html { margin-top: 0px !important; }
p, .thecomment p, li, .post-navigation span, .comment-text .date, textarea {color: #555555;}
body .single-post .overlay, .post-overlay { opacity: 0.3;}
strong{font-weight:500 !important;}

#footer {background: #dd3333;}

.imgBanner{
	max-width:100%;
}

/** Grid **/

	@media screen and (min-width: 200px) {
		.box{width: calc(100%/1 - 1px - 2*8.5px);}	
		.boxImgThumb{height: 165px;} 
	}
	@media screen and (min-width: 300px) { 
		.box{width: calc(100%/2 - 1px - 2*8.5px);}	
		.boxImgThumb{height: 165px;} 
	}
	@media screen and (min-width: 700px) { 
		.box{width: calc(100%/2 - 1px - 2*8.5px);}	
		.boxImgThumb{height: 165px;} 
	}
	@media screen and (min-width: 800px) {
		.box{width: calc(100%/3 - 1px - 2*8.5px);}	
		.boxImgThumb{height: 165px;} 
	}
	@media screen and (min-width: 900px) {
		.box{width: calc(100%/3 - 1px - 2*8.5px);}	
		.boxImgThumb{height: 165px;} 
	}
	@media screen and (min-width: 1080px) {
		.box{width: calc(100%/3 - 1px - 2*8.5px);}
		.boxImgThumb{height: 245px;} 
	}

	.box {
		min-height:130px;
		float: left;
		border:1px solid #888888;
		margin:3px;
		padding:5px;
		border-radius:0 0 10px 10px;
		
	}

	.boxPrdThumb {
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
	}
		.boxTitleLong {
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}
	
	.boxTitle{
	  overflow: hidden;
	  white-space: nowrap;
	  text-overflow: ellipsis;
	  max-width: 290px;
	}
	.boxPrice{
		border-top:1px solid #eeeeee;
	}
.boxImgThumb {
	width: 100%;
	background-size: cover;
	margin: 3px;
	background-position: center center;
}
/*==== end grid*/
	
/*=================== Animate */

@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.4;}
}
.blink{
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.09s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}
.blink2{
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
}


.neon {
  font-family: Kanit;
  color: #FB4264;
  line-height: 9vw;
  text-shadow: 0 0 3vw #F40A35;
}

.neon {
  animation: neon .81s ease infinite;
  -moz-animation: neon .51s ease infinite;
  -webkit-animation: neon .51s ease infinite;
}

@keyframes neon {
  0%,
  100% {
    text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 10vw #FA1C16, 0 0 10vw #FA1C16, 0 0 .4vw #FED128, .5vw .5vw .1vw #806914;
    color: #FED128;
  }
  50% {
    text-shadow: 0 0 .5vw #800E0B, 0 0 1.5vw #800E0B, 0 0 5vw #800E0B, 0 0 5vw #800E0B, 0 0 .2vw #800E0B, .5vw .5vw .1vw #40340A;
    color: #806914;
  }
}

.flux {
  font-family: neon;
  color: #426DFB;
  line-height: 9vw;
  text-shadow: 0 0 3vw #2356FF;
}


.flux {
  animation: flux 2s linear infinite;
  -moz-animation: flux 2s linear infinite;
  -webkit-animation: flux 2s linear infinite;
  -o-animation: flux 2s linear infinite;
}

@keyframes flux {
  0%,
  100% {
    text-shadow: 0 0 1vw #1041FF, 0 0 3vw #1041FF, 0 0 10vw #1041FF, 0 0 10vw #1041FF, 0 0 .4vw #8BFDFE, .5vw .5vw .1vw #147280;
    color: #28D7FE;
  }
  50% {
    text-shadow: 0 0 .5vw #082180, 0 0 1.5vw #082180, 0 0 5vw #082180, 0 0 5vw #082180, 0 0 .2vw #082180, .5vw .5vw .1vw #0A3940;
    color: #146C80;
  }
}



.blink-image {
    -moz-animation: blink normal 		.3s infinite ease-in-out; /* Firefox */
    -webkit-animation: blink normal 	.3s infinite ease-in-out; /* Webkit */
    -ms-animation: blink normal 			.3s infinite ease-in-out; /* IE */
    animation: blink normal 					.3s infinite ease-in-out; /* Opera and prob css3 final iteration */
}
 
@-moz-keyframes blink {
    0% {opacity:1;}
    50% {opacity:0;}
    100% {opacity:1;}
} 
 
@-webkit-keyframes blink {
    0% {opacity:1;}
    50% {opacity:0;}
    100% {opacity:1;}
}
/* IE */
@-ms-keyframes blink {
    0% {opacity:1;}
    50% {opacity:0;}
    100% {opacity:1;}
} 
/* Opera and prob css3 final iteration */
@keyframes blink {
    0% {opacity:1;}
    50% {opacity:0;}
    100% {opacity:1;}
} 
 
 
/* End Effect */
.fold-shadow-right {
	position: absolute;
	z-index: 5;
	width: 52px;
	height: 100%;
	background: url('../assets/img/fold-shadow-right.png');
	opacity: .3;
	pointer-events: none;
	background-size: contain;
	opacity: .15 !important;
}

.colorRed{color:red;}
.colorGreen{color:green;}
.colorBlue{color:blue;}
.colorBlueBnch{color:#0057df;}

@media screen and (max-width: 1275px) {
      .navHome {display:none;}
   }
	
.col-p3{padding:3px !important; }

/*new h2*/
.feat-categ-item.first .content-part {
	position: absolute;
	z-index: 2;
	color: #fff;
	width: 98%;
	padding: 0;
	font-weight: 400;
	margin: 0;
}
.feat-categ-item.first .content-part .the-content {
	position: absolute;
	bottom: 0;
	vertical-align: bottom;
	width: 100%;
	background-color: #0d0d0d91;
	padding-left: 10px;
}
.feat-categ-item.first .content-part a:hover {
	opacity: 1;
}

/*.first{transition: all 0.3s ease-in-out;}
.first:hover{box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;}
*/
.name-prd{transition: all 0.3s ease-in-out;font-weight:400}
.name-prd:hover{color:#ff8000 !important;}
.firstName:hover{color:#ff8000;}

.firstName {
	color: #ffffff;
	position: absolute;
	bottom: -20px;
	left: 0;
	width: 100%;
	background: linear-gradient(#fff0, black);
	z-index: 2;
	padding: 31px;
	font-size: 1.8em;
	margin: 0;
	transition: all 0.3s ease-in-out;
	font-weight: 500;
}
.boxFirst{
	position:relative;
}
@media only screen and (max-width: 800px) {
  .firstName {
	color: #ffffff;
	position: absolute;
	bottom: -0px;
	left: 0;
	width: 100%;
	background: linear-gradient(#fff0, black);
	z-index: 2;
	padding: 31px;
	font-size: 1.1em;
	margin: 0;
	transition: all 0.3s ease-in-out;
	font-weight: 500;
	}
	.boxFirst{
	position:relative;
	overflow:hidden;
	}
}


.gradient-bg {
	background: linear-gradient(#fff0, white);
	position: absolute;
	z-index: 99;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100px;
}

.boxlr{transition: all 0.3s ease-in-out;}
.boxlr:hover{box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
/*//// imgShine Begin*/

	.shine {margin: 0;padding: 0;background: #fff;overflow: hidden;position: relative;}
	.shine::before {
	 position: absolute;
	 top: 0;
	 left: -75%;
	 z-index: 2;
	 display: block;
	 content: '';
	 width: 50%;
	 height: 100%;
	 background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	 background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	 -webkit-transform: skewX(-25deg);
	 transform: skewX(-25deg);
	}
	.shine:hover::before { -webkit-animation: shine .75s;animation: shine .75s;}
	@-webkit-keyframes shine {100% {left: 125%;}}
	@keyframes shine {100% {left: 125%;}}

/*//// imgShine End*/
.zoomImg img {
display: block;
width: 100%;
height: auto;
-webkit-transition: all .5s ease; /* Safari and Chrome */
-moz-transition: all .5s ease; /* Firefox */
-ms-transition: all .5s ease; /* IE 9 */
-o-transition: all .5s ease; /* Opera */
transition: all .5s ease;
}
.zoomImg:hover img {
-webkit-transform:scale(1.25); /* Safari and Chrome */
-moz-transform:scale(1.25); /* Firefox */
-ms-transform:scale(1.25); /* IE 9 */
-o-transform:scale(1.25); /* Opera */
transform:scale(1.25);
}

/*----------- home */
.feat-categ-item .image-part {
	float: left;
	overflow: hidden;
	position: relative;
	width: 40%;
	height: 100%;
	background: #eeeeee;
}

.feat-categ-item .content-part {
	display: flex;
	flex-direction: column;
	align-self: center;
	justify-content: center;
	float: left;
	box-sizing: border-box;
	width: 55%;
	height: 100%;
	margin-left: 4%;
}

.feat-categ-item .image-part {
	float: left;
	overflow: hidden;
	position: relative;
	width: 40%;
	height: 100%;
	background: #eeeeee;
	border-radius: 10px;
}
.feat-categ-item {margin-bottom: 8px;}
 
