/** Adjust Bootstrap variable to match the 1rem = 10px base size **/
:root {
    --bs-body-font-size: 1.6rem;
}

body .container,
body .container-fluid,
body .container-lg,
body .container-md,
body .container-sm,
body .container-xl,
body .container-xxl {
    --bs-gutter-x: 2.4rem;
}

body .row,
body .row > * {
    --bs-gutter-x: 2.4rem;
}

body .card {
    --bs-card-spacer-y: 1.6rem;
    --bs-card-spacer-x: 1.6rem;
}

body .list-group,
body .list-group-item {
    --bs-list-group-border-radius: 0.6rem;
    --bs-list-group-item-padding-x: 1.6rem;
    --bs-list-group-item-padding-y: 0.8rem;
}

body .nav-tabs,
body .nav-tabs > * {
    --bs-nav-tabs-border-width: 1.6px;
    --bs-nav-tabs-border-radius: 0.6rem;
    padding-bottom: 0;
}

body .nav,
body .nav > * {
    --bs-nav-link-padding-x: 1.6rem;
    --bs-nav-link-padding-y: 0.8rem;
}

/* OIC colors and theme */
html {
    font-size: 10px;
    background: #fff;
}

body {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.6rem !important;
    font-weight: 400;
    color: #000;
    position: relative;
    background: #FFF;
}
    body p {
        font-size: 1.6rem;
        font-family: 'Open Sans';
        color: #223E4D;        
    }

    body a:hover,
    body .nav-link:hover {
        text-decoration: none;
    }

    body .visually-hidden.skip-link.focusable:focus {
        position: static !important;
        overflow: visible;
        clip: auto;
        width: auto;
        height: auto;
    }

    body footer.site-footer {
        padding: 0;
    }

        body footer.site-footer .block {
            border: none;
        }

        body footer.site-footer .wrapper-footer-top h2 {
            color: #fff;
        }

        body footer.site-footer .wrapper-footer-bottom .block {
            margin: 0.8rem 0;
        }

        body footer.site-footer .wrapper-footer-bottom p {
            margin: 0;
            text-align: center;
        }

    body a:focus,
    body input:focus,
    body .form-control:focus,
    body button:focus,
    body .btn:focus {
        outline: 2.5px #4BA63A solid;
    }

    body a:hover,
    body .nav-link:hover {
        text-decoration: none !important;
    }

    body .row,
    body .row > * {
        --bs-gutter-x: inherit;
    }

    body .notransform {
        transform: none !important;
    }

    body #page,
    body #main-wrapper,
    body ul.list-group {
        background: #FFF !important;
        --bs-list-group-bg: #FFF;
    }

    body .region-header-start {
        width: 100%;
    }

    body .visually-hidden.skip-link.focusable:focus {
        position: static !important;
        overflow: visible;
        clip: auto;
        width: auto;
        height: auto;
        background-color: #fff;
        color: #0368c0;
    }

    body a {
        color: #337728;
    }

        body a:hover {
            color: #337728;
        }

@media screen and (max-width: 767px) {
    body p {
        line-height: 2.4rem;
        margin-bottom: 3rem;
    }
}

body .small {
    font-size: 1.3rem;
}

body .large {
    font-size: 2.3rem;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body .h1,
body .h2,
body .h3,
body .h4,
body .h5,
body .h6 {
    font-weight: 700;
    color: #1A1C1E;
    font-family: 'Open Sans', sans-serif;
}

body h1.title {
    padding-top: 5px;
}

body h1,
body .h1 {
    font-size: 4rem;
    color: #005A8B;
    margin-bottom: 0.8rem;
}

@media screen and (max-width: 767px) {
    body h1,
    body .h1 {
        font-size: 2.9rem;
        margin-bottom: 2.4rem;
        margin-top: 0;
        padding-top: 0;
        line-height: 3rem;
    }
}

body h2,
body .h2 {
    font-size: 3.4rem;
    margin-bottom: 1.2rem;
}

@media screen and (max-width: 767px) {
    body h2,
    body .h2 {
        font-size: 2.4rem;
        margin-bottom: 1rem;
        margin-top: 0;
        padding-top: 0;
        line-height: 3.6rem;
    }
}

body h3,
body .h3 {
    font-size: 2.7rem;
    margin-bottom: 1rem;
    padding-top: 1rem;
}

@media screen and (max-width: 767px) {
    body h3,
    body .h3 {
        font-size: 2rem;        
        margin-top: 0;
        line-height: 2rem;
    }
}

body h4,
body .h4 {
    font-size: 1.9rem;
}

body h5,
body .h5 {
    font-size: 1.6rem;
    color: #223E4D;
    margin-bottom: 0.8rem;
}

@media screen and (max-width: 767px) {
    body h4,
    body .h4 {
        font-size: 1.8rem;
        margin-bottom: 3rem;
        margin-top: 0;
        padding-top: 0;
        line-height: 2.7rem;
    }
}

body h6,
body .h6 {
    font-size: 1.6rem;
    margin-bottom: 0.8rem;
}


body ul li,
body ol li {
    padding-bottom: 1rem;
    color: #223E4D;
}

body svg.ext {
    height: 24px;
    width: 24px;
    margin-top: -9px;
    fill: #337728;
}

body .fa-external-link:before {
    font-size: 1rem;
    padding-left: 0.3rem;
}

body .field-name {
    font-size: 2.3rem;
    margin-bottom: 30px;
    color: #223E4D;
}

@media screen and (max-width: 767px) {
    body .field-name {
        font-size: 1.7rem;
        line-height: 2.4rem;
        margin-bottom: 2rem;
    }
}

body .text-white h1,
body .text-white h2,
body .text-white h3,
body .text-white h4,
body .text-white h5,
body .text-white .h1,
body .text-white .h2,
body .text-white .h3,
body .text-white .h4,
body .text-white .h5 {
    color: #F0F0F0 !important;
}

body .border,
body .border-top,
body .border-end,
body .border-bottom,
body .border-start {
    border-color: #E9E9E9 !important;
}

body button,
body .btn,
body .btn-primary,
body .btn-secondary {
    border-radius: 0;
    stroke-width: 2.5px;
    -webkit-text-stroke-color: #005A8B;
    line-height: 1.5rem;
    font-weight: 400;
    font-size: 1.6rem;
    padding: 1.5rem 1.8rem;
}

    body .btn-items a,
    body .btn.btn-primary,
    body .btn-default {
        background-color: #337728 !important;
        color: #FCFEFF !important;
    }

        body .btn-items a:hover,
        body .btn.btn-primary:hover,
        body .btn-default:hover,
        body .btn-items a:focus,
        body .btn.btn-primary:focus,
        body .btn-default:focus {
            background-color: #005A8B !important;
        }

body .btn-secondary {
    background-color: #FCFEFF !important;
    color: #000 !important;
    border: 4px solid #005A8B;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-secondary:hover,
.btn-secondary:focus {
    --bs-btn-hover-bg: #005A8B;
    border-color: #337728 !important;
}

body .btn-xs {
    padding: 0.3rem 0.6rem;
    font-size: 0.9rem;
    border-radius: 0.3rem;
}

body .btn-sm {
    padding: 0.4rem 0.8rem;
    font-size: 1.4rem;
    border-radius: 0.4rem;
}

body .btn-lg {
    padding: 0.8rem 1.6rem;
    font-size: 2rem;
    border-radius: 0.8rem;
}

.oic-btn-info {
    padding: 0.2rem 0.6rem 0rem 0.6rem !important;
    vertical-align: top;
    color: #005A8B;
    text-align: center;
}

    .oic-btn-info:hover,
    .oic-btn-info:focus {
        color: #337728 ;
    }

body .header-wrapper {
    background-color: #F7FAFB;
}

body .align-center img {
    margin-right: auto !important;
    margin-left: auto !important;
}

body .grecaptcha {
    z-index: 20;
}

.spin-div-hidden {
    display: none;
    visibility: hidden;
}

.spin-div-visible {
    display: flex;
    visibility: visible;
}

.spin-grid-visible {
    display: block;
    visibility: visible;
}

body .card {
    background-color: #F7FAFB;
    color: #223E4D;
    border-radius: 0;
    border: 2.5px solid #E9E9E9;
    padding: 16px;
    flex: 1 1 100%;
    margin-bottom: 2.4rem;
    box-shadow: 0px 6px 10px 0px transparent;
}
    body .card h2 {
        font-size: 23px;        
    }

    body .card h2 a {
        color: #000;
        text-decoration: none;
    }

    body .card a:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    body .card:hover {
        background-color: #F7FAFB;
        border: none;
        -webkit-box-shadow: 0px 6px 10px 0px #00000026;
        -moz-box-shadow: 0px 6px 10px 0px #00000026;
        box-shadow: 0px 6px 10px 0px #00000026;
        border: 2.5px solid #E9E9E9;
    }

    body .card:focus-within {
        outline: 2.5px #4BA63A solid;
    }

        body .card:focus-within a {
            outline: 0;
        }

body .topic-image i,
body .topic-image svg {
    padding-top: 10px;
    width: 5rem;
    height: 5rem;
    color: #005A8B;
}

.custom-popover {
    --bs-popover-font-size: 1.6rem;
    --bs-popover-header-font-size: 1.6rem;
    --bs-popover-header-bg: #F7FAFB;
}

/* Put some whitespace between the link and its Font Awesome suffix. */
i.extlink,
svg.extlink {
    padding-left: 0.4em;
    width: 12px;
    height: 12px;
    text-decoration: none;
}

.extlink-nobreak {
    white-space: nowrap;
}

.navbar-light .nav-link:hover,
.navbar-light .nav-link:focus {
    color: rgba(0, 0, 0, 0.7);
}

.navbar-light .nav-link {
    color: rgba(0, 0, 0, 0.5);
}

/** Main navigation **/
.nav-outer-wrapper {
    background-color: #F7FAFB;
}

    .nav-outer-wrapper #navbar-main {
        background: transparent;
        padding: 0;
    }

        .nav-outer-wrapper #navbar-main #navbar-top {
            background: transparent;
            padding: 0;
        }

.horizontal-menu a {
    color: #fff;
    font-size: 1.9rem;
    text-decoration: none;
}

    .horizontal-menu a:hover {
        background-color: #1e4d67;
    }

.horizontal-menu > li > a {
    background: none;
    padding: 0.8rem 1.6rem;
}

.horizontal-menu .sub-nav {
    background-color: #256081;
}

#utility-nav ul li a {
    text-decoration: underline;
    color: #337728 !important;
    font-size: 1.6rem;
}

    #utility-nav ul li a:after {
        display: none;
    }

    #utility-nav ul li a:hover,
    #utility-nav ul li a:focus {
        background-color: transparent;
        color: #007b5f !important;
    }

    #utility-nav ul li a:visited {
        color: #005A8B !important;
    }

    #utility-nav ul li a .material-icons {
        font-size: 1.6rem;
        position: relative;
        line-height: 0;
        top: 4px;
    }

#utility-nav ul li:last-child a {
    padding-right: 0 !important;
}

#header {
    border-top: 0;
}

    #header #pmenu-toggle {
        border: 0;
        background-color: #0368c0;
        height: 100%;
        color: #FFF;
        padding: 0 1.6rem;
        position: relative;
        right: -12px;
    }

@media (max-width: 991px) {
    #header .hrside {
        position: absolute;
        right: 0;
        height: 100%;
    }
}

.horizontal-menu a {
    color: #005A8B;
    font-weight: 600;
    font-size: 1.6rem;
}

    .horizontal-menu a:hover {
        background-color: #005A8B;
        color: #FCFEFF;
    }

        .horizontal-menu a:hover:after {
            color: #FCFEFF;
        }

.horizontal-menu > li.menu-item.sfHover a {
    background-color: #005A8B;
    color: #FCFEFF;
}

.horizontal-menu > li > a:after {
    content: "\f107";
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    color: #005A8B;
    margin-left: 1.2rem;
    line-height: 0;
    vertical-align: middle;
}

.horizontal-menu .sub-nav {
    background-color: #005A8B;
}

    .horizontal-menu .sub-nav a {
        color: #FCFEFF;
    }

        .horizontal-menu .sub-nav a:hover {
            text-decoration: underline !important;
        }

    .horizontal-menu .sub-nav li {
        margin-bottom: 15px;
    }

.banner-header-text {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.3rem;
}

/* Horizontal Menus */
#block-mainnavigation #mainnav > ul > li {
    padding: 0;
    border-bottom: 2.5px solid #E9E9E9;
}

#block-mainnavigation li {
    position: relative;
}

    #block-mainnavigation li a.nav-link,
    #block-mainnavigation li button.nav-link {
        color: #005A8B !important;
        font-size: 1.6rem;
        line-height: 1.6rem;
        outline-offset: 0;
        font-weight: 600;
        border: 0;
        background-color: transparent;
        padding: 10px 16px;
    }

        #block-mainnavigation li a.nav-link:after,
        #block-mainnavigation li button.nav-link:after {
            display: none;
        }

@media (min-width: 992px) {
    #block-mainnavigation li a.nav-link.active-trail:before,
    #block-mainnavigation li button.nav-link.active-trail:before {
        content: '';
        display: block;
        width: 100%;
        height: 4px;
        position: absolute;
        bottom: 0;
        left: 0;
    }
}

#block-mainnavigation li a.nav-link:focus,
#block-mainnavigation li button.nav-link:focus,
#block-mainnavigation li a.nav-link:hover,
#block-mainnavigation li button.nav-link:hover,
#block-mainnavigation li a.nav-link.show,
#block-mainnavigation li button.nav-link.show {
    background-color: #005A8B;
    color: #FCFEFF !important;
    outline-color: #337728;
}

#block-mainnavigation li a.nav-link em.material-icons,
#block-mainnavigation li button.nav-link em.material-icons {
    position: relative;
    top: 3px;
    font-size: 1.4rem;
    line-height: 0;
}

#block-mainnavigation li a.nav-link.show em.material-icons,
#block-mainnavigation li button.nav-link.show em.material-icons {
    transform: rotate(180deg);
}

#block-mainnavigation li .borderbox {
    width: 1px;
    display: block;
    position: absolute;
    border-left: 1px solid #B2D6E0;
    height: 1.5rem;
    top: 50%;
    left: 0;
    margin-top: -0.75rem;
    z-index: 2;
}

#block-mainnavigation li.last .borderbox:last-child {
    right: 0;
    left: auto;
}

#block-mainnavigation .navbar-collapse .dropdown-menu {
    font-family: 'Open Sans', sans-serif;
    border: 0;
    padding: 1.6rem;
    color: #005A8B;
    background-color: #fff;
    border-radius: 0;
    margin-top: 0;
}

    #block-mainnavigation .navbar-collapse .dropdown-menu.show .grid {
        padding-left: 0;
        min-width: 100%;
    }

    #block-mainnavigation .navbar-collapse .dropdown-menu a {
        text-decoration: underline;
        color: #005A8B;
        font-size: 1.5rem;
    }

        #block-mainnavigation .navbar-collapse .dropdown-menu a:hover {
            color: #005A8B;
        }

        #block-mainnavigation .navbar-collapse .dropdown-menu a:focus {
            outline-color: #337728;
        }

    #block-mainnavigation .navbar-collapse .dropdown-menu .fw-bold {
        font-size: 1.7rem;
    }

    #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item {
        color: #005A8B;
        white-space: normal;
        background-color: transparent;
    }

        #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item.more-link {
            border: 2px solid #005A8B;
            border-radius: 0.25rem;
            text-decoration: none;
        }

            #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item.more-link:hover,
            #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item.more-link:focus {
                border-color: #fff;
                color: #fff;
                background-color: #005A8B;
            }

        #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item:hover,
        #block-mainnavigation .navbar-collapse .dropdown-menu .dropdown-item:focus {
            background-color: transparent;
        }

#block-mainnavigation .grid-one {
    grid-row: 1;
}

#block-mainnavigation h2 {
    background-color: #082f52;
    color: #fff;
    padding: 10px 15px 10px 15px;
    font-size: 2rem;
}

    #block-mainnavigation h2 a {
        color: #fff;
        font-size: 2rem;
    }

        #block-mainnavigation h2 a:hover {
            text-decoration: underline !important;
        }

@media (max-width: 991px) {
    #block-mainnavigation ul {
        flex-direction: column;
    }

        #block-mainnavigation ul.grid {
            display: block !important;
            columns: 1 !important;
        }

    #block-mainnavigation li {
        position: relative;
    }

        #block-mainnavigation li a.nav-link,
        #block-mainnavigation li button.nav-link {
            font-weight: 700;
            color: #FCFEFF !important;
        }

    body.pmenu-open #primary-nav-bg {
        display: block;
        background-color: rgba(0, 0, 0, 0.5);
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: fixed;
        z-index: 1;
    }

    #mainnav {
        position: fixed;
        top: 0;
        right: 0;
        height: 100%;
        width: 90%;
        z-index: 2;
        background-color: #005A8B;
        overflow-y: auto;
    }

        #mainnav #pnav-close {
            border: 0;
            background-color: transparent;
            text-align: right;
            margin-bottom: 1.6rem;
            font-size: 2.6rem;
        }

        #mainnav .dropdown-menu.show {
            display: block !important;
            width: 100% !important;
            background-color: transparent !important;
            box-shadow: none;
            position: relative;
            grid-gap: 1.1rem;
        }

            #mainnav .dropdown-menu.show .dropdown-item {
                color: #FCFEFF !important;
                text-decoration: none;
            }

        #mainnav ul.umenu {
            display: block;
            list-style: none;
            padding: 0;
        }

            #mainnav ul.umenu li {
                margin-bottom: 0.8rem;
            }

                #mainnav ul.umenu li a {
                    text-decoration: underline;
                    font-weight: 400;
                    background-color: transparent !important;
                    color: #FCFEFF !important;
                }

                    #mainnav ul.umenu li a.nav-link.show,
                    #mainnav ul.umenu li a.nav-link:focus,
                    #mainnav ul.umenu li a.nav-link:hover {
                        color: #FCFEFF !important;
                    }

        #mainnav > ul.navbar-nav > li .material-icons {
            display: none;
        }
}

.nav-border-top {
    background: #0368c0;
    display: block;
    width: 100%;
    height: 2px;
}
/* Footer Navigation */
#footernav,
footer.site-footer a {
    text-decoration: underline;
    color: #FCFEFF;
}

    #footernav:hover,
    footer.site-footer a:hover {
        text-decoration: none;
    }

footer.site-footer {
    background: #082f52 !important;
    font-size: 1.6rem;
    font-family: 'Open Sans', sans-serif;
}

    footer.site-footer ul {
        list-style: none;
        padding-left: 0 !important;
    }

    footer.site-footer h2 {
        color: #FCFEFF !important;
    }

    footer.site-footer .content {
        font-size: 1.6rem;
    }

    footer.site-footer .wrapper-footer-bottom .content {
        color: #000;
    }

    footer.site-footer .block {
        margin: 0;
        padding: 0;
    }

body footer.site-footer .wrapper-footer-bottom p {
    text-align: inherit;
}

.site-footer .content a,
.site-footer .content a.is-active {
    color: #FCFEFF !important;
}

.contextual a {
    color: black !important;
}

/* Components */
/* Screen widths */
/* OIC Colors */
body {
}

    body .nav-tabs .nav-link {
        border-color: #ccc;
        text-decoration: underline;
    }

        body .nav-tabs .nav-link.active,
        body .nav-tabs .nav-link:hover {
            text-decoration: none;
        }

    body .tab-content {
        padding: 1.6rem;
    }

    body .table {
        font-size: 1.6rem;
    }

        body .table th,
        body .table td {
            padding: 0.7343rem 1.028rem;
        }

    body .form-control,
    body .form-select {
        font-size: 1.6rem;
        padding: 0.6rem 1.2rem;
    }

    body p:has(.arrows):after,
    body li:has(.arrows):after {
        content: '\f324';
        font-family: 'Font Awesome 6 Free';
        padding-left: 0.6rem;
        text-decoration: none !important;
        color: #337728;
    }

    body p:has(.btn.arrows):after {
        content: '';
    }

    body p:has(.btn.arrows) a:after {
        content: '\f324';
        font-family: 'Font Awesome 6 Free';
        padding-left: 0.6rem;
        text-decoration: none !important;
        color: inherit;
    }

    body ul.pagination li.page-item {
        white-space: nowrap;
        min-height: 3rem;
        min-width: 3rem;
        border: none;
        padding: 0;
        font-size: 2.0rem;
    }

@media screen and (max-width: 767px) {
    body ul.pagination li.page-item {
        min-height: 2.5rem;
        min-width: 2.5rem;
    }
}

body ul.pagination li.page-item a {
    font-size: 2.0rem;
    color: #337728;
    border-radius: 0;
}

    body ul.pagination li.page-item a.page-link {
        background-color: #fff;
        border: none !important;
        padding: 0.5rem;
    }

        body ul.pagination li.page-item a.page-link:hover,
        body ul.pagination li.page-item a.page-link:focus {
            background-color: #337728;
            color: #fff;
        }

body ul.pagination li.page-item .page-link.ellipsis {
    display: flex;
    align-items: end;
    background-color: #fff;
    border: none !important;
}

    body ul.pagination li.page-item .page-link.ellipsis:hover,
    body ul.pagination li.page-item .page-link.ellipsis:focus {
        background-color: #fff;
        color: #337728;
    }

body ul.pagination li.page-item.active span {
    align-items: center;
    background-color: #337728;
    color: #fff;
    font-size: 2.0rem;
    border-color: rgba(27, 27, 27, 0.2);
    border-radius: 0;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    justify-content: center;
    padding: 0.425rem;
    text-decoration: none;
    width: 100%;
}

body .wrapper-footer-top {
    background: #005A8B;
    margin-top: 30px;
}

    body .wrapper-footer-top p,
    body .wrapper-footer-top a,
    body .wrapper-footer-top h1,
    body .wrapper-footer-top h2,
    body .wrapper-footer-top h3 {
        color: #FCFEFF;
    }

body .wrapper-footer-bottom {
    background: #E9E9E9;
    color: #000;
    text-align: center;
}

    body .wrapper-footer-bottom a {
        color: #000 !important;
    }

body div.contact-info .material-icons {
    color: #559E8D;
    position: relative;
    top: 5px;
}

body div.contact-info span.country {
    display: none;
}

body div.contact-info p.address {
    display: inline-block;
}

    body div.contact-info p.address br {
        display: none;
    }

body .gray-box {
    position: relative;
    background-color: #E9E9E9;
    color: #223E4D;
}

    body .gray-box .wrapper {
        padding: 20px 50px 30px 25px;
    }

    body .gray-box:not(:has(.wrapper)) {
        padding: 2rem;
    }

    body .gray-box.subscribe {
        padding: 2rem 2rem 2rem 5rem;
    }

    body .gray-box h2 {
        font-size: 2.7rem;
    }

@media screen and (max-width: 767px) {
    body .gray-box h2 {
        font-size: 2.4rem;
    }
}

body .gray-box .icon {
    font-family: "Font Awesome 6 Free";
    position: absolute;
    top: 25px;
    left: -30px;
}

    body .gray-box .icon i,
    body .gray-box .icon svg {
        background-color: #005A8B;
        color: #fff;
        text-align: center;
        line-height: 70px;
        font-size: 4rem;
        border-radius: 50%;
    }

    body .gray-box .icon span {
        display: block;
        width: 70px;
        height: 70px;
        background-color: #005A8B;
        color: #fff;
        text-align: center;
        line-height: 70px;
        font-size: 4rem;
        border-radius: 50%;
    }

body .gray-box .content {
    width: 87%;
    display: inline-block;
    margin-left: 30px;
}

.chart-container {
    aspect-ratio: 1;
    align-content: center !important;
}