
 
.splide__slide {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 400px;
    width: 580px;
    overflow: hidden;
    transition: .2s;
    border-width: 2px !important;
    margin: 10px 4px;
}

.splide--nav > .splide__track > .splide__list > .splide__slide.is-active {
     box-shadow: 2px 3px 5px var(--primary-color); 
	 
}

.splide__slide img {
    width: auto;
    height: auto;
    margin: auto;
    display: block;
    max-width: 100%;
    max-height: 100%;
}
/* Slider CSS End  */ 


@keyframes splide-loading{
    0%{
        transform:rotate(0)
    }
    to{
        transform:rotate(1turn)
    }
}
.splide__container{
    position:relative;
    box-sizing:border-box
}
.splide__list{
    display:flex;
    margin:0!important;
    padding:0!important
}
.splide__pagination{
    display:inline-flex;
    align-items:center
}
.splide__pagination li{
    list-style-type:none;
    display:inline-block
}
.splide{
    position:relative;
    visibility:hidden
}
.splide__slide{
    position:relative;
    box-sizing:border-box;
    list-style-type:none!important
}
.splide__slide img{
    vertical-align:bottom
}
.splide__slider{
    position:relative
}
.splide__spinner{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
    display:inline-block;
    width:20px;
    height:20px;
    border-radius:50%;
    border:2px solid #999;
    border-left-color:transparent;
    animation:splide-loading 1s linear infinite
}
.splide__sr{
    border:0!important;
    clip:rect(1px,1px,1px,1px)!important;
    -webkit-clip-path:inset(50%)!important;
    clip-path:inset(50%)!important;
    height:1px!important;
    overflow:hidden!important;
    padding:0!important;
    position:absolute!important;
    width:1px!important;
    white-space:nowrap!important
}
.splide__track{
    overflow:hidden
}
.splide--draggable>.splide__track>.splide__list>.splide__slide{
    -webkit-user-select:none;
    user-select:none
}
.splide--fade>.splide__track>.splide__list{
    display:block
}
.splide--fade>.splide__track>.splide__list>.splide__slide{
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    opacity:0
}
.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{
    position:relative;
    z-index:1;
    opacity:1
}
.splide--rtl{
    direction:rtl
}
.splide--ttb>.splide__track>.splide__list{
    display:block
}
.splide__arrow{
    position:absolute;
    z-index:1;
    top:50%;
    transform:translateY(-50%);
    width:2em;
    height:2em;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:none;
    padding:0;
    opacity:.2;
    background:var(--white);
}
.splide__arrow svg{
    width:1.2em;
    height:1.2em
}
.splide__arrow:hover{
    cursor:pointer;
    opacity:.9
}
.splide__arrow:focus{
    outline:none
}
.splide__arrow--prev{
    left:1em
}
.splide__arrow--prev svg{
    transform:scaleX(-1)
}
.splide__arrow--next{
    right:1em
}
.splide__pagination{
    position:absolute;
    z-index:1;
    bottom:.5em;
    left:50%;
    transform:translateX(-50%);
    padding:0
}
.splide__pagination__page{
    display:inline-block;
    width:8px;
    height:8px;
    background:#ccc;
    border-radius:50%;
    margin:3px;
    padding:0;
    transition:transfrom .2s linear;
    border:none;
    opacity:.7
}
.splide__pagination__page.is-active{
    transform:scale(1.4);
    background:#fff
}
.splide__pagination__page:hover{
    cursor:pointer;
    opacity:.9
}
.splide__pagination__page:focus{
    outline:none
}
.splide__progress__bar{
    width:0;
    height:3px;
    background:#ccc
}
.splide--nav>.splide__track>.splide__list>.splide__slide{
    border:1px solid transparent
}
.splide--nav>.splide__track>.splide__list>.splide__slide.is-active{
    border-color:var(--primary-color);
}
.splide--nav>.splide__track>.splide__list>.splide__slide:focus{
    outline:none
}
.splide--rtl>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev{
    right:1em;
    left:auto
}
.splide--rtl>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev svg{
    transform:scaleX(1)
}
.splide--rtl>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next{
    left:1em;
    right:auto
}
.splide--rtl>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next svg{
    transform:scaleX(-1)
}
.splide--ttb>.splide__arrows .splide__arrow,.splide--ttb>.splide__track>.splide__arrows .splide__arrow{
    left:50%;
    transform:translate(-50%)
}
.splide--ttb>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev{
    top:1em
}
.splide--ttb>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev svg{
    transform:rotate(-90deg)
}
.splide--ttb>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next{
    top:auto;
    bottom:1em
}
.splide--ttb>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next svg{
    transform:rotate(90deg)
}
.splide--ttb>.splide__pagination{
    display:flex;
    flex-direction:column;
    bottom:50%;
    left:auto;
    right:.5em;
    transform:translateY(50%);
 
}
