/* by Adon , CSS Document */


.header{ background:none}
.header-div{ display:none}
.header .box{ border-bottom:solid 1px #fff}
.slider{overflow:hidden;position:relative;}
.slider .prev{ position:absolute; top:45%; left:5%; z-index:1}
.slider .next{ position:absolute; top:45%; right:5%; z-index:1}
.slider,.slider li,.slider li a{float:left;width:100%; overflow:hidden;}
.slider li{position:relative;overflow:hidden}
.slider li .box{position:absolute;right:0;top:50%;margin-top:-130px;text-transform:uppercase;width:100%;color:#fff;}
.slider li .box .p1{font-size:45px;line-height:55px;font-weight:bold}
.slider li .box .p2{font-size:30px;font-weight:bold; margin:5px 0 5% 0}
.slider li .box .p3{font-size:16px; max-width:630px;}
.navs{ float:left; text-align:center; line-height:100px; width:100%; text-transform:uppercase; font-weight:bold;font-size:14px;}
.navs a{ margin:0 30px 0 10px;}
.products{ float:left; width:100%; position:relative; overflow:hidden;}
.products .container{ height:100%; position:relative;}
.products .des{ width:20%; float:left; position: absolute; top:50%; margin:-80px 0}
.products .des .p2{font-size:15px; margin-top:30px;}
.products .next{ position:absolute; right:0; top:50%; margin:-50px 0; z-index:11; overflow:hidden; background:#003d6c}
.products .next:hover{ right:-10px;padding-left:10px;}
.products ul{ float:right; width:75%;}
.products ul li{ float:left; border:solid 1px #e7e7e7; font-size:20px; width:98%; max-height:370px;background:#fff;font-weight:bold; padding:10%; margin:0 5px;}
.products ul li img{ max-height:180px; margin:10% auto; display:block; text-align:center;}
.products ul li span{ margin-top:5%; text-transform:uppercase; text-align:center;}
.about{float:left; width:100%; background:#f7f8f9; padding:5% 0;position:relative; margin-bottom:10%;}
.about ul li{ float:left; width:50%; position:relative; color:#fff;}
.about ul li span{ font-size:40px; font-weight:bold; line-height:45px; color:#fff; text-transform:uppercase;position:absolute; top:10%; left:10%;}
.about ul li p{ font-size:15px; position:absolute; top:23%; left:10%;color:#fff; max-width:450px; padding-right:5%;}
.news .p2{font-weight:bold; border:solid 2px #ededed; text-align:center; font-size:15px; max-width:185px; width:100%; margin:0 auto; line-height:47px;}

@media (max-width:1366px){
.slider li img{ width:150%; max-width:150%; margin-left:-25%}
.slider .prev,.slider .next{ display:none}
.products ul li img{ max-height:120px;}
}
@media (max-width:1111px) and (min-width:769px){
.title{font-size:36px; line-height:40px;}
.products .des .p2{font-size:14px;}
.products ul li{ font-size:16px;}
.products .next img{ height:80px;}
}
@media (max-width:1024px){
.slider li .box { margin-top:-110px;}
.slider li .box .p1{font-size:40px;line-height:45px;}
.slider li .box .p2{font-size:24px}
.slider li .box .p3{font-size:14px;}
.about ul li span{ font-size:35px; line-height:40px;}
.about ul li p{ font-size:13px;}
}
@media (max-width:768px){
.slider li .box { margin-top:-90px;}
.slider li .box .p1{font-size:35px;line-height:40px;}
.slider li .box .p2{font-size:20px}
.slider li .box .p3{font-size:13px;}
.about ul li{width:100%;}
.about{ padding:10% 0; margin-bottom:15%;}
.products .des{ width:100%; position:static; margin:0;}
.products ul{ width:100%;}
.products .des .p2{ margin:5% 0;}
.products ul li{ font-size:16px;}
.products .next{ display:none}
.products ul li{ margin:0 5px;}
}
@media (max-width:640px){
.navs{ line-height:25px;padding:5% 0;}	
.navs .on{ display:block;}
.navs a{ margin:0 5%;}
}
@media (max-width:480px){
.header{ background:#003d6c}
.header .box{ border-bottom:solid 1px #fff}
.header-div{ display:block}
.slider li .box { margin-top:-80px;}
.slider li .box .p1{font-size:25px;line-height:30px;}
.slider li .box .p2{font-size:16px}
.about ul li span{ font-size:26px; line-height:30px;}
.products ul li{ font-size:14px;}
.products .des .p2{ margin:7.5% 0; font-size:14px;}
.news .p2{ font-size:14px; max-width:160px; line-height:35px;}
.products ul li img{ max-height:100px;}
.products ul li{ margin:0;}
}
@media (max-width:320px){
.slider li .box { margin-top:-100px;}
.slider li .box .p1{font-size:26px;line-height:26px;}
.slider li .box .p2{font-size:14px}
.about ul li span{ font-size:22px; line-height:25px;}
.about ul li p{ font-size:12px;}
.products .des .p2{ font-size:13px;}
.products ul li{ font-size:12px;}
}