.wcd{width:33%;height:40px;float:left;}
.wcd-logo{font-size:36px;color:#fff;text-align:center;float:left;cursor:pointer;color:#fff;font-size:32px;font-family:'Varela Round', sans-serif;-webkit-transition:color 0.3s ease-in;-moz-transition:color 0.3s ease-in;x²-o-transition:color 0.3s ease-in;transition:color 0.3s ease-in;}
.wcd-logo:hover{color:#3facff;}
.wcd-tuto{font-family:'Varela Round', sans-serif;color:#fff;font-size:16px;line-height:36px;}
.webcodo-top{width:100%;height:40px;background-color:#232323;}
.clear{clear:both;}
.grid, .list{border-radius:3px;width:15px;height:15px;margin-left:10px;float:left;cursor:pointer;padding:5px;}
.view-cnt{float:right;}
.grid{background:url(../img/grid.png) 50% no-repeat;}
.grid:hover{background:#000000 url(../img/gridw.png) 50% no-repeat;}
.grid-active{background:#039fd3 url(../img/gridw.png) 50% no-repeat;}
.list{background:url(../img/list.png) 50% no-repeat;}
.list:hover{background:#000000 url(../img/listw.png) 50% no-repeat;}
.list-active{background:#039fd3 url(../img/listw.png) 50% no-repeat;}
.prods-cnt{width:720px;height:auto;min-height:400px;margin:40px auto;padding:40px;background-color:#fafafa;border:#ccc 1px dotted;overflow:auto;}
.category-menu ul{}
.category-menu ul li{display:inline-block;list-style:none;cursor:pointer;line-height:0.7;margin-right:10px;background-color:#333333;color:#FF0000;padding:10px 15px;font-size:20px;border-radius:3px;-webkit-transition:background-color 0.3s ease-in;-moz-transition:background-color 0.3s ease-in;-o-transition:background-color 0.3s ease-in;transition:background-color 0.3s ease-in;}
.category-menu ul li:hover, .category-menu ul li.cat-active{background:#000000;}
.prod-box{width:22.5%;height:415px;padding:20px;margin:15px;background-color:#fff;float:left;overflow:hidden;}
.prod-box:hover{}
.prod-box img:first-child{width:190px;text-align:center;margin-right:auto;margin-left:auto;}
.prod-box-list img:first-child{width:190px;float:left;}
.prod-box h3 a{text-decoration:none;float:left;margin:5px 0;color:#888;}
.prod-box p{height:50px;overflow:hidden;color:#888888;}
.prod-box .old{margin-right:20px;color:#be0000 !important;text-decoration:line-through;}
.prod-box .price{width:100%;display:inline;float:left;color:#b9775a;text-align:right;}
.prod-box .buy-ico{border-radius:20px;width:35px;height:35px;float:right;margin:5px;cursor:pointer;background:#039fd3 url(../img/bag-ico.png) 50% no-repeat;-webkit-transition:background-color 0.3s ease-in;-moz-transition:background-color 0.3s ease-in;-o-transition:background-color 0.3s ease-in;transition:background-color 0.3s ease-in;}
.prod-box .buy-ico:hover{background-color:#000000;}
.prod-box-list{height:215px;width:97.5%;margin:15px;padding:10px;background-color:#fff;overflow:hidden;}
.prod-box-list h3 a{text-decoration:none;width:320px;float:left;padding:0;margin:0 10px;color:#3c2e25;font:italic normal 22px georgia;}
.prod-box-list p{color:#888;width:500px;float:left;margin:20px 10px 10px 10px;line-height:20px;}
.prod-box-list .buy-ico{border-radius:5px;width:85px;height:20px;color:#fff;padding:5px 5px 5px 30px;font:italic 12px georgia;float:right;margin:5px;cursor:pointer;background:#039fd3 url(../img/bag-ico.png) 5% 50% no-repeat;-webkit-transition:background-color 0.3s ease-in;-moz-transition:background-color 0.3s ease-in;-o-transition:background-color 0.3s ease-in;transition:background-color 0.3s ease-in;}
.prod-box-list .buy-ico:before{content:"More Details";line-height:22px;}
.prod-box-list .buy-ico:hover{background-color:#000000;}
.prod-box-list .old{color:#be0000 !important;float:right;font-style:18px;text-decoration:line-through;}
.prod-box-list .price{margin-right:10px;display:block;color:#181818;margin:7px;}
.prod-box-list .price-cnt{width:150px;height:auto;float:left;text-align:right;}
.shadow{-webkit-box-shadow:0px 0px 18px rgba(50, 50, 50, 0.31);-moz-box-shadow:0px 0px 10px rgba(50, 50, 50, 0.31);box-shadow:0px 0px 5px rgba(50, 50, 50, 0.31);-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;}
.shadow:hover{-webkit-box-shadow:0px 0px 18px rgb(129, 210, 203);-moz-box-shadow:0px 0px 10px rgba(50, 50, 50, 0.31);box-shadow:0px 0px 15px rgb(129, 210, 203);}
.page{margin:0px 5px 0px 0px;padding:5px;background:#FFF;float:left;font-size:11px;color:#666;border:1px solid #ccc;display:block;cursor:pointer;-webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;border-radius:5px;}
.page:hover{margin:0px 5px 0px 0px;padding:5px;background:#7FD34D;float:left;font-size:11px;color:#fff;border:1px solid #7FD34D;display:block;cursor:pointer;-webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;border-radius:5px;}
.d-grid{font-size:25px;position:relative;top:-5px;}
.d-grid-h{color:#000;cursor:pointer;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;}
.d-grid-h:hover{color:#000000;}
@media(max-width:1440px){.prod-box{width:22.4%;}
}
@media(max-width:1385px){.prod-box{width:22.3%;}
}
@media(max-width:1335px){.prod-box{width:22.2%;}
}
@media(max-width:1285px){.prod-box{width:22.1%;}
}
@media(max-width:1245px){.prod-box{width:22%;}
}
@media(max-width:1200px){.prod-box{width:29.5%;}
}
@media(max-width:1045px){.prod-box{width:29.4%;}
}
@media(max-width:1024px){.prod-box{width:29.3%;}
}
@media(max-width:992px){.category-menu ul li {line-height: 16px;padding: 5px 5px;font-size: 16px; border-radius: 3px;}
}
@media(max-width:768px){.prod-box{width:46%;}
}
@media(max-width:750px){.prod-box{width:45.5%;}
}
@media(max-width:665px){.prod-box{width:45.2%;}
}
@media(max-width:625px){.prod-box{width:45%;}
}
@media(max-width:600px){.prod-box{width:44.5%;}
}
@media(max-width:545px){.prod-box{width:44%;}
}
@media(max-width:500px){.prod-box{width:43%;}
.category-menu ul li{line-height:1.2;margin-right:2px;margin-bottom:5px;padding:10px 10px;font-size:14px;}
}
@media(max-width:440px){.prod-box{width:93%;}
}
@media(max-width:414px){.prod-box{width:92%;height:415px;}
}