/*css*/
@import "grid.css";
@import "alimaofade.css";
html, body {height:100%;}
body{font:13px/20px Arial, Helvetica, sans-serif;color:#666;position:relative;min-width:320px;-webkit-text-size-adjust: none}
/*Links*/
a{color:#333;text-decoration:none}
a:hover{color:#ff0000;text-decoration: none}
a[href^="tel:"] {color: inherit;text-decoration:none}
header{width:100%;z-index:10;position:relative;background:rgba(5,4,8,0.5) !important;-webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.2);
box-shadow: 0 4px 5px 0 rgba(0,0,0,0.2)}
.stuck_container{position:fixed; left:0; top:-100px; right:0; margin:0 auto; z-index:30000; background:#002339;-webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.2);box-shadow: 0 4px 5px 0 rgba(0,0,0,0.2); opacity:0;}
#page header{background:#003e65 !important}
header h1,#logo{position:relative;z-index:9;float:left; width:200px}
header h1 a.logo,#logo a.logo{display:block;padding-top:10px}
.topbox{height:32px;border-bottom:1px solid #265d8a; color:#999}
.topbox .language{float:right; position:relative; margin-left:15px}
.topbox .language h6{color:#ddd;cursor:pointer;margin-top:5px; padding:1.2px 15px; background:#3e698b}
.topbox .language h6:hover{background:#ff6908; color:#fff}
.language ul{display:none; position:absolute; left:0; top:28px; padding:20px 0; width:140px; background:#000; z-index:3}
.language:hover ul{display:block}
.topbox li{display:block; padding:5px 20px}
.topbox li a{ color:#fff}
.topbox li img{ margin-right:10px}
.topbox a:hover{color:#ff0000}
.top_ico a{float:left; text-align:right; position: relative}
.top_ico a i{position: absolute; z-index: 999; width: 200px; height: 200px; background: url('../images/weixin.jpg') no-repeat; background-size: 100%; left: 0; top: 32px; display: none}
.top_ico a:hover i{display: inline-block}
#searchform{float:right;overflow:hidden;border:none;background:#3e698b;width:200px}
#searchform input{margin:0;font-size:13px;background:#3e698b; border:none; padding:3px 0 0 10px; color:#001153; outline:none; position:relative; font-family:Arial, Helvetica, sans-serif;float: left;width:160px;}
#searchform a{width:30px;height: 22px; display: block; float: left; background: url('../images/search_a.png') no-repeat;background-position:0 -22px}
#searchform a:hover{background-position:0 0px;}
/* Menu */
nav{position:relative;float:right;z-index:2;}
.sf-menu .current a{background:#ff6908;color:#fff}
.sf-menu,.sf-menu ul {margin:0;padding:0;list-style:none}
.sf-menu:before,.sf-menu:after {display:table;content:""}
.sf-menu:after {clear:both}
.sf-menu {zoom:1}
.sf-menu > li {float:left;border-radius:3px;text-align:center; margin:0 10px; position:relative}
.sf-menu a span {display:block}
.sf-menu a {color:#fff;font-size:12px; margin:5px 0;padding:5px 15px;border-radius:3px; text-transform:uppercase;-webkit-transition:all 0.4s ease 0s;-o-transition:all 0.4s ease 0s;transition:all 0.4s ease 0s;display:block}
.sf-menu > li:hover a,.sf-menu > li:hover > a,.sf-menu > li.sfHoverForce > a {margin:0;padding:10px 15px;background:#ff6908; color:#fff;text-decoration:none}
.sf-menu li:last-child:hover:after {top:10px}
.sf-menu ul {opacity:0;visibility:hidden;background:#000;position:absolute;top:44px;left:0;border-radius:5px;padding:16px 0 16px;z-index:999;transition:all 0.2s ease-in-out 0.2s;-webkit-transition:all 0.2s ease-in-out 0.2s;-moz-transition:all 0.2s ease-in-out 0.2s;-ms-transition:all 0.2s ease-in-out 0.2s;-o-transition:all 0.2s ease-in-out 0.2s; width:240px;}
.sf-menu li:hover > ul {opacity:1;visibility:visible;margin:0;transition-delay:0s;-webkit-transition-delay:0s;-moz-transition-delay:0s;-ms-transition-delay:0s;-o-transition-delay:0s}
.sf-menu ul ul {margin:0 0 0 20px;top:-16px;background:#222;}
.sf-menu ul li {display:block; margin:0;padding:0 20px 0 !important;text-align: left}
.sf-menu ul li:last-child {border:none}
.sf-menu ul a {display:block;float:none;border-radius:0;margin:0;white-space:nowrap; background:none !important}
.sf-menu > li:hover ul a{color:#fff; padding:5px 15px}
.sf-menu > li:hover ul a:hover{color:#ff0000}
.sf-menu ul ul a {color:#999 !important}
.sf-menu ul a span {display:inline}
/* Public */
.img_wrap1, .img_wrap2, .link1, .sf-menu a,a.img_wrap2 strong, a.img_wrap1 strong{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
.button1 strong,.list1 a em,.link1 em,.button2 strong,.button3 strong{
-webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
-moz-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
-ms-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
-o-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275)}
.img_wrap1{display:block;padding:10px;background:#fff;box-shadow:1px 1px 4px #666;position:relative;}
.img_wrap2{display:block;padding:5px;background:#fff;box-shadow:0px 0px 4px #d2ccc1;position: relative;}
.img_wrap1 strong, .img_wrap2 strong{display:block;position: absolute; top:0;left:0;width:0;height:0;background:#1c6699;}
.img_wrap1 img, .img_wrap2 img{position: relative; z-index:1;}
a.img_wrap1:hover strong, a.img_wrap2:hover strong{height:100%;width:100%;}
.button1,.button2,.button3{display:inline-block; padding:15px 23px; box-shadow:1px 1px 1px #b9b5ac; text-shadow:0px -1px #d67303; margin: 18px 0 0; font-size: 12px; line-height: 15px; color:#fff; text-transform:uppercase; background:#323234;position:relative;}
.button1 span,.button2 span,.button3 span{display:block;position:relative;z-index:1;}
.button1 strong,.button2 strong,.button3 strong{background:#ff6908;display:block;position:absolute;left:0;top:0;right:0;bottom:0;}
.button1:hover strong,.button2:hover strong,.button3:hover strong{left:50%;top:50%;right:50%;bottom:50%;}
.button1:hover,.button2:hover,.button3:hover{color:#fff;text-shadow: none;}
.button2{padding:7px 12px 6px;background:#fc8703;box-shadow:1px 1px 1px #b9b5ac; text-shadow:0px -1px #1a1a1a;}
.button2 strong{background:#323234}
.button3{padding:10px 18px 8px; margin:0}
.button3 strong{background:#ff6908}
.b_line{padding-bottom:20px;border-bottom:1px dotted #ccc}
.link1 em, .list1 a em{display:block;position:absolute;bottom:-4px;width:0;height:1px;background:#000;content:"";}
.link1:hover em, .list1 a:hover em{width:100%;}
.link1,.list1 a{text-decoration:none !important}
/* banner */
.camera_wrap { min-height:220px; background:#020516}
/* About */
.first{background:#1c6699; padding:40px 0 40px 0}
.first .grid_5{font-size:36px; color:#fff;font-family: Georgia, serif}
.first .grid_5 h2{font-size:72px; display:block; margin-bottom:40px}
.first .grid_7 p{ margin-top:20px;font-size:14px; line-height:22px}
/*video*/
.video{background:#ff6908; padding:5px 0}
#htmlvideo iframe{width:570px;height:320px; background:url(../images/vido.jpg) no-repeat center}
.partner{padding:50px 0}
.partner .grid_2{width:120px}
/* News */
.video .list1 a{ color:#fff}
.graphic{overflow:hidden; padding-bottom:10px;border-bottom:1px #f5f5f5 solid}
.graphic h2 a{ margin:0; padding:0; color:#fff; line-height:18px}
.graphic .grid_2{margin-left:0}
.video .list1 a:hover,.graphic h2 a:hover{color:#000}
/* Products Sort */
.sort h2{font-weight:bold; color:#000}
/* Footer */
footer{width:100%;border-top: 6px solid #191919;border-bottom: 35px solid #ff6908;padding-top: 60px;padding-bottom: 60px;background: #fff}
span.copy{display: block;font:bold 18px/18px Arial, Helvetica, sans-serif;color: #3a3a3a;text-transform: uppercase;margin-bottom: 5px}
.copyright{font: 12px/15px Arial, Helvetica, sans-serif;color: #949494;text-transform: uppercase;margin-bottom: 16px;padding-top: 20px;}
.footer_logo{display: block;margin-bottom: 20px}
.copyright a{color:inherit}
.footer-link{display:block}
.footer_soc_icon{overflow: hidden;display: block}
.footer_soc_icon li{float: left}
.icon1 a, .icon2 a, .icon3 a, .icon4 a, .icon5 a{display: block;height: 23px}
.icon1 a{background: url(../images/soc_icon1.png) 0 0;margin-right: 22px;width: 14px}
.icon2 a{background: url(../images/soc_icon2.png) 0 0;margin-right: 20px;width: 22px}
.icon3 a{background: url(../images/soc_icon3.png) 0 0;margin-right: 22px;width: 19px}
.icon4 a{background: url(../images/soc_icon4.png) 0 0;margin-right: 21px;width: 20px}
.icon5 a{background: url(../images/soc_icon5.png) 0 0;margin-right: 0px;width: 20px}
.footer_soc_icon li a:hover{opacity: 0.6}
.b_l_line{border-left: 1px solid #dadada; padding-left:30px; overflow:hidden}
.border_img{border: 3px solid #e5e5e5;float: left;border-radius: 2px;margin-right: 19px;margin-top: 5px}
.float_none{float: none;margin-right: 0}
footer h5{font:bold 18px/18px Arial, Helvetica, sans-serif;color: #3a3a3a;padding-top: 20px;margin-bottom: 22px}
.footer_list1 li{margin-top: 16px;font: 12px/14px Arial, Helvetica, sans-serif;color: #838282}
.footer_list1 li:first-child{margin-top: 0}
.footer_list2{padding-top: 0px}
.footer_list2 li{display: block;padding-bottom:16px;font: 12px/14px Arial, Helvetica, sans-serif;}
.footer_list2 li:first-child{margin-top: 0}
.footer_list2 li a{display: inline-block;color: #838282;transition: 0.2s;-webkit-transition: 0.2s;-moz-transition: 0.2s}
.footer_list2 li a:hover{color: #d44900}
.footer_list3 li{ float:left; margin-right:40px; width:140px }
/*To top*/
#toTop {background:url(../images/back_to.png) center top no-repeat;border:none;bottom: 180px !important;color:transparent;display:none;font-size:0;height:42px;line-height:0;overflow:hidden;position:fixed;right:0;text-decoration:none;width:42px;z-index:20;transition: 0.3s;-webkit-transition: 0.3s;-moz-transition: 0.3s; display:none}
#toTop:hover{background-position:center -42px; cursor:pointer}
#toTop:active, #toTop:focus {outline:none}
/***************Page*****************/
/*Public Css*/
/* Lists */
.list1 li{padding-left:24px;padding-top:1px;margin-bottom:8px;}
.list1 a{line-height: 15px; display:inline-block;position: relative;transition: 0.7s;-webkit-transition: 0.7s;-moz-transition: 0.7s}
.list1 a:hover{padding-left:10px}
.list1 li a:before{position: absolute;width: 13px;height: 13px;content: '';top: 2px;left: -23px;background: url(../images/list_marker.png)  no-repeat;transition: 0.7s;-webkit-transition: 0.7s;-moz-transition: 0.7s}
.list1 li a:hover:before{-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg)}
#searchbar{overflow:hidden;border:1px solid #c2c1c1;background:#fff;width:auto;}
#searchbar input{margin:0;font-size:13px; border:none; color:#736c67; padding:7px 0px 0 12px;outline:none; position:relative; font-family:Arial, Helvetica, sans-serif;float: left;width: 70%;}
#searchbar a{width:35px;height: 31px; display: block; float: right; background: url('../images/search_a.jpg') no-repeat;}
#searchbar a:hover{background-position:0 -31px;}
/*About Css*/
.about .grid_7 p{padding-bottom:5px}
.advantage .grid_3{ min-height:330px}
.advantage .grid_3 img{transition: 0.7s;-webkit-transition: 0.7s;-moz-transition: 0.7s}
.advantage .grid_3 img:hover {-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg); cursor:pointer}
.work {position:relative}
.work a{width:100%; height:100%; overflow:hidden}
.work img{transition: .9s;-moz-transition: .9s;-webkit-transition: .9s;-o-transition: .9s;line-height: 1em; min-height:auto; max-width:100%}
.work a:hover img{transform: scale(1.2);-webkit-transform: scale(1.2);-o-transition: scale(1.2)}

/*Product Css*/
aside h2,.titlebar{height:50px; line-height:50px; font-size:18px; padding-left:20px; background:#014f81; color:#fff; display:block;border-radius:8px 8px 0 0}
.titlebar{background:#ff6908}
.category{background:#f5f5f5}
.category ul{padding:20px 0}
.category li{line-height:32px}
.category li a{padding:5px 20px; display:block; font-size:16px}
.category li.curr a,.category li a:hover{ background:#ff6908; color:#fff}
.tag_list h3{background:#f5f5f5; font-weight:600; color:#333; height:42px; line-height:42px; padding-left:20px;}
.tag_list a{display:inline-block; padding:5px 10px; margin:3px 0 3px; background:#014f81; color:#fff}
.tag_list a:hover{background:#ff6908}
article.grid_9 .pro_list{ margin-left:-15px}
.pro_list .grid_3{margin-bottom:20px; margin-left:15px;float:none;display:inline-block; width:280px; color:#333}
.pro_list .grid_3:hover{background:#f5f5f5}
.pro_list .grid_3 p{ overflow:hidden}
.pro_list .grid_3 h3{height:60px;overflow:hidden}
.pro_list div h3+a{height:100%; display:block; overflow:hidden}
.pro_list img{transition: .9s;-moz-transition: .9s;-webkit-transition: .9s;-o-transition: .9s;line-height: 1em; min-height:auto; max-width:100%}
.pro_list a:hover img{transform: scale(1.2);-webkit-transform: scale(1.2);-o-transition: scale(1.2)}
.details_t{height:36px; overflow:hidden}
.details_t a{float:left;width:33%;background:#ff6908;line-height:36px; text-align:center; color:#fff; font-size:16px; display:inline-block}
.details_t a.curr{background:#fff; border:2px solid #ff6908; border-bottom:0; color:#333; display:inline-block}
.details {padding:30px 0; position:relative}
.details .hide{display:none}
.details table{width:100%; margin-bottom:20px}
.details td{ border:1px solid #ccc; text-align:center; padding:3px 0}
.prevnext .list1 a{text-transform: none;}
.pagination{margin-top:30px;line-height:20px; display:none}
.pagination a{padding:3px 10px; border:1px solid #ccc; margin:0 2px; display:inline-block; vertical-align: inherit}
.pagination strong{padding:3px 10px; border:0; background:#ed7020; color:#fff;margin:0 2px;display:inline-block}
/*News Css*/
time span{display:block; color:#333}
time span.day{font-size:36px; padding-bottom:10px; border-bottom:2px solid #ccc}
time span.month{font-size:18px; margin-top:5px}
.data{width:60px; height:60px; display:block;background: #eee;color:#333; text-align:center; line-height:60px}
.news .content a{color: #004BBF}
.news .content a:hover{color:#FF0000}
.prnext {text-align:center}
.prnext b{ color:#999}
.prnext a{margin:0 5px; font-size:13px}
/*Gallery Css*/
.gallery .date{ background:url(../images/gallery_day_bg.png) no-repeat left 0; text-align:left; line-height:56px; font-size:24px; color:#fff; padding-left:30px;}
/* Contact Css */
.contact .content p{
	font-size: 18px;
	color: #333
}
.contact .content strong{font-size:16px}
#feedback textarea, #feedback input,#feedback select {margin:0;width: 90%;font-size:13px; border:1px solid #c2c1c1; color:#736c67; padding:7px 12px 8px;outline:none; position:relative; font-family:Arial, Helvetica, sans-serif;background:#fff;}
#feedback textarea {overflow:auto; height:161px;resize:none; float:left; margin: 0;}	
#feedback label {display:block; min-height:43px; overflow:hidden;}	
#feedback label.message { display:block; padding-bottom:0; }
#feedback .error, #feedback .empty {display:none;}	
#feedback .error, #feedback .empty {text-align:left; color:red; font-size:11px; clear:both;}
#feedback .button2{ padding:10px 25px}
#feedback span{ display:inline-block}

/*==================================RESPONSIVE LAYOUTS===============================================*/
@media (min-width: 980px) and (max-width: 1199px) {
.f16{font-size:14px}
.f22{font-size:20px}
.pro_list .grid_3{width:223px}
#htmlvideo iframe{width:460px;height:259px}
}
@media only screen and (max-width: 1199px) {
.partner .grid_2{width:100px}
.certification .row{margin-left:-20px}
.certification .grid_2{width:172px; margin-left:20px}
}
@media (min-width: 768px) and (max-width: 979px) {
.sf-menu > li > a {padding: 5px}
.sf-menu > li > a:hover {padding:10px 5px}
.first .grid_5{font-size:28px }
.first .grid_5 h2 {font-size:48px}
#htmlvideo iframe{width:364px;height:205px}
.partner .grid_2{width:170px; margin-bottom:20px}
aside.grid_3{width:220px}
article.grid_9{ width: 508px}
.pro_list .grid_3{width:245px}
}
@media only screen and (max-width: 979px) {
.pro_read .grid_9 .grid_5,.pro_read .grid_9 .grid_5+.grid_4{float:none; margin:0 auto; width:100%}
.pro_read .grid_9 > .row{margin-left:0}
}
@media only screen and (max-width: 767px) {
.topbox{display:none}
.tel img{float: right; width:200px; display:block}
header h1{width:180px}
header nav.m_t20 { margin-top:25px}
#mm0{ width:220px}
.first{ padding:20px 0}
.first .grid_5{font-size:32px; text-align:left;}
.first .grid_5 h2{display:none}
.first .grid_7{float:left}
.first .grid_7 h2{margin:10px 0 0 0; text-align:left}

.sort .row,.partner .row{margin-left:-20px}
.sort .grid_4{float:left; width:220px; margin-left:20px}
.button1,.button2{ padding:10px 15px; margin: 10px 0 0;}
#htmlvideo iframe{width:460px;height:259px}
.graphic .grid_2{float:left;width:160px}
.partner .grid_2{float:left; width:140px; margin-left:20px; margin-bottom:20px}
footer .row{margin-left:-20px}
footer [class*="grid_"]{float:left; margin-left:20px;width:220px; margin-bottom:20px}
footer .grid_3 .b_l_line{border:0; border-top:1px solid #dadada; padding-left:0}
.about .text_r{text-align:center}
aside.grid_3,article.grid_9{float:none; margin:0 auto;width:100%}
article .pro_list .grid_3{width:220px}
.aside_news .grid_3{float:none; margin:0 auto;margin-left:0; width: auto;}
.news_list .grid_1,.news_list .grid_8{float:left}
.news_list .grid_1{width:40px}
.news_list .grid_8{width:400px; margin-left:20px}
.certification .row{margin-left:-20px}
.certification .grid_2{float:left;width:220px; margin-left:20px}
}
@media only screen and (max-width: 479px) {
header h1{width:160px}
header nav.m_t20 { margin-top:20px; padding-bottom:15px}
#mm0{width:140px}
.sort .row{margin-left:0}
.sort .grid_4{float: none; width:320px; margin-left:0}
#htmlvideo iframe{width:320px;height:180px}
.partner .grid_2{width:90px; margin-bottom:20px}
footer .row{margin-left:0}
footer [class*="grid_"]{float: none; margin-left:0;width:320px; margin-bottom:20px}
footer .grid_4 .b_l_line{border:0; border-top:1px solid #dadada; padding-left:0}
article .pro_list .grid_3{width: 320px}
.details_t a{line-height:12px; padding:10px 0 14px 0;font-size:12px}
.details_t a.curr{border:1px solid #ff6908;}
.news_list .grid_8{width:260px; margin-left:20px}
.certification .grid_2{float:left;width:150px; margin-left:20px}
}