/** media quries **/
*{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}

@media screen and (max-width: 1024px) {
 /* Add your styles for devices with a maximum width of 1024 */
body{ font-size:80%; }
.header-logo img{ max-width:80%; }  
.lead-txt01 img, .lead-txt02 img, .lead-txt03 img{ max-width:80%; }

.showcasebox{ display:block; position:relative; width:80%; margin:0 auto; }

.newbox{ display:block; position:relative; width:96%; margin:0 auto; }
.new-box{  width:300px; }
.new-list{  width:290px; }
.new-img{  width:290px; height:193px;  }
.newdebox{ display:block; position:relative; width:96%; margin:0 auto; }

.box-contact{ width:80%; }

}

@media only screen and (max-width:960px){
#boxheader.desktop{ display:none; }
#boxheader.mobile{ display:block; position:fixed; height:77px; top:0px; left:0; right:0; z-index:99; background:#ffffff; border-bottom:#e4e4e4 solid 1px;   }
.boxheader{ display:table; width:94%; margin:0 auto; height:77px;  }
.header-logo{ display:table-cell; position:relative; width:50%; vertical-align:middle; text-align:left; }
.header-logo img{ max-width:100%; max-height:40px;   }
.header-menu{ display:table-cell; width:50%; vertical-align:middle; }

.menu-icon{ cursor:pointer; }
#boxmenu-m{ 
    position:fixed; display:none; overflow:auto;  background:#c6c6c6;
    height:100%; z-index:10; width:260px; right:0px; top:0px; }
.mmenu-top{ display:table; width:100%; position:relative; height:77px;  }
.mmenu-top > .tb-left{ display:table-cell; width:36px; color:#ffffff; font-family: 'db_helvethaica_x53_ext'; font-size:1.25em; }
.mmenu-top > .tb-left a{ color:#ffffff; }
.mmenu-top > .tb-right{ display: table-cell; vertical-align:middle; }
.mmenu-top > .tb-right > .menu-close{ display:inline-block; cursor:pointer; margin-right:25px; }
.lang-tb.bb{ border-top:#d5de83 solid 1px; border-right:#d5de83 solid 1px; border-bottom:none; }

.mmenu-bottom{ display:block; position:relative;  } 

ul#navmenu-m{ padding:0; margin:0; }
#navmenu-m li{  position:relative; display:block; width:100%; text-align:left; margin:0; padding:0;   }
#navmenu-m li a{
   font-size:1.125em; line-height:14px; font-family: 'db_helvethaica_x73_bdext'; text-transform:uppercase; color:#ffffff; transition:ease 0.5s;  }


#navmenu-m li a.m-home{ display:block; position:relative; height:46px; background:#123b6f; }
#navmenu-m li a.m-home .m-about-icon{ 
  display:inline-block; position:relative; width:26px; height:23px; background:url(../../img/icon-m-home.png) no-repeat #123b6f; background-size:100%; }
#navmenu-m li a.m-home .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0;  width:26px; height:23px;
  background:url(../../img/icon-m-home.png) no-repeat #123b6f; background-position:0 -24px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }
 


#navmenu-m li a.m-about{ display:block; position:relative; height:46px; background:#34a853; }
#navmenu-m li a.m-about .m-about-icon{ 
  display:inline-block; position:relative; width:20px; height:29px; background:url(../../img/icon-m-about.png) no-repeat #34a853; background-size:100%; }
#navmenu-m li a.m-about .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0;  width:20px; height:29px;
  background:url(../../img/icon-m-about.png) no-repeat #34a853; background-position:0 -29px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }
#navmenu-m li a.m-about-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#34a853 !important; }
#navmenu-m li a.m-about-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:20px; height:29px; background:url(../../img/icon-m-about.png) no-repeat #ffffff; background-size:100%;  background-position:0 -58px; }
  

#navmenu-m li a.m-ourservice{ display:block; position:relative; height:46px; background:#0072ce; }
#navmenu-m li a.m-ourservice .m-about-icon{ 
  display:inline-block; position:relative; width:29px; height:23px; background:url(../../img/icon-m-ourservice.png) no-repeat #0072ce; background-size:100%; }
#navmenu-m li a.m-ourservice .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0;  width:29px; height:23px;
  background:url(../../img/icon-m-ourservice.png) no-repeat #0072ce; background-position:0 -23px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }
#navmenu-m li a.m-ourservice-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#0072ce !important; }
#navmenu-m li a.m-ourservice-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:29px; height:23px; background:url(../../img/icon-m-ourservice.png) no-repeat #ffffff; background-size:100%;  background-position:0 -46px; }


#navmenu-m li a.m-quality{ display:block; position:relative; height:46px; background:#ffad1e; }
#navmenu-m li a.m-quality .m-about-icon{ 
  display:inline-block; position:relative; width:26px; height:24.6px; background:url(../../img/icon-m-quality.png) no-repeat #ffad1e; background-size:100%; }
#navmenu-m li a.m-quality .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0; width:26px; height:24.6px;
  background:url(../../img/icon-m-quality.png) no-repeat #ffad1e; background-position:0 -24.6px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }
#navmenu-m li a.m-quality-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#ffad1e !important; }
#navmenu-m li a.m-quality-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:26px; height:24.6px; background:url(../../img/icon-m-quality.png) no-repeat #ffffff; background-size:100%;  background-position:0 -49.2px; }

  
#navmenu-m li a.m-ourshowcase{ display:block; position:relative; height:46px; background:#ea4638; }
#navmenu-m li a.m-ourshowcase .m-about-icon{ 
  display:inline-block; position:relative; width:46px; height:20px; background:url(../../img/icon-m-ourshowcase.png) no-repeat #ea4638; background-size:100%; }
#navmenu-m li a.m-ourshowcase .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0; width:46px; height:20px;
  background:url(../../img/icon-m-ourshowcase.png) no-repeat #ea4638; background-position:0 -20px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  } 
#navmenu-m li a.m-ourshowcase-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#ea4638 !important; }
#navmenu-m li a.m-ourshowcase-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:46px; height:20px; background:url(../../img/icon-m-ourshowcase.png) no-repeat #ffffff; background-size:100%;  background-position:0 -40px; }

  
#navmenu-m li a.m-new{ display:block; position:relative; height:46px; background:#f06d54; }
#navmenu-m li a.m-new .m-about-icon{ 
  display:inline-block; position:relative; width:21px; height:23px; background:url(../../img/icon-m-new.png) no-repeat #f06d54; background-size:100%; }
#navmenu-m li a.m-new .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0; width:21px; height:23px;
  background:url(../../img/icon-m-new.png) no-repeat #f06d54; background-position:0 -23px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }  
#navmenu-m li a.m-new-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#f06d54 !important; }
#navmenu-m li a.m-new-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:21px; height:23px; background:url(../../img/icon-m-new.png) no-repeat #ffffff; background-size:100%;  background-position:0 -46px; }

  
#navmenu-m li a.m-contact{ display:block; position:relative; height:46px; background:#00bff0; }
#navmenu-m li a.m-contact .m-about-icon{ 
  display:inline-block; position:relative; width:20px; height:14px; background:url(../../img/icon-m-contact.png) no-repeat #00bff0; background-size:100%; }
#navmenu-m li a.m-contact .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0; width:20px; height:14px;
  background:url(../../img/icon-m-contact.png) no-repeat #00bff0; background-position:0 -14px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }  
#navmenu-m li a.m-contact-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#00bff0 !important; }
#navmenu-m li a.m-contact-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:20px; height:14px; background:url(../../img/icon-m-contact.png) no-repeat #ffffff; background-size:100%;  background-position:0 -28px; }

  
#navmenu-m li a.m-faq{ display:block; position:relative; height:46px; background:#134687; }
#navmenu-m li a.m-faq .m-about-icon{ 
  display:inline-block; position:relative; width:14px; height:20px; background:url(../../img/icon-m-faq.png) no-repeat #134687; background-size:100%; }
#navmenu-m li a.m-faq .m-about-icon > span{
  position:absolute; top:0; left:0; right:0; bottom:0; width:14px; height:20px;
  background:url(../../img/icon-m-faq.png) no-repeat #134687; background-position:0 -20px;  background-size:100%;
  -webkit-transition:opacity 0.5s;  -moz-transition:opacity 0.5s;   -o-transition:opacity 0.5s;   
  opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0);  }        
#navmenu-m li a.m-faq-mactiv{display:block; position:relative; height:46px; background:#ffffff; color:#134687 !important; }
#navmenu-m li a.m-faq-mactiv .m-about-icon{ 
    display:inline-block; position:relative; width:14px; height:20px; background:url(../../img/icon-m-faq.png) no-repeat #ffffff; background-size:100%;  background-position:0 -40px; }


.m-navmenu-img{ display:table-cell; height:46px; width:70px; vertical-align:middle; text-align:center;  }
.m-navmenu-txt{ display:table-cell; vertical-align:middle; text-align:left;  }
.m-navmenu-imgn{ display:table-cell; width:70px; vertical-align:middle; text-align:center;  }

.contant-m{  display:table; width:100%;   }
#navmenu-m li a:hover{ color:#242424; }
#navmenu-m li a:hover .m-about-icon > span{ opacity:1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100);   }

.mmcc{ display:block; position:relative; cursor:pointer;  }
.macc_body{	display:none;background:#34a853; border-top:#c6c6c6 solid 1px; padding:15px 0 0;   } 
.msubnav a{ font-family: 'db_helvethaica_x53_ext' !important; font-size:1.25em !important;   }
 
.footer{ display:block; position:relative; text-align:left; padding:23px 20px; color:#666666; }
.footer a{ color:#666666; transition:ease 0.5s; }
.footer a:hover{ color:#000000; }
.footer a.txtb{ color:#000000; transition:ease 0.5s; }
.footer a.txtb:hover{ color:#666666; }


.lead-txt01 img, .lead-txt02 img, .lead-txt03 img{ max-width:75%; }


.content-page.mobile{ display:block; position:relative; }
.about-overview-txt{ display:block; position:relative; top:36px; left:0; width:94%; margin:0 auto; }

.abouth-green, .abouth-blue{ font-size:2.8em; padding-bottom:20px; } 
.overview-txt{ font-size:1.5em;  line-height:20px; padding:20px 0;  }

#about-overview{ display:none; }
.overview-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-overview.jpg) top center no-repeat; background-size:cover; }

#about-vision{ display:none;}
.vision-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-vision.jpg) top center no-repeat; background-size:cover; }

#about-mission{ display:none;}
.mission-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-mission.jpg) top center no-repeat; background-size:cover; }

#about-team{ display:none;}
.team-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-team.jpg) top  right no-repeat; background-size:cover; }

#about-alliance{ display:none;}
.alliance-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-alliance.jpg) top center no-repeat; background-size:cover; }

#about-sponsor{ display:none;}
.sponsor-img{ display:block; position:relative; height:499px; background:url(../../img/aboutus-sponsor.jpg) top center no-repeat; background-size:cover; }


.box-serviceh{ padding:125px 0 36px;  }
.box-qualityh{ padding:125px 0 36px;  }

.box-qualitytxt{  width:60%; }

.qualitybox{ width:99%; margin:0 auto; }
.quality-box{ display:block; position:relative; width:33%; padding:0 0; }
.quality-img{ display:block; position:relative; padding:0 0 15px; }
.quality-img img{ max-width:100%; }


.box-showcaseh{ padding:125px 0 36px;   }
.showcasebox{ display:block; position:relative; width:98%; margin:0 auto; }
.showcase-top-name{ font-size:22px;  }

.box-newh{ padding:125px 0 36px; } 
.new-td{ display:block; position:relative; width:96%; margin:0 auto; }
#newde{ margin-bottom:36px; }

 
.new-box{  width:246px; margin:0 auto; }
.new-list{  width:236px; }
.new-img{  width:236px; height:157px;  }
.new-nav{ display:none !important; }
.new-navm{ display:block !important; text-align:center; position:relative; width:100%; margin:26px 0 0;  }

.box-contact{ width:98%;  }
.box-contacth{ padding:125px 0 36px;   }
.contact-txt{  width:90%; }

.ct-txtbox1{  width:60%; float:none; padding:0 0 10px; margin:0 auto; }
.ct-txtbox2{  width:60%; float:none; padding:0 0 10px; margin:0 auto; }
.ct-txtbox2 > div{ width:100%; margin:0 auto; }
.ct-txtbox3{ width:60%; padding:0 0 10px; margin:0 auto;  }
.ct-txtbox3.left{ float:none; }
.ct-txtbox3.right{ float:none; }
#contactform div.btn-submit{ margin:20px auto 30px; } 

.box-faqh{ padding:125px 0 36px; }
.faqbox{   width:94%;  }
.faqh{  background:url(../../img/faq-down.png) 96% no-repeat;  }

#footer{ display:none; }

}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
  /* Add your styles for devices with a maximum width of 768 */
 
  
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
   /* Add your styles for devices with a maximum width of 1024 */
}



@media screen and (max-width: 768px) {
 /* Add your styles for devices with a maximum width of 768 */
 
}

@media only screen and (max-device-width:640px) {
.overview-img, .vision-img, .mission-img, .team-img, .alliance-img, .sponsor-img{  height:416px;  }

.box-serviceh{ padding:117px 0 36px; font-size:2.8125em;    }
.box-service{ padding:39px 0; }

.box-qualityh{ font-size:45px; line-height:36px; }
.box-qualitytxt{ width:94%;  }
.quality-box{ width:98%; padding:0 5px; float:none; margin-bottom:26px;  }

 
.box-showcaseh{  font-size:45px; line-height:36px;   }

.showcasebox{ width:96%; }
.showcase-box{  width:100%; float:none;  }
.showcase-top{ display:block; position:relative; padding:26px 0; text-align:center;  }



.new-box{ display:block; position:relative; width:100%; margin-bottom:26px;  }

.new-list{  width:300px; }
.new-img{  width:300px; height:200px;  }

.box-newh{ padding:116px 0 36px; font-size:45px; line-height:36px;  } 
 
 
.box-contacth{ padding:116px 0 36px;  font-size:45px; line-height:36px;  }

.contact-td{ display:block; position:relative; width:100%;  }
.contact-txt, .contact-txt.txt-right{  text-align:center; }

a.btn-map{  margin:0 auto; padding:0 0 5px; }
a.btn-googlemap{ margin:0 auto 25px; }
.contact-btn{ text-align:center; padding:0 0 5px;  }
.contact-btn.txt-right{ text-align:center; }

.ct-txtbox1{  width:90%;  }
.ct-txtbox2{  width:90%;  }
.ct-txtbox3{  width:90%;  }
 

.box-faqh{ padding:116px 0 36px;  font-size:45px; line-height:36px;  } 
 
}
 
@media screen and (max-width: 480px) {
.overview-img, .vision-img, .mission-img, .team-img, .alliance-img, .sponsor-img{  height:320px;  }

.lead-txt01 img, .lead-txt02 img, .lead-txt03 img{ max-width:60%; }



}
 

@media screen and (max-width: 320px) {
.overview-img, .vision-img, .mission-img, .team-img, .alliance-img, .sponsor-img{  height:284px;  }

/*.lead-txt01, .lead-txt02, .lead-txt03{ left:20%; top:50%;}	*/
.lead-txt01 img, .lead-txt02 img, .lead-txt03 img{ max-width:50%; }
}