body {
    font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

h1 {
    color: #36485e;
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
    font-family: 'Roboto', sans-serif;
    /*
    font-size: 1.85rem;
    text-transform: uppercase;
    font-weight: 600;
        */
}

.form-group {
    margin-bottom: 1.5rem;
}

.title, h2, .h2 {
    font-family: 'Roboto', sans-serif;
    color: #36485e;
    text-transform: none;
    font-size: 1.75rem;
}

h3, .h3 {
    font-family: 'Roboto', sans-serif;
    color: #434a54;
    font-size: 1.2rem;
}

.bg-light {
    background-color: #e6e9ee !important;
}

.border-light {
    border-color: #e6e9ee !important;
}

/* LINKS */
a {
    color: #36485e;
    text-decoration: none;
    background-color: transparent;
}

    a:hover {
        color: #3e699e;
        text-decoration: none;
    }

    a.link {
        color: #3599db;
    }

        a.link:hover {
            text-decoration: underline;
        }

.text-sm {
    font-size: .9rem;
}

.text-muted {
    color: #909091 !important;
}

.text-strike {
    text-decoration: line-through;
}

.text-underline {
    text-decoration: underline;
}

.text-underline-hover:hover {
    text-decoration: underline;
}

.cursor-pointer {
    cursor: pointer
}

.display-5 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
}

.display-6 {
    font-size: 2rem;
    font-weight: 300;
    line-height: 1.2;
}

/* Tables */


.table thead th {
    vertical-align: top;
}

/* LISTS */
ol, ul, dl {
    margin-bottom: 0;
}

/* COLORS */
.text-primary {
    color: #3598db !important;
}

a.text-primary:hover,
a.text-primary:focus {
    color: #2c7fb6 !important;
}

.text-secondary {
    color: #1cba9b !important;
}

a.text-secondary:hover,
a.text-secondary:focus {
    color: #16a086 !important;
}


/* BORDERS */

/*.border {
    border-color: #ababab !important;
}*/

.border-primary {
    border-color: #467187 !important;
}

/* BUTTONS */
.btn {
    border-radius: 0.15rem;
    cursor: pointer;
}

.btn-full-width {
    width: 100%;
}

/* primary */
.btn-primary {
    background-color: #3598db;
    border-color: #2c7fb6;
}

.btn-outline-primary {
    color: #2c7fb6;
    background-color: #fff;
    border-color: #2c7fb6;
}

    .btn-primary:hover,
    .btn-outline-primary:hover,
    .btn-primary:active,
    .btn-outline-primary:active {
        background-color: #2c7fb6 !important;
        border-color: #2c7fb6 !important;
    }

.bg-primary {
    background-color: #3598db !important;
}

/* secondary */
.btn-secondary {
    background-color: #1cba9b;
    border-color: #16a086;
}

.btn-outline-secondary {
    color: #16a086;
    background-color: #fff;
    border-color: #16a086;
}

    .btn-secondary:hover,
    .btn-outline-secondary:hover,
    .btn-secondary:active,
    .btn-outline-secondary:active {
        background-color: #16a086 !important;
        border-color: #16a086 !important;
    }

.bg-secondary {
    background-color: #1cba9b !important;
}

/* success */
.btn-success {
    background-color: #9a58b5;
    border-color: #8c44ad;
}

.btn-outline-success {
    color: #8c44ad;
    background-color: #fff;
    border-color: #8c44ad;
}

    .btn-success:hover,
    .btn-outline-success:hover {
        background-color: #8c44ad;
        border-color: #8c44ad;
    }

.bg-success {
    background-color: #9a58b5 !important;
}

/* danger */
.btn-danger {
    background-color: #e84c3d;
    border-color: #c13a2b;
}

.btn-outline-danger {
    color: #c13a2b;
    background-color: #fff;
    border-color: #c13a2b;
}

    .btn-danger:hover,
    .btn-outline-danger:hover {
        background-color: #c13a2b;
        border-color: #c13a2b;
    }

.bg-danger {
    background-color: #e84c3d !important;
}

/* warning */
.btn-warning {
    background-color: #e67f22;
    color: #fff;
    border-color: #d25400;
}

.btn-outline-warning {
    color: #d25400;
    background-color: #fff;
    border-color: #d25400;
}

.btn-warning:hover {
    color: #fff;
    background-color: #d25400;
    border-color: #d25400;
}

.btn-outline-warning:hover {
    background-color: #d25400;
    border-color: #d25400;
}

.bg-warning {
    background-color: #e67f22 !important;
}

/* light */
.btn-light {
    color: #7d8c8d;
    background-color: #fff;
    border-color: #7d8c8d;
}

.btn-outline-light {
    color: #7d8c8d;
    background-color: #fff;
    border: 1px dashed #7d8c8d;
}

    .btn-light:hover,
    .btn-outline-light:hover,
    .btn-light:active,
    .btn-outline-light:active {
        color: #fff !important;
        background-color: #7d8c8d !important;
        border: 1px solid #7d8c8d !important;
    }


/* BREADCRUMBS */
.breadcrumb {
    padding: 0;
    background: none;
    border-radius: unset;
    margin-bottom: 1.75rem;
    width: 100vw;
    flex-wrap: nowrap;
    max-width: 100%;
    font-family: 'Roboto', sans-serif;
}

.breadcrumb-item {
    display: block;
    background-color: #e6e9ee;
    text-decoration: none;
    position: relative;
    height: 36px;
    line-height: 36px;
    padding: 0 1rem;
    text-align: center;
    margin-right: 23px;
    white-space: nowrap;
}

    .breadcrumb-item + .breadcrumb-item::before {
        display: inline-block;
        padding-right: 0.5rem;
        color: #70747b;
        content: "";
    }

a.breadcrumb-item:hover {
    background-color: #ccd0d9;
}

    a.breadcrumb-item:hover:before {
        border-color: #ccd0d9;
        border-left-color: transparent;
    }

    a.breadcrumb-item:hover:after {
        border-left-color: #ccd0d9;
    }

div.breadcrumb-item {
    cursor: default;
}

.breadcrumb-item:before, .breadcrumb-item:after {
    content: "";
    position: absolute;
    top: 0;
    border: 0 solid #e6e9ee;
    border-width: 18px 10px;
    width: 0;
    height: 0;
}

.breadcrumb-item:before {
    left: -20px;
    border-left-color: transparent;
}

.breadcrumb-item:first-child {
    -moz-border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px 0 0 4px;
}

    .breadcrumb-item:first-child:before,
    .breadcrumb-item:last-child:after {
        border: none;
    }

.breadcrumb-item:last-child {
    -moz-border-radius: 0 4px 4px 0;
    -webkit-border-radius: 0;
    border-radius: 0 4px 4px 0;
}

.breadcrumb-item:after {
    left: 100%;
    border-color: transparent;
    border-left-color: #e6e9ee;
}


/**** DROPDOWN CUSTOMIZATIONS ****/
@media all and (min-width: 1200px) {
    /* MEGAMENU */
    .navbar .has-megamenu {
        position: static !important;
    }

    .navbar .megamenu {
        left: 0;
        right: 0;
        width: 100%;
        padding: 20px;
        margin: 0;
    }

    .navbar .nav-link {
        padding-top: 1rem;
        padding-bottom: 1rem;
        font-family: 'Roboto', sans-serif;
    }
}

/**** END DROPDOWN CUSTOMIZATIONS ****/


.form-check {
    padding-left: 1.5rem;
}

    .form-check .form-check-input {
        margin-top: .25rem;
        margin-left: -1.5rem;
    }

input[type="checkbox"] {
    transform: scale(1.3);
    -webkit-transform: scale(1.3);
}

.checkbox-2x {
    transform: scale(2) !important;
    -webkit-transform: scale(2) !important;
}

.popover-trigger {
    cursor: pointer;
}

.badge {
    font-weight: normal;
}

.badge-lg {
    padding: .5em .6em;
    font-size: .9em;
}

/* Used to show that something (attributes) are managed on the platform level */
.badge-platform {
    background-color: #517bba;
    color: #fff;
}

.badge-outline-platform {
    border: solid 1px #517bba;
    background-color: #fff;
    color: #111;
}

/* Used to show that something (attributes) were created by a non-FDN business */
.badge-business-data {
    background-color: #6e6e6e;
    color: #fff;
}

.badge-outline-business-data {
    border: solid 1px #6e6e6e;
    background-color: #fff;
    color: #111;
}

.badge-success {
    background-color: #2b967c;
}

.badge-outline-success {
    border: solid 1px #2b967c;
    color: #2b967c;
}

.badge-warning {
}

.badge-outline-warning {
    border: solid 1px #ffc107;
    color: #444;
}


/*
@media (min-width: 768px) {
    .container-small {
        width: 300px;
    }

    .container-large {
        width: 970px;
    }
}

@media (min-width: 992px) {
    .container-small {
        width: 500px;
    }

    .container-large {
        width: 1170px;
    }
}

@media (min-width: 1200px) {
    .container-small {
        width: 500px;
    }

    .container-large {
        width: 1500px;
    }
}

.container-small, .container-large {
    max-width: 100%;
}*/


.container-small, .container-medium, .container-large {
    max-width: 100%;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

.container-xs-gutter {
    width: 96.5%;
}

@media (min-width: 500px) {
    .container-small, .container-medium {
        width: 500px;
    }
}

@media (min-width: 768px) {
    .container-small, .container-medium {
        width: 500px;
    }

    .container-large {
        width: 970px;
    }

    .offcanvas-collapse {
        max-width: 25rem;
        border-left: 1px solid #dee2e6 !important;
    }

    .btn-full-width {
        width: auto;
    }
}

@media (min-width: 992px) {
    .container-small {
        width: 500px;
    }

    .container-medium {
        width: 700px;
    }

    .container-large {
        width: 1170px;
    }
}

@media (min-width: 1200px) {
    .container-small {
        width: 500px;
    }

    .container-large {
        width: 1500px;
    }
}


/* Custom Off Canvas thing (NOT FROM BOOTSTRAP 5) */
.offcanvas-collapse {
    position: fixed;
    bottom: 0;
    width: 100%;
    right: -100%;
    overflow-y: auto;
    background-color: #fff;
    transition: right .35s ease-in-out;
    z-index: 1041;
}

    .offcanvas-collapse.open {
        right: 0;
    }

.offcanvas-collapse,
.modal-backdrop--offcanvas {
    top: 71px; /* Height of navbar */
}


/*https://www.joshwcomeau.com/shadow-palette/*/
:root {
    --shadow-color: 0deg 0% 0%;
    --shadow-elevation-low: 0.3px 1px 1.2px hsl(var(--shadow-color) / 0.1), 0.5px 1.6px 1.9px -1.2px hsl(var(--shadow-color) / 0.1), 1.1px 4px 4.7px -2.5px hsl(var(--shadow-color) / 0.1);
    --shadow-elevation-medium: 0.3px 1px 1.2px hsl(var(--shadow-color) / 0.11), 0.9px 3.3px 3.8px -0.8px hsl(var(--shadow-color) / 0.11), 2.3px 8.2px 9.6px -1.7px hsl(var(--shadow-color) / 0.11), 5.6px 19.9px 23.3px -2.5px hsl(var(--shadow-color) / 0.11);
    --shadow-elevation-high: 0.3px 1px 1.2px hsl(var(--shadow-color) / 0.1), 1.6px 5.8px 6.8px -0.4px hsl(var(--shadow-color) / 0.1), 3.1px 10.8px 12.6px -0.7px hsl(var(--shadow-color) / 0.1), 5px 17.8px 20.8px -1.1px hsl(var(--shadow-color) / 0.1), 8px 28.4px 33.2px -1.4px hsl(var(--shadow-color) / 0.1), 12.6px 44.4px 51.9px -1.8px hsl(var(--shadow-color) / 0.1), 19.1px 67.4px 78.8px -2.1px hsl(var(--shadow-color) / 0.1), 28.1px 99.3px 116.1px -2.5px hsl(var(--shadow-color) / 0.1);
}

.shadow-elevation-low {
    box-shadow: var(--shadow-elevation-low);
}

.shadow-elevation-medium {
    box-shadow: var(--shadow-elevation-medium);
}

.shadow-elevation-high {
    box-shadow: var(--shadow-elevation-high);
}