/* based on this: https://www.creative-tim.com/product/paper-dashboard */

:root {
    --primaryColor: #ffa300;
    --secondaryColor: #6c757d;
}
/** {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}*/

button.btn-none {
    border: 0px;
    border-color: transparent;
    background-color: transparent;
    color: var(--color-font);
}

    button.btn-none .fa {
        color: var(--font-icon-inactive-color) !important;
    }
body {
    background-color: var(--workspace-bg-color);
    font-family: var(--font-family);
    -webkit-font-smoothing: antialiased;
}

main {
    padding: 0rem 1rem .15rem 1rem !important;
}

a.pageTitle {
    color:rgba(255,255,255,.95);
}

.bb-1 {
    border-bottom: 1px solid var(--row-border-color) !important;
}

.nav-tabs-navigation {
    text-align: center;
    border-bottom: 1px solid #f1eae0;
    /*margin-bottom: 30px;*/
}

.nav-tabs-navigation .nav > li > a {
    padding-bottom: 10px;
}

.nav > li > a:hover, .nav > li > a:focus {
    background-color: transparent;
}

.nav-tabs > li > a:hover {
    /*border-color: #eee #eee #ddd;*/
}

/*.nav > li > a:focus,*/ 
.nav > li > a:hover {
    text-decoration: none;
    /*background-color: #eee;*/
}

.nav-tabs > li > a {
    border: 0;
    /*color: #a49e93;*/
}

    .nav-tabs > li > a:hover {
        /*color: #66615b;*/
    }

.nav-tabs > li.active > a, 
.nav-tabs > li.active > a:focus
,.nav-tabs > li.active > a:hover
{
    color: inherit !important;
    cursor: default;
    border-bottom: solid 4px #ffa300;
}
    .nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
}

.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.nav-tabs-wrapper {
    display: inline-block;
    margin-bottom: -1px;
    margin-left: 1.25%;
    margin-right: 1.25%;
    position: relative;
    width: auto;
}

a.nav-link.dropdown-toggle:after {
    font-size: 1.5rem;
    vertical-align: .25rem;
}

.tab-pane {
    padding-top:1rem;
    
}



[data-bs-toggle="collapse"].collapsed .if-not-collapsed {
    display: none;
}

[data-bs-toggle="collapse"]:not(.collapsed) .if-collapsed {
    display: none;
}

/*.expandCaret:before */
/*.collapsed .expandCaret*/
[data-bs-toggle='collapse'] .expandCaret:before {
    content: "\f0d7";
    transition: transform 250ms;
    font-family: 'Font Awesome 6 Free';
    /* width: 20px; */
    font-weight: 900;
    display: inline-block;
    font-size: 20px;
    margin-top: -4px;    
    margin-right: .5rem;
    color: rgba(0,0,0,.5);
}
/*.expandCaret.collapsed:before*/
/*.collapsed .expandCaret:before*/
.collapsed .expandCaret:before {
    transform: rotate( -90deg ) !important;
}
/*
.expandCaret {
    transition: transform 250ms;
}

    .expandCaret.down {
        transform: rotate(90deg);
    }*/

.card-body {
    transition: height .25s ease-in-out !important;
}

.card-body p:last-of-type {
    margin-bottom:0px;
}

.card-body .row:first-child .card-subheader {
    margin-top: 0;
}

.partnerActions .card-body .row:first-child .card-subheader {
    margin-top: 2rem;
}

.form-switch .form-check-input {
    margin-left: -2rem;
    margin-right: .8rem;
}

select option:disabled {
    color: gray;
}

nav {
    /*border-bottom: 1px solid rgba(0, 0, 0, 0.125);*/
    /*background-color: #004c97;*/
    background-color: var(--color-etrac-dark);
    position: absolute;
    top: 0px;
    width: 100%;
    padding-top:;
    padding-right: 32px;
    padding-left: 32px;
    color: rgba(256, 256, 256, .95) !important;
}

nav .title {
    color: unset;
}

.navbar-light .navbar-nav .nav-link {
    /*color: #495057 !important;*/
    color: rgba(256, 256, 256, .95);
}

.nav .fa,
button .fa{
    color: rgba(256, 256, 256, .95);
    font-size:1.1rem;
}

    /*button:not([type='reset']) .fa:hover {*/
        /*color: rgba(256, 256, 256, .75);*/
        /*color:#ffa300 ;
    }*/

.nav .fa,
button.btn-outline-primary .fa {
    color:#ffa300;
}

button.btn-outline-secondary .fa {
    color: #6c757d;
    font-size: .9rem;
}
button.btn-outline-secondary:hover .fa {
    color: #fff;
}

.dropdown-toggle:empty::after {
    margin-left: -3px;
    /*margin-top: 10px;*/
    font-size: 1.2rem;
}
.dropdown-toggle:empty:hover::after {
    color: #ffa300;
}
.dropdown-menu {
    left:unset;
    right:0px;
}

.form-control {
    /*background-color: #fffcf5;*/
    color: #212529;  
    border: 1px solid #ddd;
    transition: all 300ms linear;
}

    .form-control:not([readonly]):focus {
        color: #495057;
        background-color: #fff;
        border: 1px solid #CCC5B9;
        outline: 0;
        box-shadow: 0 0 0 0.1rem rgba(204,197,185, .25);
    }
    .form-control[readonly]:focus {
        background-color: #fffcf5;
        border: 1px solid #CCC5B9;
        box-shadow: 0 0 0 0.1rem rgba(204,197,185, .25);
    }

    .form-control:disabled {
        opacity: .6;
        background-color: #f8f9fa;
        border-color: #f8f9fa;
    }

.control-label,
.form-label {
    color: #878787; /*#767676;*/
    font-size: small;
}

input[readonly],
select[readonly],
select.readonly {
    border: none;    
    border-width:1px;
    background-color: #E3E3E3 !important;
    color: #9A9A9A !important;
}

.btn-muted {
    color: #252422;
    background-color: transparent;
    border-color: transparent;
}

    .btn-muted:hover {
        color: #252422;
        background-color: transparent;
        border-color: transparent;
    }

    .btn-muted:focus, .btn-info.focus {
        box-shadow: 0 0 0 0.1rem #25242245;
    }

    .btn-muted.disabled, .btn-muted:disabled {
        color: #252422;
        background-color: transparent;
        border-color: transparent;
    }

    .btn-muted:not(:disabled):not(.disabled):active, .btn-muted:not(:disabled):not(.disabled).active,
    .show > .btn-muted.dropdown-toggle {
        color: #252422;
        background-color: transparent;
        border-color: transparent;
    }

        .btn-muted:not(:disabled):not(.disabled):active:focus, .btn-muted:not(:disabled):not(.disabled).active:focus,
        .show > .btn-muted.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.1rem #25242245;
        }

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: #212529 !important;
    background-color: transparent !important;
    border-color: #21252945 !important;
}

/*.btn-short {
    height: 2rem;
}*/

.btn-outline-primary.btn-on-hover {
    background-color: transparent;
    border-color: transparent;
}

    .btn-outline-primary.btn-on-hover-primary:hover {
        background-color: #212529;
        border-color: #212529;
    }

.btn-outline-secondary.btn-on-hover {
    background-color: transparent;
    border-color: transparent;
}

.btn-outline-secondary.btn-on-hover-primary:hover {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
}




button.btn-borderless {
    border-color: transparent;
    padding-left: .25rem;
    padding-right: .25rem;
    min-width:unset;
}

a.title-link {
    color: rgba(256, 256, 256, .95);
    display: inline;
}
a, a:focus, a:hover {
    color: var(--color-etrac-dark);
}
    a:hover {
        text-decoration: underline;
        color: #ffa300
    }

.table th {
    text-transform: uppercase;
    font-size: smaller;
    color: #212529;
    border-bottom: 1px solid #dee2e6;
    border-top: 0px solid #dee2e6;
    font-family: 'Open Sans',"Arial",sans-serif;
}

    .table th .fa {
        font-size:medium;
    }
    th a {
        text-transform: none;        
        font-size:medium;
        font-weight: normal;
    }

.table-checklist th,
.table-checklist td {
    border-top: 0px;
}

.table-scoped th {
    /*text-transform: uppercase;*/
    font-size: smaller;
    font-weight: bolder;
    /*background-color:#fafafa;*/
    border-bottom: solid 0px rgba(128,128,128,0.2);
    border-top: solid 0px rgba(128,128,128,0.2);
}
.table-scoped th[scope="col"]{
    border-bottom-width:2px
}

    .table-scoped th[scope="row"] {
        border-right: solid 0px rgba(128,128,128,0.2);
        text-align:left;
    }
    .table-scoped tbody th[scope="row"] {
        /*border-left: solid 1px rgba(128,128,128,0.2);*/
    }


.table-scoped th,
.table-scoped td {
    padding: 0.75rem;
    vertical-align: top;
    border-bottom: solid 1px rgba(128,128,128,0.2);
}
        .table-scoped td {
            
        }



input[required] {
    border-width:1px;
}

[required] {
    border-color: #886666;
}

tr:hover td div.actionButtons:not(.disabled) {
    visibility:visible;
}
tr td div.actionButtons {
    visibility: hidden;
}

.under-label {
    color: #878787;
    font-size: 1rem;
    margin-top: -0.3rem;
}

.title {
    /*color: rgba(0,0,0,.7);*/
    /*font-size: larger;*/
    /*font-family: 'Muli', "Helvetica", Arial, sans-serif;*/
}

    .title > .control-label,
    .title > .form-label {
        margin-top: -0.25rem;
    }


.card-header .title {
    color: rgba(0,0,0,.7);
    /*font-family: 'Muli', "Helvetica", Arial, sans-serif;*/
}
.card-subtitle {
    text-transform: capitalize;
    font-weight: 400;
    color: #9a9a9a;
    font-size: .9em;
}

.card-title {
    /*padding: 0.75rem 1.25rem 0rem 1.25rem;*/
    padding: .66rem 1rem;
    margin-bottom: 0px;
    background-color: var(--menu-color);
}
.card-title .title {
    /*font-size: 1.4rem;*/
    font-weight:300;
}

    .card-title .subheading {
        color: rgba(0,0,0,.7);
        font-size: 1.2rem;
        font-weight: 300;
    }



.card-footer {
    background-color: unset !important;
}

.btn {
    border-radius: 30px;
    min-width:5rem;    
}

.dropdown-toggle-split {
    min-width:.5rem !important;
}

.dropdown-toggle {
    border-radius: 0.25rem;
    /*height: calc(2.25rem + 2px);*/
    padding: .4rem .75rem;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #ffb651;
}

.dropdown-item.disabled {
    color:#cccccc;
}


.page-item:first-child .page-link {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border: 1px;
}

.page-item:last-child .page-link {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}


.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #ffa300;
    border-color: #ffa300;
}
.page-link {
    color: #212529;
    background-color: #fff;
    border: 0px solid #ffa300;
    transition: all 300ms ease;
}
    .page-link:hover {
        color: #fff;
        background-color: #ffb651;
        border-color: #ffb651;
        box-shadow: 0 0px 0px .1rem rgba(255, 163, 0, 0.5);
    }

.card {
    border-radius: 3px;
    /*border: 1px solid transparent;*/
    /*box-shadow: 0 2px 2px rgba(204, 197, 185, 0.5);*/
    /*box-shadow: 0 6px 10px -4px rgba(0,0,0,.15);*/
    background-color: #FFFFFF;
    color: #252422;
    margin-bottom: 0px;
    margin-top: 20px;
    position: static;
    /*z-index: 1;*/
    transition: transform .3s cubic-bezier(.34,2,.6,1),box-shadow .2s ease;
}


    .card.card-transparent {
        border: 1px solid transparent;
        background-color: transparent;
        box-shadow: 0 0px 0px 0px;
    }

    .card.card-list-item {
        border: 1px solid transparent;
        box-shadow: 0 0px 0px 0px;
        margin-top: 0rem;
    }

    .card.card-list-item .card-body {
        padding: .5rem 1rem;
    }


    .card.card-list-item:not(:last-child) {
        border-bottom:1px solid var(--row-border-color);
    }

main .card.card-information { /*Card infos that appear outside of another .card*/
    background-color: #fff;
}

main .card .card.card-information { /*Cards infos appear within of another .card*/
    background-color: rgba(192,192,192,.15);
    margin: 2rem;
}

.card.card-information {
    
    box-shadow: 0 0px 0px 0px;
    /*border: 1px solid transparent;*/
    border-radius: 16px;
}
/*    .card.card-information.right-edge {
        position: absolute;
        right: 1rem;
        max-width: calc(var(--main-container-max-width) * .2);
        border-radius: 6px;
    }*/

.card-header, .card-header:first-child {
    background-color: transparent;
    border-bottom: 0px solid rgba(0, 0, 0, 0.125);
    /*border-radius: 6px;*/
    background-color: var(--menu-color);
}

.card-title .title.collapsed {
    padding-bottom: .75rem;
}

.table thead th {
    border-bottom: 0px solid #dee2e6;
}

.navbar-right .nav-item:last-child {
    margin-right: 0rem;
}
.navbar .navbar-brand {
    font-weight: 600;
    margin: 5px 0px;
    /*padding: 20px 15px;*/
    font-size: 20px;    
}

.main-logo {
    width: 325px;
}

@media (min-width: 992px) {
    .main-logo {
        width: 525px;
    }
}
.nav-link:focus {
    outline: 0px dotted;
    outline: 0px auto -webkit-focus-ring-color;
}

.navbar {
    padding: 0.625rem 0rem .35rem 0rem;
}
.navbar-default .navbar-brand {
    color: #777;
}

.navbar-brand {
    /*float: left;*/
    /*height: 50px;*/
    /*padding: 15px 15px;*/

}


    .navbar-brand img {
        margin-right: .5em;
        /*margin-top: -.25em;*/
    }

.nav-link.title {
    overflow:hidden;
    white-space: nowrap;
}



.navbar button:focus {
    outline: 0px dotted;
    outline: 0px auto -webkit-focus-ring-color;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, .navbar, .brand, a, .td-name, td {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    /*font-family: 'Muli', "Helvetica", Arial, sans-serif;*/
}

.category,
.card-category {
    text-transform: capitalize;
    font-weight: 400;
    color: #9A9A9A;
    font-size: 0.7142em;
}

.card-category {
    font-size: 1em;
}
.card .numbers {
    font-size: 1.25em;
    text-align: right;
}



/*.btn-primary {
    border: none;
    background-color: #00a19a;
    color: #fff;
}

    .btn-primary:hover {
        background-color: #007473 !important;
    }*/


.btn {
    border-radius: 4px;
}

.btn-primary {
    background-color: #ffa300;
    border-color: #ffa300;
    color: white;
    /*font-weight: bold;*/
    
}

    .btn-primary:hover {
        background-color: #ffb651 !important;
        border-color: #ffb651 !important;
    }

.btn-outline-primary {
    background-color: transparent;
    border-color: #ffa300;
    color: #ffa300;
}

    .btn-outline-primary:hover:not(:disabled),
    .btn-group .dropdown-item:hover {
        background-color: #ffb651;
        border-color: #ffb651;
        color: #fff;
    }
    .btn-outline-primary:disabled {
        color: #212529;
    }

    .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle {
        background-color: #ffb651;
        border-color: #ffb651;
        color: #fff;
    }
    

    .btn-danger:disabled {
        background-color: var(--color-disabled);
        border-color: var(--color-disabled);
    }

    .btn-danger:hover {
        background-color: #d47c58;
    }

.btn-outline-success:focus,
.btn-outline-success:focus-within,
.btn-outline-success:focus-visible,
.btn-outline-danger:focus,
.btn-outline-danger:focus-within,
.btn-outline-danger:focus-visible {
    box-shadow: none;
    color: unset;
}

.btn-outline-success.toggle,
.btn-outline-danger.toggle,
.btn-borderless{
    border-color: transparent;
    border-radius: 1px;
}
.btn-outline-success.toggle,
.btn-outline-danger.toggle {
    color: rgba(0, 0, 0, .7);
    padding-right: 0px;
    background-color: transparent;
}
    .btn-outline-success.toggle:focus,
    .btn-outline-danger.toggle:focus {
        box-shadow: none;
    }

    .btn-outline-success i,
    .btn-outline-danger i {
        /*color: var(--color-danger);*/
        margin-right: .5rem;
        margin-left: .5rem;
    }

    .btn-outline-success i:before,
    .btn-outline-danger.btn-remove i:before {
        content: "\f0c8"; /*unchecked*/
    }

.btn-outline-success.toggle:not(:[data-state="on"]) i.fa-regular:before
.btn-outline-danger.toggle:not(:[data-state="on"]) i.fa-regular:before {
    content: "\f0c8"; /*unchecked*/
}

.btn-outline-success.toggle:hover,
.btn-outline-success.toggle:hover i.fa-regular {
    color: var(--color-success);
    background-color: transparent;
}

.btn-outline-danger.toggle:not(:disabled):hover,
.btn-outline-danger.toggle:not(:disabled):hover i.fa-regular {
    color: var(--color-danger);
    /*border-color: var(--color-danger);*/
    background-color: transparent;
}

.btn-outline-success.toggle[data-state="on"] {
    color: var(--color-success);
}
.btn-outline-danger.toggle[data-state="on"] {
    color: var(--color-danger);
}

    .btn-outline-success.toggle[data-state="on"] i.fa-regular {
        color: var(--color-success);
    }
    .btn-outline-danger.toggle[data-state="on"] i.fa-regular {
        color: var(--color-danger);
    }
        .btn-outline-success.toggle[data-state="on"] i.fa-regular:before,
        .btn-outline-danger.toggle[data-state="on"] i.fa-regular:before {
            content: "\f14a" !important; /*checked*/
        }



.btn-outline-success:hover i:before,
.btn-outline-danger.btn-remove:hover i:before {
    content: "\f14a"; /*checked*/
}

.btn-outline-success.toggle[data-state="on"]:hover i:before
.btn-outline-danger.toggle[data-state="on"]:hover i:before {
    content: "\f0c8"; /*unchecked*/
}

.btn-light {
    background-color: #ffffff;
    border: 1px solid #CCC5B9;
}

    .btn-light:hover {
        background-color: #eeebe4;
    }

.btn-primary:focus, .btn-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(81, 203, 206, .5);
}

.searchbox {
    background-color: rgba(255,255,255,.15);
    border: 0px solid #ced4da;
    border-radius: 0.25rem;
}

    .searchbox::placeholder {
        color: rgba(255,255,255,.85);
    }

    .searchbox .fa {
        color: rgba(255,255,255,.85);
    }

.badge {
    font-weight: 700;
    border: 1px solid transparent;
    color: #fff;
}

    .badge.badge-success {
        background-color: #7ed6a5;
        border: 1px solid #7ed6a5;
    }

    .badge.badge-primary {
        border: 1px solid #65d1d4;
        background-color: #65d1d4;
    }

    .badge.badge-info {
        /*border: 1px solid #66c4de;   
        background-color: #66c4de;*/
        border: 1px solid #007473;
        background-color: #007473;
    }

    .badge.badge-warning {
        border: 1px solid #F3BB45;
        background-color: #F3BB45;
    }

.badge-outline {
    border: 1px solid transparent;
    background-color: transparent;
}

    .badge-outline.badge-success,
    .badge-outline.badge-success i{
        color: #7ed6a5;
        border-color: #7ed6a5;
        background-color: transparent;
    }

    .badge-outline.badge-primary,
    .badge-outline.badge-primary i {
        /*border-color: #65d1d4;
        color: #65d1d4;*/
        border-color: #007473;
        color: #007473;
        background-color: transparent;
    }

    .badge-outline.badge-info,
    .badge-outline.badge-info i {
        border-color: #66c4de;
        color: #66c4de;
        background-color: transparent;
    }

    .badge-outline.badge-danger,
    .badge-outline.badge-danger i {
        border-color: #ef8157;
        color: #ef8157;
        background-color: transparent;
    }

    .badge-outline.badge-warning,
    .badge-outline.badge-warning i {
        border-color: #F3BB45;
        color: #F3BB45;
        background-color: transparent;
    }

.badge-light {
    color: #3d444c;
    background-color: #e0e2e3;
}

.badge.badge-warning {
    border-color: #fbc658;
    background-color: #fbc658;
}

.badge.badge-danger {
    border-color: #ef8157;
    background-color: #ef8157;
}

.badge-danger i {
    color:#fff;
}


.fa-minus-circle {
    margin-left: .75rem;
}
    .fa-minus-circle:hover {
        color: #ee0000 !important;
    }
.fa-plus-circle:hover {
    color: #ef8157;
}

.fa,
.fa-regular,
.fa-solid{
    color: rgba(0,0,0,.5);
}

    .fa:hover,
    .fa-regular:hover,
    .fa-solid:hover {
        color: #ffa300;
    }

.fa-circle-exclamation {
    color: #ffa300;
}

.fa-light {
    color: #fff !important;
}

.fa-large {
    font-size: 2rem !important;
}

.fa-1dot5x {
    font-size: 1.3em !important;
    margin-top: .3rem !important;
}

.fa-info-circle:before {
    display: inline-block;
    /*content: "\f0d7" !important;
    font-size: 1.75rem !important;*/

    content: "\f059" !important;
    font-size: 1rem !important;


}

.fa-info-circle {
    margin-left: .4rem;
    color: var(--color-etrac-light);
    opacity:.6;
    /*margin-bottom: .75rem;*/
}


input.input-group-append-inside {
    border-right-width: 0px;
}

.input-group-text i {
    line-height: 1.5rem;
}

.input-group-prepend + .form-control {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.input-group-prepend .input-group-text{
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}


.input-group-append {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    margin-left: -3px;
}

.input-group-append-inside {
/*    margin-left: -3px;*/
    background-color: transparent;
    border-left-width: 0px;
    ob
}

.input-group-text-inside {
    margin-left: -3px;
    background-color: transparent;
    border-left-width: 0px;
}

.no-border {
    border-width:0px;
}


.helpText {
    /*For small onscreen help text adjacent to form controls*/
    
    font-size:small;
    color: var(--color-secondary);
}

.tooltip {
    pointer-events: none;
}

    .tooltip > .tooltip-inner {
        border: solid 1px darkgray;
        background-color: white;
        color: #212529;
    }

.tooltip > .tooltip-arrow {
    border-bottom-color: lightgray;
}
    .tooltip > .tooltip-arrow
    .tooltip > .tooltip-inner {
        pointer-events: none;
        background-color: lightgray;
        color: #212529;
        max-width: none;
        white-space: normal;
        margin: .75rem;
    }

.bs-tooltip-auto .arrow::before,
.bs-tooltip-bottom .arrow::before {
    border-bottom-color: lightgray;
    color: #212529;
    pointer-events: none;
    /*margin: .75rem;*/
}

.form-control[readonly] ~ .input-group-append .input-group-text {
    border: 0px solid #ced4da;
    border-radius: 0.25rem;
}


.form-control:not([readonly]):focus ~ .input-group-append .input-group-text {
    color: #66615b;
    border-color: #CCC5B9;
    outline: 0;
    box-shadow: 0 0 0 0.1rem rgba(204,197,185, .25);
    border-left: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border: 1px solid #CCC5B9;
}

    .input-group-append .input-group-text {
        /*border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border: 1px solid #CCC5B9;
        border-left-color: #ced4da;*/
    }

.card[data-background-color="blue"] {
    background-color:#b8d8d8;
}

    .card[data-background-color="blue"] .card-header,
    .card[data-background-color="blue"] .card-body {
        color: #fff;
    }

input[type="radio"],
input[type="checkbox"]:not([role="switch"]) {
    box-sizing: border-box;
    padding: 0;
    background-color: #fffcf5;
    color: #212529;
    /* font-size: 14px; */
    /* transition: background-color 0.3s ease 0s; */
    border: 1px solid #ddd;
    transition: all 300ms linear;
    display: inline-block;
    margin-left: .3rem;
    margin-right: .75rem;
    width: auto;
    height: auto;
    /*height: calc(2.25rem + 2px);*/
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    -ms-transform: scale(1.5) translateY(5%); /* IE */
    -moz-transform: scale(1.5) translateY(5%); /* FF */
    -webkit-transform: scale(1.5) translateY(5%); /* Safari and Chrome */
    -o-transform: scale(1.5) translateY(5%); /* Opera */
    transform: scale(1.5) translateY(5%);
    /*padding: 10px;*/
}
input[type="checkbox"][role="switch"] {
    -ms-transform: scale(1.25); /* IE */
    -moz-transform: scale(1.25); /* FF */
    -webkit-transform: scale(1.25); /* Safari and Chrome */
    -o-transform: scale(1.25); /* Opera */
    transform: scale(1.25);
}

    input[type="checkbox"]:checked {
        accent-color: var(--color-etrac-light);
    }

    input[type="checkbox"]:hover {
        border-color: var(--color-highlight);
    }
    /* width */
    ::-webkit-scrollbar {
        width: 8px;
    }

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 4px;
    border: 2px solid transparent;
    /*background-clip: padding-box;*/
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}

@media (min-width: 576px) {
    .address:not(.street):not(.state) {
        padding-left: 8px;
        padding-right: 8px;
    }

    .address.street {
        padding-left: 15px;
        padding-right: 8px;
    }

    .address.state {
        padding-left: 8px;
        padding-right: 15px;
    }
}

.stat-hist-label:before {
    display: inline-flex;
    content: "";    
    cursor: pointer;
    background-position: center;
    height: 2.5rem;
    width: 10.5rem;
    background-size: 2.5rem 2.5rem;
    margin-left: -.325rem;
    justify-content: center;
    align-content:end;
}

.stat-hist-label:hover {
    color:var(--color-highlight);
}
.stat-hist-label.collapsed:before {
    background: url("/images/flaticon/svg/chevrons-down.svg") no-repeat;
    background-size: 2.5rem 2.5rem;
    content: "show more";
    align-content: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.stat-hist-label:before {
    background: url("/images/flaticon/svg/chevrons-up.svg") no-repeat;
    background-size: 2.5rem 2.5rem;
    content: "show less";
    align-content: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.timeline {
    list-style: none;
    position: relative;
}

    .timeline:before {
        top: 1rem;
        bottom: 1rem;
        position: absolute;
        content: " ";
        width: 4px;
        background-color: #e3e3e3;
        margin-left: -3px;
        background-color: var(--color-success);
        height: calc(100% - 1rem);
        left: 1rem;
    }

.timeline > li > .timeline-badge {
    color: #fff;
    width: 40px;
    height: 40px;
    line-height: 36px;
    font-size: 14em;
    text-align: center;
    position: absolute;
    top: 16px;
    left: 0;
    margin-left: -25px;
    background-color: #9a9a9a;
    z-index: 100;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
}
.tl-item {
    border: 2px solid var(--color-success);
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    background-color: #e8e7e3;
    width: 28px;
    height: 28px;
    line-height: 1.5rem;
}

    .tl-item.fa:before {
        margin-top: -5px;
    }

.button-append {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-left-width: 0px;
    margin-left: -3px;
    padding-left:.25rem;
    padding-right:0px;
    min-width:1.5rem;
}