html { font-size: 18px;}
body { font-family: 'Nunito Sans', sans-serif; color: #000; background-color: #7e9588; font-size: 18px;}

input { font-size: 18px; font-family: 'Nunito Sans', sans-serif; color: #000;}
select { font-size: 18px; font-family: 'Nunito Sans', sans-serif; color: #000;}

p { line-height: 1.4em; margin-bottom: 0.6em;}
a { color: #015d54;}
a:visited { color: #222; }
ul { list-style-type: disc; padding: 0 0 0 2em; list-style-position: outside;}
ul ul { list-style-type: circle; padding: 0 0 0 1em; list-style-position: outside; margin: 0.3em 0 0 2em;}
ol { list-style-type: decimal; list-style-position: outside;  padding: 0 0 0 2em;}
li { margin-bottom: 5px;  line-height: 1.4em;}
h1 { font-size: 150%; text-align: center; margin: 1em 0 1em 0; font-weight: bold; color: /*#ff9100*/ #000; line-height: 1.4em;}
h2 { font-size: 120%; text-align: left; margin: 1em 0 0.5em 0; color: #444; line-height: 1.4em;}
h3 { font-size: 100%; text-align: left; margin: 1em 0 0.2em 0; color: #555; line-height: 1.4em;}

.component { max-width: 1080px; margin: 0 auto; padding: 0;}

.notebook {}
ul.notebook-tabs { border-bottom: solid 1px #015d54; margin: 0!important; padding: 0; list-style-type: 0;}
ul.notebook-tabs-smaller { font-size: 80%;}
li.notebook-tab {
    display: inline-block;
    margin: 0; padding: 0.4em;
    color: #015d54;
    cursor: pointer;
}
li.notebook-selected-tab { background: #015d54; color: #fff; border: solid 1px #015d54; border-top-right-radius: 7px; border-top-left-radius: 7px;}
ul.notebook-tabs li a { color: #fff; text-decoration: none;}
.notebook-page { padding: 1em 0 0 0;}

.side-box { float: right; width: 25%; border-left: dotted 1px #b0b0b0; padding: 0 0 0 1em; font-size: 80%; margin: 0 0 1em 2em;}

.button {
    display: inline-block; vertical-align: middle;
    font-size: 1em; font-weight: bold; text-transform: none;
    padding: 2px; line-height: normal;
    background: /*#ffb00d*/ url(/static/img/design/button-bg.png) repeat-x center; color: #fff;
    border: solid 1px /*#196d64*/ #23998c; padding: 6px;
    border-top-left-radius: 2px; -moz-border-radius-topleft: 2px;
    border-top-right-radius: 2px; -moz-border-radius-topright: 2px;
    border-bottom-left-radius: 2px; -moz-border-radius-bottomleft: 2px;
    border-bottom-right-radius: 2px; -moz-border-radius-bottomright: 2px;
    font-family: Arial, sans-serif;
    cursor: pointer;
}
a.button { text-decoration: none; color: #fff; line-height: normal; margin: 2px 0; vertical-align: middle;}
.button-minor-action {background: url(/static/img/design/button-bright-bg.png) repeat-x center !important; color: #015d54!important; border: solid 1px #ffe41c; font-weight: bold;}
.buttons { text-align: center;}
.help { font-size: 0.8em; color: #777;}

.supporter { border-bottom: dotted 1px #b0b0b0; padding: 0 12px 12px 12px; font-size: 90%; margin-bottom: 12px;}
.supporter .supporter-logo { float: left; margin: 0 12px 0 0; width: 160px; text-align: center;}

.layout-two-columns-with-divider { display: flex; flex-direction: row;}
.layout-two-columns-with-divider-left-col { padding-right: 2em; border-right: solid 1px #ddd;}
.layout-two-columns-with-divider-right-col { padding-left: 2em;}

table.listing { width: 100%; border-collapse: collapse; border-top: dotted 1px #ddd; margin: 0; padding: 0;}
table.listing > tbody > tr > th { border-bottom: dotted 1px #ddd; padding: 0.5em 0.3em; text-align: left; text-transform: uppercase; font-weight: normal; color: #555;}
table.listing > tbody > tr > td { border-bottom: dotted 1px #ddd; padding: 0.5em 0.3em;}

table.listing-short {width: 100%; margin: 0 0 1em 0; border-top: dotted 1px #ddd;}
table.listing-short td, table.listing-short th { padding: 4px; border-bottom: dotted 1px #ddd; line-height: 140%; text-align: left; vertical-align: middle;}
table.listing-short th { font-weight: normal; color: #777; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; text-transform: uppercase;}
table.listing-short td.helper { color: #777;}
table.listing-short td.help-field {color: #777; font-size: 0.7em;}
table.listing-short td.buttons { text-align: right}
table.listing-short tr:hover { background-color: rgb(255, 254, 209);}
table.listing-short tr.selected-row:hover { background-color: yellow;}

table.details { border-collapse: collapse; width: 100%;}
table.details th { border: dotted 1px #ddd; border-left: 0; padding: 0.5em 0.3em; font-weight: normal; color: #444; text-align: right; width: 25%;}
table.details td { border: dotted 1px #ddd; border-right: 0;  padding: 0.5em 0.3em;}
table.details td.cell-input { padding: 0 0.3em; font-size: 100%; }

.error-messages {color: #f00; text-align: left; margin: 0 0 1em 0; border-top: dotted 1px #f00; border-bottom: dotted 1px #f00; padding: 1em;}
.error-messages ul { list-style-position: outside;}

.link { cursor: pointer; text-decoration: underline; text-decoration-color: #677b70;}
.empty { text-align: center; color: #555; font-style: italic;}

#show-all-countries-link { cursor: pointer; text-decoration: underline dotted #555; font-size: 0.7em; color: #555;}

#spk-header { background-color: #fff; height: 94px; line-height: 94px;}
#spk-header h1 { display: inline; font-weight: 600; text-transform: uppercase; font-size: 1.66em; color: #005c39;}
#spk-header h1 a { text-decoration: none; color: #005c39;}
#spk-header h1 a:hover { text-decoration: underline;}

#spk-tools { float: right; margin-top: 34px; width: 150px; line-height: 1.3em; list-style-type: none; text-align: center;}
#spk-login-button { background-color: #005c39; }
#spk-login-button a { color: #fff; font-weight: 300; font-size: 0.8em; text-decoration: none;}
#spk-login-button a:hover { text-decoration: underline;}
#spk-select-language-button {}

#spk-content-front-page {}
#spk-content { background-color: #fff;}
#spk-content-component { padding: 32px 0;}

#spk-top-menu { list-style-type: none; display: inline; padding-left: 2em; padding-inline-start: 4em;}
#spk-top-menu li { display: inline; margin: 0 9px;}
#spk-top-menu li a { color: #005c39; text-transform: uppercase; text-decoration: none;}
#spk-top-menu li a:hover { text-decoration: underline;}

#spk-footer { font-size: 0.66em; height: 4em;}
#spk-footer-links { float: right; list-style-type: none; margin: 0; padding: 0; line-height: 4em;}
#spk-footer-links li { display: inline-block; margin: 0; padding: 0;}
#spk-footer-links li::after { content: " |"}
#spk-footer-links li:last-child::after { content: ""}
#spk-footer-links li a { color: #000; font-weight: bold; text-decoration: none;}
#spk-footer-links li a:hover { text-decoration: underline;  text-decoration-color: #677b70;}
#spk-footer-copyright { float: left; list-style-type: none; margin: 0; padding: 0; line-height: 4em;}
#spk-footer-copyright li { display: inline-block; margin: 0; padding: 0;}
#spk-footer-copyright li::after { content: " |"}
#spk-footer-copyright li:last-child::after { content: ""}
#spk-footer-copyright li a { color: #000; text-decoration-color: #677b70;}
.spk-dropdown-menu {
    display: inline-block; position: absolute; text-align: left; font-size: 80%; padding: 0px; z-index: 2000;
    box-shadow: black 2px 3px 10px; -webkit-box-shadow: black 2px 3px 10px; -moz-box-shadow: black 2px 3px 10px;
}
.spk-dropdown-menu-light { background-color: #fff;}
.spk-dropdown-menu-dark { background-color: #005e52; color: #fff;}
.spk-dropdown-menu-dark a { color: #fff;}
.spk-dropdown-menu ul { list-style-type: none; padding: 1em; margin: 0;}
.spk-dropdown-menu ul li { padding: 0.4em; margin: 0; cursor: pointer; /*border-bottom: dotted 1px #bbb;*/}
.spk-dropdown-menu ul li:hover { background-color: #f0f0f0;}
.spk-dropdown-menu ul li.info { cursor: default; color: #555;}
.spk-dropdown-menu ul li a { display: block; color: #000; text-decoration: none;}
.spk-dropdown-menu ul li a:hover { text-decoration: underline; text-decoration-color: #677b70;}
.spk-dropdown-link { color: #305a3a; font-size: 0.8em; padding-right: 12px; background: url(/static/img/design/dropdown-link.png) right center no-repeat; cursor: pointer;}

button:focus-visible, a:focus-visible, input:focus-visible {
    outline: 2px solid dodgerblue;
}

#breadcrumbs { text-align:left; border-top: dotted 1px #aaa; border-bottom: dotted 1px #aaa; padding: 0; margin: 0 0 6px 0; font-size: 80%;}
#breadcrumbs li.header { font-weight: bold; }
#breadcrumbs li { padding: 3px 12px 3px 3px; display: inline; background: url(/static/img/design/breadcrumbs-separator.png) right center no-repeat;}
#breadcrumbs li:last-child { background-image: none;}
#breadcrumbs li a { font-weight: normal;}
#breadcrumbs .container-name {color: #777; font-weight: normal;}

.article-metadata { border-top: dotted 1px #ddd; margin-top: 1rem; color: #555; text-align: right; font-size: 80%; padding-top: 0.3em;}