/*  رسپانسیو تبلت */

@media (min-width: 768px)  and (max-width: 1280px) {
}

/* رسپانسیو موبایل */
@media only screen and (max-width: 768px) {
    header {
        display: none !important;
    }
    .MobileMenuNav {
        display: block !important;
    }

    .MobileMenuNav a.logo_menu {
        width: 40%;
        display: flex;
        float: right;
        height: 60px;
    }
    .MobileMenuNav {
        display: flex !important;
        float: right;
        width: 100%;
        flex-direction: row-reverse;
        flex-wrap: nowrap;
        position: fixed;
        top: 0;
        z-index: 999;
        background: #fff;
        padding: 12px 0;
        justify-content: center;
    }

    .MobileMenuNav a.logo_menu {
        width: 50%;
        display: flex;
        float: right;
        padding: 0;
        margin: 0;
    }
    .MobileMenuNav a.logo_menu img {
        width: 100px;
        height: auto;
        text-align: right;
        float: right;
        margin: 0 16px 0px 0;
    }

    .MobileMenuNav .MenuMobileSide {
        display: flex;
        float: left;
        position: relative;
        left: 0;
        z-index: 999;
        background: #fff;
        flex-direction: column;
        width: 50%;
        margin: 0;
    }

    .MobileMenuNav .MenuMobileSide ul {
        float: right;
        width: 100%;
        list-style: none;
    }

    .MobileMenuNav .MenuMobileSide ul li {
        float: right;
        width: 100%;
        margin: 0;
        padding: 0 0 8px 0;
    }

    .MobileMenuNav .MenuMobileSide ul li a {
        float: right;
        width: 100%;
        text-decoration: none;
        color: #000;
    }
    .MobileMenuNav .closeMenu {
        float: right;
        width: 80%;
        text-align: right;
        color: #fff;
        margin: 10px 0px 0 0px;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    header .Toggle_Menu {
        display: flex;
        width: 65%;
        float: left;
        align-content: end;
        flex-direction: column;
        align-items: end;
        flex-wrap: wrap;
        cursor: pointer;
    }
    .MobileMenuNav .closeMenu {
        position: absolute;
    }


    .MobileMenuNav .closeMenu span:nth-child(1) {
        width: 34%;
        border: 1px solid #000;
        background: #000;
        float: left;
    }

    .MobileMenuNav .closeMenu span:nth-child(2) {
        width: 26%;
        border: 1px solid #000;
        background: #000;
        float: left;
        margin-top: 8px;
    }

    .MobileMenuNav .closeMenu span:nth-child(3) {
        width: 18%;
        border: 1px solid #000;
        float: right;
        margin-top: 8px;
    }

    .MobileMenuNav .closeMenu span {
        margin: 0px 0 0 0;
    }
    .MenuMobileSide .menu-main-menu-mobile-container {
        position: absolute;
        top: -400px;
        left: 0px;
        background: #000;
        padding: 0 12px 0 0px;
    }
    .MenuMobileSide .menu-main-menu-mobile-container.active {
        position: absolute;
        top: 56px;
        left: 0px;
        background: #000;
        padding: 0 12px 0 0px;
        transition: 1s;
    }
    /*.MenuMobileSide .header_menu {*/
    /*    display: none;*/
    /*}*/
    /*.MenuMobileSide .header_menu.active {*/
    /*    display: block;*/
    /*}*/
    .MenuMobileSide .header_menu {
        position: absolute;
        top: 55px;
        right: -285px;
        padding: 30px 12px 24px 0px;
        transition: 1s;
        width: 200%;
        text-align: center;
        height: 38vh;
        display: flex;
        flex-wrap: wrap;
    }
    .MenuMobileSide .header_menu.active {
        position: absolute;
        top: 55px;
        right: -33px;
        background: #fff;
        padding: 30px 12px 24px 0px;
        transition: 1s;
        width: 200%;
        text-align: center;
        height: 38vh;
        display: flex;
        flex-wrap: wrap;
    }
    .Menufooter ul {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column !important;
        padding: 0;
    }
    .SocialFooter ul {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        padding: 0;
    }

    .SocialFooter ul li {
        padding: 8px 0;
    }
    .ButtonHover:hover {
        margin: 0 !important;
    }
    .ComentsBlog form#commentform p {
        width: 100%;
    }
    p.form-submit > input {
        width: 100%;
    }
}

/* این مورد فقط برای استثناها می باشد. */
/* رسپانسیو موبایل های کوچک و قدیمی */
@media only screen and (max-width: 368px) {
}
