@import url("font.css");
@charset "utf-8";
* { margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; list-style: none }
body { font-family:Arial, 'Helvetica World'; position:relative; z-index:0; line-height:20px; font-size:14px}
p { margin: 0; padding:5px 0; font-size:inherit; font-weight:inherit; color:inherit; line-height:inherit;}
.clear { clear: both}
.container-fluid{ padding-left:0; padding-right:0; width:100%; position:relative; }
.container { padding-left:0; padding-right:0; position:relative;}
.row { margin-left: 0px; margin-right: 0px}
[class*="col-"]{ padding:0}
.panel { margin-bottom:0; border:none; border-radius:0px; box-shadow:none}
.panel-heading, .panel-footer{ padding:0; border:none; background:none ; border-radius:0px}
.panel-body { padding:0}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5{ margin:0; padding:0; font-size:inherit; font-weight:inherit; color:inherit; line-height:inherit; transition:all 0.3s linear}
ol, ul { margin: 0 ; padding: 0}
a, a:hover { text-decoration: none; color:inherit}
a, img, input, select{transition:all 0.3s linear}
b, strong{font-weight:600}
/* CSS hover and fix */
@-webkit-keyframes shake_hover {
	0% { -webkit-transform: translate(0px); }
	17% { -webkit-transform: translate(10px); }
	34% { -webkit-transform: translate(-10px); }
	51% { -webkit-transform: translate(6px); }
	68% { -webkit-transform: translate(-6px); }
	85% { -webkit-transform: translate(3px); }
	100% { -webkit-transform: translate(0px); }
}
@-moz-keyframes shake_hover { 
	0% { -moz-transform: translate(0px); }
	17% { -moz-transform: translate(10px); }
	34% { -moz-transform: translate(-10px); }
	51% { -moz-transform: translate(6px); }
	68% { -moz-transform: translate(-6px); }
	85% { -moz-transform: translate(3px); }
	100% { -moz-transform: translate(0px); }
}

@-ms-keyframes shake_hover { 
	 0% { -ms-transform: translate(0px); }
	17% { -ms-transform: translate(10px); }
	34% { -ms-transform: translate(-10px); }
	51% { -ms-transform: translate(6px); }
	68% { -ms-transform: translate(-6px); }
	85% { -ms-transform: translate(3px); }
	100% { -ms-transform: translate(0px); }
}
@keyframes shake_hover { 
	 0% { transform: translate(0px); }
	17% { transform: translate(10px); }
	34% { transform: translate(-10px); }
	51% { transform: translate(6px); }
	68% { transform: translate(-6px); }
	85% { transform: translate(3px); }
	100% { transform: translate(0px); }
}
/*a:hover{-webkit-animation:shake 0.7s; -moz-animation:shake 0.7s; animation:shake 0.7s}*/

.customNavigation{position:absolute; left: 0; right: 0;}
.btn{padding:0; position:absolute; width: 40px;  height: 40px;  font-size: 35px; line-height: 25px; color: #21759b; text-align: center; background: rgba(255,255,255,0.6); opacity:0.5; z-index:999; cursor:pointer; border-radius:0; display: flex; align-items: center; justify-content: center;}
.btn:hover{opacity:1; background: rgba(255, 255 ,255, 0.8);}
.next{right:0}
.prev{left:0}

/*
.fixed{position:fixed; z-index:1000; top:0; left:0; box-shadow:0px 5px 10px #d5d5d5; width:100%; background:#fff}
*/
#backtop {width: 50px; height: 50px;left:90%; position: fixed; bottom: 20px; right: 20px; text-indent: -99999px; cursor: pointer;  background:url(../images/backtotop.png) no-repeat;  z-index:400000}
/*-------------- SAMPLE ITEM ----------------*/
.item-post{padding:10px 5px}
.post{position:relative; background:#fff; transition:all 0.4s linear}

.img-post{overflow:hidden; position:relative}
.img-post img{width:100%; height:100%; transition:all 0.2s linear}
.img-post:hover img{transform:scale(1.1)}

.quickview{ display: flex; align-items: center; justify-content: center; background:rgba(0,0,0,0.6); position:absolute; top:0; left:0; right:0; bottom:0; opacity:0; transition:all 0.5s linear}
.quickview i{display: flex; align-items: center; justify-content: center; text-align:center; width:70px; height:70px; border-radius:50%; background:#d54900 ;color:#fff; -webkit-transform: translateY(30px); -moz-transform: translateY(30px);-ms-transform: translateY(30px); transform: translateY(30px) ; transition:all 0.4s linear}

.id-post{ position:absolute; top:35%; left:0; right:0; background:rgba(213, 73, 0, 0.7); padding:10px;  color:#fff; font-size:16px; text-transform:uppercase; text-align:center;  -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px) ; opacity:0; transition:all 0.4s linear}

.meta-post{padding:10px;}
.meta-post h4{position:relative; overflow:hidden; font-weight:600; white-space:nowrap; font-size:15px; line-height:23px;}
.meta-post h4:after{ display: block; content: ""; position: absolute;  top: 0; right: 0; width: 30px;  height: 25px;  
	background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #ffffff 65%, #ffffff 100%);  
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(65%, #ffffff), color-stop(100%, #ffffff));
	background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #ffffff 65%, #ffffff 100%);
	background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #ffffff 65%, #ffffff 100%);
	background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #ffffff 65%, #ffffff 100%);
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #ffffff 65%, #ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=1);
}
.desc{font-size:13px; padding:10px 0; color:#999}

.price{font-size:14px; color:#999; display:block; margin:10px 0}
.price del, .price ins{display:inline-block; padding:0 8px}
.price ins{text-decoration:none; font-size:22px; font-family:'OpenSans Bold'; color:#d54900 }

.button a{display:inline-block; text-transform:uppercase; font-size:16px; padding:10px 25px; margin:10px 0; border:2px solid #d54900}
.button a:hover{background:#d54900 ; color:#fff}

.post:hover .quickview{opacity:1}
.post:hover .quickview i{-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); transform: translateY(0) ;}
.post:hover .id-post{ opacity:1; -webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); transform: translateY(0) ;}


body {
    font-family: 'Roboto', sans-serif;
}
.h3.title-dt span {
    font-family: 'Roboto Condensed', sans-serif;
}