body { font-family: Encode Sans,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-size: 18px; letter-spacing: 0.02em; color: #444444; }
h1 { font-size: 36px; color: #00762C; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; letter-spacing: 0.02em; margin-top: 20px; margin-bottom: 30px; }
h2 { font-size: 28px; color: #666666; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; letter-spacing: 0.02em; margin-top: 36px; margin-bottom: 24px; }
h3 { font-size: 24px; color: #666666; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; letter-spacing: 0.02em; margin-top: 36px; margin-bottom: 24px; }
h4 { font-size: 20px; color: #666666; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; letter-spacing: 0.02em; margin-top: 36px; margin-bottom: 24px; }
.sub-head { color: #666666; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; }
.nolink   { color: #666666; font-family: Encode Sans Semi Condensed,Roboto,Calibri,Helvetica Neue,Helvetica,Arial,sans-serif; letter-spacing: 0.02em; }
a       { color: #00AA40; text-decoration: none; }
a:hover { color: #15EA65; text-decoration: none; }

.spf-bg-dark    { background-color: #007A2E; }
.spf-header-sep { background-color: #00AA40; padding: 8px; margin-top: 0px; margin-bottom: 20px; }
.spf-footer-sep { background-color: #00AA40; padding: 8px; margin-top: 32px; }
.spf-footer     { background-color: #007A2E; padding: 10px; font-size: 12px; }
.spf-footer a       { color: #EEEEEE; padding-right: 20px; }
.spf-footer a:hover { color: #15EA65; }

div.spf-smallpic   { display: inline-block; margin: 8px; }
img.spf-smallpic   { padding: 4px; border: solid 1px #cccccc; border-radius: 5px; }
a img.spf-smallpic { border-color: green; }

ul.spf-list          { padding-left: 0px; list-style-type: none; }
ul.spf-list li       { padding: 2px 0 5px 25px; background-image: url("/static/li_1_bg.png"); background-repeat: no-repeat; background-position: 0px 9px; }
ul.spf-list li ul    { padding-left: 0px; list-style-type: none; }
ul.spf-list li ul li { padding: 2px 0 5px 20px; background-image: url("/static/li_2_bg.png"); background-repeat: no-repeat; background-position: 0px 10px; }

.navbar-dark .navbar-nav .show > .nav-link { color: #EEEEEE; }
.navbar-dark .navbar-nav .nav-link { font-size: 20px; color: #EEEEEE; }
.navbar-dark .navbar-nav .nav-link:hover { color: #15EA65; }
.navbar { padding-top: 0px; padding-bottom: 0px; }
.dropdown-menu { background-color: #007A2E; margin-top: 0px; border: 0px; border-radius: 0px; }
.dropdown-item { font-size: 20px; color: #EEEEEE; }
.dropdown-item:hover { background-color: #007A2E; color: #15EA65; }

table.headered-text th { vertical-align: top; text-align: text; color: #666666; white-space: nowrap; padding-right: 20px; }
table.headered-text td { vertical-align: top; text-align: text; }

table.contacts td { vertical-align: top; white-space: nowrap; }
.tn { letter-spacing: 1px; }

#spf-mainmenu.show ~ .language-switch, #spf-mainmenu.collapsing ~ .language-switch { display: none; }

.monospace { font-family: monospace; }

.jumpbox { background-color: #C0FFC0; padding: 15px 15px 1px 15px; }
.contentbox { background-color: #E0E0E0; padding: 15px 15px 0px 15px; }
.contentboxpic { margin-bottom: 10px; }

.klaff {
  background-image: url('/static/klaff-hgr_light.png');
  background-repeat: no-repeat;
  padding-left: 18px;
  display: inline;
  filter: none;
}

.colorscheme-switch-to-dark  { display: inline; }
.colorscheme-switch-to-light { display: none; }

@media (prefers-color-scheme: dark)
{
  body               { color: #BBBBBB; background-color: #0F0F0F; }
  h2, h3, h4         { color: #777777; }
  .sub-head, .nolink { color: #777777; }

  ul.spf-list li { background-image: url("/static/li_1_bg_dark.png"); }

  textarea   { background-color: transparent; color: #BBBBBB; }

  img { filter: brightness(75%); }

  .jumpbox    { background-color: #204020; }
  .contentbox { background-color: #202020; }

  .klaff { background-image: url('/static/klaff-hgr_dark.png'); }

  .colorscheme-switch-to-dark  { display: none; }
  .colorscheme-switch-to-light { display: inline; }
}