:root {
    --oxford-green: #042126;
    --kelly-green: #2BBC2B;
    --digital-green: #1C8b38;
    --digital-blue: #208880;
    --oat-milk: #F5F0E9;
    --container-dark: var(--oxford-green);
    --on-container-dark: white;
    --container-light: var(--oat-milk);
    --on-container-light: black;
}

BODY {
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial, Verdana, sans-serif;
    BACKGROUND-COLOR: #ffffff
}

TD {
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial, Verdana, sans-serif
}

UL {
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial, Verdana, sans-serif
}

P {
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial, Verdana, sans-serif
}

.flex-box {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.opl-row {
    display: flex;
    flex-flow: column wrap;
    padding: 0.5rem;
}

.opl-row-header {
    font-size: 1.25rem;
    font-weight: bold;
    color: var(--digital-green);
}

.opl-row-item {
    padding: 0.25rem 0rem;
}

    .opl-row-item span {
        font-weight: bold;
    }

.opl-row-footer {
    border-top: 1px solid var(--container-dark);
}

.title {
    FONT: bold 12px Verdana, Arial, serif, sans-serif;
    COLOR: #003366;
    TEXT-ALIGN: left;
    TEXT-DECORATION: none
}

.subtopic {
    FONT: bold 10px Verdana, Arial, serif, sans-serif;
    COLOR: #336699;
    TEXT-DECORATION: none
}

.currentsubtopic {
    FONT: bold 10px Verdana, Arial, serif, sans-serif;
    COLOR: #003063;
    TEXT-DECORATION: underline
}

.menutopic {
    FONT: bold 10px Verdana, Arial, serif, sans-serif;
    COLOR: #9c0000;
    TEXT-DECORATION: none
}

.contentshading {
    BACKGROUND-COLOR: #ffffff
}

.navynolink {
    FONT: 8pt arial, helvetica;
    COLOR: #003366;
    TEXT-ALIGN: center
}

.rednolink {
    FONT: 8pt arial, helvetica;
    COLOR: #9c0000;
    TEXT-ALIGN: left
}

.header {
    FONT: bold 10px Verdana, Arial, serif, sans-serif;
    COLOR: #003061;
    TEXT-ALIGN: left;
    TEXT-DECORATION: none
}

.white {
    FONT-SIZE: 10px;
    COLOR: #ffffff;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    TEXT-DECORATION: none
}

SUP {
    FONT-WEIGHT: lighter;
    FONT-SIZE: xx-small;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    FONT-VARIANT: small-caps
}

.tiny {
    FONT: lighter 9px/6px Verdana, Arial, Helvetica, sans-serif
}

.background {
    BACKGROUND-POSITION: 150px 108px;
    BACKGROUND-ATTACHMENT: fixed;
    FONT: 10px Verdana, Arial, serif, sans-serif;
    COLOR: #000000;
    BACKGROUND-REPEAT: no-repeat;
    TEXT-DECORATION: none
}

.whitecurrent {
    FONT-WEIGHT: bold;
    FONT-SIZE: 10px;
    COLOR: #ffffff;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    LIST-STYLE-TYPE: none;
    TEXT-DECORATION: underline
}

.whitetopic {
    FONT-WEIGHT: bold;
    FONT-SIZE: 10px;
    COLOR: #ffffff;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    TEXT-DECORATION: none
}

.whitelight {
    FONT-WEIGHT: lighter;
    FONT-SIZE: 8px;
    COLOR: white;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    LIST-STYLE-TYPE: none;
}

.newtopic {
    FONT: bold 12px Verdana, Arial, serif, sans-serif;
    COLOR: var(--on-container-light);
    TEXT-DECORATION: none
}

.navycurrent {
    FONT-WEIGHT: bold;
    FONT-SIZE: 10px;
    COLOR: #003063;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    LIST-STYLE-TYPE: none;
    TEXT-DECORATION: underline
}

.navytopic {
    FONT-WEIGHT: bold;
    FONT-SIZE: 10px;
    COLOR: #003063;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    TEXT-DECORATION: none
}

.navy {
    FONT-SIZE: 10px;
    COLOR: #003063;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    TEXT-DECORATION: none
}

.link_item {
    FONT: bold 10px Verdana, Arial, serif, sans-serif;
    COLOR: #9c0000;
    TEXT-DECORATION: underline
}

.tdbg {
    BACKGROUND-POSITION: center 50%;
    BACKGROUND-ATTACHMENT: scroll;
    BACKGROUND-IMAGE: url(background.jpg);
    BACKGROUND-REPEAT: no-repeat
}

.servicemark {
    FONT-WEIGHT: normal;
    FONT-SIZE: 8px;
    FONT-STYLE: normal;
    FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    FONT-VARIANT: small-caps
}

.new {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #000000;
    background-color: #CCD9D2;
    border: thin outset #FFFFFF;
    font-weight: bold;
    cursor: pointer;
}

.container-light {
    background-color: var(--container-light);
    color: var(--on-container-light);
}

.container-dark {
    background-color: var(--container-dark);
    color: var(--on-container-dark);
}


.button {
    border: 1px solid var(--container-dark);
    font-weight: bold;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    text-decoration: none;
    text-transform: capitalize;
    text-align: center;
    margin: 0 0 0 5px;
    cursor: pointer;
}

.button-primary {
    background-color: var(--container-dark);
    color: var(--on-container-dark);
    border: 1px solid var(--container-dark);
}

.button-secondary {
    background-color: var(--container-light);
    color: var(--on-container-light);
}

.tabButton {
    background: white;
    border: 1px solid var(--on-container-light);
    border-bottom: 0.25rem solid var(--on-container-light);
    font-size: 1.00rem;
    padding: 0.25rem;
    text-decoration: none;
    text-transform: capitalize;
    text-align: center;
    margin: 0rem;
    cursor: pointer;
}

    .tabButton:hover {
        background: var(--container-light);
    }

    .tabButton.active {
        background: var(--container-light);
        font-weight: bold;
        border-bottom: 0.25rem solid var(--kelly-green);
    }

.search-result {
    border: 1px solid var(--container-dark);
}

.display-label {
    font-weight: bold;
    font-style: italic
}

.form-label {
    display: block;
    font-weight: bold;
}

.refine-search {
    border: 1px solid var(--container-dark);
    width: 98%;
}

.gg-chevron-up {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    transform: scale(1);
    width: 22px;
    height: 22px;
    border: 2px solid transparent;
    border-radius: 100px;
    margin-bottom: -0.5rem;
}

    .gg-chevron-up::after {
        content: "";
        display: block;
        box-sizing: border-box;
        position: absolute;
        width: 10px;
        height: 10px;
        border-top: 2px solid;
        border-right: 2px solid;
        transform: rotate(-45deg);
        left: 4px;
        bottom: 2px;
    }

.gg-chevron-down {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    transform: scale(1);
    width: 22px;
    height: 22px;
    border: 2px solid transparent;
    border-radius: 100px;
    margin-bottom: -0.5rem;
}

    .gg-chevron-down::after {
        content: "";
        display: block;
        box-sizing: border-box;
        position: absolute;
        width: 10px;
        height: 10px;
        border-bottom: 2px solid;
        border-right: 2px solid;
        transform: rotate(45deg);
        left: 4px;
        top: 2px;
    }
