/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    .menudiv {
        width: 100%;
        padding: 20px 20px 0 20px;
    }

    .maindiv {
        display: block;
    }

    .page-content {
        padding: 20px;
    }

    .footcopy {
        left: 20px;
        width: calc(100% - 40px);
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .display-1 {
        font-size: calc(20px + 2.7vw) !important;
        line-height: 1.2 !important;
    }

    .display-2 {
        font-size: calc(15px + 2.7vw) !important;
        line-height: 1.2 !important;
    }

    .display-3 {
        font-size: calc(10px + 2.7vw) !important;
        line-height: 1.2 !important;
    }

    .grid-4col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .logo img {
        max-width: 150px;
    }
}

/* X-Small devices (portrait phones, less than 400px) */
@media (max-width: 400px) {
}







/* XX-Large devices (grater than 1400px) */
@media (min-width: 1399.98px) {
}

/* X-Large devices (grater than 1200px) */
@media (min-width: 1199.98px) {
}

/* Large devices (grater than 992px) */
@media (min-width: 991.98px) {

    .menubgdiv {
        border-radius: var(--bxradius);
        height: 100%;
        background-color: #fff;
        border: 1px solid #e5e7eb;
    }

    .cmmenu {
        height: 100%;
    }

        .cmmenu ul {
            overflow: auto;
            height: calc(100% - 80px);
            padding: 10px 10px 10px 0;
        }

            .cmmenu ul::-webkit-scrollbar {
                width: 6px;
            }

            /* Track */
            .cmmenu ul::-webkit-scrollbar-track {
                box-shadow: inset 0 0 5px grey;
                border-radius: 10px;
            }

            /* Handle */
            .cmmenu ul::-webkit-scrollbar-thumb {
                background: red;
                border-radius: 10px;
            }

            /* Handle on hover */
            .cmmenu ul::-webkit-scrollbar-thumb {
                background: var(--menuhoverbg);
            }

    .menudiv {
        padding: 20px;
        height: 100vh;
        width: 300px;
        position: fixed;
        left: 0;
    }

    .contentdiv {
        margin-left: 300px;
        width: calc(100% - 300px);
    }
}

/* Medium devices (grater than 768px) */
@media (min-width: 767.98px) {
}

/* Small devices (grater than 576px) */
@media (min-width: 575.98px) {
}




@media (min-width: 991.98px) and (max-width: 1199.98px) {
}