@charset "utf-8";

.container{ overflow:hidden;position:relative;width:100%;margin:0 auto;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;	}

/* filters */

#filters{margin:0;padding:0; text-align:center;list-style:none;}

#filters li{ display:inline-block;}

#filters li span{display:block;padding:5px 20px; font-size:14px; height:32px; line-height:32px;text-decoration:none;color:#666;cursor:pointer; border:#d8d8d8 solid 1px; margin-left:-1px}

#filters li span.active{background:#e95a44;color:#fff; border:#e95a44 solid 1px;}

#portfoliolist{ margin-left:-45px;overflow:hidden}

#portfoliolist .portfolio{  height:335px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;width:370px;margin:35px 0 0 45px;display:none;float:left;overflow:hidden;}

.portfolio-wrapper{height:335px;overflow:hidden;position:relative!important;background:#101533;cursor:pointer;}

.portfolio-wrapper .text{opacity:0; position:absolute; width:350px; height:167px; text-align:center;display:block;z-index: 9; border:#101533 solid 10px; padding-top:60px;}

.portfolio-wrapper .text strong{ font-size:22px; color:#fff; font-weight:bold;display: block;height: 50px;line-height: 50px;}

.portfolio-wrapper .text span{ width:110px; height:40px; line-height:40px; display:inline-block; margin:20px auto; color:#fff; font-size:14px; text-align:center; background:#1956a7; clear:both}

.portfolio-wrapper .text a{ display:block; width:350px; height:167px; }

.portfolio-wrapper img{width: 370px; height: 247px;}



.portfolio img{position:relative;}

.portfolio .label{position:absolute;width:100%;height:88px;bottom:0px;left:0;}

.portfolio .label-bg{background:#f2f2f2;width:100%;height:100%;position:absolute;top:0;left:0;}

.portfolio .label-text{color:#fff;position:relative;z-index:500;padding:5px 20px; height:78px}

.portfolio .label-text .text-title{ font-size:16px; color:#333; line-height:36px;}

.portfolio .text-category{display:block;font-size:9px; color:#999}







#prodtype{margin:0;padding:0; text-align:center;list-style:none;}

#prodtype li{ display:inline-block;}

#prodtype li span{display:block;padding:5px 18px; font-size:14px; height:32px; line-height:32px;text-decoration:none;color:#666;cursor:pointer; border:#d8d8d8 solid 1px; margin-left:-1px}

#prodtype li span.active{background:#e95a44;color:#fff; border:#e95a44 solid 1px;}

#productslist{ margin-left:-25px; height:740px; overflow:hidden}

#productslist .products{  height:335px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;width:281px;margin:25px 0 0 25px;display:none;float:left;overflow:hidden;}

.products-wrapper{height:335px;overflow:hidden;position:relative!important;background:#101533;cursor:pointer;}

.products-wrapper .text{opacity:0; position:absolute; width:261px; height:143px; text-align:center;display:block;z-index: 9; border:#101533 solid 10px; padding-top:84px;}

.products-wrapper .text strong{ font-size:22px; color:#fff; font-weight:bold;display: block;height: 50px;line-height: 50px; overflow:hidden}

.products-wrapper .text span{ width:60px; height:60px; line-height:60px; display:inline-block; margin:auto; color:#fff; font-size:26px; border-radius:100%; text-align:center; background:#1956a7; clear:both}

.products-wrapper .text a{ display:block; width:261px; height:143px; }

.products img{position:relative; width:281px; height:247px}

.products .label{position:absolute;width:100%;height:88px;bottom:0px;left:0;}

.products .label-bg{background:#f2f2f2;width:100%;height:100%;position:absolute;top:0;left:0;}

.products .label-text{color:#fff;position:relative;z-index:500;padding:5px 20px; height:78px}

.products .label-text .text-title{ font-size:16px; color:#333; line-height:36px; height:36px;display: block;overflow: hidden;}

.products .text-category{display:block;font-size:9px; color:#999}









/* Self Clearing Goodness */

.container:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden;}

.clearfix:before,.clearfix:after,.row:before,.row:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0;}

.row:after,.clearfix:after{clear:both;}

.row,.clearfix{zoom:1;}