.mega-menu-container ul {
    list-style: none;
}

button {
    font-family: "Switzer", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    transition: 0.5s;
}

div.head-account-menu-signout>li {
    color: #031242;
    display: flex;
    align-items: center;
}

.badge-v2 {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    gap: 4px;
    min-width: 62px;
    height: fit-content;
    min-height: 20px;
    border-radius: 15px;
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}

.btn.active, .btn:active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: none;
    outline-offset: 0;
}

/** button default dark */
.btn-default-dark {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 9px 13px;
    gap: 5px;
    width: auto;
    height: 36px;
    color: #FFFFFF;
    background: #031242;
    border: 1px solid #031242;
    border-radius: 6px;
}

.btn-default-dark:hover {
    color: #FFFFFF;
    background: #000E38;
    border: 1px solid #031242;
    border-radius: 6px;
}

.btn-default-dark.focus, .btn-default-dark:focus {
    color: #FFFFFF;
    background: #000E38;
    border: 1px solid #031242;
    border-radius: 6px;
}

.btn-default-dark.active.focus, .btn-default-dark.active:focus, .btn-default-dark.active:hover, .btn-default-dark:active.focus, .btn-default-dark:active:focus, .btn-default-dark:active:hover, .open > .dropdown-toggle.btn-default-dark.focus, .open > .dropdown-toggle.btn-default-dark:focus, .open > .dropdown-toggle.btn-default-dark:hover {
    color: #FFFFFF;
    background: #142764;
    border-radius: 6px;
}

.btn-default-dark.disabled, .btn-default-dark.disabled.active, .btn-default-dark.disabled.focus, .btn-default-dark.disabled:active, .btn-default-dark.disabled:focus, .btn-default-dark.disabled:hover, .btn-default-dark[disabled], .btn-default-dark[disabled].active, .btn-default-dark[disabled].focus, .btn-default-dark[disabled]:active, .btn-default-dark[disabled]:focus, .btn-default-dark[disabled]:hover, fieldset[disabled] .btn-default-dark, fieldset[disabled] .btn-default-dark.active, fieldset[disabled] .btn-default-dark.focus, fieldset[disabled] .btn-default-dark:active, fieldset[disabled] .btn-default-dark:focus, fieldset[disabled] .btn-default-dark:hover {
    pointer-events: none;
    background: #031242;
    opacity: 0.4;
    border-radius: 6px;
}

/** setting button */
.btn-setting {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 9px 13px;
    gap: 5px;
    width: auto;
    height: 36px;
    color: #001345;
    background: #EBF3FF;
    border-radius: 6px;
    border: none;
}

.btn-setting:hover {
    background: #D5E2F5;
    border-radius: 6px;
}

.btn-setting.focus, .btn-setting:focus {
    background: #D5E2F5;
    border-radius: 6px;
}

.btn-setting.active.focus, .btn-setting.active:focus, .btn-setting.active:hover, .btn-setting:active.focus, .btn-setting:active:focus, .btn-setting:active:hover, .open > .dropdown-toggle.btn-setting.focus, .open > .dropdown-toggle.btn-setting:focus, .open > .dropdown-toggle.btn-setting:hover {
    background: #EBF3FF;
    border: 1px solid rgba(0, 150, 247, 0.8);
    border-radius: 6px;
}

.btn-setting.disabled, .btn-setting.disabled.active, .btn-setting.disabled.focus, .btn-setting.disabled:active, .btn-setting.disabled:focus, .btn-setting.disabled:hover, .btn-setting[disabled], .btn-setting[disabled].active, .btn-setting[disabled].focus, .btn-setting[disabled]:active, .btn-setting[disabled]:focus, .btn-setting[disabled]:hover, fieldset[disabled] .btn-setting, fieldset[disabled] .btn-setting.active, fieldset[disabled] .btn-setting.focus, fieldset[disabled] .btn-setting:active, fieldset[disabled] .btn-setting:focus, fieldset[disabled] .btn-setting:hover {
    pointer-events: none;
    background: #EBF3FF;
    opacity: 0.4;
    border-radius: 6px;
}

.mega-menu-container {
    font-family: "Switzer", sans-serif !important;
    position: fixed;
    left: 0;
    top: 0;
    width: 0;
    overflow: hidden;
    /*height: 100%;*/
    background: #fff;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    box-shadow: 5px 1px 5px #8888886e;
    line-height: 1;
    /*display: none;*/
    height: 100vh;
}

.mega-menu-container.mega-toggle {
    display: none;
}

#sub-navbar-name-message {
    display: none;
}

#sub-navbar-name-message.mega-toggle {
    display: block;
}

div.sub-navbar-name-message {
    background-color: #FBFDFF;
}
.sub-navbar-name-message {
    width: 100%;
    height: 330px;
    background-size: cover;
    font-style: normal;
    font-size: 16px;
    font-weight: 400;
}

.sub-navbar-name-message .badge-v2 {
    width: fit-content;
    min-width: auto;
}

.sub-navbar-name-message a {
    color: #031242;
}

.sub-navbar-name-message a:hover, .sub-navbar-name-message a:active {
    color: #031242;
    /*font-weight: 500;*/
    text-shadow: 0 1px 3px rgba(43, 59, 93, 0.3);
}

.sub-navbar-name-message a:hover img {
    box-shadow: 0 1px 3px rgba(43, 59, 93, 0.3);
    border: 1px solid rgba(43, 59, 93, 0.3);
    border-radius: 4px;
}

.sub-navbar-name-message #avatar-photo-computer {
    border-radius: 50%;
    width: 100px;
    height: 100px;
    margin-top: 5px;
}

#avatar-photo-nav {
    display: inline-block;
    background: linear-gradient(149.98deg, #FBD051 13.32%, #CBE0AE 54.14%, #7BC7F9 89.41%);
    width: 24px;
    height: 24px;
    border-radius: 100px;
}

.mega-menu-container #avatar-photo-nav {
    width: 50px;
    height: 50px;
}

.sub-navbar-name-message #avatar-photo-nav,
.mega-menu-container.mega-toggle .acc-info-container .acc-info .info-top .avatar-photo-nav .avatar-photo {
    border-radius: 50%;
    margin-top: 5px;
}

.sub-navbar-name-message #avatar-photo-nav {
    width: 100px;
    height: 100px;
}

.sub-navbar-name-message .fileinput-button {
    position: relative;
}

.sub-navbar-name-message #id-head-image-upload-cropper {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    left: 0;
    top: 5px;
    opacity: 0;
}

.sub-navbar-name-message ul {
    width: 100%;
    display: inline-flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.sub-navbar-name-message ul > div {
    width: 100%;
    height: 222px;
    /*flex-basis: 25%;*/
    border-right: 1px solid #CDD0D9;
    padding: 15px 40px;
}

.sub-navbar-name-message ul > div > span:first-child {
    /*display: inline-grid;*/
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 5px;
    align-content: baseline;
    /*overflow-y: auto;*/
}

.sub-navbar-name-message ul > div > span:first-child::-webkit-scrollbar {
    display: none;
}

.sub-navbar-name-message .head-info {
    width: 100%;
    display: inline-flex;
    align-items: start;
    justify-content: end;
    gap: 35px;
    border-bottom: none;
    justify-content: center;
}

.sub-navbar-name-message .head-info #user_dropdown_avatar_uploader_button {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: grid;
    align-items: center;
    background: #0076BF;
    top: 5px;
    text-align: center;
    color: #fff;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 600;
    opacity: 0;
    -webkit-transition: opacity .2s ease;
    position: absolute;
    left: 0;
    z-index: -1;

}
.sub-navbar-name-message .head-info .pull-right {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 5px;
    /*min-height: 102px;*/
    font-size: 14px;
    color: rgba(3, 18, 66, 0.4);
}

.sub-navbar-name-message .head-info .pull-right .name {
    cursor: pointer;
    color: #031242;
    font-weight: 700;
    font-size: 16px;
}

.sub-navbar-name-message .head-info .pull-right .name:hover {
    text-shadow: 0 1px 3px rgba(43, 59, 93, 0.3);
}

#head-info > div.pull-right > div.download-the-app {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    margin-top: auto;
}

span.download-app-content {
    color: #031242;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Switzer, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 13.756px;
    opacity: 0.4;
    white-space: nowrap;
}

.sub-navbar-name-message .head-info .pull-right .badge-v2 {
    background: #EFD8FF;
    color: #792170;

}

.sub-navbar-name-message .head-notification {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.sub-navbar-name-message .head-notification .head-notification-label {
    overflow-y: auto;
    max-height: 172px;
    display: grid;
    gap: 5px;
}

.sub-navbar-name-message .head-notification .head-notification-label li {
    display: flex;
    gap: 10px;
    align-items: center;
}

.sub-navbar-name-message .head-notification .head-notification-label::-webkit-scrollbar {
    display: none;
}

.sub-navbar-name-message .head-notification .badge-v2 {
    background: #0096F7;
    color: #FFFFFF;
}

.sub-navbar-name-message .head-notification > span:first-child li {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.sub-navbar-name-message .head-notification > span:first-child li a {
    /*flex: 1;*/
}

.sub-navbar-name-message .head-notification .mark-all-as-read-li {
    height: 28px;
    color: #0096F7;
    background: rgba(0, 150, 247, 0.2);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease-in-out;
}

.sub-navbar-name-message .head-notification .mark-all-as-read-li:hover {
    box-shadow: 0 1px 3px rgba(43, 59, 93, 0.3);
}

.sub-navbar-name-message .head-notification .mark-all-as-read-li .mark_all_as_read {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    color: #0096f7;
}

.sub-navbar-name-message .head-notification .mark-all-as-read-li .mark_all_as_read:hover {
    text-shadow: none;
}

.sub-navbar-name-message .head-notification .mark-all-as-read-li a {
    color: #0096F7;
}

.new-navbar-scroll .name-message #head_side_bar_account .top > span.fa-angle-down {
    transition: all 0.5s ease 0s
}

#mega-toggle-btn {
    display: none;
}

.sub-navbar-name-message .head-return-btn {
    padding-top: 0;
    height: 100px;
}

.sub-navbar-name-message .head-return-btn .btn-content {
    width: 100%;
    margin-top: auto;
    font-size: 14px;
    height: 28px;
    color: #0096F7;
    background: rgba(0, 150, 247, 0.2);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    transition: all .2s ease-in-out;
}

.sub-navbar-name-message .head-return-btn .btn-content:hover {
    box-shadow: 0 1px 3px rgba(43, 59, 93, 0.3);
}

#id-name-message {
    width: auto;
    height: 31px;
    min-width: 70px;
    padding: 3px 6px;
    /*border: 1px solid #031242;*/
    border-radius: 100px;
}

.head-notification .fa-solid.fa-chevron-down.open {
    transform: rotate(180deg);
}

@media (max-width: 1200px) {

    .sub-navbar-name-message#sub-navbar-name-message {
        display: none !important;
    }

    .sub-navbar-name-message {
        background: #FFFFFF none;
    }

    .new-navbar-scroll.mega-toggle .navbar-collapse {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile ul > div {
        height: auto;
        padding: 15px 20px;
    }

    #id-name-message {
        display: none;
    }

    #user_dropdown_avatar_uploader_button {
        width: 50px;
        height: 50px;
    }

    #mega-toggle-btn {
        display: inherit !important;
    }

    #mega-toggle-btn .btn-default-dark {
        width: 52px;
        height: 32px;
        color: #FFFFFF;
        border-radius: 40px;
    }

    #mega-toggle-btn .btn-default-dark .btn-default i,
    #mega-toggle-btn .btn-default-dark .btn-default-dark i,
    #mega-toggle-btn .btn-default-dark .btn-clear i,
    #mega-toggle-btn .btn-default-dark .btn-setting i {
        color: #FFFFFF;
    }

    .mega-menu-container.mega-toggle.white .mega-menu-icon a.navbar-logo .cls-1 {
        /*transform: none;*/
        /*filter: none;*/
        fill: #121642;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: start;
        z-index: 2;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon a.navbar-logo {
        margin: 0;
        padding: 0;
        width: 100%;
        height: auto;
        flex: 1;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon a.navbar-logo > svg {
        /*width: 100%;*/
        width: 145px;
        height: 34px;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon a.navbar-logo .cls-1 {
        fill: #FFFFFF;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon a.navbar-logo img {
        /*transform: translateY(-120px);*/
        /*filter: drop-shadow(#ffffff 0 120px);*/
    }

    .mega-menu-container.mega-toggle .mega-menu-icon .btn-default-dark .btn-default i,
    .mega-menu-container.mega-toggle .mega-menu-icon .btn-default-dark i,
    .mega-menu-container.mega-toggle .mega-menu-icon .btn-default-dark.btn-clear i,
    .mega-menu-container.mega-toggle .mega-menu-icon .btn-default-dark.btn-setting i {
        color: #FFFFFF;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon .btn-default-dark {
        width: 52px;
        height: 32px;
        color: #FFFFFF;
        border-radius: 40px;
        background: rgba(251, 253, 255, 0.1);
    }

    .mega-menu-container.mega-toggle.white .mega-menu-icon .btn-default-dark {
        background: #031242;
    }

    /* mega-menu-mask */
    .mega-menu-container.mega-toggle .mega-menu-mask {
        position: fixed;
        width: calc(50% + 105px);
        height: 100%;
        right: 0;
        background: rgba(0, 0, 0, 0.31);
        padding: 0;

        margin: -24px -40px;
        z-index: 1;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    /*mega-menu-content*/
    .mega-menu-container.mega-toggle .mega-menu-content {
        display: flex;
        width: 100%;
        height: calc(100vh - 82px);
        overflow: auto;
        z-index: 2;
        flex: 1;
    }

    .mega-menu-container.mega-toggle .mega-menu-content::-webkit-scrollbar {
        display: none;
    }

    .mega-menu-container.mega-toggle .mega-menu-content > div {
        width: 100%;
        /*height: calc(100vh - 82px);*/
    }

    /* mega menu mobil*/
    .mega-menu-container.mega-toggle::-webkit-scrollbar {
        display: none;
    }

    .mega-menu-container.mega-toggle {
        display: flex;
        flex-direction: column;
        width: calc(50% - 64px);
        height: 100vh;
        /*height: calc(100vh - 60px);*/
        padding: 24px 40px;
        background: #031242;
        color: #FBFDFF;
        /*overflow-y: auto;*/
        gap: 20px;
    }

    .mega-menu-container.mega-toggle > div:not(:first-child.mega-menu-icon) {

    }

    .mega-menu-container.mega-toggle.white {
        background: #FFFFFF;
    }

    .mega-menu-container > div {
        opacity: 0;
    }

    .mega-menu-container.mega-toggle > div {
        opacity: 1;
    }

    .mega-menu-container.mega-toggle a {
        color: #FBFDFF;
    }

    .mega-menu-container.mega-toggle a:hover, .mega-menu-container.mega-toggle a:active {
        color: #FBFDFF;
    }

    /* back */
    .mega-menu-container.mega-toggle .mega-menu-back {
        display: flex;
        align-items: center;
        gap: 15px;
        color: #fdfdfd40;
        font-size: 16px;
        margin-bottom: 16px;
        cursor: pointer;
    }

    /* acc-info-container*/
    .mega-menu-container.mega-toggle .acc-info-container {
        /*display: none;*/
        height: 100%;
        display: inline-flex;
        flex-direction: column;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 30px;
        border-bottom: 1px solid #fdfdfd40;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 35px;
        padding-bottom: 15px;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info-top {
        width: 100%;
        display: flex;
        gap: 10px;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info .left {

    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info .right {
        display: flex;
        flex-direction: column;
        gap: 5px;
        flex: 1;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info .right .badge-v2 {
        width: fit-content;
        background: #EFD8FF;
        color: #792170;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info .right > div {
        display: flex;
        flex-direction: column;
        font-weight: 500;
        line-height: 22px;
        gap: 5px;
        color: rgba(251, 253, 255, 0.4);;
    }

    .mega-menu-container.mega-toggle .acc-info-container .acc-info .info-bottom {
        width: 100%;
        height: 28px;
        display: inline-flex;
        align-items: center;
        font-size: 14px;
        color: #0096F7;
        justify-content: center;
        gap: 10px;
        background: rgba(0, 150, 247, 0.2);
        border-radius: 37px;
        cursor: pointer;
    }
    /* no-sign-in-info */
    .mega-menu-container.mega-toggle .acc-info-container .no-sign-in-info {
        display: flex;
        flex-direction: column;
        gap: 20px;
        font-size: 25px;
        font-weight: 500;
        padding: 30px 0;
        border-bottom: 1px solid #fdfdfd40;
    }

    .mega-menu-container.mega-toggle .acc-info-container .no-sign-in-info > div{
        display: inline-flex;
        gap: 10px;
    }
    .mega-menu-container.mega-toggle .acc-info-container .no-sign-in-info .fa-user{
        margin: 0;
    }

    /* menu-container */
    .mega-menu-container.mega-toggle .acc-info-container .menu-info {
        display: flex;
        flex-direction: column;
        gap: 20px;
        font-size: 32px;
        font-weight: 600;
        /*flex: 1;*/
        padding: 30px 0;
        border-bottom: 1px solid #fdfdfd40;
        overflow-y: visible;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-first {
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 14px;
        cursor: pointer;
    }


    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-first:hover {
        /*text-shadow: 0 1px 3px rgb(242 244 248 / 71%);*/
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-first .icon {
        font-size: 16px;
        font-weight: 400;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown {
        display: flex;
        flex: 1;
        gap: 15px;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown > div {
        position: relative;
        margin-top: auto;
    }

    #head-info > div.pull-right > div.download-the-app {
        display: none;
    }

    #menu-info > div.download-the-app {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 10px;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .btn-setting {
        height: 32px;
        border-radius: 20px;
        gap: 10px;
        padding: 7px 18px;
        background: #fdfdfd21;
        color: #FBFDFF;;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .btn-setting:active {
        border: none;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .btn-setting .fa-angle-down {
        color: #FBFDFF;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown #currency-dropdown-btn .fa-angle-down,
    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown #translate-dropdown-btn .fa-angle-down {
        transform: none;
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown #currency-dropdown-btn.open .fa-angle-down,
    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown #translate-dropdown-btn.open .fa-angle-down {
        transform: rotate(180deg);
    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .dropdown-menu-list {
        position: absolute;
        /*display: none;*/
        display: flex;
        width: 168px;
        height: 0;
        overflow: hidden;
        top: 0;
        flex-direction: column;
        gap: 10px;
        padding: 0;
        font-size: 14px;
        font-weight: 500;
        background: #031242;
        border-radius: 6px;
        border: 0;
        /*transform: translateY(-100%);*/
        z-index: 2;
        /* Add transition for smooth animation */

        /* Start with the menu hidden */
        transform: translateY(-100%);
        opacity: 0;

    }

    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .dropdown-menu-list.open {
        /*display: flex;*/
        /*transform: translateY(0);*/
        height: auto;
        padding: 10px 15px;
        border: 2px solid #fdfdfd21;
        opacity: 1;
        transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    }


    .mega-menu-container.mega-toggle .acc-info-container .menu-info .menu-dropdown .dropdown-menu-list a {
        color: #FBFDFF;
    }

    /* bottom-info*/
    .mega-menu-container.mega-toggle .acc-info-container .bottom-info {
        display: flex;
        flex-direction: column;
        gap: 5px;
        padding: 25px 0 0 0;
        color: rgba(251, 253, 255, 0.4);
        z-index: 1;
    }

    .mega-menu-container.mega-toggle .acc-info-container .bottom-info .img-icon {
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 15px;
        font-size: 14px;
    }

    .mega-menu-container.mega-toggle .acc-info-container .bottom-info .img-icon > img {
        border-radius: 4px;
        opacity: 0.4;
    }

    .mega-menu-container.mega-toggle .acc-info-container .bottom-info .bottom-info-content {
        display: flex;
        align-items: center;
        justify-content: start;
        font-size: 12px;
        font-style: normal;
    }

    /* my-acc-container*/
    .mega-menu-container.mega-toggle {
        /*display: none;*/
    }

    .mega-menu-container.mega-toggle .my-acc-container {
        display: none;
        font-style: normal;
        font-weight: 500;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-one .mega-menu-back {
        margin: 0;
        cursor: pointer;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-one {
        display: none;
        height: 100%;
        flex-direction: column;
        gap: 29px;
        font-size: 24px;
        overflow: hidden;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-one .section {
        display: flex;
        gap: 14px;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-two {
        display: none;
        height: 100%;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-two .section {
        display: none;
        /*display: flex;*/
        flex-direction: column;
        gap: 25px;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-two .section .section-title {
        font-size: 24px;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-two .section .section-content {
        display: flex;
        flex-direction: column;
        gap: 15px;
        font-size: 18px;
        padding-left: 30px;
    }

    .mega-menu-container.mega-toggle .my-acc-container .my-account-menu-page-content {
        height: calc(100% - 45px);
        display: flex;
        flex-direction: column;
        gap: 25px;
        margin-bottom: 10px;
        overflow: auto;
        cursor: pointer;
    }

    /* dropdown-menu-container */
    .mega-menu-container.mega-toggle .dropdown-menu-container {
        display: none;
        height: 100%;
        font-style: normal;
        font-weight: 500;
        overflow: hidden;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .dropdown-menu-page-content {
        height: calc(100% - 45px);
        display: flex;
        flex-direction: column;
        gap: 25px;
        overflow: auto;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container #dropdown-menu-page-one,
    .mega-menu-container.mega-toggle .dropdown-menu-container #dropdown-menu-page-two,
    .mega-menu-container.mega-toggle .dropdown-menu-container #dropdown-menu-page-three {
        display: none;
    }


    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module {
        display: flex;
        flex-direction: column;
        gap: 25px;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 15px;
        font-size: 18px;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:first-child div:first-child {
        font-size: 24px;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module > div:first-child > div:nth-child(2) {
        color: #FBFDFF;
        opacity: .6;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module:not(:last-child) .drop-module-content:first-child div:last-child {
        display: none;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(2) div:first-child,
    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(3) div:first-child,
    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(4) div:first-child {
        font-size: 16px;
        color: #FBFDFF;
        opacity: 0.4;
        letter-spacing: -0.01em;
        border-bottom: 1px solid #FBFDFF;
        padding: 5px 0;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(2) div:not(:first-child),
    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(3) div:not(:first-child),
    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .drop-module-content:nth-child(4) div:not(:first-child) {
        padding-left: 15px;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .support-option-chat-online {
        cursor: pointer;
        margin: 0;
        background: none;
        font-size: 16px;
        width: inherit;
        height: inherit;
        border-radius: inherit;
        color: inherit;
    }

    .mega-menu-container.mega-toggle .dropdown-menu-container .drop-module .support-option-chat-online > a {
        line-height: normal;
    }

    /* acc-info-quick-links-container */
    .mega-menu-container.mega-toggle .acc-info-quick-links-container {
        display: none;
        height: 100%;
        overflow-y: auto;
    }

    .mega-menu-container.mega-toggle .acc-info-quick-links-container a {
        color: #031242;
    }

    .mega-menu-container.mega-toggle .acc-info-quick-links-container #sub-navbar-name-message-mobile {
        height: 100%;
        background-image: none !important;
        background: #FFFFFF;
    }

    .sub-navbar-name-message {
        /*height: calc(100vh - 60px);*/
    }

    .sub-navbar-name-message ul {
        /*display: flex;*/
        height: auto;
        flex-direction: column;
        /*height: calc(100vh - 60px);*/
        /*height: 100%;*/
        /*gap: 0;*/
        /*overflow-y: auto;*/
    }

    .sub-navbar-name-message ul::-webkit-scrollbar {
        display: none;
    }

    .sub-navbar-name-message ul > div {
        border-right: none;
        border-bottom: 1px solid #CDD0D9;
    }

    .sub-navbar-name-message .head-info {
        justify-content: start;
        gap: 10px;
    }

    .sub-navbar-name-message #avatar-photo-nav {
        width: 50px;
        height: 50px;
    }

    .sub-navbar-name-message #id-head-image-upload-cropper {
        width: 50px;
        height: 50px;
    }

    .sub-navbar-name-message ul > div > span:first-child {
        /*gap: 15px;*/
    }

    .sub-navbar-name-message .head-notification .head-notification-label {
        gap: 10px;
    }

    .mega-menu-container.mega-toggle .acc-info-quick-links-container #sub-navbar-name-message-mobile .head-notification-label {
        gap: 10px;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile ul > div > span:first-child > li,
    .mega-menu-container.mega-toggle .acc-info-quick-links-container #sub-navbar-name-message-mobile .head-account-menu > span .head-account-menu-signout > li {
        height: 40px;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        border-radius: 6px;
        padding: 0 20px;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile ul > div > span:first-child > li:hover,
    .mega-menu-container.mega-toggle .acc-info-quick-links-container #sub-navbar-name-message-mobile .head-account-menu > span .head-account-menu-signout > li:hover {
        background: #ecf3fe;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile ul > div > span:first-child > li > a,
    .mega-menu-container.mega-toggle .acc-info-quick-links-container #sub-navbar-name-message-mobile .head-account-menu > span .head-account-menu-signout > li > a {
        display: flex;
        align-items: center;
        height: 100%;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-info {
        border-radius: 6px;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-info:hover {
        background: #ecf3fe;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-inbox {
        padding: 5px 0;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-inbox > span > li:first-child {
        height: 22px;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-inbox > span > li:first-child:hover {
        background: none;
    }

    .mega-toggle .sub-navbar-name-message#sub-navbar-name-message-mobile .head-account-menu {
        height: 100%;
        padding: 5px 0;
        border: none;
    }

    .sub-navbar-name-message .head-account-menu > span {
        height: 100%;
    }

    .sub-navbar-name-message .head-account-menu > span .head-account-menu-signout {
        /*margin-top: auto;*/
        /*border-top: 1px solid #03124217;*/
        /*padding: 5px 0px 0;*/
    }
}

@media (min-width: 1200px) {
    /* ... */
}

@media (min-width: 992px) and (max-width: 1199px) {
    /* ... */
    .sub-navbar-name-message {
        font-size: 14px;
    }

    .sub-navbar-name-message ul > div {
        padding: 9px 30px;
    }

    .sub-navbar-name-message .head-notification {
        height: 222px;
    }

    .sub-navbar-name-message .head-info {
        gap: 20px;
    }

    .sub-navbar-name-message #avatar-photo-nav {
        width: 50px;
        height: 50px;
    }

    .sub-navbar-name-message #id-head-image-upload-cropper {
        width: 50px;
        height: 50px;
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    /* ... */
    .sub-navbar-name-message {
        font-size: 13px;
    }

    .sub-navbar-name-message ul > div {
        padding: 9px 15px;
    }

    .sub-navbar-name-message .head-notification {
        height: 222px;
    }

    .sub-navbar-name-message .head-info {
        gap: 20px;
    }

    .sub-navbar-name-message #avatar-photo-nav {
        width: 50px;
        height: 50px;
    }

    .sub-navbar-name-message #id-head-image-upload-cropper {
        width: 50px;
        height: 50px;
    }
}

@media (max-width: 767px) {
    /*.mega-menu-container.mega-toggle {*/
    /*    background: #031242;*/
    /*}*/
    .mega-menu-container.mega-toggle .mega-menu-mask {
        display: none;
    }
    .mega-menu-container.mega-toggle {
        width: 100%;
    }

    .mega-menu-container.mega-toggle .mega-menu-icon a.navbar-logo img {
        /*transform: translateY(-35px);*/
        /*filter: drop-shadow(#ffffff 0 35px);*/
    }
}