.app-brand {
    transition: padding 0.15s ease-in-out;
}

.layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-offcanvas):not(.layout-menu-fixed-offcanvas) .layout-menu .app-brand {
    padding-left: 0;
    padding-right: 0;
}

.layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-offcanvas):not(.layout-menu-fixed-offcanvas) .layout-menu .app-brand-text {
    display: none;
}


.threejs {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

#threejs-canvas {
    width: 100%;
    height: 100%;
}

    #threejs-canvas .canvas {
        width: 100%;
        height: 100%;
    }

.nav-pills {
    background-color: #DFF1FF;
}

    .nav-pills .nav-link {
        margin-right: 10px;
    }

    .nav-pills .nav-link:last-child {
        margin-right: 0;
    }

    .nav-pills .nav-link.active, .nav-pills .nav-link:focus {
        background-color: #333333 !important;
        color: #fff !important;
        font-weight: bold;
    }

    .nav-pills .nav-link:not(.active, .disabled) {
        color: #fff !important;
    }

    .nav-pills .nav-item {
        margin-right: 10px;
    }


.bg-light-custom {
    background: #F5F7F8;
}

.btn-blue-custom {
    background-color: #043952;
    background: #043952;
    border-color: #043952;
    color: #FFF;
    font-weight: 700;
}

    .btn-blue-custom:hover {
        background: #13848C;
        border-color: #13848C;
        color: #FFF;
    }

    .btn-blue-custom:active, .btn-blue-custom:focus,
    .btn-blue-custom:focus-visible {
        background: #13848C !important;
        border-color: #13848C !important;
        color: #FFF !important;
    }

    .page-item.active .page-link {
        background: #043952;
        border-color: #043952;
        color: #FFF;
    }

    .page-item.active .page-link:hover {
        background: #13848C;
        border-color: #13848C;
        color: #FFF;
    }

    .page-item.active .page-link:active, .page-item.active .page-link:focus,
    .page-item.active .page-link:focus-visible {
        background: #13848C !important;
        border-color: #13848C !important;
        color: #FFF !important;
    }

.bg-black-custom {
    background: #141414;
}

.auth-container {
    background: rgba(20, 20, 20, 0.8);
    width: auto !important;
    display: flex;
    height: 100vh;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    min-width: 560px;
}

    .auth-container h5, .auth-container .form-label {
        color: #fff;
    }


.authentication-wrapper.authentication-basic .authentication-inner {
    width: 600px;
}

.bg-indonesia {
    background-image: url("/img/bg-indonesia.jpg");
    background-position: center;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

.bg-darker-custom {
    background: #1F1F1F !important;
}

.bg-gray-custom {
    background: #474747 !important;
}

.layout-container .bg-darker-custom .menu-text {
    color: #fff;
}

.layout-container .bg-darker-custom .menu-link {
    color: #fff;
}

.border-color-grey-custom {
    border-color: #525252 !important;
}

.bg-grey-custom {
    background: #525252 !important;
}

.menu-inner.bg-darker-custom > .menu-item.active > .menu-link {
    background: #333333 !important;
    color: #fff;
}

.bg-menu-theme .menu-item.open:not(.menu-item-closing) > .menu-toggle, .bg-menu-theme .menu-item.active > .menu-link {
    background: #333333 !important;
    color: #fff;
}

.layout-wrapper:not(.layout-horizontal) .bg-menu-theme .menu-inner.bg-darker-custom > .menu-item.active:before {
    content: "";
    position: absolute;
    right: 0;
    width: .25rem;
    height: 2.6845rem;
    border-radius: .375rem 0 0 .375rem;
    background: #fff;
}


.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal) .layout-page:before {
    height: 0 !important;
}

.app-brand .layout-menu-toggle {
    background: #333 !important;
    border: 7px solid #525252;
}

    .app-brand .layout-menu-toggle i {
        font-size: 18px !important;
        display: flex;
        justify-content: center;
        align-items: center;
    }

.layout-navbar {
    height: 48px;
    padding: 4px !important;
}

    .layout-navbar .navbar-dropdown.dropdown-user .dropdown-menu {
        margin-right: -5px;
        margin-top: 10px;
    }

.custom-dropdown-setting {
    padding: 5px;
}

.z-index-1095 {
    z-index: 1095;
}

.toast-container {
    right: 30px;
}

.bg-darker-custom label,
.bg-gray-custom label {
    color: white;
}

.bg-darker-custom .table th,
.bg-darker-custom .table td,
.bg-gray-custom .table th,
.bg-gray-custom .table td {
    color: white;
    border-color: #474747 !important;
}

.bg-darker-custom .table th,
.bg-gray-custom .table th {
    background: #292929 !important;
}

.bg-darker-custom .table tr.odd,
.bg-gray-custom .table tr.odd {
    background: none !important;
}

.bg-darker-custom .table tr.even,
.bg-gray-custom .table tr.even {
    background: #292929 !important;
}

    .bg-darker-custom .table tr.odd td,
    .bg-gray-custom .table tr.odd td,
    .bg-darker-custom .table tr.even td,
    .bg-gray-custom .table tr.even td {
        color: white;
    }

.bg-darker-custom input[type="text"],
.bg-gray-custom input[type="text"],
.bg-black-custom input[type="text"],
.bg-black-custom input[type="password"],
.bg-gray-custom input[type="password"],
.bg-darker-custom input[type="password"],
.bg-darker-custom input[type="color"],
.bg-gray-custom input[type="color"],
.bg-black-custom input[type="color"],
.bg-darker-custom input[type="number"],
.bg-gray-custom input[type="number"],
.bg-black-custom input[type="number"],
.bg-darker-custom textarea,
.bg-gray-custom textarea,
.bg-black-custom textarea,
.bg-darker-custom select,
.bg-black-custom select,
.bg-gray-custom select,
.bg-darker-custom input[type="file"],
.bg-gray-custom input[type="file"],
.bg-black-custom input[type="file"],
.bg-darker-custom .select2-container--default .select2-selection--single,
.bg-gray-custom .select2-container--default .select2-selection--single,
.bg-black-custom .select2-container--default .select2-selection--single {
    background: #141414 !important;
    color: #fff;
    border-color: #525252;
}

    .bg-darker-custom .select2-container--default .select2-selection--single .select2-selection__rendered,
    .bg-gray-custom .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #fff;
    }

.select2-container--default .select2-selection--single {
    height: auto !important;
    padding-top: 3px;
    padding-bottom: 3px;
}


.navbar-detached {
    box-shadow: 0 0 0.375rem 0.25rem rgba(0, 0, 0, 0.15);
}

.page-link {
    padding-top: 10 !important;
    padding-bottom: auto !important;
}

.bg-darker-custom h5 {
    color: #fff;
}

.bg-darker-custom .form-control:focus,
.bg-darker-custom .form-select:focus {
    color: #fff;
}

.link-yellow-custom {
    color: #13848C !important;
}

.box-shadow-none {
    box-shadow: none !important;
}

.bg-darker-custom .input-group-text {
    background: #525252;
    border-color: #525252;
    color: #FFF;
}