/* header {
    min-height: 120px;
} */

/* body{
    min-height: 100vh;
} */

.top {
    min-width: 185px;
    /* width: 100%; */
}


.scrollframe {
    width: 100%;
    height: 100%;
    object-fit: contain;
    overflow-x: scroll;
    overflow-y: visible;

    /**keep scrolling when
      *finger or cursor scrolling*/
    -webkit-overflow-scrolling: touch;

}

.scrollmenu {
    width: 100%;
    height: 100%;
    gap: 0px;
    font-size: 0;
    /* overflow-x: scroll; */

    /* object-fit: contain; */
    /**used to scroll text*/
    white-space: nowrap;





    /**keep scrolling when
      *finger or cursor scrolling*/
    -webkit-overflow-scrolling: touch;
}

.scrollframe::-webkit-scrollbar {
    width: var(--sb-size);
}

.scrollframe::-webkit-scrollbar-track {
    background: var(--sb-track-color);

}

.scrollframe::-webkit-scrollbar-thumb {
    background: var(--sb-thumb-color);


}




.product-card {
    background-color: red;
    height: 100%;
    object-fit: contain;
    float: none;
    display: inline-block;
    gap: 0px;
}

/*to hide the scrollbars*/
/* .scrollmenu::-webkit-scrollbar {
    display: none;
} */


img {

    width: 100%;
    height: 100%;

    object-fit: cover;
    display: block;
    border-left: 1px solid rgb(237, 237, 237);
    /* border-right: 1px solid rgb(237, 237, 237); */
    border-bottom: 1px solid rgb(237, 237, 237);
    border-top: 1px solid rgb(237, 237, 237);



}

img:last-child {

    width: 100%;
    height: 100%;

    object-fit: contain;
    display: block;
    border-left: 1px solid rgb(237, 237, 237);
    /* border-right: 1px solid rgb(237, 237, 237); */
    border-bottom: 1px solid rgb(237, 237, 237);
    border-top: 1px solid rgb(237, 237, 237);
    border-right: 1px solid rgb(237, 237, 237);


}

@media screen and (max-width: 768px) {
    * {
        max-height: none;
    }

    html,
    body {
        height: auto;
    }

    body {
        min-height: 100vh;
    }

    main {
        height: auto;
    }

    .scrollmenu {
        width: 100%;
        height: auto;
        gap: 0px;
        font-size: 0;
        display: flex;
        flex-direction: column;
        /* object-fit: contain; */
        /**used to scroll text*/
        white-space: normal;

        overflow: visible;





        /**keep scrolling when
      *finger or cursor scrolling*/
        /* -webkit-overflow-scrolling: touch; */
    }

    .scrollframe {
        width: 100%;
        height: auto;
        display: flex;
        overflow: visible;

        /**keep scrolling when
      *finger or cursor scrolling*/
        /* -webkit-overflow-scrolling: touch; */
    }

    .product-card {
        background-color: red;
        height: auto;
        object-fit: contain;
        float: none;
        display: flex;
        gap: 0px;
    }

    img {
        height: auto;
        max-width: 100%;
        border-top: none;
        border-bottom: none;
        border-left: none;
        border-right: none;
    }

    img:first-child {
        border-top: 1px solid #ffffff;
        border-bottom: none;
        border-left: none;
        border-right: none;
    }

    img:last-child {
        border-top: none;
        border-bottom: 1px solid #ffffff;
        border-left: none;
        border-right: none;
        object-fit: cover;
    }

}