#navbar-mobile {
    display: none !important;
}

@media (max-width: 768px) {
    body {
        position: relative;
    }
    .navbar-toggler {
        display: none;
    }
    #navbar-mobile {
        display: flex !important;
        flex-wrap: nowrap;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #FFF;
        z-index: 9999999999;
        border-top: #DDD thin solid;
        box-sizing: inherit !important;
    }
    #navbar-mobile > a,
    #navbar-mobile > div {
        width: 100%;
        text-align: center;
        padding: 15px 0 10px;
    }
    #navbar-mobile .box-icon.active,
    #navbar-mobile .box-icon.active > i,
    #navbar-mobile .box-icon.active > span {
        color: var(--button-color);
    }
    #navbar-mobile .box-icon > i {
        display: block;
        font-size: 22px;
        color: #999;
    }
    #navbar-mobile .box-icon > span {
        display: block;
        font-size: 10px;
        margin-top: 2px;
        color: #999;
    }

    #boxActionMemberMobile {
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9999;
        background-color: #FFFFFF;
        width: 100%;
        height: 100vh;
        display: none;
    }

    #boxActionMemberMobile > .box-member-login {
        padding: 30px;
    }
    #boxActionMemberMobile > .box-member-login > .title {
        font-size: 18px;
        text-align: center;
        width: 100%;
        display: block;
        color: #999;
    }
    #boxActionMemberMobile > .box-member-login > a > label {
        width: 100%;
        text-align: center;
        margin: 15px 0;
        padding: 10px;
        font-size: 20px;
        border-radius: 5px;
    }
    #boxActionMemberMobile > .box-member-login > a > label#btnMemberLogin {
        background: var(--button-color);
        color: #FFF;
    }
    #boxActionMemberMobile > .box-member-login > a > label#btnMemberRegister {
        background: #FDD035;
        color: #FFF;
        margin-top: 10px;
    }
    #boxActionMemberMobile > .box-member-login > .powered-paybill {
        width: 100%;
        text-align: center;
    }
    #boxActionMemberMobile > .box-member-login > .powered-paybill > img {
        height: 18px;
        margin-left: 2px;
    }

    #boxActionMemberMobile > .box-member-info {
        padding: 20px 30px;
        border-bottom: #CCC thin dashed;
    }
    #boxActionMemberMobile > .box-member-info > label {
        margin-bottom: 0;
        font-size: 20px;
        color: #999;
    }
    #boxActionMemberMobile > .box-member-info > label > b {
        display: block;
        margin-bottom: -5px;
    }
    #boxActionMemberMobile > .box-member-menu {
        display: block;
        padding: 10px 30px;
    }
    #boxActionMemberMobile > .box-member-menu > .member-menu {
        font-size: 18px;
        margin: 30px 0;
        font-weight: 600;
    }
    #boxActionMemberMobile > .box-member-menu > .member-menu > a {
        color: var(--button-color);
    }
    #boxActionMemberMobile > .box-member-menu > .member-menu > a > i {
        width: 40px;
    }
}
@media (min-width: 320px) and (max-width: 334px) {
    body.loading div.box-loading > div > div.box-loading-svg > svg {
        margin-top: 80% !important;
    }
}