.header {
    background-color: rgb(47, 159, 63);
    /*position: fixed;*/
    position: relative;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 90px;
    z-index: 40;
    overflow: hidden;
}
.header span:nth-child(2) { 
    font-family: "Jaguar", "Helvetica", "Myriad Pro", sans-serif;
    color: rgb(255, 255, 255);
    font-size: 46pt; 
    line-height: 46pt; 
    font-weight: bold; 
    position: absolute; 
    top:  4px; 
    left: 16px; 
    z-index: 43; 
}
.header span:nth-child(2) img {
    height: 46pt;
    margin-bottom: -9.2pt;
}
.header span:nth-child(3) { 
    font-family: "Jaguar", "Helvetica", "Myriad Pro", sans-serif; 
    color: rgba(255, 255, 255, 0.5);
    font-size: 32pt; 
    line-height: 32pt; 
    font-weight: bold; 
    position: absolute;
    top: 32px; 
    left: 40px; 
    z-index: 42; 
}

.header.small {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 45px;
    z-index: 39;
}
.header.small span:nth-child(2) { 
    font-size: 23pt; 
    line-height: 23pt; 
    top:  2px; 
    left: 16px; 
    z-index: 43; 
}
.header.small span:nth-child(2) img {
    height: 23pt;
    margin-bottom: -4.6pt;
}
.header.small span:nth-child(3) { 
    font-size: 16pt; 
    line-height: 16pt; 
    top: 16px; 
    left: 28px; 
    z-index: 42; 
}
.header.small span:nth-child(4) { 
    font-size: 10pt; 
    line-height: 10pt;
    text-align: right;    
    font-weight: 100;
    position: absolute;
    top: 4px; 
    left: 420px;
    right: 16px; 
    z-index: 41; 
}
.header.small span:nth-child(4) a {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
}
.header.small span:nth-child(4) a:hover {
    text-decoration: underline;
}
.header.small span:nth-child(4) a svg {
    height: 8pt;
    margin-right: 1pt;
}
.header.small span:nth-child(4) a svg path {
    fill: rgba(255, 255, 255, 0.75);
}

.anchor {
    display: block;
    /*padding-top: calc(125px + 24pt + 16pt);*/
    padding-top: calc(80px + 24pt + 16pt);
    /*margin-top: calc((-1) * (125px + 24pt + 16pt));*/
    margin-top: calc((-1) * (80px + 24pt + 16pt));
    margin-bottom: -16pt;
}

.headerpagegradient {
    position: fixed;
    /*top: 90px;*/
    top: 45px;
    left: 0px;
    right: 0px;
    /*height: 35px;*/
    height: 25px;
    border-top: solid 1px rgb(23, 79, 31);
    background: linear-gradient(
        180deg,
        rgba(47, 159, 63, 0.5),
        rgba(47, 159, 63, 0)
    );
    mix-blend-mode: multiply;
    z-index: 20;
}


.menu {
    position: relative;
    /*margin-top: 90px;*/
    background-color: rgb(255, 255, 255);
    z-index: 30;
}
.menu>ul, .menu>div {
    position: relative;
    margin: 0px;
    padding-left: 10pt;
    padding-right: 10pt;
    z-index: 32;
}
.menu * {
    text-align: center;
    font-size: 10pt;
    line-height: 18pt;
}

.menu>*:nth-child(1) {
    background-color: rgba(47, 159, 63, 0.7);
}
.menu>*:nth-child(1) a.active {
    background-color: rgba(255, 255, 255, 0.2);
}
.menu>*:nth-child(2) {
    background-color: rgba(47, 159, 63, 0.5);
}
.menu>*:nth-child(2) a.active {
    background-color: rgba(255, 255, 255, 0.3);
}
.menu>*:nth-child(3) {
    background-color: rgba(47, 159, 63, 0.3);
}
.menu>*:nth-child(3) a.active {
    background-color: rgba(255, 255, 255, 0.4);
}
.menu>*:nth-child(4) {
    background-color: rgba(47, 159, 63, 0.15);
}
.menu>*:nth-child(4) a.active {
    background-color: rgba(255, 255, 255, 0.5);
}
.menu>*:nth-child(5) {
    background-color: rgb(255, 255, 255);
}

.menu>*:nth-child(2):last-child {
    border-bottom: solid 1px rgb(127, 159, 127);
}
.menu>*:nth-child(3):last-child {
    border-bottom: solid 1px rgb(159, 175, 159);
}
.menu>*:nth-child(4):last-child {
    border-bottom: solid 1px rgb(175, 191, 175);
}
.menu>*:nth-child(5):last-child {
    border-bottom: solid 1px rgb(191, 191, 191);
}

.menu li, .menu a {
    display: inline-block;
    position: relative;
    z-index: 33;
}
.menu a {
    white-space: nowrap;
    padding-left: 4pt;
    padding-right: 4pt;
    color: rgb(0, 0, 0);
    text-decoration: none;
    transition: color 1s 0.5s, background-color 2s;
}
.menu ul>li::after {
    content: " •";
}
.menu ul>li:last-child::after {
    content: "";
}
.menu a:hover, .menu a.active:hover {
    background-color: rgb(0, 0, 0, 0.9);
    color: rgba(255, 255, 255);
    text-decoration: underline;
    transition: color 0.25s, background-color 0.5s;
}


.highlightgradient {
    position: absolute;
    top: 0pt;
    left: 0pt;
    right: 0pt;
    height: 9pt;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.25),
        rgba(255, 255, 255, 0.20) 5%,
        rgba(255, 255, 255, 0)
    );
    mix-blend-mode: overlay;
}
.shadinggradient {
    position: absolute;
    bottom: 0pt;
    left: 0pt;
    right: 0pt;
    height: 9pt;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.08) 95%,
        rgba(0, 0, 0, 0.10)
    );
    mix-blend-mode: overlay;
}
.header .shadinggradient {
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.16) 95%,
        rgba(0, 0, 0, 0.20)
    );
    mix-blend-mode: overlay;
    z-index: 41;
}
.menu .highlightgradient {
    z-index: 31;
}
.menu>*:nth-child(5) .highlightgradient {
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.05) 25%,
        rgba(0, 0, 0, 0)
    );
    mix-blend-mode: multiply;
}
.menu .shadinggradient {
    z-index: 32;
}
.menu>*:nth-child(5) .shadinggradient {
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0),
        rgba(0, 0, 0, 0.08) 95%,
        rgba(0, 0, 0, 0.10)
    );
    mix-blend-mode: multiply;
}


.page {
    position: relative;
    z-index: 10;
    top: 0px;
    bottom: 0px;
    background: rgb(255, 255, 255);
}
.page>.background {
    border-left: solid 1px rgba(0, 0, 0, 0.25);
    border-right: solid 1px rgba(0, 0, 0, 0.25);
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 10%;
    right: 10%;
    background-size: 100%;
}
.page>.background.class50 {
    background-size: 50%;
    background-position: 50% 0%;
}
.page>.index {
    display: grid;
    grid-gap: 0pt;
    grid-template-columns: auto 170px;
    grid-template-areas: 
        "a b"
        "c b";
}
.page>.index,
.page>.content {
    margin-left: 10%;
    margin-right: 10%;
    /*z-index: 10;*/
    position: relative;
}
.page>.index>.content,
.page>.content {
    padding-top: 10pt;
    padding-bottom: 10pt;
    padding-left: 16pt;
    padding-right: 16pt;
}
.page>.index>.content {
    grid-area: a;
}
.page>.index>.rightcol {
    grid-area: b;
    padding: 8pt;
    position: relative;
}
.page>.rightcol {
    position: absolute;
    top: 0px;
    right: 10%;
    bottom: 0px;
    width: 170px;
    border-left: solid 1px rgba(0, 0, 0, 0.25);
    background: linear-gradient(
        90deg,
        rgba(31, 74, 21, 0.1),
        rgba(31, 74, 21, 0.2)
    );
}
.page>.index>.rightcol img {
    width: 100%;
}
.page>.index>.rightcol img,
.page>.index>.rightcol div {
    margin-top: 8pt;
    margin-bottom: 8pt;
}
.page>.index>.footer {
    grid-area: c;
}
.page>.footer,
.page>.index>.footer {
    margin-left: 10%;
    margin-right: 10%;
    padding-top: 10pt;
    padding-bottom: 20pt;
    padding-left: 32pt;
    padding-right: 32pt;
    position: relative;
    /*z-index: 10;*/
}

.leftpagegradient,
.rightpagegradient {
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.5),
        rgba(0, 0, 0, 0.3) 10%,
        rgba(0, 0, 0, 0.2) 33%,
        rgba(0, 0, 0, 0.1) 33%,
        rgba(0, 0, 0, 0)
    );
    mix-blend-mode: multiply;
    position: absolute;
    top: 0px;
    bottom: 0px;
    z-index: -1;
}
.leftpagegradient {
    left: 4.5%;
    right: 94.5%;
}
.rightpagegradient {
    left: 94.5%;
    right: 4.5%;
}
.menupagegradient {
    position: absolute;
    /*z-index: 1;*/
    left: 0px;
    right: 0px;
    top: 0px;
    height: 32pt;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 1),
        rgba(255, 255, 255, 0)
    );
}
.rightcolheadgradient {
    position: absolute;
    z-index: 1;
    left: -1px;
    right: 0px;
    top: -8pt;
    height: 64pt;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.5) 32pt,
        rgba(255, 255, 255, 0)
    );    
}
.footerpagegradient {
    position: absolute;
    /*z-index: 1;*/
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 128pt;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 1)
    );
}


.navigation {
    position: relative;
    margin-top: 8pt;
    margin-bottom: 8pt;
    text-align: center;
}
.navigation {
    display: grid;
    grid-gap: 5%;
    grid-template-columns: 30% 30% 30%;
    grid-template-areas: "a b c";    
}
.navigation .previous {
    grid-area: a;
}
.navigation .current {
    grid-area: b;
}
.navigation .next {
    grid-area: c;
}
.navigation.extended {
    display: grid;
    grid-gap: 3%;
    grid-template-columns: 17.6% 17.6% 17.6% 17.6% 17.6%;
    grid-template-areas: "a b c d e";    
}
.navigation.extended .first {
    grid-area: a;
}
.navigation.extended .previous {
    grid-area: b;
}
.navigation.extended .current {
    grid-area: c;
}
.navigation.extended .next {
    grid-area: d;
}
.navigation.extended .last {
    grid-area: e;
}
.navigation .first:before {
    content: "⏪ ";
}
.navigation .previous:before {
    content: "◀ ";
}
.navigation .next:after {
    content: " ▶"
}
.navigation .last:after {
    content: " ⏩"
}
.navigation .first,
.navigation .previous,
.navigation .current,
.navigation .next,
.navigation .last {
    border-top: solid 1px rgba(0, 0, 0, 0.25);
    padding: 4pt;
    box-shadow: 0pt 4pt 4pt rgba(0, 0, 0, 0.5);
}
.navigation.font14 {
    font-size: 14pt;
}
.navigation a:hover {
    background: linear-gradient(135deg,
        rgba(95, 223, 63, 0.05),
        rgba(95, 223, 63, 0.15)
    );
    box-shadow: 0pt 4pt 4pt rgba(47, 111, 31, 0.75);
}
.navidescription {
    background: linear-gradient(to bottom,
        rgba(0, 0, 0, 0.25),
        rgba(0, 0, 0, 0.25) 1px,
        rgba(0, 0, 0, 0.15) 2px,
        rgba(0, 0, 0, 0.05) 4pt,
        rgba(0, 0, 0, 0)
    );
    text-align: center;
    font-style: italic;
    margin-left: calc((-16pt) + 1px);
    margin-right: calc((-16pt) + 1px);
    margin-top: 20pt;
    padding-top: 4pt;
    margin-bottom: -8pt;
    padding-bottom: 8pt;
}

.footer {
    font-size: 8pt; 
    line-height: 10pt; 
    text-align: center;
}
.footer hr {
    margin: 4pt;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}
.footer img {
    height: 18pt;
    border-radius: 1.8pt;
    margin-top: 1.8pt;
}