.image-slider{

    text-align: center;

    display: block;

    overflow: hidden;

    position: relative;

}



.image-slider>ul {

    padding: 0;

}



.image-slider>ul>li.slide {

    text-align: center;

    width: 100%;

    visibility: hidden;

}



.image-slider>ul>li {

    list-style-type: none;

    float: left;

}



.image-slider .selectors{

    width: 100% !important;

}



.image-slider .selectors .thumbnail a {

    display: inline-block;

    border-width: 1px;

    border-style: solid;

    height: 60px;

    overflow: hidden;

    border-color: white;

}



.image-slider>ul{

    position: relative;

}



.image-slider .slide{

    position: absolute;

}



.from-right-to-center {

    animation: from-right-to-center 0.5s forwards;

    -webkit-animation: from-right-to-center 0.5s forwards;

}



.from-left-to-center {

    animation: from-left-to-center 0.5s forwards;

    -webkit-animation: from-left-to-center 0.5s forwards;

}



.from-center-to-right {

    animation: from-center-to-right 0.5s forwards;

    -webkit-animation: from-center-to-right 0.5s forwards;

}



.from-center-to-left {

    animation: from-center-to-left 0.5s forwards;

    -webkit-animation: from-center-to-left 0.5s forwards;

}



@keyframes from-right-to-center {

    0% { transform: translateX(100%); }

    100% { transform: translateX(0%); }

}



@-webkit-keyframes from-right-to-center {

    0% { transform: translateX(100%); }

    100% { transform: translateX(0%); }

}



@keyframes from-left-to-center {

    0% { transform: translateX(-100%); }

    100% { transform: translateX(0%); }

}



@-webkit-keyframes from-left-to-center {

    0% { transform: translateX(-100%); }

    100% { transform: translateX(0%); }

}



@keyframes from-center-to-right {

    0% { transform: translateX(0%); }

    100% { transform: translateX(100%); }

}



@-webkit-keyframes from-center-to-right {

    0% { transform: translateX(0%); }

    100% { transform: translateX(100%); }

}



@keyframes from-center-to-left {

    0% { transform: translateX(0%); }

    100% { transform: translateX(-100%); }

}



@-webkit-keyframes from-center-to-left {

    0% { -webkit-transform: translateX(0%); }

    100% { -webkit-transform: translateX(-100%); }

}



.image-slider .slide.to-be-active{

    z-index: 999;

}

.image-slider .slide.active,

.image-slider .slide.to-be-active{

    visibility: visible;

}

.image-slider li.slide{

    display: flex;

    min-height: 100%;

}

.image-slider li.image-slide img{

    margin: auto;

}

.image-slider .slidernav{

    position: absolute;

    top: 40%;

    background-color: rgba(255,255,255,0.5);

    padding: 10px;

}

.image-slider .slidernav.prev{

    left: 0%;

}

.image-slider .slidernav.next{

    right: 0%;

}



@media screen and (max-width: 767px){

    .homepage-slider .slidernav.prev{

        left: 4%;

    }



    .homepage-slider .slidernav.next{

        right: 4%;

    }

}



.image-slider .selectors .thumbnail a.active{

    border-color: black !important;

}





.image-slider .selectors .thumbnail {

    display: inline-block;

}



.image-slider .selectors .thumbnail a.video-selector {

    width: 100px;

    border: 1px solid #CCC;

    text-align: center;

    padding: 5px 0;

}



.selectors .thumbnail .video-selector i {

    display: block;

    margin: auto

}



.slider table{

    width: 100%;

}



.video_thumbnail{

    width: 100%;

    height: calc(100% + 10px);

    margin-top: -5px;

    margin-bottom: -5px;

    background-size: cover;

    background-position: center;

    padding-top: 21px;

}



.video_thumbnail i {

    margin: auto;

    display: inline-block;

    width: 17px;

    background-color: white;

    border-radius: 10px;

}