/* by Adon , CSS Document */

.products-navs{ float:left; width:100%; margin:0 0 5% 0;}
.products-navs ul li{ float:left; font-size:18px; color:#909090; margin-right:80px;}
.products-navs ul li a{color:#909090;}
.products-navs ul li:hover a,.products-navs ul li.on a{color:#17927a;}

.video{float:left;width:100%;}
.video li{float:left;width:49.5%;background:#f5f5f5;margin-bottom:1%; padding-bottom:2.5%;}
.video li .thumb{position:relative;max-height:363px;overflow:hidden}
.video li .thumb .pic{display:block;width:100%}
.video li .thumb .bg{background:#000;opacity:.2;-webkit-opacity:.2;-moz-opacity:.2;-ms-opacity:.2;-o-opacity:.2;width:100%;position:absolute;top:0;left:0;height:100%}
.video li .thumb i{position:absolute;z-index:2;left:5%; bottom:7.5%;text-align:center}
.video li span{display:block;font-size:25px; font-weight:bold;text-overflow:ellipsis;white-space:nowrap;overflow:hidden; margin:2.5% 5%;}
.video li.l{margin-right:.5%}
.video li.r{margin-left:.5%}
@media (max-width:1024px){

}
@media (max-width:768px){
.products-navs{ margin:0 0 10% 0;}
.video li span{font-size:16px}
}
@media (max-width:640px){
.products-navs ul li{ font-size:15px; margin-bottom:15px;}
.video li{width:100%;margin-right:0!important;margin-bottom:2.5%;margin-left:0!important}
}
@media (max-width:480px){
.video li .thumb i{margin-top:-20px}
.video li .thumb i img{width:40px}
}