﻿.art-bottom-nav {
    display: none;
}

@media (max-width: 920px) {
    footer {
        margin-bottom: 5.3rem;
        display: inline-block;
    }

    .art-bottom-nav {
        display: block;
    }

        .art-bottom-nav .mobile-menu {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            display: flex;
            justify-content: space-around;
            background: #20202a;
            -webkit-box-shadow: 0 3px 8px 0 rgba(15, 15, 20, 0.2);
            box-shadow: 0 3px 8px 0 rgba(15, 15, 20, 0.2);
            z-index: 8;
            list-style: none;
            padding: .5rem 0 .5rem 0;
            margin: 0;
        }

            .art-bottom-nav .mobile-menu .menu-item a {
                display: flex;
                flex-direction: column !important;
                justify-content: center;
                align-items: center;
                text-decoration: none;
                color: #8c8c8e;
                padding: 10px;
                -webkit-transition: 0.2s ease-in-out;
                transition: 0.2s ease-in-out;
                gap: 3px;
                text-transform: uppercase;
                font-weight: 500;
            }

                .art-bottom-nav .mobile-menu .menu-item a.active,
                .art-bottom-nav .mobile-menu .menu-item a:hover,
                .art-bottom-nav .mobile-menu .menu-item.current-menu-item > a,
                .art-bottom-nav .mobile-menu .menu-item.menu-item-has-children .sub-menu.dropdown-menu a.active,
                .art-bottom-nav .mobile-menu .menu-item.menu-item-has-children .sub-menu.dropdown-menu a:hover,
                .art-bottom-nav .mobile-menu .menu-item.show > a {
                    text-shadow: 0 0 3px rgba(250, 250, 252, 0.4);
                    color: #fafafc;
                }

            .art-bottom-nav .mobile-menu .menu-item.menu-item-has-children .sub-menu.dropdown-menu a {
                display: block;
                flex-direction: unset;
                justify-content: initial;
                align-items: unset;
                font-size: 10px;
                font-family: "Poppins", sans-serif;
                font-weight: 400;
                letter-spacing: 1px;
                -webkit-transition: 0.2s ease-in-out;
                transition: 0.2s ease-in-out;
                padding: 7px 30px;
            }

    body[data-layout-color=light] .art-bottom-nav .mobile-menu {
        background: #f4f4f6;
    }

        body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item a {
            color: #5c5c6f;
        }

            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item a.active,
            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item a:hover,
            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item.current-menu-item > a,
            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item.menu-item-has-children .sub-menu.dropdown-menu a.active,
            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item.menu-item-has-children .sub-menu.dropdown-menu a:hover,
            body[data-layout-color=light] .art-bottom-nav .mobile-menu .menu-item.show > a {
                color: #1e1e28;
            }
}
