:root {
    --accent: #b0706b;
    --accent-dark: #8d4b45;
    --accent-soft: #f7ebe9;
    --danger: #a00000;
    --danger-dark: #6c0e00;
    --danger-soft: #fbc9c0;
    --layer-one: #f5f6f7;
    --layer-two: #f9fcff;
    --primary: #0080ff;
    --primary-dark: #2f4462;
    --primary-soft: #d8ecf7 ;
    --primary-dark-soft: #cdd8e7;
    --presentation-layer-1: #22395e;
    --secondary: #80869f;
    --secondary-soft: #e3e6ed;
    --secondary-dark: #141824;
    --success: #178f8f;
    --success-dark: #075454;
    --success-soft: #c1e5e5;
    --warning: #ffc107;
    --warning-dark: #614503;
    --warning-soft: #ffe9aa;
}

@font-face {
    font-family: Lato;
    src: url(Lato-Regular.ttf);
}

@font-face {
    font-family: FuturaBook;
    src: url(futura_book_regular.otf);
}

[x-cloak] { display: none !important; }

.tab-item::after{
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--primary);
}

a {
    color: var(--primary);
}

a.active {
    color: var(--primary) !important;
    border-bottom: var(--primary) 1px solid;
}

body {
    font-family: Lato, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: FuturaBook, sans-serif;
}

.bg-accent, .bg-accent-hover:hover {
    background-color: var(--accent) !important;
}

.bg-accent-dark, .bg-accent-dark-hover:hover {
    background-color: var(--accent-dark) !important;
}

.bg-accent-soft, .bg-accent-soft-hover:hover {
    background-color: var(--accent-soft) !important;
}

.bg-danger, .bg-danger-hover:hover {
    background-color: var(--danger) !important;
}

.bg-danger-dark, .bg-danger-dark-hover:hover {
    background-color: var(--danger-dark) !important;
}

.bg-danger-soft, .bg-danger-soft-hover:hover {
    background-color: var(--danger-soft) !important;
}

.bg-layer-one, .bg-layer-one-hover:hover {
    background-color: var(--layer-one) !important;
}

.bg-layer-two, .bg-layer-two-hover:hover {
    background-color: var(--layer-two) !important;
}

.bg-primary, .bg-primary-hover:hover {
    background-color: var(--primary) !important;
}

.bg-primary-dark, .bg-primary-dark-hover:hover {
    background-color: var(--primary-dark) !important;
}

.bg-primary-soft, .bg-primary-soft-hover:hover {
    background-color: var(--primary-soft) !important;
}

.bg-primary-dark-soft, .bg-primary-dark-soft-hover:hover {
    background-color: var(--primary-dark-soft) !important;
}

.bg-presentation-layer-1, .bg-presentation-layer-1-hover:hover {
    background-color: var(--presentation-layer-1) !important;
}

.bg-secondary, .bg-secondary-hover:hover {
    background-color: var(--secondary) !important;
}

.bg-secondary-soft, .bg-secondary-soft-hover:hover {
    background-color: var(--secondary-soft) !important;
}

.bg-secondary-dark, .bg-secondary-dark-hover:hover {
    background-color: var(--secondary-dark) !important;
}

.bg-success, .bg-success-hover:hover {
    background-color: var(--success) !important;
}

.bg-success-dark, .bg-success-dark-hover:hover {
    background-color: var(--success-dark) !important;
}

.bg-success-soft, .bg-success-soft-hover:hover {
    background-color: var(--success-soft) !important;
}

.bg-warning, .bg-warning-hover:hover {
    background-color: var(--warning) !important;
}

.bg-warning-dark, .bg-warning-dark-hover:hover {
    background-color: var(--warning-dark) !important;
}

.bg-warning-soft, .bg-warning-soft-hover:hover {
    background-color: var(--warning-soft) !important;
}

.btn-danger {
    background: var(--danger) !important;
    color: white !important;
}

.btn-danger-outlined {
    background: white !important;
    color: var(--danger) !important;
    border: solid 1px var(--danger) !important;
}

.btn-danger-outlined:hover {
    background: var(--danger) !important;
    color: white !important;
}

.btn-primary {
    background: var(--primary) !important;
    color: white !important;
}

.btn-primary-dark {
    background: var(--primary-dark) !important;
    color: white !important;
}

.btn-primary-dark-outlined {
    background: white !important;
    color: var(--primary-dark) !important;
    border: solid 1px var(--primary-dark) !important;
}

.btn-primary-dark-outlined:hover {
    background: var(--primary-dark) !important;
    color: white !important;
}

.card {
    border: .5px #e6e9f1 solid !important;
    box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15) !important;
    background-color: #ffffff !important;
}

.border-accent, .border-accent-hover:hover {
    border-color: var(--accent) !important;
}

.border-danger, .border-danger-hover:hover {
    border-color: var(--danger) !important;
}

.border-danger-dark, .border-danger-dark-hover:hover {
    border-color: var(--danger-dark) !important;
}

.border-danger-soft, .border-danger-soft-hover:hover {
    border-color: var(--danger-soft) !important;
}

.border-layer-one, .border-layer-one-hover:hover {
    border-color: var(--layer-one) !important;
}

.border-layer-two, .border-layer-two-hover:hover {
    border-color: var(--layer-two) !important;
}

.border-primary, .border-primary-hover:hover {
    border-color: var(--primary) !important;
}

.border-primary-dark, .border-primary-dark-hover:hover {
    border-color: var(--primary-dark) !important;
}

.border-primary-soft, .border-primary-soft-hover:hover {
    border-color: var(--primary-soft) !important;
}

.border-presentation-layer-1, .border-presentation-layer-1-hover:hover {
    border-color: var(--presentation-layer-1) !important;
}

.border-secondary, .border-secondary-hover:hover {
    border-color: var(--secondary) !important;
}

.border-secondary-soft, .border-secondary-soft-hover:hover {
    border-color: var(--secondary-soft) !important;
}

.border-secondary-dark, .border-secondary-dark-hover:hover {
    border-color: var(--secondary-dark) !important;
}

.border-success, .border-success-hover:hover {
    border-color: var(--success) !important;
}

.border-success-dark, .border-success-dark-hover:hover {
    border-color: var(--success-dark) !important;
}

.border-success-soft, .border-success-soft-hover:hover {
    border-color: var(--success-soft) !important;
}

.border-bottom-secondary {
    border-bottom: .5px solid var(--secondary-soft) !important;
}

.dropdown-link {
    padding: 4px 4px;
}

.dropdown-link:first-child {
    padding-top: 4px;
}

.dropdown-link:last-child {
    padding-bottom: 4px;
    border: none !important;
}

.form-control.field-disabled {
    color: var(--secondary-dark) !important;
    background-color: var(--secondary-soft) !important;
    cursor: not-allowed;
}

.form-control {
    background-color: #ffffff !important;
}

.form-control:disabled {
    color: var(--secondary-dark) !important;
    background-color: var(--secondary-soft) !important;
    cursor: not-allowed;
}

.form-control:focus {
    outline: none !important;
}

.form-label {
    color: var(--secondary) !important;
    font-size: .75rem !important;
    font-weight: 700 !important;
    /*margin-bottom: 0 !important;*/
}

input:focus {
    outline: none !important;
}

textarea:focus {
    outline: none;
    border: 0;
}

textarea {
    outline: none;
    border: 0;
}

.item-container:first-child {
    padding-top: 0 !important;
}

.item-container:last-child {
    padding-bottom: 0 !important;
}

.item-select:hover {
    background-color: var(--primary-soft);
    cursor: pointer;
}

.item-hover:last-child {
    border: none !important;
}

.nav-link {
    width: 210px;
}

.top-navigation {
    background-color: var(--primary-dark) !important;
    height: 65px;
}

.text-accent, .text-accent-hover:hover {
    color: var(--accent) !important;
}

.text-accent-dark, .text-accent-dark-hover:hover {
    color: var(--accent-dark) !important;
}

.text-accent-soft, .text-accent-soft-hover:hover {
    color: var(--accent-soft) !important;
}

.text-danger, .text-danger-hover:hover {
    color: var(--danger) !important;
}

.text-danger-dark, .text-danger-dark-hover:hover {
    color: var(--danger-dark) !important;
}

.text-danger-soft, .text-danger-soft-hover:hover {
    color: var(--danger-soft) !important;
}

.text-layer-one, .text-layer-one-hover:hover {
    color: var(--layer-one) !important;
}

.text-layer-two, .text-layer-two-hover:hover {
    color: var(--layer-two) !important;
}

.text-primary, .text-primary-hover:hover {
    color: var(--primary) !important;
}

.text-primary-dark, .text-primary-dark-hover:hover {
    color: var(--primary-dark) !important;
}

.text-primary-soft, .text-primary-soft-hover:hover {
    color: var(--primary-soft) !important;
}

.text-presentation-layer-1, .text-presentation-layer-1-hover:hover {
    color: var(--presentation-layer-1) !important;
}

.text-secondary, .text-secondary-hover:hover {
    color: var(--secondary) !important;
}

.text-secondary-soft, .text-secondary-soft-hover:hover {
    color: var(--secondary-soft) !important;
}

.text-secondary-dark, .text-secondary-dark-hover:hover {
    color: var(--secondary-dark) !important;
}

.text-success, .text-success-hover:hover {
    color: var(--success) !important;
}

.text-success-dark, .text-success-dark-hover:hover {
    color: var(--success-dark) !important;
}

.text-success-soft, .text-success-soft-hover:hover {
    color: var(--success-soft) !important;
}

.text-warning-dark, .text-warning-dark-hover:hover {
    color: var(--warning-dark) !important;
}

.text-white, .text-white-hover:hover {
    color: #ffffff !important;
}

.shadow, .shadow-hover:hover {
    box-shadow: 0 7px 14px 0 rgba(65, 69, 88, 0.1), 0 3px 6px 0 rgba(0, 0, 0, 0.07) !important;
}

.shadow-lg, .shadow-hover-lg:hover {
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;
}

.shadow-sm, .shadow-sm-hover:hover {
    box-shadow: 0 0.1875rem 0.1875rem 0 rgba(14,34,56,.07) !important;
}

.drag-disabled {
    opacity: .5;
}

/* Hides arrows (spinner) on a number input field */
.remove-webkit-appearance {
  /* Firefox */
  -moz-appearance:textfield;
}
.remove-webkit-appearance::-webkit-outer-spin-button,
.remove-webkit-appearance::-webkit-inner-spin-button {
  /* Other browsers */
  -webkit-appearance: none;
  margin: 0;
}

.user-select-none {
    user-select: none;
}

/*Small*/
@media (max-width: 767px) {

}

/*Medium*/
@media (min-width: 768px) {

}

/*Large*/
@media (min-width: 992px) {
    .nav-link {
        width: 168px;
    }
}