@charset "utf-8";

/* CSS Document */



/* Table of Contents

-----------------------------------------------------------------------------

	1. Mobile

	2. Large Mobile

	3. iPad

	4. large desktop

	5. Other

*/



/* 1. Mobile responsive css 640px

------------------------------------------------------------------------------*/

@media (max-width:640px) {



p{ font-size:14px; line-height:22px; text-align:center;}



/* footer */

footer .container{ padding:22px 2%;}

footer .copyright{ display:block; text-align:center; margin:0 0 10px;}

footer a{display:block; text-align:center; margin:0 0 10px;}

footer span{display:block; text-align:center; margin:0;}

footer span a{ display:block; margin-top:5px;}



/* main container */

.container{ width:96%; padding:0 2%;}



/*--------- home page ------------*/

/* banner */

.banner .container{ width:100%; padding:0 !important;}

.menu-block .menu-container{ float:none; width:100%;}

.logo{ /*max-width:200px; margin-left:10px;*/ margin: 0 auto; width: 210px; float: none;}
	.banner img{ max-width: 100%;}	

.menu-block{ width:100%;}

.menu-top{ padding:12px 0 13px;}

.social-media a{ margin-left:7px;}

.toogle{ margin-top:9px; margin-right:10px;}


	.top-menu { float: none; text-align: center;}
	.top-menu ul { margin: 0; padding: 0 0 10px;}
	.top-menu ul li { float: none; display: inline-block;}

/* menu */

.menu-accordion ul{ margin:10px 0 30px}



/* Me section */

#me-block{ display:block; float:none; padding-top:70px;}

#me-block::before{ display:none;}

.me-left{ width:100%; float:none; padding-bottom:100px; padding-top:30px;}

.me-title{ margin:0 auto 30px}

.me-left::before{ width:10%; bottom:25px;}

.me-left::after{ left:10%; bottom:25px}

.me-right{width:100%; float:none;}

.me-left .me-left-inner{ max-width:none; width:96%; padding:0 2%; float:none; margin:0px auto;}

.me-left-inner p{ font-size:14px; line-height:22px;}

.me-right .me-inner-right{ max-width:none; width:100%; padding:0%; float:none; margin:0px auto;}

.me-right::after{ display:none;}

.george-bg{ display:none !important;}

.mobile-img{ display:block !important; width:100%;}

.safari .me-inner-right img{ max-width:100%!important;}



/* awards section */

#awards-block{margin-top: 0;}

.awards-left-block{ width:100%; float:none;}

.awards-inner{ max-width:none;padding:0 2%; float:none; margin:30px auto 0;}

.awards-title{ max-width:280px; margin:0 auto 30px}

.awards-right-block{width:100%; float:none;}

.awards-box{ margin-bottom:0px;}

.awards-box .awards-year{ font-size:18px; line-height:18px; float:none; text-align:center; margin:0 auto 5px;}

.awards-box .awards-des{ float:none; width:100%;}

.awards-right-block .awards-inner{ max-width:none;padding:0 2%; float:none; margin:0px auto;}



/* story far section */

.story-left-block{ width:100%; float:none; margin-bottom:0px; padding:100px 0 30px;}

.story-left-block::after{ display:none;}

.story-inner{max-width:none;padding:0 2%; float:none; margin:0px auto 0;}

.story-title{ max-width:280px}

.story-right-block{width:100%; float:none;padding:30px 0; }

.story-right-block::after{ display:none;}

.story-right-block .story-inner{max-width:none;padding:0 2%; float:none; margin:0px auto; width:96%;}

.story-inner p{ font-size:14px; line-height:28px;}

.partner-block a{ margin-left:0; margin-right:10px; margin-bottom:10px;}

.story-bottom .container{ padding-bottom:85px;}

.story-bottom .pyramid{ width:280px; height:280px;}

.story-bottom .pyramid span{width:280px; height:280px;}

.story-bottom .pyramid span.layer1{ background-size:100% !important;}

.story-bottom .pyramid span.layer2{ background-size:100% !important;}

.story-bottom .pyramid span.layer3{ background-size:100% !important;}

.story-bottom .pyramid span.layer4{ background-size:100% !important;}

.story-bottom .pyramid span.layer5{ background-size:100% !important;}

.story-bottom .pyramid span.layer6{ background-size:100% !important;}



/* my friend section */

#my-friends-block{ padding-top:70px;}

#my-friends-block:before{ display:none;}

.my-friends-left{ float:none; width:100%;}

.my-friends-left:after{ display:none;}

#my-friends-block::after{ display:none;}

.my-friends-inner{float:none; width:96%; max-width:none; padding:0 2%; margin:30px auto;}

.my-friends-title{ max-width:280px; margin:0 auto 30px;}

.my-friends-right{float:none; width:100%; margin:0;}

.my-friends-left p{ font-size:14px; line-height:24px; margin:0 auto 20px;}

.my-friends-right .my-friends-inner{float:none; width:96%; max-width:none; padding:0 2%; margin:30px auto;}

.my-friends-right p{ font-size:12px; line-height:12px; text-align:center; margin-bottom:30px;}



/* say hello section */

#say-hello-block{ padding:70px 0 10px; background-position: left center;}

#say-hello-block::after{ display:none;}

.say-hello-inner{ float:none; max-width:none; padding:30px 2% 30px; width:96%;}

.say-hello-title{ max-width:280px; margin:0 auto 30px;}

.say-hello-inner p{ font-size:14px; line-height:24px; margin-bottom:20px; text-align:center;}



/* bottom section */

#bottom-part{ padding-top:70px;}

#bottom-part:before{ display:none;}

#bottom-part .container{ padding:40px 0;}

.bottom-logo{ margin:0 auto; display:block;}

.has-logo{ margin:0 auto 20px; display:block; max-width:100px; width:100%;}

#bottom-part .social-media{text-align:center; margin:0 auto;}

#bottom-part .bottom-top{ margin-bottom:25px}

.newsletter-box form .news-input-style{ width:89%; padding:10px 5%; display:block; margin:0 auto 10px;}



.me-left-inner h1,

.me-left-inner h2,

.me-left-inner h3,

.me-left-inner h4,

.me-left-inner h5,

.me-left-inner h6{color:#d8d9d9; margin-top: 0; margin-bottom: 20px; text-align: center;}

.me-left-inner ul{color:#d8d9d9; margin-bottom: 24px; text-align: center;}

.me-left-inner ul li{color:#d8d9d9;font-size:14px; line-height: 16px; margin-bottom: 5px;  text-align: center;}

.me-left-inner ol{color:#d8d9d9; margin-bottom: 24px; text-align: center;}

.me-left-inner ol li{color:#d8d9d9;font-size:14px; line-height: 16px; margin-bottom: 5px; margin-left: 0;}





.story-inner h1,

.story-inner h2,

.story-inner h3,

.story-inner h4,

.story-inner h5,

.story-inner h6{margin-bottom:20px; margin-top: 0;color:#231f20; text-align: center;}

.story-inner ul{color:#231f20; margin-bottom: 24px; text-align: center;}

.story-inner ul li{color:#231f20;font-size:14px; line-height:16px; margin-bottom: 5px;}

.story-inner ol{color:#231f20; margin-bottom: 24px; text-align: center;}

.story-inner ol li{color:#231f20;font-size:14px; line-height:16px; margin-bottom: 5px; margin-left: 0;}







.my-friends-inner h1,

.my-friends-inner h2,

.my-friends-inner h3,

.my-friends-inner h4,

.my-friends-inner h5,

.my-friends-inner h6{margin-bottom:20px; margin-top: 0;color:#d7d7d7;  margin-left: 0px; text-align: center;}

.my-friends-inner ul{color:#d7d7d7; margin-bottom: 24px; margin-left: 24px; text-align: center;}

.my-friends-inner ul li{color:#d7d7d7;font-size:14px; line-height:16px; margin-bottom: 5px;}

.my-friends-inner ol{color:#d7d7d7; margin-bottom: 24px;  margin-left: 24px; text-align: center;}

.my-friends-inner ol li{color:#d7d7d7;font-size:14px; line-height:16px; margin-bottom: 5px; margin-left: 0;}



.my-friends-right ul{color:#2d2929; margin-bottom: 24px; margin-left: 0px; text-align: center;}

.my-friends-right ul li{color:#2d2929;font-size:14px; line-height:16px; margin-bottom: 5px;}

.my-friends-right ol{color:#2d2929; margin-bottom: 24px;  margin-left: 0px; text-align: center;}

.my-friends-right ol li{color:#2d2929;font-size:14px; line-height:16px; margin-bottom: 5px; margin-left: 0;}





.say-hello-inner h1,

.say-hello-inner h2,

.say-hello-inner h3,

.say-hello-inner h4,

.say-hello-inner h5,

.say-hello-inner h6{margin-bottom:20px; margin-top: 0;color:#2d2929; text-align: center;}

.say-hello-inner ul{color:#2d2929; margin-bottom: 24px; text-align: center;}

.say-hello-inner ul li{color:#2d2929;font-size:14px; line-height:16px; margin-bottom: 5px;}

.say-hello-inner ol{color:#2d2929; margin-bottom: 24px; text-align: center;}

.say-hello-inner ol li{color:#2d2929;font-size:14px; line-height:16px; margin-bottom: 5px; margin-left: 0;}

.equal{height: auto !important;}
.banner .image{background-position: 30% center !important;}


}



/* 2. Large Mobile responsive css 640px

------------------------------------------------------------------------------*/

@media (min-width:641px) and (max-width:767px) {



/* main container */

.container{ max-width:600px;}



/* footer */

footer .container{ padding:35px 0}

footer .copyright{ font-size:9px; margin-right:40px;}

footer a{ font-size:9px;margin-right:40px;}

footer span{ margin-right:0px;font-size:9px;}



/*--------- home page ------------*/

/* banner */

.banner .container{width:600px;}



/* menu */

.menu-accordion ul{ margin:30px 0 80px}



/* Me section */

.me-left .me-left-inner{ max-width:280px; margin:156px 20px 69px 0}

.me-title{ max-width:280px;}

.me-left-inner p{ font-size:15px; line-height:28px;}

.me-left::before{ width:23%;}

.me-left::after{ left:23%;}

.safari .me-inner-right img{ max-width:100%!important;}



/* awards section */

.awards-inner{ max-width:300px;}

.awards-title{max-width:300px;}

.awards-right-block .awards-inner{ max-width:265px;}

.awards-box .awards-year{ font-size:26px; line-height:26px;}

.awards-box .awards-des{ width:66%;}



/* story far section */

.story-inner{ max-width:280px; margin:115px 30px 87px 0}

.story-title{max-width:280px;}

.story-right-block .story-inner{ max-width:280px; margin:105px 0 0 30px}

.story-inner p{ font-size:15px; line-height:28px;}

.partner-block a{ margin-right:27px; margin-left:0px;}

.story-bottom .container{ padding-bottom:85px}

.story-bottom .pyramid{ width:500px; height:500px;}

.story-bottom .pyramid span{width:500px; height:500px;}

.story-bottom .pyramid span.layer1{ background-size:100% !important;}

.story-bottom .pyramid span.layer2{ background-size:100% !important;}

.story-bottom .pyramid span.layer3{ background-size:100% !important;}

.story-bottom .pyramid span.layer4{ background-size:100% !important;}

.story-bottom .pyramid span.layer5{ background-size:100% !important;}

.story-bottom .pyramid span.layer6{ background-size:100% !important;}



/* my friend section */

.my-friends-inner{ margin:169px 20px 0 0; max-width:280px;}

.my-friends-title{max-width:280px;}

.my-friends-right .my-friends-inner{ max-width:280px; margin:79px 0 0 20px}

.my-friends-left p{ margin-left:0px; line-height:28px; font-size:15px;}

.my-friends-right p{ font-size:11px; line-height:16px; margin-bottom:35px;}







.my-friends-inner h1,

.my-friends-inner h2,

.my-friends-inner h3,

.my-friends-inner h4,

.my-friends-inner h5,

.my-friends-inner h6{margin-bottom:20px; margin-top: 0;color:#d7d7d7;  margin-left: 0px;}

.my-friends-inner ul{color:#d7d7d7; margin-bottom: 24px; margin-left: 24px;}

.my-friends-inner ul li{color:#d7d7d7;font-size:17px; line-height:22px; margin-bottom: 5px;}

.my-friends-inner ol{color:#d7d7d7; margin-bottom: 24px;  margin-left: 24px;}

.my-friends-inner ol li{color:#d7d7d7;font-size:17px; line-height:22px; margin-bottom: 5px; margin-left: 0;}



/* say hello section */

.say-hello-inner{ max-width:510px;}



/* bottom section */

#bottom-part .container{ padding:100px 0;}

.bottom-logo{ max-width:160px; margin-right:20px;}

.has-logo{ max-width:130px;margin-right:20px;}

.newsletter-box form .news-input-style{ max-width:440px;}



}



/* 3. iPad responsive css 768px to 1023px

------------------------------------------------------------------------------*/

@media (min-width:768px) and (max-width:1023px) {



/* main container */

.container{ max-width:750px;}



/* footer */

footer .copyright{ font-size:10px; margin-right:10px;}

footer a{ font-size:10px;margin-right:10px;}

footer span{ margin-right:0px;font-size:10px;}



/*--------- home page ------------*/

/* banner */

.banner .container{width:750px;}



/* menu */

.menu-accordion ul{ margin:30px 0 80px}



/* Me section */

.me-left .me-left-inner{ max-width:337px;}

.me-left::before{ width:22%;}

.me-left::after{ left:22%;}

/*.safari .me-inner-right img{ max-width:100%!important;}

*/

/* awards section */

.awards-inner{ max-width:375px;}

.awards-right-block .awards-inner{ max-width:340px;}



/* story far section */

.story-left-block::after{ width:50%;}

.story-inner{ max-width:325px; width:100%; margin:115px 50px 87px 0;}

.story-title{ max-width:325px;}

.story-right-block .story-inner{max-width:325px; margin:105px 0 0 50px}

.story-bottom .container{ padding-bottom:85px}

.story-bottom .pyramid{ width:650px; height:650px;}

.story-bottom .pyramid span{width:650px; height:650px;}

.story-bottom .pyramid span.layer1{ background-size:100% !important;}

.story-bottom .pyramid span.layer2{ background-size:100% !important;}

.story-bottom .pyramid span.layer3{ background-size:100% !important;}

.story-bottom .pyramid span.layer4{ background-size:100% !important;}

.story-bottom .pyramid span.layer5{ background-size:100% !important;}

.story-bottom .pyramid span.layer6{ background-size:100% !important;}



/* my friend section */

.my-friends-inner{ max-width:345px; margin:169px 30px 0 0}

.my-friends-right .my-friends-inner{max-width:345px; margin:110px 0 0 30px}

.my-friends-left p{ margin-left:40px;}





.my-friends-inner h1,

.my-friends-inner h2,

.my-friends-inner h3,

.my-friends-inner h4,

.my-friends-inner h5,

.my-friends-inner h6{margin-bottom:20px; margin-top: 0;color:#d7d7d7;  margin-left: 40px;}

.my-friends-inner ul{color:#d7d7d7; margin-bottom: 24px; margin-left: 40px;}

.my-friends-inner ul li{color:#d7d7d7;font-size:17px; line-height:22px; margin-bottom: 5px;}

.my-friends-inner ol{color:#d7d7d7; margin-bottom: 24px;  margin-left: 40px;}

.my-friends-inner ol li{color:#d7d7d7;font-size:17px; line-height:22px; margin-bottom: 5px; margin-left: 0;}



/* say hello section */

.say-hello-inner{ max-width:660px;}



/* bottom section */

.bottom-logo, .has-logo{ margin-right:19px;}



}





/* 5. Other media-query

------------------------------------------------------------------------------*/