#thumbnail-slider {    
height:400px; 
display:inline-block;
padding:0px 0; position:relative;
-webkit-user-select: none;
user-select:none;
width: 370px;
}
#thumbnail-slider div.inner {
border-radius:3px;
background-color:#444; height:100%;  box-sizing:border-box;
position:relative;
overflow:hidden;
margin:0;
}
#thumbnail-slider div.inner ul { position:relative;
left:0; top:0;
list-style:none;
font-size:0;
padding:0;
margin:0;
float:left!important;
width:auto!important;
height:auto!important;
}
#thumbnail-slider ul li {
opacity:1;
display:block;
margin:0; transition:all 0.5s;
text-align:center;
padding:0;
position:relative;
list-style:none;
box-sizing:content-box;
backface-visibility:hidden;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
#thumbnail-slider ul li.active {
border-color:white;    
-webkit-filter: initial;
filter: initial;
}
#thumbnail-slider li:hover {
border-color:rgba(255,255,255,0.5);   
-webkit-filter: grayscale(50%);
filter: grayscale(50%);
}
#thumbnail-slider .thumb {
width:100%;
height: 100%;
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
display:block;
position:absolute;
font-size:0;
}  #thumbnail-slider-pause-play {display:none;} #thumbnail-slider-prev, #thumbnail-slider-next
{
position: absolute;
background-color:rgba(0,0,0,0.4);
width:100%;
height:30px;
line-height:30px;
text-align:center;
margin:0;
color:white;
z-index:4;
cursor:pointer;
transition:opacity 0.6s;
*background-color:#ccc; backface-visibility:hidden;
}
#thumbnail-slider-prev {
top:0;
}
#thumbnail-slider-next {
bottom:0;
}
#thumbnail-slider-next.disabled, #thumbnail-slider-prev.disabled {
opacity:0.1;
cursor:default;
} #thumbnail-slider-prev::before, #thumbnail-slider-next::before {
position:absolute;
content: "";
display: inline-block;
width: 10px;
height: 10px;
margin-left:-5px;
border-left: 4px solid white;
border-top: 4px solid white;
}
#thumbnail-slider-prev::before {
top:12px;
-ms-transform:rotate(-45deg); -webkit-transform:rotate(45deg);
transform: rotate(45deg);
}
#thumbnail-slider-next::before {
bottom:12px;
-ms-transform:rotate(135deg); -webkit-transform:rotate(-135deg);
transform: rotate(-135deg);
}
#thumbnail-slider .inner ul li .item-title {
padding: 18px 0 10px 0;
background: rgba(0, 0, 0, 0.5);
position: absolute;
bottom: 0;
left: 0;
width: 100%; }
#thumbnail-slider .inner ul li .item-title h6 {
color: #fff;
font-weight: 600;
padding-left: 12px;
line-height: 14px; }
#thumbnail-slider .inner ul li .item-title span {
position: absolute;
left: 12px;
bottom: 40px;
font-size: 13px;
background: #e96969;
padding: 0 9px;
color: #fff;
font-weight: 600; }