/*------------- home ------------*/
.home-category li{float:left;width:50%;margin-bottom:50px;}
.home-category .b{overflow:hidden;background-color:#76a830;border-radius:25px;-webkit-border-radius:25px;-moz-border-radius:25px;
}
.home-category .i-text{padding:30px;text-align:center;font-size:18px;color:#FFF;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.home-category li:nth-child(odd) .b{margin-right:25px;}
.home-category li:nth-child(even) .b{margin-left:25px;}
.home-category a:hover{text-decoration:none;}
.home-category li:hover .b{background-color:#58971e;}
.home-category .i-icon img{width:100%;}

.home-act{padding:120px 0;text-align:center;margin:0 auto;width:790px;}
.home-act h3{font-size:36px;margin:0 0 50px 0;font-weight:500;}

/** view **/
.view-bar{border:1px solid #eaeaea;border-left:none;border-right:none;height:60px;margin-bottom:30px;}
.view-filter{float:left;width:70%;}
.view-filter .h{float:left;line-height:60px;margin-right:40px;}
.view-filter-h{position:relative;float:left;}
.view-filter-h .i-h{height:60px;line-height:60px;padding:0 20px;}
.view-filter-h .i-h .if{font-size:12px;margin-left:5px;}
.view-filter-h .i-h .on{display:inline-block;white-space:nowrap;margin-left:5px;color:#e12c43;}
.view-filter-h:hover .i-h{background-color:#222;color:#FFF;}
.view-filter-sub{position:absolute;top:68px;left:0;z-index:999;background-color:#FFF;height:0;overflow:hidden;
opacity:0;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter:alpha(opacity=0);}
.view-filter-h:hover .view-filter-sub{display:block;top:60px;height:auto;opacity:1;overflow:visible;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter:alpha(opacity=100);}
.view-filter-sub .vt{padding:15px 20px;}
.view-filter-sub .vt li{white-space:nowrap;list-style:disc;margin:0 0 8px 13px;}
.view-filter-sub .vc{width:500px;padding:20px;display:grid;grid-template-columns:33.33% 33.33% 33.33%;grid-row-gap:10px;}
.view-filter-sub .vc li{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.view-filter-sub .vc a{display:inline-block;}
.view-filter-sub .vc a.on{background-color:#c5ac9b;color:#FFF;padding:0 10px;}
.view-filter-sub .vc a:hover{text-decoration:none;}
.view-filter-sub .vc a .if{vertical-align:middle;}
.view-filter-sub .i-color{display:inline-block;width:12px;height:12px;}

.view-page{float:right;padding:17px 0 0 15px;}
.view-sort{float:right;}

#view-filter-category a:hover{text-decoration:none;}
#view-filter-category .category-tree{min-width:160px;}

/*------------- layout ------------*/
.product-left{float:left;width:22%;}
.product-right{float:right;width:72%;}

.product-category .i-h, .bar-category .i-title{margin-bottom:20px;position:relative;border-bottom:1px solid #EEE;}
.product-category .i-h h2, .bar-category .i-title h2{font-size:25px;margin:0;padding-bottom:15px;}
.product-category .i-h .if{display:none;}
.bar-category{margin-bottom:50px;}

.product-category .i-menu ul{margin:0 0 15px 20px;}
.product-category .i-menu li{list-style:disc;margin-bottom:15px;}
.product-category .i-menu a{font-size:17px;}
.product-category .i-menu a.on{color:#76a830;text-decoration:underline;}
.product-category .sub{padding:10px 0 2px 0;}

/*------------- list ------------*/
.product-list li{float:left;width:25%;margin-bottom:50px;}
.product-list .b{border:1px solid #EEE;overflow:hidden;background-color:#F2F2F2;margin:0 15px;
border-radius:25px;-webkit-border-radus:25px;}
.product-list li:hover .b{background-color:#76a830;}
.product-list .i-thumb img{width:100%;}
.product-list .i-text{padding:25px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.product-list li:hover .i-text{color:#FFF;}
.product-list .status-new, .product-list .status-best{font-size:10px;padding:2px 3px;}


/*------------------------ product ------------------------*/
.product-img{float:left;width:28%;}
.product-img .i-img{border:1px solid #eaeaea;overflow:hidden;}
.product-img .i-img li{float:left;position:relative;min-height:310px;width:100%;}
.product-img .i-img .load{position:absolute;width:100%;height:100%;background-color:rgba(0,0,0,0.3);}
.product-img .i-img .load span{position:absolute;width:100%;left:0;top:42%;text-align:center;color:#FFF;font-size:24px;}
.product-img .i-img img{width:100%;cursor:pointer;}
.product-img .i-img img:hover{opacity:0.8;}
.product-img .i-play{position:absolute;z-index:5;width:55px;height:55px;line-height:55px;right:15px;bottom:15px;
background-color:rgba(0, 0, 0, 0.6);text-align:center;cursor:pointer;overflow:hidden;}
.product-img .i-play .if{font-size:22px;color:#FFF;}
.product-img .i-play:hover{background-color:#76a830;}
.product-img .i-gthumb{margin-top:20px;}
.product-img .i-gthumb li{float:left;width:50px;height:50px;overflow:hidden;position:relative;margin:0 10px 10px 0;border:1px solid #eaeaea;cursor:pointer;}
.product-img .i-gthumb li:after{position:absolute;top:0;left:0;content:'';border-style:solid;border-width:1px;border-color:transparent;width:48px;height:48px;z-index:1;overflow:hidden;}
.product-img .i-gthumb li.on:after{border-color:#76a830;}
.product-img .i-gthumb li:hover{border-color:#AAA;}
.product-img .i-gthumb li.on{border-color:#76a830;}

.product-info{float:left;width:72%;overflow:hidden;}
.product-info .i-box{margin-left:60px;}
.product-info h2{font-size:28px;font-weight:400;text-transform:capitalize;margin:0 0 20px 0;}
.product-info .i-sku{font-size:12px;color:#999;margin-bottom:20px;}
.product-info .i-line{clear:both;width:100%;height:0;border-top:1px solid #eaeaea;margin:45px 0;overflow:hidden;}
.product-info .i-summary{color:#979797;margin-top:25px;}

.product-detail{padding:60px 0;}
.product-detail .i-tabs li{float:left;height:55px;line-height:55px;padding:0 30px;overflow:hidden;background-color:#76a830;color:#FFF;
border-radius:15px 15px 0 0;-webkit-border-radius:15px 15px 0 0;}
.product-detail .i-box{padding:50px;border:1px solid #EEE;overflow:hidden;
border-radius:0 25px 25px 25px;-webkit-border-radius:0 25px 25px 25px;}

.product-attr-table table{width:100%;border-collapse:collapse;}
.product-attr-table td{padding:15px 20px;border-right:1px solid #FFF;background-color:#c0c0c0;}
.product-attr-table tr:nth-child(2n+0) td{background-color:#f2f2f2;}

.product-desc-img p{margin:0 !important;padding:0 !important;}

/*----------- detail ---------- */
.product-detail-line{width:100%;clear:both;height:1px;background-color:#EEE;margin:45px 0;overflow:hidden;}
.product-title{margin-top:45px;}
.product-title h2{font-size:28px;margin:0;}
.product-title p{margin:20px 0 0 0;color:#3c3c3b;}
.product-title .i-btn{margin-top:40px;}

.product-tabs-title{margin-bottom:35px;}
.product-tabs-title h3{font-size:23px;border-left:2px solid #da3731;padding-left:15px;}

.product-attr table{border-collapse:collapse;}
.product-attr td{padding:4px;border:1px solid $EEE;}

/*----------- common ---------- */
/* transition */
.home-category .b, 
.product-list .b,
.view-filter-h .i-h, .view-filter-sub{transition:all 0.5s ease 0s; -webkit-transition:all 0.5s ease 0s;-moz-transition:all 0.5s ease 0s;-o-transition:all 0.5s ease 0s;}

.product-options li, 
.product-img .i-play{transition:background-color 0.5s ease 0s; -webkit-transition:background-color 0.5s ease 0s;-moz-transition:background-color 0.5s ease 0s;-o-transition:background-color 0.5s ease 0s;}
.product-options li a{transition:padding 0.5s ease 0s; -webkit-transition:padding 0.5s ease 0s;-moz-transition:padding 0.5s ease 0s;-o-transition:padding 0.5s ease 0s;}

.view-filter-sub .i-color, 
.product-img .i-play{border-radius:100%;-webkit-border-radius:100%;-moz-border-radius:100%;}

.home-category li:hover .b, .product-list li:hover .b,
.view-filter-sub
{-moz-box-shadow:0 1px 10px rgba(0,0,0,0.15);-webkit-box-shadow:0 1px 10px rgba(0,0,0,0.15);box-shadow:0 1px 10px rgba(0,0,0,0.15);}


/*----------- media ---------- */
@media screen and (max-width:960px){
.product-left, .product-right{width:100%;}

.product-category{margin-bottom:35px;position:relative;}
.product-category .i-menu{display:none;position:absolute;top:52px;left:0;z-index:2;width:100%;background-color:#FFF;
-moz-box-shadow:0 1px 10px rgba(0,0,0,0.15);-webkit-box-shadow:0 1px 10px rgba(0,0,0,0.15);box-shadow:0 1px 10px rgba(0,0,0,0.15);}
.product-category .i-menu ul{padding:20px 20px 5px 20px;}
.product-category .i-h{margin:0;border:1px solid #EEE;height:50px;overflow:hidden;}
.product-category .i-menu, .product-category .i-h{border-radius:25px;-webkit-border-radius:25px;}
.product-category .i-h h2{padding:0;line-height:50px;padding:0 20px;font-size:18px;}
.product-category .i-h .if{display:block;position:absolute;z-index:1;right:20px;top:0;line-height:50px;}


.product-list li{width:33.33%;}

.view-filter-sub{display:none;top:60px;height:auto;opacity:1;overflow:visible;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter:alpha(opacity=100);}
}

@media screen and (max-width:790px){
.home-act{padding:90px 0;width:auto;}

.view-filter{width:100%;}
.view-page{display:none;}
.view-filter-h{float:right;}
}

@media screen and (max-width:640px){
.home-category li{margin-bottom:18px;}
.home-category .i-text{padding:18px;font-size:16px;}
.home-category li:nth-child(odd) .b{margin-right:9px;}
.home-category li:nth-child(even) .b{margin-left:9px;}

.home-act h3{font-size:34px;margin:0 0 35px 0;}

.product-list li{margin-bottom:18px;width:50%;}
.product-list li:nth-child(odd) .b{margin:0 9px 0 0;}
.product-list li:nth-child(even) .b{margin:0 0 0 9px;}
.product-list .i-text{padding:18px;font-size:12px;}

.product-img, .product-info{width:100%;}
.product-info .i-box{margin:35px 0 0 0;}
.product-detail{padding:80px 0;}
.product-detail .i-box{padding:0;border:none;}
.product-detail .i-tabs{border-bottom:1px solid #EEE;}
}