@font-face {
    font-family: 'Feijoa';
    src: url('#{request.contextPath}/fonts/feijoa/feijoa-medium.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Feijoa';
    src: url('#{request.contextPath}/fonts/feijoa/feijoa-mediumitalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Feijoa';
    src: url('#{request.contextPath}/fonts/feijoa/feijoa-bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Feijoa';
    src: url('#{request.contextPath}/fonts/feijoa/feijoa-display.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --color-light-blue: #D1F9F1;
    --color-dark-blue-600: #0B2128;
    --color-dark-blue-500: #133844;
    --color-dark-blue-400: #1C5264;
    --color-dark-blue-300: #216278;
    --color-crest-600: #e4683a;
    --color-crest-500: #FD8153;
    --color-crest-400: #FF9D71;
    --color-crest-light: #FFE2C8;
    --color-light-cherry: #F2CAD8;
    --color-light-indigo: #EBEDFB;

    --color-slate-1: #ECEEF1;
    --color-slate-2: #B5BDC8;
    --color-slate-3: #546072;
    --color-slate-4: #232830;
}

/* Fonts */

.theme-pace h1 {
    font-family: 'Feijoa', serif !important;
}

.theme-pace .local-header .title {
    font-family: 'Feijoa', serif !important;
}

.theme-pace .local-header {
    background-color: var(--color-dark-blue-500) !important;
}

.theme-pace .local-header .navbar-local {
    border-color: var(--color-dark-blue-500) !important;
    background-color: var(--color-dark-blue-400) !important;
}

.theme-pace .local-header.subtitle .container {
    background-color: var(--color-dark-blue-300) !important;
}

.theme-pace .local-header .navbar-local .nav .nav-item .nav-link {
    &:hover, &:focus {
        background-color: var(--color-dark-blue-600) !important;
    }
    border-color: var(--color-dark-blue-500) !important;
    background-color: var(--color-dark-blue-400) !important;
}

.theme-pace .local-header .navbar-local .nav .nav-item.active .nav-link {
    background-color: var(--color-dark-blue-300) !important;
}

.theme-pace .local-footer {
    background-color: var(--color-dark-blue-500) !important;
    a {
        color: var(--color-light-blue) !important;
    }
}

.theme-pace h2 {
    color: var(--color-dark-blue-500) !important;
}

.theme-pace a {
    color: var(--color-crest-500);
}

.theme-pace .vertical-menu {
    color: var(--color-dark-blue-500) !important;
}

.theme-pace .vertical-menu a {
    color: var(--color-dark-blue-500) !important;
}

.theme-pace .vertical-menu li span {
    font-weight: bold;
}




.theme-pace .well {
    background-color: var(--color-light-indigo) !important;
    border-radius: 4px;
}

.theme-pace .secondary-cta {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAJCAYAAAD6reaeAAAAFElEQVQI12NgYGD4z4AD0FKCGgIASp0I+Mq3Wm0AAAAASUVORK5CYII=) !important;
}

.theme-pace .btn-cta {
    background-color: var(--color-crest-500) !important;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAJCAYAAAD6reaeAAAAFElEQVQI12NgYGD4z4AD0FKCGgIASp0I+Mq3Wm0AAAAASUVORK5CYII=) !important;
    &:hover {
        background-color: var(--color-crest-400) !important;
    }
    color: var(--color-dark-blue-500) !important;
    border-radius: 4px;
    border-color: transparent !important;
}

.theme-pace .btn:focus {
    box-shadow: none !important;
}

.theme-pace .btn-link {
    &.dropdown-toggle {
        &:hover {
            color: var(--color-crest-600) !important;
        }
    }
}

.theme-pace .btn-group .dropdown-menu {
    background-color: #FAFAFA !important;
    a {
        color: var(--color-dark-blue-500) !important;
    }
}

.theme-pace .btn-cta a {
    color: var(--color-light-blue) !important;
}

.theme-pace .btn-secondary {
    background-color: var(--color-dark-blue-500) !important;
    color: white !important;
    border-radius: 4px;
    border-color: transparent !important;
    &:hover {
        background-color: var(--color-dark-blue-400) !important;
    }
}

.theme-pace .ui-tabs .ui-tabs-nav.ui-widget-header li a {
    color: var(--color-dark-blue-500) !important;
}

body.theme-pace {
    color: var(--color-dark-blue-500) !important;
    /*background-color: var(--color-light-blue) !important;*/
}

.theme-pace .dropdown-menu {
    background-color: var(--color-dark-blue-600) !important;
}

.theme-pace .local-header .navbar-local .nav .nav-item .dropdown-menu a {
    border-top-color: var(--color-dark-blue-500) !important;
    &:hover {
        background-color: var(--color-dark-blue-500) !important;
    }
}

.theme-pace table a {
    color: var(--color-dark-blue-300) !important;
}

.theme-pace .table-bordered thead th {
    background-color: var(--color-dark-blue-400) !important;
}