/*.horizontal-scrollable {
    white-space: nowrap;
    position: relative;
    display: flex;
    height: 100%;
    max-width: 100%;
    overflow-y: hidden;
    overflow-x: scroll;
    scrollbar-color: red grey;
    scrollbar-width:thin;
    margin-top:20px;    
    
    
}

.h-item {
    background: #191313;
    margin-right: 4px;*/
    /*  border-radius: 2px;*/
    /*flex-shrink: 0;
    width: 90%;
    max-width: 320px;
    padding: 0px 0px;
}*/

    /*.h-item:first-child {*/
        /*border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;*/
   /* }*/

/*.h-display {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-orient: vertical;
    box-orient: vertical;
    flex-direction: column;
    position: relative;
    color: #202124;
    vertical-align: top;
}*/


/*Not  Usable start ------------------------------------------------------------------*/


/*.horizontal-scrollable::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.horizontal-scrollable::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}

.horizontal-scrollable::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #D62929;
}*/

/*Not  Usable end ------------------------------------------------------------------*/

/* start scoll css slider 1    Upcomming Events*/


#slide {
    display: flex;
    overflow-y: hidden;
    overflow-x: hidden;
    scrollX: true;
}

    #slide img {
        margin: 0 0.5em;
    }

#sliderScroll_outer {
    width: auto;
    height: 5px;
    background: #7E7E7E;
    margin: 2em;
    scrollbar-width: thin;
    float: center;
}


    #sliderScroll_outer::-webkit-scrollbar {
        background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
        border-radius: 6px;
    }

    #sliderScroll_outer::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }

    #sliderScroll_outer::-webkit-scrollbar-thumb {
        border-radius: 6px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    #sliderScroll_outer::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

#sliderScroll {
    height: 10px;
    background: RED;
    border-radius: 10px;
    width: 100%;
    /*  bijo edit */
    min-width: 200px;
    /*min-width: 250px;*/
    padding-top: 10px;
    vertical-align: center;
    scrollbar-width: thin;
    top: -3px !important;
}


    #sliderScroll::-webkit-scrollbar {
        width: 4px;
        height: 4px;
        border-radius: 6px;
    }

    #sliderScroll::-webkit-scrollbar-track, webkit-scrollbar-thumb {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }

    #sliderScroll::-webkit-scrollbar-thumb:window-inactive {
        /* Select the thumb when the browser window isn't in focus */
    }


    #sliderScroll::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll {
        min-width: 75px;
    }
}


@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll {
        min-width: 75px;
    }
}


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

        #slide {
            display: flex;
            overflow-y: hidden;
            overflow-x: scroll;
            scrollbar-color: #FF0000 #7E7E7E;
            margin-top: 20px;
            scrollbar-width: thin;
            scroll-margin:15px 30px 60px 90px;
        }

        #container > div {
            scroll-padding-bottom:  90px;
        }

        #sliderScroll_outer {
            display: none;
        }

        /* for smaller red portion  */
        #sliderScroll {
            min-width: 75px;
        }

       
    }

    /* end of scroll*/



    /* start scoll css slider2*/

    #slide2 {
        display: flex;
        overflow-y: hidden;
        overflow-x: hidden;
    }

        #slide2 img {
            /*margin: 0 0.5em;*/
        }

    #sliderScroll_outer2 {
        width: auto;
        height: 5px;
        background: #7E7E7E;
        margin: 2em;
        scrollbar-width: thin;
        float: center;
    }


        #sliderScroll_outer2::-webkit-scrollbar {
            background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
            border-radius: 6px;
        }

        #sliderScroll_outer2::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }

        #sliderScroll_outer2::-webkit-scrollbar-thumb {
            border-radius: 6px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
        }

        #sliderScroll_outer2::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }

    #sliderScroll2 {
        height: 10px;
        background: RED;
        border-radius: 10px;
        width: 100%;
        min-width: 250px !important;
        padding-top: 10px;
        vertical-align: center;
        scrollbar-width: thin;
        top: -3px !important;
    }


        #sliderScroll2::-webkit-scrollbar {
            width: 4px;
            height: 4px;
            border-radius: 6px;
        }

        #sliderScroll2::-webkit-scrollbar-track, webkit-scrollbar-thumb {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }


        #sliderScroll2::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }

@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide2 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

   

    #sliderScroll_outer2 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll2 {
        min-width: 75px;
    }
}
@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll2 {
        min-width: 75px;
    }
}


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

    #slide2 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer2 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll2 {
        min-width: 75px;
    }
}

/* end start scoll css*/








    /* start scoll css slider3*/

    #slide3 {
        display: flex;
        overflow-y: hidden;
        overflow-x: hidden;
    }

        #slide3 img {
            margin: 0 0.5em;
        }

    #sliderScroll_outer3 {
        width: auto;
        height: 5px;
        background: #7E7E7E;
        margin: 2em;
        scrollbar-width: thin;
        float: center;
    }


        #sliderScroll_outer3::-webkit-scrollbar {
            background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
            border-radius: 6px;
        }

        #sliderScroll_outer3::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }

        #sliderScroll_outer3::-webkit-scrollbar-thumb {
            border-radius: 6px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
        }

        #sliderScroll_outer3::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }

    #sliderScroll3 {
        height: 10px;
        background: RED;
        border-radius: 10px;
        width: 100%;
        min-width: 250px !important;
        padding-top: 10px;
        vertical-align: center;
        scrollbar-width: thin;
        top: -3px !important;
    }


        #sliderScroll3::-webkit-scrollbar {
            width: 4px;
            height: 4px;
            border-radius: 6px;
        }

        #sliderScroll3::-webkit-scrollbar-track, webkit-scrollbar-thumb {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }


        #sliderScroll3::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }
@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide3 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }



    #sliderScroll_outer3 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll3 {
        min-width: 75px;
    }
}

@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll3 {
        min-width: 75px;
    }
}


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

    #slide3 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer3 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll3 {
        min-width: 75px;
    }
}

    /* end start scoll css*/





    /* start scoll css slider4*/

    #slide4 {
         display: flex;
        overflow-y: hidden;
        overflow-x: hidden;
    }

        #slide4 img {
            margin: 0 0.5em;
        }

    #sliderScroll_outer4 {
        width: auto;
        height: 5px;
        background: #7E7E7E;
        margin: 2em;
        scrollbar-width: thin;
        float: center;
    }


        #sliderScroll_outer4::-webkit-scrollbar {
            background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
            border-radius: 6px;
        }

        #sliderScroll_outer4::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }

        #sliderScroll_outer4::-webkit-scrollbar-thumb {
            border-radius: 6px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
        }

        #sliderScroll_outer4::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }

    #sliderScroll4 {
        height: 10px;
        background: RED;
        border-radius: 10px;
        width: 100%;
        min-width: 250px !important;
        padding-top: 10px;
        vertical-align: center;
        scrollbar-width: thin;
        top: -3px !important;
    }


        #sliderScroll4::-webkit-scrollbar {
            width: 4px;
            height: 4px;
            border-radius: 6px;
        }

        #sliderScroll4::-webkit-scrollbar-track, webkit-scrollbar-thumb {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
            border-radius: 6px;
        }


        #sliderScroll4::-webkit-scrollbar-track {
            background-repeat: repeat-y;
        }
@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide4 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }



    #sliderScroll_outer4 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll4 {
        min-width: 75px;
    }
}

@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll4 {
        min-width: 75px;
    }
}


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

    #slide4 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer4 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll4 {
        min-width: 75px;
    }
}
    /* end start scoll css 4*/





/* start scoll css slider 5 */

#slide5 {
     display: flex;
    overflow-y: hidden;
    overflow-x: hidden;
}

    #slide5 img {
        margin: 0 0.5em;
    }

#sliderScroll_outer5 {
    width: auto;
    height: 5px;
    background: #7E7E7E;
    margin: 2em;
    scrollbar-width: thin;
    float: center;
}


    #sliderScroll_outer5::-webkit-scrollbar {
        background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
        border-radius: 6px;
    }

    #sliderScroll_outer5::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }

    #sliderScroll_outer5::-webkit-scrollbar-thumb {
        border-radius: 6px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    #sliderScroll_outer5::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

#sliderScroll5 {
    height: 10px;
    background: RED;
    border-radius: 10px;
    width: 100%;
    min-width: 250px !important;
    padding-top: 10px;
    vertical-align: center;
    scrollbar-width: thin;
    top: -3px !important;
}


    #sliderScroll5::-webkit-scrollbar {
        width: 4px;
        height: 4px;
        border-radius: 6px;
    }

    #sliderScroll5::-webkit-scrollbar-track, webkit-scrollbar-thumb {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }


    #sliderScroll5::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }
@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide5 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }



    #sliderScroll_outer5 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll5 {
        min-width: 75px;
    }
}




@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll5 {
        min-width: 75px;
    }
}


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

    #slide5 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer5 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll5{
        min-width: 75px;
    }
}
/* end start scoll css*/



/* start scoll css slider6*/

#slide6 {
    display: flex;
    overflow-y: hidden;
    overflow-x: hidden;
}

    #slide6 img {
        margin: 0 0.5em;
    }

#sliderScroll_outer6 {
    width: auto;
    height: 5px;
    background: #7E7E7E;
    margin: 2em;
    scrollbar-width: thin;
    float: center;
}


    #sliderScroll_outer6::-webkit-scrollbar {
        background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
        border-radius: 6px;
    }

    #sliderScroll_outer6::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }

    #sliderScroll_outer6::-webkit-scrollbar-thumb {
        border-radius: 6px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    #sliderScroll_outer6::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

#sliderScroll6 {
    height: 10px;
    background: RED;
    border-radius: 10px;
    width: 100%;
    min-width: 250px !important;
    padding-top: 10px;
    vertical-align: center;
    scrollbar-width: thin;
    top: -3px !important;
}


    #sliderScroll6::-webkit-scrollbar {
        width: 4px;
        height: 4px;
        border-radius: 6px;
    }

    #sliderScroll6::-webkit-scrollbar-track, webkit-scrollbar-thumb {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }


    #sliderScroll6::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide6 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }



    #sliderScroll_outer6 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll6 {
        min-width: 75px;
    }
}

@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll6 {
        min-width: 75px;
    }
}


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

    #slide6 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer6 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll6 {
        min-width: 75px;
    }
}
/* end start scroll 6 css */




/* start scoll css slider6*/

#slide7 {
    display: flex;
    overflow-y: hidden;
    overflow-x: hidden;
}

    #slide7 img {
        margin: 0 0.5em;
    }

#sliderScroll_outer7 {
    width: auto;
    height: 5px;
    background: #7E7E7E;
    margin: 2em;
    scrollbar-width: thin;
    float: center;
}


    #sliderScroll_outer7::-webkit-scrollbar {
        background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
        border-radius: 6px;
    }

    #sliderScroll_outer7::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }

    #sliderScroll_outer7::-webkit-scrollbar-thumb {
        border-radius: 6px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    #sliderScroll_outer7::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

#sliderScroll7 {
    height: 10px;
    background: RED;
    border-radius: 10px;
    width: 100%;
    min-width: 250px !important;
    padding-top: 10px;
    vertical-align: center;
    scrollbar-width: thin;
    top: -3px !important;
}


    #sliderScroll7::-webkit-scrollbar {
        width: 4px;
        height: 4px;
        border-radius: 6px;
    }

    #sliderScroll7::-webkit-scrollbar-track, webkit-scrollbar-thumb {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 6px;
    }


    #sliderScroll7::-webkit-scrollbar-track {
        background-repeat: repeat-y;
    }

@media screen and (max-width: 991px) {
    /* for smaller red portion  */
    #slide7 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }



    #sliderScroll_outer7 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll7 {
        min-width: 75px;
    }
}

@media screen and (max-width: 767px) {
    /* for smaller red portion  */
    #sliderScroll7 {
        min-width: 75px;
    }
}


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

    #slide7 {
        display: flex;
        overflow-y: hidden;
        overflow-x: scroll;
        scrollbar-color: #FF0000 #7E7E7E;
        margin-top: 20px;
        scrollbar-width: thin;
        scroll-margin: 15px 30px 60px 90px;
    }

    #container > div {
        scroll-padding-bottom: 90px;
    }

    #sliderScroll_outer7 {
        display: none;
    }

    /* for smaller red portion  */
    #sliderScroll7 {
        min-width: 75px;
    }
}
/* end start scroll 7 css */