@media only screen and (max-width: 640px) {
	section{
		max-width: 100%;
		min-width: 100%;
	}
	.circle{
		width: 890px;
		height: 890px;
		top: 1200px;
		left: 25px;
	}
	section.content{
		background: #f5f5f5;
		padding-bottom: 5%
	}
	header section, section{
		max-width: 100%;
		min-width: 100% !important;
	}
	header{
		height: 77px;
	}	
	header figure#logo {	
		left: 40px;
		width: 108px;
		height: auto;
	}
	header figure#att  {	
		margin:2% 1.5% 0 0;
	}
	header figure#att img {	
		width: 50px;
	}	
	header figure#att p{	
		font-size: 21px;
	}	
	.wrapper{
		min-width: 100%;
	}
	#video section{
		max-width: 100% !important
	}
	#video iframe {
		max-width: 100% !important;
		height: 450px !important;
	}	
	#video #blText {
		background: #f5f5f5;
		top: 51%;
		width: 1588px;
		height: 1588px;	
		margin-left: -794px;	
	}
	#AreyouIn{
		font-size: 27px;
		max-width: 80%;
		margin: -40% auto 8%;
	}
	#AreyouIn hr{
		margin: 10% auto;
	}
	#AreyouIn h2{
		font-size: 80px;
		margin: 0 auto 2%;
	}	
	#AreyouIn li{
		width: 32%;
		font-size: 16px;
	}
	#AreyouIn li img{
		margin: 5% 0;
		width: 85%
	}
	#carrouselMenu li .first{	
		display: none;
	}
	#carrouselMenu li .last{	
		display: block;
	}
	/* carrousel */
	#carrouselMenu li {
		width: 100% !important
	}
	#carrouselMenu li article{
		right: 2%;
		top: 7%;
		width: 45%;
		font-size: 19px;
	}
	
	#carrouselMenu li article h3{
		margin-bottom: 2%;
		font-size: 35px;
	}
	#carrouselMenu li article button{	
		line-height: 35px;
		width: 50%;
		font-size: 16px;
	}
	#carrouselMenu li article.storytellers{	
		top: 30%;
		width: 40%;
	}
	#carrouselMenu li article.product{	
		left: 5%;
		top: 25%;
		width: 36%;
	}
	#carrouselMenu li article.product p{	
		width: 90%;
	}	
	#carrouselMenu li article.survey{	
		top: 5px;
		right: 2%;
		border-radius: 50%;
		width: 360px;
		height: 360px;
	}
	#carrouselMenu li article.survey h3{	
		margin-top: 15%;
		font-size: 43px;
	}

	.bx-controls{ display: none;}

	/*newgenerasian*/
	#newgenerasian{
		width: 100%;
		padding: 10% 0 0;
		margin-top: 8%;
		box-shadow: 0px 0px 20px 0px rgba(50, 50, 50, 0.50);
	}
	#newgenerasian .gallery{
		width: 100%;
	}	
	#newgenerasian h3{
		font-size: 35px;
	}	
	#newgenerasian ul.divTabs li{ 
		font-size: 25px;
		margin: 5% 3%;
	}
	#newgenerasian .gallery article div p{ 
		display: none;
	}
	#newgenerasian button{	
		width: 100%;
		font-size: 35px;
		margin: 3px 0 0 0;
		line-height: 75px;
	}

	/*products*/
	#products {
		width: 100%;
		font-size: 20px;
		line-height: 25px;
		overflow: hidden;
	}
	#products aside{
		width: auto;
		float: none;
		margin-right: 0;	
		padding: 25% 5% 0% 5%;
	}
	#products aside .info{
		width: 100%;
		font-size: 20px;
		text-align: left;
	}
	#products aside article{
		margin: 0 0 10% 0;
		text-align: center;
	}
	#products  button{	
		line-height: 60px;
		width: 50%;
		font-size: 25px;
		margin: 5% 0 0 0
	}
	#products  .marNeg1, #products .marNeg2{	
		margin-left:0
	}

	/* footer */	
	footer{
		font-size: 20px;
	}
	footer ul > li.ltransparent{
		border-right: 1px solid #eeebeb
	}
	footer ul > li{
		padding: 0 20px 10px;		
	}
	footer ul > li.ltransparent img{
		top: 10px;
		position: relative;
	}
	footer ul.socials{
		display: none;
	}

	.bx-wrapper .bx-pager.bx-default-pager a {
		width: 24px !important;
		height: 24px !important;
	}	

}

@media only screen and (min-width: 641px) and (max-width: 1160px) {
	#carrouselMenu li article{
		right: 3%;
		top: 8%;
		width: 40%
	}
	#carrouselMenu li article.storytellers{	
		top: 30%;
	}
	#carrouselMenu li article.product{	
		left: 5%;
		top: 25%;
	}
	#carrouselMenu li article.survey{	
		top: 10%;
		right: 5%;
		width: 29%;
		height: 78%;
	}
	#carrouselMenu li article.survey h3{	
		margin-top: 8%;
	}
	#carrouselMenu li article.survey button{	
		width: 40%
	}
	
}
@media only screen and (min-width: 641px) and (max-width: 1280px) {
	section{
		min-width: 100%
	}
	#newgenerasian{
		width: 90%;
	}
}
@media only screen and (min-width: 641px) and (max-width: 1024px) {
	#newgenerasian{
		width: 100%;
	}
	#newgenerasian .gallery { 
		width:100%;
	}	
}
@media only screen and (max-width: 400px) {
	header figure#att p{	
		font-size: 15px;
	}
}
@media only screen and (max-width: 985px) {
	#newgenerasian .gallery article div .view{ 
		top:30%;
	}
	.gallery p{	
		font-size: 12px;
	}
}
@media only screen and (max-width: 665px) {
	#newgenerasian .gallery article div .socials li{ 
		margin: 5% 4%;
		width: 20%;
	}	
	#newgenerasian .gallery article div .socials li img{ 
		width: 100%;
	}	
	#newgenerasian .gallery article div img.ltransparent{ 
		width: 18%;
	}
	#newgenerasian .gallery article div .view > a{ 
		width: 90%;
	}
	#newgenerasian .gallery article div .view > a img{ 
		width: 100%;
	}
	#newgenerasian .gallery article div .view{ 
		top:35%;
	}
	.gallery p{	
		display: none
	}
}