@media only screen and (min-width:220px) and (max-width: 1061px)
{
#header
{
position: relative;
/*border: solid;*/
height: auto;
}
h1 {
  font-size: 5.9vw;
}
h2 {
  font-size: 4.0vw;
}

#header-top
{
width: 100%;
height: auto;
}
#header-top-wrapper
{
width: 100%;
height: auto;
}

#header
{
width: 100%;
height: auto;
background-image: none;
}
#header-wrapper
{
width: 100%;
height: auto;
}


#baba-logo, #logo, #cow-icon
{
float: left;
width: 100%;
margin: 10px 0px 30px 0px;
height: auto;
text-align: center;
}


#menu
{
display: none;
}

.ogss-banner
{
background-position: center center;
background-attachment: scroll;
}

.ogss-escroll
{
width: 100%;
}

.ogss-escroll-wrapper
{
width: 100%;
}
	
.ogss-gallery-wrapper
{
width: 100%;
}

.ogss-activity
	{
		width: 100%;
		height: auto;
		background-repeat: repeat;
	}
.ogss-activity-overlay
	{
		padding-top: 15px;
		height: auto;	
	}
.ogss-activity-wrapper
	{
		width: 97%;
		padding-left: 1%;
		padding-right: 1%;
		height: auto;
	}

.ogss-uevent-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
border: 0px;
padding-top: 10px;
padding-bottom: 10px;
}
.ogss-uevent-image
{
float: left;
width: 99%;
padding-right: 1%;
height: auto;
}

.ogss-uevent-content
{
float: left;
width: 95%;
padding: 2%;
height: auto;
margin: 0 auto;
}

.ogss-hp-quote-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}

.ogss-intro-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}

.ogss-comp
{
background-color: #F57044;
}

.ogss-action-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}

.ogss-action-button
{
margin-bottom: 20px;
}

.ogss-quote
	{
		width: 100%;
		height: auto;
		background-repeat: repeat;
		
	}
.ogss-quote-overlay
	{
		padding-top: 55px;
		height: auto;	
	}
.ogss-quote-wrapper
	{
		width: 97%;
		padding-left: 1%;
		padding-right: 1%;
		height: auto;
	}



.responsive-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.responsive-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/*iframe {
    
    width: 100%;
    height: 100%;
}*/
#scroll-site
{
display: none;
}

/* Publication Page Responsive CSS Code Starts From Here */

.pub-cont-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 10px;
padding-bottom: 10px;
}

.pub-gs-book
{
float: left;
width: 130px;
}

/* Publication Page Responsive CSS Code Ends Here */

/* Individual Activity Responsive CSS Code Starts From Here */
.ogss-ind-act-cont-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}
.ogss-ind-act-oa-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}
/* Individual Activity Responsive CSS Code Ends Here */


/* Individual Page Responsive CSS Code Starts From Here */

.ogss-ip-wrapper
{
width: 96%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 2%;
padding-right: 2%;
}

/* Individual Page Responsive CSS Code Ends Here */


/* Blog Page Responsive Css Code Starts From Here */
#blog-page
{
width: 100%;
height: auto;
}
#blog-wrapper
{
width: 100%;
height: auto;
}
#blog-wrapper, #sidebar
{
float: left;
width: 100%;
margin: 2% 0;
/*padding-left: 2.5%;
padding-right: 2.5%;*/
height: auto;
}
#blog-container
{
width: 100%;
height: auto;
}
#blog-title, #blog-info
{
float: left;
width: 100%;
height: auto;
/*padding-left: 2%;
padding-right: 2%;*/

}
#blog-featured-image
{
float: left;
width: 100%;
height: auto;
text-align: center;
}
#blog-featured-image img
{
width: 100%;
height: auto;
}
#blog-postdata
{
float: left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
}
.postmetadata
{
float: left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
}
.readmore, .comments
{
margin: 0;
text-align: center;
}

/* Blog Page Responsive Css Code Ends From Here */


/* About Us Page Responsive CSS Code Starts From Here */
.ogss-au-intro-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}
.ogss-aboutus-wrapper
{
width: 98%;
margin: 0 auto;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}

.ogss-au-om
{
display:flex;
flex-direction: column;
}
.ogss-au-om-content { order: 2 }
.ogss-au-om-img { order: 1 }

/* About Us Page Responsive CSS Code Ends Here */


/* Our Activities Page Responsive CSS Code Starts From Here */
.ogss-oa-wrapper
{
display:flex;
flex-direction: column;
padding: 0px;
}

.ogss-inda-ltext { order: 2 }
.ogss-inda-rimg { order: 1 }

/* Our Activities Page Responsive CSS Code Ends Here */


/* Contact Us Page Responsive CSS Code Starts From Here */
.ogss-contactus-part1, .ogss-contactus-part2
{
width: 100%;
height: auto;
}

.ogss-contactus-content
{
width: 96%;
height: auto;
padding-left: 2%;
padding-right: 2%;
padding-top: 30px;
padding-bottom: 30px;
}

/* Contact Us Page Responsive CSS Code Ends Here */


.ogss-top-footer-wrapper
{
width: 98%;
padding: 20px 0px;
height: auto;
}
.ogss-top-footer-box
{
float: left;
width: 250px;
height: 240px;
margin-left: 10px;
margin-right: 10px;
}

}

@media only screen and (min-width:300px) and (max-width: 720px)
{
.ogss-cp-ind{
width: 300px;
height: auto;
margin-bottom: 25px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
  }
}


@media only screen and (min-width:350px) and (max-width: 750px)
{
.ogss-activity-box{
width: 300px;
height: auto;
margin-bottom: 25px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
  }
}

@media only screen and (min-width:250px) and (max-width: 350px)
{
.ogss-activity-box{
width: 250px;
height: auto;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
  }
}

@media only screen and (min-width:250px) and (max-width: 400px)
{
.ogss-quote-wrapper h2
{
width: 100%;
height: auto;
font-size: 17px;
  }
.ogss-uevent-content li
{
margin-left: 1em;
}
}

@media only screen and (min-width:220px) and (max-width: 500px)
{
.ogss-contactf-wrapper
{
padding: 10px;
}
.ogss-contactf-box
{
width: 90%;
margin-right: 8%;
height: auto;
}
}

@media only screen and (min-width:220px) and (max-width: 600px)
{
.ogss-intro-content
{
width: 100%;
}

.ogss-intro-video
{
width: 100%;
margin: 0 auto;
}

.ogss-au-intro-content
{
width: 100%;
height: auto;
}

.ogss-au-intro-image
{
width: 100%;
height: auto;
margin-left: 0px;
}

.ogss-donation-image
{
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
border: none;
}
.ogss-donation-text
{
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
border: none;
}
}

@media only screen and (min-width:610px) and (max-width: 1061px)
{
.ogss-donation-image
{
float: left;
width: 40%;
height: auto;
border: none;
}
.ogss-donation-text
{
float: left;
width: 40%;
height: auto;
border: none;
padding-top: 0px;
}
}

@media only screen and (min-width:220px) and (max-width: 400px)
{
.ogss-action-button
{
width: 100%;
margin: 15px auto;
}
}

@media only screen and (min-width:610px) and (max-width:1060px)
{
.ogss-intro-content
{
width: 100%;
}
.ogss-au-intro-content
{
width: 100%;
height: auto;
}
.ogss-intro-video
{
width: 500px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
}
.ogss-au-intro-image
{
width: 500px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
}
}


@media only screen and (min-width:220px) and (max-width: 600px)
{
.ogss-comp
{
background-color: #F57044;
background-image: none;
}

.ogss-comp-part1
{
width: 95%;
height: auto;
margin: 0;
padding: 2%;
}
.ogss-comp-part2
{
width: 90%;
height: auto;
margin: 0;
padding: 4%;
}
.ogss-au-ov-img, .ogss-au-ov-content, .ogss-au-om-img, .ogss-au-om-content, .ogss-au-omo-img, .ogss-au-omo-content
{
width: 100%;
height: auto;
}

.ogss-au-ov-content-box, .ogss-au-om-content-box, .ogss-au-omo-content-box
{
width: 96%;
height: auto;
padding-left: 2%;
padding-right: 2%;
padding-top: 30px;
padding-bottom: 30px;
}

.ogss-inda-limg
{
float:left;
width: 96%;
margin-left: 2%;
margin-right: 2%;
height: auto;
margin: 0;
}
.ogss-inda-limg img
{
width: 100%;
}

.ogss-inda-rtext
{
float:left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
margin: 0;
}

.ogss-inda-ltext
{
float:left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
margin: 0;
margin-bottom: 20px;
}

.ogss-inda-rimg
{
float:left;
width: 96%;
margin-left: 2%;
margin-right: 2%;
height: auto;
margin: 0;
}
.ogss-inda-rimg img
{
width: 100%;
}

}

@media only screen and (min-width:600px) and (max-width: 1024px)
{
.ogss-comp
	{
		background-color: #F57044;
		background-image: none;
	}
.ogss-comp-part1
{
width: 50%;
height: auto;
margin: 0;
}
.ogss-comp-part2
{
width: 40%;
height: auto;
margin-left: 3%;
}
	

.ogss-inda-limg
{
width: 420px;
height: 280px;
margin: 0 auto;
margin-bottom: 30px;
}
.ogss-inda-limg img
{
width: 100%;
}

.ogss-inda-rtext
{
float:left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
margin: 0;
}

.ogss-inda-ltext
{
float:left;
width: 96%;
padding-left: 2%;
padding-right: 2%;
height: auto;
margin: 0;
margin-bottom: 20px;
}

.ogss-inda-rimg
{
width: 420px;
height: 280px;
margin: 0 auto;
margin-bottom: 30px;
}
.ogss-inda-rimg img
{
width: 100%;
}
}

@media only screen and (min-width:600px) and (max-width: 1061px)
{
.ogss-au-ov-content, .ogss-au-om-content, .ogss-au-omo-content
{
width: 100%;
height: auto;
}

.ogss-au-ov-img, .ogss-au-omo-img
{
width: 600px;
margin: 0 auto;
height: 350px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, 0%);
}

.ogss-au-ov-content-box, .ogss-au-om-content-box, .ogss-au-omo-content-box
{
width: 96%;
height: auto;
padding-left: 2%;
padding-right: 2%;
padding-top: 30px;
padding-bottom: 30px;
}
}

@media only screen and (min-width:600px) and (max-width: 800px)
{
.ogss-au-om-img
{
width: 450px;
margin: 0 auto;
height: 250px;
position: relative;
  top: 50%;
  right: 50%;
  /* bring your own prefixes */
  transform: translate(68%, 0%);
}
}

@media only screen and (min-width:800px) and (max-width: 1061px)
{
.ogss-au-om-img
{
width: 600px;
margin: 0 auto;
height: 350px;
position: relative;
  top: 50%;
  right: 50%;
  /* bring your own prefixes */
  transform: translate(68%, 0%);
}
}

@media only screen and (min-width:220px) and (max-width: 550px)
{
	
.ogss-ind-act-banner-cont
{
width: 100%;
height: auto;
}
.ogss-ind-act-banner-cont h1
{
font-size: 30px;
}
}

@media only screen and (min-width:220px) and (max-width: 700px)
{
.ogss-ind-act-2p-img, .ogss-ind-act-2p-content
{
width: 100%;
height: auto;
}
.ogss-ind-act-2p-content-box
{
width: 96%;
height: auto;
padding-left: 2%;
padding-right: 2%;
padding-top: 30px;
padding-bottom: 30px;
}
}

@media only screen and (min-width:700px) and (max-width: 1100px)
{
.ogss-ind-act-2p-content
{
width: 100%;
height: auto;
}

.ogss-ind-act-2p-img
{
width: 700px;
margin: 0 auto;
height: 720px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, 0%);
  margin-bottom: 30px;
}

.ogss-ind-act-2p-content-box
{
width: 96%;
height: auto;
padding-left: 2%;
padding-right: 2%;
padding-top: 30px;
padding-bottom: 30px;
}
}

@media only screen and (min-width:330px) and (max-width: 960px)
{
#sidebar
{
width: 320px;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, 0%);
}
}


@media only screen and (min-width:300px) and (max-width: 900px)
{
.postmetadata
{
width: 300px;
margin: 0 auto;
height: auto;
position: relative;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-60%, 0%);
}
.comments
{
margin-left: 15px;
}
}