#menu-slide {
    display: none;
}

#dark-main {
    display: none;
}


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

    #menu-slide {
        width: 0;
        height: 100vh;
        background-color: #fff;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 4;
    }

    #dark-main {
        width: 100%;
        height: 100vh;
        opacity: 0.5;
        background-color: #000;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 3;
    }

    #menu-header {
        display: flex;
        justify-content: flex-start;
        width: 100%;
    }

    #menu-header-btn {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    #menu-header #close-menu {
        display: flex;
        width: 35px;
        height: 35px;
        margin-top: 15px;
        margin-left: 15px;
    }

    #menu-sm {
        direction: rtl;
        list-style: none;
        margin-right: 20px;
        margin-top: 5px;
        padding: 0;
    }

    .menu-sm-item {
        font-size: 18px;
        text-align: right;
        margin-bottom: 25px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;
    }

    .menu-sm-item a {
        text-decoration: none !important;
        color: #565656;
    }

    .menu-sm-item i {
        width: 25px;
        height: 25px;
        display: block;
        margin-top: 1px;
    }

    .menu-sm-item .home-icon {
        background: url(../../images/home.png) no-repeat;
    }

    .menu-sm-item .signUp-icon {
        background: url(../../images/signUp-icon.png) no-repeat;
    }

    .menu-sm-item .signUp-tracking-icon {
        background: url(../../images/signUp-tracking-icon.png) no-repeat;
    }

    .menu-sm-item .about-icon {
        background: url(../../images/about.png) no-repeat;
    }

    .menu-sm-item .gallery-icon {
        background: url(../../images/gallery.png) no-repeat;
    }

    .menu-sm-item .contact-icon {
        background: url(../../images/contact-us.png) no-repeat;
    }


}

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


    #menu-slide {
        width: 0;
        height: 100vh;
        background-color: #fff;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 4;
        display: none;
    }

    #dark-main {
        width: 100%;
        height: 100vh;
        opacity: 0.5;
        background-color: #000;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 3;
        display: none;

    }

    #menu-header {
        display: flex;
        justify-content: flex-start;
        width: 100%;
    }

    #menu-header-btn {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    #menu-header #close-manu {
        display: flex;
        width: 35px;
        height: 35px;
        margin-top: 15px;
        margin-left: 15px;
    }

    #menu-sm {
        direction: rtl;
        list-style: none;
        margin-right: 20px;
        margin-top: 5px;
        padding: 0;

    }

    .menu-sm-item {
        font-size: 16px;
        text-align: right;
        margin-bottom: 25px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 15px;

    }

    .menu-sm-item a {
        text-decoration: none !important;
        color: #565656;
    }

    .menu-sm-item i {
        width: 25px;
        height: 25px;
        display: block;
        margin-top: 1px;
    }

    .menu-sm-item .home-icon {
        background: url(../../images/home.png) no-repeat;
    }

    .menu-sm-item .signUp-icon {
        background: url(../../images/signUp-icon.png) no-repeat;
    }

    .menu-sm-item .signUp-tracking-icon {
        background: url(../../images/signUp-tracking-icon.png) no-repeat;
    }

    .menu-sm-item .about-icon {
        background: url(../../images/about.png) no-repeat;
    }

    .menu-sm-item .gallery-icon {
        background: url(../../images/gallery.png) no-repeat;
    }

    .menu-sm-item .contact-icon {
        background: url(../../images/contact-us.png) no-repeat;
    }



}