@media (min-width: 1200px) {
        /* agar menu di tengah  */
        .menu-box {
            margin: auto;
            width: fit-content;
        }
    }
    @media (max-width: 1199px) {
        .navbar-brand {
            visibility: hidden;
        }
        .box-title {
            text-align: center;
        }
        .total-row {
            text-align: center;
        }
    }	

    .fw-bold {
        font-weight: 500 !important;
    }
    .fw-bolder {
        font-weight: 600 !important;
    }
    .input-group-text-solid {
        color: #a8b1bb;
    }
    .form-control-solid,.form-select-solid,.input-group-text-solid {
        background-color: #f5f5f5;
        border-color:#f5f5f5;
    }
    .form-control-solid:focus,.form-select-solid:focus,.input-group-text-solid:focus {
        background-color: #f5f5f5 !important;
        border-color: #f5f5f5 !important;
    }
    .form-control-solid:hover,.form-select-solid:hover,.input-group-text-solid:hover {
        background-color: #f5f5f5;
        border-color: #f5f5f5;
    }

    .form-control-solid:hover:not([disabled]):not([focus]) {
        border-color: #f5f5f5;
    }

    .form-select-solid:hover:not([disabled]):not([focus]) {
        border-color: #f5f5f5;
    }
    .tabs-line {
        --bs-nav-tabs-border-color: none;
        --bs-nav-link-padding-x: 0.2rem;
        --bs-nav-link-padding-y: 0.469rem;
    }
    .tabs-line .nav-item {
        margin-right:20px;
    }

    .tabs-line.nav-tabs .nav-link.active, .tabs-line.nav-tabs .nav-link.active:hover, .tabs-line.nav-tabs .nav-link.active:focus, .tabs-line > .nav-tabs .nav-link.active, .tabs-line > .nav-tabs .nav-link.active:hover, .tabs-line > .nav-tabs .nav-link.active:focus {
        box-shadow: none;
        border-bottom:1px solid #171717;
    }
    .swal2-confirm {			
        color: #fff;
        background-color: #5a8dee;
        border-color: #5a8dee;
        box-shadow: 0 0.125rem 0.25rem rgba(147, 158, 170, 0.4);
    }
    .table th {
        letter-spacing:0;
        font-size: 13px;
        font-weight:600;
        background-color: #ea7024;
        color: #fff !important;
    }
    table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
        top: 1.3rem !important;
    }
    .select2-container {
        z-index: 1000000 !important;
    }

    /* override theme default top bar*/
    .menu-horizontal .menu-sub .menu-item.active > .menu-link:not(.menu-toggle) {
        font-weight: 400;
    }

    .bg-navbar-theme {
        background-color: #1c222f !important;
        color: #a1b0cb;
    }
    .bg-navbar-theme .navbar-brand,
    .bg-navbar-theme .navbar-brand a {
        color: #d8deea;
    }
    .bg-navbar-theme .navbar-brand:hover, .bg-navbar-theme .navbar-brand:focus,
    .bg-navbar-theme .navbar-brand a:hover,
    .bg-navbar-theme .navbar-brand a:focus {
        color: #d8deea;
    }
    .bg-navbar-theme .navbar-search-wrapper .navbar-search-icon,
    .bg-navbar-theme .navbar-search-wrapper .search-input {
        color: #a1b0cb;
    }
    .bg-navbar-theme .search-input-wrapper .search-input,
    .bg-navbar-theme .search-input-wrapper .search-toggler {
        background-color: #1c222f !important;
        color: #a1b0cb;
    }
    .bg-navbar-theme .navbar-nav > .nav-link,
    .bg-navbar-theme .navbar-nav > .nav-item > .nav-link,
    .bg-navbar-theme .navbar-nav > .nav > .nav-item > .nav-link {
        color: #a1b0cb;
    }
    .bg-navbar-theme .navbar-nav > .nav-link:hover, .bg-navbar-theme .navbar-nav > .nav-link:focus,
    .bg-navbar-theme .navbar-nav > .nav-item > .nav-link:hover,
    .bg-navbar-theme .navbar-nav > .nav-item > .nav-link:focus,
    .bg-navbar-theme .navbar-nav > .nav > .nav-item > .nav-link:hover,
    .bg-navbar-theme .navbar-nav > .nav > .nav-item > .nav-link:focus {
        color: #d8deea;
    }
    .bg-navbar-theme .navbar-nav > .nav-link.disabled,
    .bg-navbar-theme .navbar-nav > .nav-item > .nav-link.disabled,
    .bg-navbar-theme .navbar-nav > .nav > .nav-item > .nav-link.disabled {
        color: #6c778d !important;
    }
    .bg-navbar-theme .navbar-nav .show > .nav-link,
    .bg-navbar-theme .navbar-nav .active > .nav-link,
    .bg-navbar-theme .navbar-nav .nav-link.show,
    .bg-navbar-theme .navbar-nav .nav-link.active {
        color: #d8deea;
    }
    .bg-navbar-theme .navbar-toggler {
        color: #a1b0cb;
        border-color: rgba(216, 222, 234, 0.06);
    }
    .bg-navbar-theme .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='rgba(161, 176, 203, 0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>");
    }
    .bg-navbar-theme .navbar-text {
        color: #a1b0cb;
    }
    .bg-navbar-theme .navbar-text a {
        color: #d8deea;
    }
    .bg-navbar-theme .navbar-text a:hover, .bg-navbar-theme .navbar-text a:focus {
        color: #d8deea;
    }
    .bg-navbar-theme hr {
        border-color: rgba(216, 222, 234, 0.06);
    }


    .layout-horizontal .layout-navbar .navbar-search-wrapper .search-input, .layout-horizontal .layout-navbar .navbar-search-wrapper .search-toggler {
        background-color: #283144 !important;
    }
    .layout-horizontal .layout-navbar {
        background-color: #808080 !important;
        box-shadow: 0 1px 0 #808080;
    }

    .bg-menu-theme {
        background-color: #f2f2f6 !important;
        color: #546990;
    }
    .bg-menu-theme .menu-link,
    .bg-menu-theme .menu-horizontal-prev,
    .bg-menu-theme .menu-horizontal-next {
        color: #546990;
    }
    .bg-menu-theme .menu-link.active,
    .bg-menu-theme .menu-horizontal-prev.active,
    .bg-menu-theme .menu-horizontal-next.active {
        color: #fff;
    }
    .bg-menu-theme .menu-item.disabled .menu-link,
    .bg-menu-theme .menu-horizontal-prev.disabled,
    .bg-menu-theme .menu-horizontal-next.disabled {
        color: #93a0b9 !important;
    }
    .bg-menu-theme .menu-item.active > .menu-link:not(.menu-toggle) {
        color: #fff;
        background-color: #ea7024;
    }
    /* .bg-menu-theme.menu-horizontal .menu-inner > .menu-item.active > .menu-link {
        background-color: #5a8dee !important;
    } */
    /* .bg-menu-theme.menu-horizontal .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle) {
        background-color: transparent !important;
        color: #fff !important;
    } */
    .bg-menu-theme .menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-sub,
    .bg-menu-theme .menu-inner > .menu-item.menu-item-closing .menu-item.open .menu-toggle {
        background: transparent;
        color: #546990;
    }
    .bg-menu-theme .menu-inner-shadow {
        background: linear-gradient(#f2f2f6 41%, rgba(242, 242, 246, 0.11) 95%, rgba(242, 242, 246, 0));
    }
    .bg-menu-theme .menu-text {
        color: #fff;
    }
    .bg-menu-theme .menu-header {
        color: #7c8baa;
    }
    .bg-menu-theme hr,
    .bg-menu-theme .menu-divider,
    .bg-menu-theme .menu-inner > .menu-item.open > .menu-sub::before {
        border-color: transparent !important;
    }
    .bg-menu-theme .menu-inner > .menu-header::before {
        background-color: transparent;
    }
    .bg-menu-theme .menu-block::before {
    background-color: #7c8baa;
    }
    .bg-menu-theme .menu-inner > .menu-item.open .menu-item.open > .menu-toggle::before {
        background-color: #5a8dee;
    }
    .bg-menu-theme .menu-inner > .menu-item.open .menu-item.active > .menu-link::before {
        background-color: #fff;
    }
    .bg-menu-theme .ps__thumb-y,
    .bg-menu-theme .ps__rail-y.ps--clicking > .ps__thumb-y {
        background: rgba(255, 255, 255, 0.5803231372) !important;
    }

    .bg-menu-theme .menu-header {
        color: #a1b0cb;
    }
    .bg-menu-theme .menu-text {
        color: #5a8dee;
    }
    .bg-menu-theme .menu-inner .menu-item.open > .menu-link:hover,
    .bg-menu-theme .menu-inner .menu-item:not(.active) .menu-link:hover {
        background-color: #dfdfe2;
    }
    .bg-menu-theme .menu-inner .menu-sub > .menu-item.active > .menu-link.menu-toggle,
    .bg-menu-theme .menu-inner .menu-sub > .menu-item.open > .menu-link.menu-toggle {
        background-color: #dfdfe2;
    }
    .bg-menu-theme .menu-inner .menu-sub > .menu-item.active .menu-icon,
    .bg-menu-theme .menu-inner .menu-sub > .menu-item.open .menu-icon {
        color: #5a8dee;
    }
    html:not(.layout-menu-collapsed) .bg-menu-theme .menu-inner > .menu-item.open:not(.active), .layout-menu-hover.layout-menu-collapsed .bg-menu-theme .menu-inner > .menu-item.open:not(.active) {
        background-color: #ea7024 !important;
    }
    .bg-menu-theme .menu-inner > .menu-item.active {
        background-color: #ea7024 !important;
    }
    .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) .bg-menu-theme .menu-inner > .menu-item.active {
        background-color: #5a8dee !important;
    }
    .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) .bg-menu-theme .menu-inner > .menu-item.active > .menu-link {
        color: #fff;
    }
    .bg-menu-theme .menu-sub > .menu-item > .menu-link:before {
        background-color: #546990 !important;
    }
    .bg-menu-theme .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle):before {
        background-color: #fff !important;
    }
    .bg-menu-theme .menu-inner > .menu-header::before {
        background-color: #a1b0cb;
    }
    .bg-menu-theme.menu-horizontal .menu-inner .menu-item:not(.menu-item-closing) > .menu-sub {
        background: #ea7024 !important;
    }
    .menu-link {
        font-size: 1.025rem !important;
        color: #fff !important;
        font-family: Rubik,Helvetica,"san-serif" !important;
    }
    .bg-menu-theme.menu-horizontal .menu-inner > .menu-item.active > .menu-link {
        background-color: #ea7024 !important;
    }
    .bg-menu-theme.menu-horizontal .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle) {
        color: #ffffff !important;
    }
    .bg-menu-theme .menu-inner .menu-sub > .menu-item.active .menu-icon, .bg-menu-theme .menu-inner .menu-sub > .menu-item.open .menu-icon {
        color: #ffffff;
    }

    section.timeline-outer {
    width: 80%;
    margin: 0 auto;
    }

    h1.header {
    font-size: 50px;
    line-height: 70px;
    }
    /* Timeline */

    .timeline {
        height: auto !important;
        border-left: 2px solid #cdcece;
        letter-spacing: 0.5px;
        line-height: 1.4em;
        padding: 0 20px;
        list-style: none;
        text-align: left;
        left: 160px;
        width: calc(100% - 160px);
    }

    .timeline .event {
        padding-bottom: 15px;
        margin-bottom: 0px;
        position: relative;
    }
    .timeline p {
        margin-bottom:0 !important;
    }
    .timeline .event:last-of-type {
        padding-bottom: 0;
        margin-bottom: 0;
        border: none;
    }

    .timeline .event:before,
    .timeline .event:after {
        position: absolute;
        display: block;
        top: 0;
    }

    .timeline .event:before {
        left: -177.5px;
        color: #212121;
        content: attr(data-date);
        text-align: right;
        min-width: 120px;
    }

    .timeline .event:after {
        box-shadow: 0 0 0 3px #42A5F5;
        left: -27px;
        background: #ffffff;
        border-radius: 50%;
        height: 11px;
        width: 11px;
        content: "";
        top: 5px;
    }

    .timeline-event-warning:after {
        box-shadow: 0 0 0 3px #fdac41 !important;
    }
    .timeline-event-danger:after {
        box-shadow: 0 0 0 3px #ff5b5c !important;
    }
    .timeline-event-primary:after {
        box-shadow: 0 0 0 3px #7ba4f1 !important;
    }
    .timeline-event-info:after {
        box-shadow: 0 0 0 3px #00cfdd !important;
    }
    .timeline-event-success:after {
        box-shadow: 0 0 0 3px #39da8a !important;
    }
    /**/
    /*——————————————
    Responsive Stuff
    ———————————————*/

    @media (max-width: 945px) {
    .timeline .event::before {
        left: 0.5px;
        top: 20px;
        min-width: 0;
        /* font-size: 13px; */
    }
    /* .timeline h3 {
        font-size: 16px;
    } */
    .timeline p {
        padding-top: 20px;
        margin-bottom:0 !important;
    }
    section.lab h3.card-title {
        padding: 5px;
        /* font-size: 16px */
    }
    }

    @media (max-width: 768px) {
    .timeline .event::before {
        left: 0.5px;
        top: 20px;
        min-width: 0;
        /* font-size: 13px; */
    }
    .timeline .event:nth-child(1)::before,
    .timeline .event:nth-child(3)::before,
    .timeline .event:nth-child(5)::before {
        top: 38px;
    }
    /* .timeline h3 {
        font-size: 16px;
    } */
    .timeline p {
        padding-top: 20px;
        margin-bottom:0 !important;
    }
    }
    /*——————————————
    others
    ———————————————*/

    .btn-primary, .btn-primary[data-trigger=hover].dropdown-toggle:not(.show) {
        background-color: #a9a9a9; /* #5a8dee; */
        border-color: #a9a9a9; /* #5a8dee; */
    }
    .btn-primary:hover, .btn-primary[data-trigger=hover].show.dropdown-toggle:hover {
        background-color: #a9a9a9 !important; /* #7ba4f1*/
        border-color: #a9a9a9 !important; /* #7ba4f1*/
    }
    .btn-check:focus + .btn-primary, .btn-primary:focus, .btn-primary.focus {
        background-color: #a9a9a9; /*#4d78ca*/
        border-color: #a9a9a9; /* #4d78ca */
    }
    .btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .btn-primary.show.dropdown-toggle, .show > .btn-primary.dropdown-toggle {
        background-color: #a9a9a9 !important; /* #4d78ca */
        border-color: #a9a9a9 !important;/* #4d78ca */
    }
    .menu-item {
        background-color: #ea7024; /*#ea7024;*/
    }
    .search-topbar:focus, .search-topbar:hover,  .input-group-search-topbar:focus, .input-group-search-topbar:hover {
        border: 1px solid #fff !important;
    }
    table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
        top: 0.7rem !important;
    }
    table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
        bottom: 0.5rem !important;
    }
    .table-one-line td, .table-one-line th { white-space: nowrap; text-overflow:ellipsis; }

    .page-item.active .page-link, .page-item.active .page-link:hover, .page-item.active .page-link:focus, .pagination li.active > a:not(.page-link), .pagination li.active > a:not(.page-link):hover, .pagination li.active > a:not(.page-link):focus {
        background-color: #ea7024;
        border-color: #ea7024;
    }