@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap');

body
{
  font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
  font-size: 10pt;
  color: black;
  background-color: #efefef;
  margin-top: 0;
}

.root
{
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 1019px;
}

:link, :visited
{
  color: blue;
}

.topbanner
{
  height: 81px;
  background: url(images/topbanner.jpg);
  background-repeat: no-repeat;
}

.navbar
{
  width: 100%;
  height: 22px;
  background: linear-gradient(180deg, rgba(164,164,172,1) -5%, rgba(232,232,242,1) 40%, rgba(236,236,243,1) 100%);
  text-align: center;
  font-size: 0;
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-right: 1px solid black;
  box-sizing: border-box;
}

.navbar > .menubutton
{
  display: none;
}

.navbar > a,
.navbar > input
{
  display: inline-block;
  width: 105px;
  height: calc(100% - 3px);
  padding-top: 3px;
  font-size: 10pt;
  font-weight: bold;
  font-style: italic;
  text-decoration: none;
  color: black;
}

.navbar > a
{
  background: linear-gradient(180deg, rgba(150,150,158,1) 0%, rgba(232,232,242,1) 40%, rgba(230,230,237,1) 100%);
  border-left: 1px solid black;
}

.navbar > a:last-child
{
  border-right: 1px solid black;
}

.navbar > a:hover
{
  background: linear-gradient(180deg, rgba(223,223,223,1) 0%, rgba(210,210,210,1) 100%);
}

.navbar > :first-child
{
  border-left: 1px solid black;
}

.navbar > #navbartoggle
{
  display: none;
}

.waterfalls
{
  height: 153px;
  background: url(images/waterfalls.jpg);
  background-repeat: no-repeat;
}

.contentcontainer
{
  display: flex;
  flex-direction: row;
}

.contentcontainer > .contentcolumn
{
  display: flex;
  flex-direction: column;
  width: 490px;
  border: 1px solid black;
}

.contentcontainer > .contentcolumn + .contentcolumn
{
  display: flex;
  flex-direction: column;
  width: 526px;
  border-left: 0;
}

.contentcontainer > .contentcolumn:only-child
{
  width: 100%;
}

.contentcontainer > .contentcolumn:only-child > .content:only-child
{
  background: url(images/bodybacker.jpg);
}

.contentcontainer > .contentcolumn > .content
{
  background: white;
  padding-bottom: 1.2em;
}

.contentcontainer > .contentcolumn > .content + .content
{
  border-top: 1px solid black;
}

.contentcontainer .content + .content:before
{
  content: '';
  display: block;
  height: 3px;
  background: url(images/contactbackertop2.gif);
  border: 0px;
  position: relative;
  top: -1px;
}

.contentcontainer .content:last-child
{
  flex-grow: 1;
}

.article
{
  padding: 2em 1em;
}

.article h1
{
  font-size: 10pt;
}

.article .definition
{
  padding-left: 32px;
}

.changestamp
{
  font-style: italic;
  font-size: -15%;
}

.heading
{
}

.menuitem
{
}

address
{

}

.nav
{
  width: 106px;
  height: 22px;
  border: 0px;
  float: left;
}

table.newsbox
{
  width: 100%;
  height: 100%;
  border-spacing: 0px;
  border-collapse: collapse;
}

table.newsbox > tbody > tr:first-child
{
  height: 22px;
}

table.newsbox > tbody > tr > th
{
  padding-left: 4px;
  padding-right: 4px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;
  vertical-align: middle;
  background: url('images/topicbacker.gif');
  font-weight: bold;
  font-style: italic;
}

table.newsbox > tbody > tr > td
{
  padding-left: 4px;
  padding-right: 4px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;
  vertical-align: top;
}

table.newsbox td p:first-child
{
  margin-top: 0px;
}

div.twocolumnsifspace
{
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
  border-spacing: 0px;
  border-collapse: collapse;
}

div.twocolumnsifspace > *
{
  margin: 2em 1em;
}

dl
{
  margin: 2em 1em;
}

.article dl
{
  margin: 0;
}

dl + dl
{
  margin-top: 0;
}

dt
{
  padding-top: 0.8em;
  font-weight: bold;
}

dt:first-child
{
  padding-top: 0;
}

dd
{
  padding-top: 0.3em;
}

dd + dd
{
  padding-top: 0;
}

div.centercolumn
{
  margin-left: auto;
  margin-right: auto;
  width: 60%;
}

input.wideinput
{
  width: 30em;
}

.bottombanner
{
  color: #E2E2E2;
  font-size: 8.75pt;
  height: 40px;
  background: #0C2F05;
  border: 1px solid black;
  border-top: none;
  position: relative;
  top: -1px;
  text-align: center;
}

.bottombanner > .bottombannerleaf
{
  position: relative;
  top: -5px;
  width: 34px;
  height: 45px;
}

.bottombanner > .bottombannertext
{
  display: inline-block;
  vertical-align: top;
  margin-top: 0.3em;
  margin-bottom: 0.3em;
}

table.positions
{
  width: 100%;
  display: inline-block;
}

table.positions > tbody > tr > th
{
  font-weight: bold;
  padding-top: 0.5em;
}

table.positions > tbody > tr > td
{
  padding-left: 32px;
}

table.positions > tbody > tr > td.vacant
{
  font-style: italic;
}

.indent
{
  padding-left: 32px;
}

.smallcaps
{
  font-variant: small-caps;
  font-feature-settings: "smcp";
}

blockquote
{
  background: #f9f9f9;
  border-left: 0.2em solid #ccc;
  margin: 1.5em 0.2em;
  padding: 0.5em 0.2em;
  quotes: "\201C" "\201D" "\2018" "\2019";
}

blockquote:before
{
  content: open-quote;
  color: #ccc;
  font-size: 3em;
  line-height: 0.1em;
  margin-right: 0.05em;
  vertical-align: -0.4em;
  font-family: serif;
}

blockquote p
{
  display: inline;
}

.automaticcolumns
{
  columns: 2;
  -moz-columns: 2;
  -webkit-columns: 2;
}

.monthheader
{
  font-family: 'Lato', sans-serif;
  font-size: 10.5pt;
  width: 5em;
  background: linear-gradient(180deg, rgba(30,63,10,1) 0%, rgba(30,63,10,1) 83%, rgba(87,112,31,1) 84%, rgba(87,112,31,1) 100%) #1E3F0A;
  border: 1px solid black;
  color: white;
  text-align: center;
  font-weight: 100;
  padding: 0em 0.5em 0.5em 0.5em;
}

.details
{
  border: 1px solid black;
  font-style: italic;
  font-size: 8.5pt;
  padding-left: 2px;
  padding-right: 2px;
}

.externallinkicon
{
  width: 9px;
  height: 9px;
}

@media screen and (max-device-width: 10in)
{
  body
  {
    background: white;
    margin: 0px;
  }

  .topbanner
  {
    height: 162px;
    background-size: 200%;
  }

  .navbar
  {
    height: 0px;
    overflow: visible;
    position: relative;
  }

  .navbar > .menubutton
  {
    display: inline-block;
    float: right;
    margin: 0.5cm;
  }

  .navbar > a
  {
    clear: right;
    z-index: 1;
    display: block;
    font-size: 1cm;
    height: 1.75cm;
    padding-top: 0.5cm;
    width: 100%;
    border: 1px solid black;
  }

  .navbar > #navbartoggle ~ a
  {
    display: none;
  }

  .navbar > #navbartoggle:checked ~ a
  {
    display: block;
  }

  .navbar > #navbartoggle
  {
  }

  .navbar > #navbarbutton,
  .navbar > #navbarbutton::before,
  .navbar > #navbarbutton::after
  {
    display: block;
    background-color: white;
    position: absolute;
    height: 4px;
    width: 30px;
    border-radius: 2px;
  }

  .waterfalls
  {
    z-index: -1;
    height: 250px;
    background-size: 200%;
    background-position: center;
  }

  .contentcontainer
  {
    flex-direction: column;
    font-size: 1cm;
    padding-left: 0.5cm;
    padding-right: 0.5cm;
  }

  .contentcontainer .contentcolumn,
  .contentcontainer .contentcolumn + .contentcolumn
  {
    width: 100%;
    border: 0;
  }

  table.newsbox > tbody > tr > th
  {
    height: 1.8cm;
    background: url('images/topicbacker.gif') bottom repeat-x #ececf3;
  }

  .article h1
  {
    font-size: 1cm;
  }

  div.twocolumnsifspace
  {
    flex-direction: column;
    margin: 1em;
  }

  div.twocolumnsifspace > *
  {
    margin: 0;
  }

  div.centercolumn
  {
    width: 90%;
  }

  input
  {
    font-size: 1cm;
  }

  input[type=checkbox], input[type=radio]
  {
    transform: matrix(2, 0, 0, 2, 0, -6);
  }

  table.appform, table.appform td
  {
    display: block;
  }

  input.wideinput
  {
    width: 100%;
  }

  .automaticcolumns
  {
    columns: unset;
  }

  .monthheader
  {
    font-size: 0.7cm;
  }

  .details
  {
    font-size: 0.8cm;
  }

  .externallinkicon
  {
    width: 0.7cm;
    height: 0.7cm;
  }

  textarea
  {
    font-size: 1cm;
    width: 100%;
    height: 4em;
  }

  .bottombanner
  {
    font-size: 0.8cm;
    height: 2.3cm;
  }

  .bottombanner > .bottombannerleaf
  {
    position: relative;
    top: -0.2cm;
    width: 2cm;
    height: 2.6cm;
  }
}
