﻿body {
    background: #F0F0F0;
}

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 8px;
}

.return {
    position: absolute;
    top: 16px;
    left: 16px;
}

.return > a:link {
    display: flex;
    align-items: center;
    font-size: 1.25rem;
    color: white;
    text-decoration: none;
    padding: 6px 12px;
    background: #D44;
    border-radius: 8px;
    box-shadow: 0 0 16px #0002;
    transition: 0.15s;
}

.return > a:visited {
    color: white;
}

.return > a:hover {
    background: #D55;
    box-shadow: 0 0 4px #0006;
}

.return > a > i {
    margin: 4px 8px 0 0;
}

@media screen and (min-width: 1200px) {
    .belt-nav-account-mobile {
        display: none !important;
    }

    .belt-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 100vh;
        display: flex;
    }

    .belt-nav {
        position: fixed;
        min-width: 0;
        top: 0;
        left: 0;
        width: 256px;
        height: 100vh;
        max-width: 256px;
        overflow: hidden;
        background: #1E355E;
        z-index: 1;
        transition: height 0.4s;
    }

    .belt-hide-nav {
        height: 68px !important;
    }

    .belt-nav-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px;
        width: 100%;
        box-shadow: 0 2px 8px #0005;
    }

    .belt-logo {
        padding-left: 8px;
        height: 48px;
        filter: drop-shadow(1px 1px 0.5px white)
                drop-shadow(1px -0.5px 0.5px white)
                drop-shadow(-0.5px 1px 0.5px white)
                drop-shadow(-0.5px -0.5px 0.5px white)
                drop-shadow(1px 0px 0.5px white)
                drop-shadow(0px -1px 0.5px white)
                drop-shadow(-0px 1px 0.5px white)
                drop-shadow(-0.5px 0px 0.5px white);
    }

    .belt-burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        width: 48px;
        height: 48px;
    }

    .belt-burger:hover span {
        height: 3px;
        margin: 3.5px 0;
    }

    .belt-burger span {
        position: relative;
        width: 24px;
        height: 2px;
        border-radius: 8px;
        margin: 3px 0;
        background: white;
        transition: 0.15s;
    }

    .belt-nav-list {
        display: flex;
        flex-direction: column;
        padding: 0;
        list-style-type: none;
        width: 100%;
        max-height: calc(100vh - 84px);
        overflow-y: auto;
        margin-top: 16px;
    }

    .belt-nav-list li {
        width: 100%;
    }

    .belt-nav-category {
        display: flex;
        width: 100%;
        padding: 12px 28px;
        color: #789;
        font-weight: 500;
        font-size: 0.95rem;
        margin-top: 16px;
        margin-bottom: 6px;
        cursor: default;
    }

    .belt-nav-item > i {
        margin-right: 0.75rem;
    }

    .belt-nav-item, .belt-nav-item:link {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 6px 24px;
        color: #ccc;
        text-decoration: none;
        font-size: 1rem;
        transition: 0.15s;
    }

    .belt-nav-item:visited {
        color: #ccc;
    }

    .belt-nav-item:hover {
        color: white;
    }

    .belt-nav-item:not(.belt-nav-active), .belt-nav-item:link:not(.belt-nav-active) {
        padding-left: 28px;
    }

    .belt-nav-active {
        color: white !important;
        border-left: 4px solid white;
    }

    .belt-body {
        position: absolute;
        top: 0;
        left: 256px;
        width: calc(100% - 256px);
        min-height: 100vh;
        overflow-x: hidden;
        transition: left 0.4s, width 0.4s;
    }

    .belt-expand-body-content {
        left: 0 !important;
        width: 100% !important;
    }

    .belt-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: fixed;
        top: 0;
        left: 256px;
        width: calc(100% - 256px);
        height: 68px;
        background: white;
        box-shadow: 0 2px 8px #0005;
        z-index: 2;
    }

    .belt-search-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 0 24px;
        width: 512px;
        height: 68px;
    }

    .belt-search-hide-non-mobile {
        display: none;
    }

    .belt-search-group {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .belt-search-group > label {
        cursor: pointer;
        margin-top: 4px;
        margin-right: 24px;
        font-size: 1.1rem;
    }

    .belt-search-input {
        height: 68px;
        width: 100%;
        border: none;
    }

    .belt-search-dropdown {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 92px;
        left: 270px;
        width: 300px;
        background: white;
        border-radius: 4px;
        padding: 16px;
        z-index: 3;
        box-shadow: 0 0 12px #0005;
    }

    .belt-search-dropdown:before {
        content: '';
        position: absolute;
        left: 48px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(-45deg);
    }

    .belt-search-input:focus {
        outline: none;
    }

    .belt-search-item, a.belt-search-item:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-search-item:visited {
        color: black;
    }

    .belt-search-item:hover, a.belt-search-item:hover {
        background: #eee;
    }

    .belt-search-item > i {
        margin-right: 24px;
        font-size: 1.1rem;
    }

    .belt-profile-dropdown {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 92px;
        right: 16px;
        width: 256px;
        z-index: 3;
        padding: 16px;
        background: white;
        border-radius: 4px;
        box-shadow: 0 0 12px #0005;
    }

    .belt-profile-dropdown:before {
        content: '';
        position: absolute;
        right: 48px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(45deg);
    }

    .belt-profile:focus-within .belt-profile-dropdown {
        display: flex !important;
    }

    .belt-profile-toggle {
        display: flex;
        align-items: center;
        height: 68px;
        border: none;
        padding: 0 24px;
        background: none;
        transition: 0.15s;
    }

    .belt-profile-toggle:hover {
        background: #eee;
    }

    .belt-profile-toggle > i {
        margin-left: 8px;
        font-size: 1.2rem;
    }

    .belt-dropdown-button, a.belt-dropdown-button:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-dropdown-button:visited {
        color: black;
    }

    .belt-dropdown-button:hover, a.belt-dropdown-button:hover {
        background: #eee;
    }

    .belt-dropdown-button > i {
        margin-right: 24px;
        font-size: 1.1rem;
    }

    .belt-body-content {
        z-index: 0;
        position: absolute;
        top: 68px;
        left: 0;
        width: 100%;
        height: calc(100vh - 68px);
        max-height: calc(100vh - 68px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #f0f0f0;
        padding: 32px 32px 64px 32px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .belt-nav-account-mobile {
        display: none !important;
    }

    .belt-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 100vh;
        display: flex;
    }

    .belt-nav {
        position: fixed;
        min-width: 0;
        top: 0;
        left: 0;
        width: 224px;
        height: 100vh;
        max-width: 224px;
        overflow: hidden;
        background: #1E355E;
        z-index: 1;
        transition: height 0.4s;
    }

    .belt-hide-nav {
        height: 68px !important;
    }

    .belt-nav-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px;
        width: 100%;
        box-shadow: 0 2px 8px #0005;
    }

    .belt-logo {
        padding-left: 8px;
        height: 48px;
        filter: drop-shadow(1px 1px 0.5px white) drop-shadow(1px -0.5px 0.5px white) drop-shadow(-0.5px 1px 0.5px white) drop-shadow(-0.5px -0.5px 0.5px white) drop-shadow(1px 0px 0.5px white) drop-shadow(0px -1px 0.5px white) drop-shadow(-0px 1px 0.5px white) drop-shadow(-0.5px 0px 0.5px white);
    }

    .belt-burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        width: 48px;
        height: 48px;
    }

    .belt-burger:hover span {
        height: 3px;
        margin: 3.5px 0;
    }

    .belt-burger span {
        position: relative;
        width: 24px;
        height: 2px;
        border-radius: 8px;
        margin: 3px 0;
        background: white;
        transition: 0.15s;
    }

    .belt-nav-list {
        display: flex;
        flex-direction: column;
        padding: 0;
        list-style-type: none;
        width: 100%;
        max-height: calc(100vh - 84px);
        overflow-y: auto;
        margin-top: 16px;
    }

    .belt-nav-list li {
        width: 100%;
    }

    .belt-nav-category {
        display: flex;
        width: 100%;
        padding: 12px 24px;
        color: #789;
        font-weight: 500;
        font-size: 0.95rem;
        margin-top: 16px;
        margin-bottom: 6px;
        cursor: default;
    }

    .belt-nav-item > i {
        margin-right: 0.5rem;
    }

    .belt-nav-item, .belt-nav-item:link {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 6px 20px;
        color: #ccc;
        text-decoration: none;
        font-size: 1rem;
        transition: 0.15s;
    }

    .belt-nav-item:visited {
        color: #ccc;
    }

    .belt-nav-item:hover {
        color: white;
    }

    .belt-nav-item:not(.belt-nav-active), .belt-nav-item:link:not(.belt-nav-active) {
        padding-left: 24px;
    }

    .belt-nav-active {
        color: white !important;
        border-left: 4px solid white;
    }

    .belt-body {
        position: absolute;
        top: 0;
        left: 224px;
        width: calc(100% - 224px);
        min-height: 100vh;
        overflow-x: hidden;
        transition: left 0.4s, width 0.4s;
    }

    .belt-expand-body-content {
        left: 0 !important;
        width: 100% !important;
    }

    .belt-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: fixed;
        top: 0;
        left: 224px;
        width: calc(100% - 224px);
        height: 68px;
        background: white;
        box-shadow: 0 2px 8px #0005;
        z-index: 2;
    }

    .belt-search-hide-non-mobile {
        display: none;
    }

    .belt-search-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 0 20px;
        width: 496px;
        height: 68px;
    }

    .belt-search-group {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .belt-search-group > label {
        cursor: pointer;
        margin-top: 4px;
        margin-right: 20px;
        font-size: 1.1rem;
    }

    .belt-search-input {
        height: 68px;
        width: 100%;
        border: none;
    }

    .belt-search-dropdown {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 92px;
        left: 240px;
        width: 300px;
        background: white;
        border-radius: 4px;
        padding: 16px;
        z-index: 3;
        box-shadow: 0 0 12px #0005;
    }

    .belt-search-dropdown:before {
        content: '';
        position: absolute;
        left: 48px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(-45deg);
    }

    .belt-search-input:focus {
        outline: none;
    }

    .belt-search-item, a.belt-search-item:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-search-item:visited {
        color: black;
    }

    .belt-search-item:hover, a.belt-search-item:hover {
        background: #eee;
    }

    .belt-search-item > i {
        margin-right: 20px;
        font-size: 1.1rem;
    }

    .belt-profile-dropdown {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 92px;
        right: 16px;
        width: 224px;
        z-index: 3;
        padding: 16px;
        background: white;
        border-radius: 4px;
        box-shadow: 0 0 12px #0005;
    }

    .belt-profile-dropdown:before {
        content: '';
        position: absolute;
        right: 48px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(45deg);
    }

    .belt-profile:focus-within .belt-profile-dropdown {
        display: flex !important;
    }

    .belt-profile-toggle {
        display: flex;
        align-items: center;
        height: 68px;
        border: none;
        padding: 0 20px;
        background: none;
        transition: 0.15s;
    }

    .belt-profile-toggle:hover {
        background: #eee;
    }

    .belt-profile-toggle > i {
        margin-left: 8px;
        font-size: 1.2rem;
    }

    .belt-dropdown-button, a.belt-dropdown-button:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-dropdown-button:visited {
        color: black;
    }

    .belt-dropdown-button:hover, a.belt-dropdown-button:hover {
        background: #eee;
    }

    .belt-dropdown-button > i {
        margin-right: 20px;
        font-size: 1.1rem;
    }

    .belt-body-content {
        z-index: 0;
        position: absolute;
        top: 68px;
        left: 0;
        width: 100%;
        height: calc(100vh - 68px);
        max-height: calc(100vh - 68px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #f0f0f0;
        padding: 32px 32px 64px 32px;
    }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
    .belt-nav-account-mobile {
        display: none !important;
    }

    .belt-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 100vh;
        display: flex;
    }

    .belt-nav {
        position: fixed;
        min-width: 0;
        top: 0;
        left: 0;
        width: 196px;
        height: 100vh;
        max-width: 196px;
        overflow: hidden;
        z-index: 1;
    }

    .belt-nav-list-wrapper {
        width: 100%;
        height: 100%;
        transition: width 0.4s;
        overflow-x: hidden;
    }

    .belt-hide-nav > .belt-nav-list-wrapper {
        width: 68px !important;
    }

    .belt-nav-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px;
        width: 100%;
        background: #1E355E;
        box-shadow: 0 2px 8px #0005;
        z-index: 2;
    }

    .belt-logo {
        padding-left: 4px;
        height: 44px;
        filter: drop-shadow(1px 1px 0.5px white) drop-shadow(1px -0.5px 0.5px white) drop-shadow(-0.5px 1px 0.5px white) drop-shadow(-0.5px -0.5px 0.5px white) drop-shadow(1px 0px 0.5px white) drop-shadow(0px -1px 0.5px white) drop-shadow(-0px 1px 0.5px white) drop-shadow(-0.5px 0px 0.5px white);
    }

    .belt-burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        width: 44px;
        height: 44px;
    }

    .belt-burger:hover span {
        height: 3px;
        margin: 3px 0;
    }

    .belt-burger span {
        position: relative;
        width: 24px;
        height: 2px;
        border-radius: 8px;
        margin: 2.5px 0;
        background: white;
        transition: 0.15s;
    }

    .belt-nav-list {
        display: flex;
        flex-direction: column;
        list-style-type: none;
        width: 100%;
        padding: 16px 0 0 0;
        height: 100%;
        max-height: calc(100vh - 60px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #1E355E;
    }

    .belt-hide-nav .belt-nav-list::-webkit-scrollbar {
        width: 4px;
    }

    .belt-nav-list li {
        min-width: 196px;
    }

    .belt-nav-category {
        display: flex;
        width: 100%;
        padding: 12px 18px;
        color: #789;
        font-weight: 500;
        font-size: 0.95rem;
        margin-top: 16px;
        margin-bottom: 6px;
        cursor: default;
    }

    .belt-hide-nav .belt-nav-category {
        display: none;
    }

    .belt-nav-item span {
        transition: margin 0.4s;
    }

    .belt-hide-nav .belt-nav-item:link {
        padding: 14px 24px;
        font-size: 1.2rem;
    }

    .belt-hide-nav .belt-nav-item span {
        margin-left: 28px;
    }

    .belt-nav-item > i {
        margin-right: 0.5rem;
    }

    .belt-nav-item, .belt-nav-item:link {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 6px 16px;
        color: #ccc;
        text-decoration: none;
        font-size: 0.95rem;
        transition: 0.15s;
    }

    .belt-nav-item:visited {
        color: #ccc;
    }

    .belt-nav-item:hover {
        color: white;
    }

    .belt-nav-item:not(.belt-nav-active), .belt-nav-item:link:not(.belt-nav-active) {
        padding-left: 18px;
    }

    .belt-nav-item.belt-nav-active, .belt-nav-item:link.belt-nav-active {
        padding-left: 14px;
    }

    .belt-nav-active {
        color: white !important;
        border-left: 4px solid white;
    }

    .belt-body {
        position: absolute;
        top: 0;
        left: 196px;
        width: calc(100% - 196px);
        min-height: 100vh;
        overflow-x: hidden;
        transition: left 0.4s, width 0.4s;
    }

    .belt-expand-body-content {
        left: 64px !important;
        width: calc(100% - 64px) !important;
    }

    .belt-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: fixed;
        top: 0;
        left: 196px;
        width: calc(100% - 196px);
        height: 60px;
        background: white;
        box-shadow: 0 2px 8px #0005;
        z-index: 2;
    }

    .belt-search-hide-non-mobile {
        display: none;
    }

    .belt-search-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 0 20px;
        width: 384px;
        height: 60px;
    }

    .belt-search-group {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .belt-search-group > label {
        cursor: pointer;
        margin-top: 3px;
        margin-right: 16px;
        font-size: 1.1rem;
    }

    .belt-search-input {
        height: 60px;
        width: 100%;
        border: none;
    }

    .belt-search-dropdown {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 92px;
        left: 216px;
        width: 300px;
        background: white;
        border-radius: 4px;
        padding: 16px;
        z-index: 3;
        box-shadow: 0 0 12px #0005;
    }

    .belt-search-dropdown:before {
        content: '';
        position: absolute;
        left: 48px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(-45deg);
    }

    .belt-search-input:focus {
        outline: none;
    }

    .belt-search-item, a.belt-search-item:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-search-item:visited {
        color: black;
    }

    .belt-search-item:hover, a.belt-search-item:hover {
        background: #eee;
    }

    .belt-search-item > i {
        margin-right: 16px;
        font-size: 1.1rem;
    }

    .belt-profile-dropdown {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 92px;
        right: 32px;
        width: 196px;
        z-index: 3;
        padding: 16px;
        background: white;
        border-radius: 4px;
        box-shadow: 0 0 12px #0005;
    }

    .belt-profile-dropdown:before {
        content: '';
        position: absolute;
        right: 40px;
        top: -12px;
        width: 24px;
        height: 24px;
        background: white;
        transform: rotate(45deg);
    }

    .belt-profile:focus-within .belt-profile-dropdown {
        display: flex !important;
    }

    .belt-profile-toggle {
        display: flex;
        align-items: center;
        height: 60px;
        border: none;
        padding: 0 20px;
        background: none;
        transition: 0.15s;
    }

    .belt-profile-toggle:hover {
        background: #eee;
    }

    .belt-profile-toggle > i {
        margin-left: 8px;
        font-size: 1.2rem;
    }

    .belt-dropdown-button, a.belt-dropdown-button:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: black;
        text-decoration: none;
        background: none;
        transition: 0.15s;
    }

    a.belt-dropdown-button:visited {
        color: black;
    }

    .belt-dropdown-button:hover, a.belt-dropdown-button:hover {
        background: #eee;
    }

    .belt-dropdown-button > i {
        margin-right: 20px;
        font-size: 1.1rem;
    }

    .belt-body-content {
        z-index: 0;
        position: absolute;
        top: 60px;
        left: 0;
        width: 100%;
        height: calc(100vh - 60px);
        max-height: calc(100vh - 60px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #f0f0f0;
        padding: 28px 28px 56px 28px;
    }
}

@media screen and (max-width: 768px) {
    .belt-header {
        display: none;
    }

    .belt-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 100vh;
        display: flex;
    }

    .belt-nav {
        position: fixed;
        min-width: 0;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        overflow: hidden;
        z-index: 3;
        transition: height 0.4s;
    }

    .belt-nav.belt-hide-nav {
        height: 60px !important;
    }

    .belt-hide-nav > .belt-nav-list-wrapper {
        padding: 0;
        height: 0 !important;
    }

    .belt-nav-list-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: calc(100vh - 60px);
        overflow: hidden;
        transition: height 0.4s;
    }

    .belt-nav-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px;
        width: 100%;
        background: #1E355E;
        z-index: 2;
    }

    .belt-logo {
        padding-left: 4px;
        height: 44px;
        filter:
            drop-shadow(-1px -1px 1px white)
            drop-shadow(1px -1px 1px white)
            drop-shadow(-1px 1px 1px white)
            drop-shadow(1px 1px 1px white);
    }

    .belt-burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        width: 44px;
        height: 44px;
    }

    .belt-burger:hover span {
        height: 3px;
        margin: 3px 0;
    }

    .belt-burger span {
        position: relative;
        width: 24px;
        height: 2px;
        border-radius: 8px;
        margin: 2.5px 0;
        background: white;
        transition: 0.15s;
    }

    .belt-search-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 0 20px;
        width: 100%;
        height: 48px;
    }

    .belt-search-group {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .belt-search-group > label {
        cursor: pointer;
        margin-top: 3px;
        margin: 0 24px;
        font-size: 1.3rem;
        color: white;
    }

    .belt-search-input {
        height: 48px;
        width: 100%;
        border: none;
        background: none;
        font-size: 1.3rem;
        color: white;
    }

    .belt-search-input::placeholder {
        color: #ddd;
    }

    .belt-search-dropdown {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 140px;
        left: 16px;
        width: calc(100% - 32px);
        background: #30558E;
        border-radius: 8px;
        padding: 16px;
        z-index: 3;
        box-shadow: 0 0 12px #0005;
        max-height: calc(100vh - 200px);
        overflow-y: auto;
    }

    .belt-search-input:focus {
        outline: none;
    }

    .belt-search-item, a.belt-search-item:link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        padding: 8px;
        border: none;
        border-radius: 4px;
        color: white;
        font-size: 1.3rem;
        text-decoration: none;
        background: none;
    }

    a.belt-search-item:visited {
        color: black;
    }

    .belt-search-item > i {
        margin-right: 24px;
        font-size: 1.3rem;
    }

    .belt-nav-list-mobile {
        display: flex;
        flex-direction: column;
        list-style-type: none;
        width: 100%;
        padding: 16px 0 0 0;
        height: calc(100vh - 60px - 244px);
        max-height: calc(100vh - 60px - 244px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #1E355E;
        margin-bottom: 0;
    }

    .belt-nav-account-mobile {
        display: flex;
        flex-direction: column;
        list-style-type: none;
        width: 100%;
        padding: 16px 0 0 0;
        background: #1E355E;
        min-height: 244px;
        height: 244px;
        margin-bottom: 0;
    }

    .belt-nav-list li {
        width: 100%;
    }

    .belt-nav-category {
        display: flex;
        width: 100%;
        padding: 12px 24px;
        color: #789;
        font-weight: 500;
        font-size: 1.2rem;
        margin-top: 8px;
        margin-bottom: 4px;
        cursor: default;
    }

    .belt-nav-item > i {
        margin-right: 1.5rem;
    }

    .belt-nav-item, .belt-nav-item:link {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 8px 24px;
        color: #ccc;
        text-decoration: none;
        font-size: 1.3rem;
        background: none;
        border: none;
    }

    .belt-nav-item:visited {
        color: #ccc;
    }

    .belt-nav-item:not(.belt-nav-active), .belt-nav-item:link:not(.belt-nav-active) {
        padding-left: 28px;
    }

    .belt-nav-active {
        color: white !important;
        border-left: 6px solid white;
    }

    .belt-account-nav-item, a.belt-account-nav-item:link {
        font-size: 1rem !important;
        padding: 6px 24px !important;
    }

    .belt-account-nav-item > i {
        font-size: 1rem !important;
    }

    .belt-body {
        position: absolute;
        top: 60px;
        left: 0;
        width: 100%;
        min-height: calc(100vh - 60px);
        overflow-x: hidden;
    }

    .belt-body-content {
        z-index: 0;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: calc(100vh - 60px);
        max-height: calc(100vh - 60px);
        overflow-x: hidden;
        overflow-y: auto;
        background: #f0f0f0;
        padding: 72px 18px;
    }
}
