/*
 * BPP Developer Global Mobile Navigation V8.4
 * Uses the global footer/nav markup.
 * Developer profile mobile only.
 */

@media (max-width: 767px) {

    html body nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;

        position: fixed !important;

        left: 12px !important;
        right: 12px !important;
        bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;

        top: auto !important;

        width: auto !important;
        max-width: none !important;

        height: auto !important;
        min-height: 72px !important;
        max-height: 84px !important;

        margin: 0 !important;
        padding: 7px 6px !important;

        background: rgba(255, 255, 255, .97) !important;

        border: 1px solid rgba(5, 75, 51, .12) !important;
        border-radius: 20px !important;

        box-shadow:
            0 12px 32px rgba(0, 0, 0, .14) !important;

        backdrop-filter: blur(14px) !important;
        -webkit-backdrop-filter: blur(14px) !important;

        align-items: stretch !important;

        overflow: hidden !important;

        z-index: 9998 !important;
    }


    html body nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] > a {
        display: flex !important;
        flex-direction: column !important;

        align-items: center !important;
        justify-content: center !important;

        gap: 3px !important;

        width: 100% !important;
        min-width: 0 !important;

        height: 58px !important;
        min-height: 58px !important;

        margin: 0 !important;
        padding: 3px 2px !important;

        border: 0 !important;
        border-radius: 14px !important;

        background: transparent !important;

        color: #5f6e66 !important;

        text-align: center !important;
        text-decoration: none !important;

        font-size: 11px !important;
        font-weight: 800 !important;
        line-height: 1.05 !important;

        box-shadow: none !important;
    }


    html body nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] > a > strong {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 36px !important;
        height: 34px !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #079455 !important;

        font-size: 22px !important;
        font-weight: 500 !important;
        line-height: 1 !important;

        background: #eef8f3 !important;
        border-radius: 12px !important;
    }


    html body nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] > a:hover,
    html body nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] > a:focus {
        color: #087648 !important;
        background: #f5faf7 !important;
    }


}


@media (min-width: 768px) {

    nav.rpgx-mobile-bottom.rpgp-mobile-bottom[data-bpp-developer-global-nav-v83="1"] {
        display: none !important;
    }

}