html, body {
    margin: 0;
    padding: 0;
    height: 100%;
     font-family:ITFGujarati-Regular;
}

@font-face {
    font-family:ITFGujarati-Regular;
    src:url('../fonts/AkhandGujarati-Semibold.eot');
    url('../fonts/ITFGujarati-Regular.woff2') format('woff2'),
    font-weight:400;
    font-style:normal;
}


.middle-content {

    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    height: 100%;
    background-image: url(../img/back.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}
  
.stories-slider { max-width:500px; margin:auto;position: relative; }

.stories-slider .stories.web-slider {
    margin-bottom: 0px;
}


.stories-images {
    height:75vh;
    position: relative;
}

.stories-images img {
    border-radius: 10px;
    height: 100%;
    object-fit: cover;
}

.stories-images video {
    border-radius: 10px;
    height: 100%;
    object-fit: cover;

}

    .slick-slide {
      margin: 0px 20px;
    }

    .slick-slide img {
      width: 100%;
    }

    .slick-prev:before,
    .slick-next:before {
      color: black;
    }


    .slick-slide {
      transition: all ease-in-out .3s;
      opacity: .2;
    }
    
    .slick-active {
      opacity: .5;
    }

    .slick-current {
      opacity: 1;
    }


.stories-title {
    position: absolute;
    bottom: 10px;
    background-color: #0000009c;
    text-align: center;
    color: #fff;
    left: 0;
    right: 5%;
    padding: 10px;
    border-radius: 0px;
    font-size:26px;
    border-left: #eb7e2a 10px solid;
       font-family: 'ITF Gujarati';
}

.stories .slick-dots {
    top: 10px;
}

.stories .slick-dots li {
    width: 35px;
    height: 5px;
    margin: 0 5px;
    padding: 0;
}

.stories .slick-dots li button {
    width: 100%;
    height: auto;
    padding: 5px;
}

.stories .slick-dots li button:before {
    content: '';
    background-color: #fff;
    opacity: 9;
    height:3px;
    width: 35px;
}

.share-icon {
    top: 15px;
    position: absolute;
    right: 15px;
}

.share-icon-list { 
    display: flex;
    justify-content: center;
    align-items: center;
}

.share-icon-list a {
    margin: 0 3px;
}


.stories .slick-prev, 
.stories .slick-next {
    width: 35px;
    height: 35px;
    background:rgb(255 255 255 / 87%);
    border-radius: 100%;
}


a.close-icon img {
    width: 12px;
    background: #eb7e2ac7;
    padding: 10px;
    position: absolute;
    z-index: 1;
    left: 30px;
    top: 15px;
    border-radius: 30px;
}


a.story-btn {
    position: absolute;
    top: 43%;
    transform: translate(0px, 50%);
}

a.previous {
    left: -75px;
    transform: translateY(45%) rotate(180deg);
}


a.next.story-btn {
    right: -75px;
    transform: translateY(50%) rotate(0deg);
}


.home-middle-content .gallery-slider {
    padding: 20px 0;
}



@media (max-width:767px) {

    .stories-slider {
        max-width: 100%;
    }

    .stories-slider a.previous.story-btn {
    display: none !important;
}

.stories-slider a.next.story-btn {
    display: none !important;
}

.stories .slick-prev, .stories .slick-next {
    width: auto;
    height: auto;
    background: transparent;
    border-radius: 100%;
    z-index: 9;
}

.stories .slick-prev:before, 
.stories .slick-next:before {
    color: #fff;
}


.stories .slick-next {
    right: 10px;
}

.stories .slick-prev {
    left: 10px;
}





    .stories-title {
    font-size: 14px;
    font-weight: 600;
}


.home-middle-content .gallery-slider {
    padding: 20px 0;
}

.gallery-slider .home-gal-1 .web-stories-poster {
    height: 220px;
}



}