html,body {
  display:block;
  font-family:ProximaNova,"Gotham Book",Arial,Tahoma,Verdana;
  font-size:21px;
  line-height:1.2em;
  height:100%;
  width:100%;
  background-color:white;
  color:black;
  margin:0;
}
body {
  display:flex;
  flex-direction:column;
}
button {
  font-family:ProximaNova,"Gotham Book",Arial,Tahoma,Verdana;
  font-size:21px;
}
a {
  text-decoration:none;
  color:#00cf00;
}
a:hover,
a:focus {
  text-decoration:underline;
}
bgy {
  background-color:#ffff005f;
  padding:0 5px;
}
blink {
  animation-duration:1s;
  animation-name:blink;
  animation-iteration-count:infinite;
  animation-timing-function:steps(2,start);
}
@keyframes blink {
  100% { visibility: hidden; }
}
details summary {
  cursor:pointer;
  margin-left:-2px;
}
details p,
details table,
details ol,
details ul {
  margin-left:2em;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top:0;
  line-height:100%;
}
li {
  margin-bottom:12px;
}

.print {
  display:none;
  width:100%;
  padding:5%;
}
.desktop {
}
.mobile {
  width:100vw;
}

@media(max-width:1279px) { .desktop { display:none; visibility:hidden; } main { font-size:80%; line-height:125%; } h1 { line-height:111%; } }
@media(min-width:1280px) { .mobile { display:none; visibility:hidden; } }
@media print {
  .nhc {
    display:none !important;
  }
  .print {
    display:flex;
  }
  a {
    color:#003f00;
  }
}

.p_logo {
  padding-right:3%;
  _padding:0 3% 0 0;
  _margin-bottom:32px;
  vertical-align:bottom;
}
.p_logo b {
  color:black;
  font-size:388%;
  text-shadow: 0 1px 0 #aaa, 
               0 2px 0 #b9b9b9,
               0 3px 0 #bbb,
               0 4px 0 #c9c9c9,
               0 5px 0 #ccc,
               0 6px 1px rgba(0,0,0,.15),
               0 0 5px rgba(0,0,0,.2),
               0 1px 3px rgba(0,0,0,.25),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.3),
               0 10px 10px rgba(0,0,0,.1),
               0 20px 20px rgba(0,0,0,.1);
}
.p_name {
  vertical-align:bottom;
  line-height:0.8em;
  position:relative;
  bottom:-12px;
}
.p_uri {
  font-size:73%;
}

.heading_o {
  display:block;
  _background-color:#3fdf3f;
  _background-color:#1f7f1f;
  background-color:#355e3b;
  color:limegreen;
  box-shadow:rgba(0, 0, 0, 0.5) 0 0 17px 0;
  padding:1% 0;
}
.heading {
  display:flex;
  color:green;
  margin:0 auto;
  min-width:1280px;
  max-width:1280px;
  width:1280px;
}
.heading a {
  _color:inherit;
  color:#dfdfdf;
}
.heading-r a:hover,
.heading-r a:focus {
  text-decoration:underline;
}
.heading-l {
  margin:auto 0 0 0;
  padding:27px 0 7px 0;
}
.heading-l a {
  text-decoration:none;
}
.heading-m {
  margin:auto 0 0 0;
  vertical-align:bottom;
}
.heading-r {
  margin:auto 0 0 auto;
  padding-right:27px;
  text-align:right;
  font-size:88%;
  line-height:1.3em;
  vertical-align:bottom;
}
.logo {
  padding-right:21px;
  color:white;
  font-size:388%;
  text-shadow: 0 1px 0 #ccc, 
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}
table.sf td {
  font-size:80%;
}

.m_heading_o {
  position:fixed;
  display:block;
  _z-index:1;
  top:0;
  left:0;
  right:0;
  width:100vw;
  min-width:100vw;
  background-color:#008f00;
  box-shadow:rgba(0, 0, 0, 0.5) 0 0 17px 0;
}
.m_heading {
  display:block;
  padding:2% 6% 2% 5%;
  _width:100%;
}
.m_menu {
  _padding-top:2%;
  _margin-bottom:-2%;
  _width:100%;
}
.m_menu summary {
  list-style:none;
  _float:right;
  _width:100%;
}
.m_menu::marker {
  display:none;
}
.m_burger {
  cursor:pointer;
}
.m_options {
  font-size:88%;
  color:white;
  display:inline-block;
  padding:22px 0 16px 2%;
}
.m_options a {
  color:white;
  padding:3px 12px;
}
.m_options a:hover,
.m_options a:focus {
  background-color:black;
  text-decoration:none;
}
.m_logo {
  _flex-grow:1;
  color:white;
  font-size:138%;
  text-shadow:0 1px 0 #ccc, 
              0 2px 0 #c9c9c9,
              0 3px 0 #bbb,
              0 4px 0 #b9b9b9,
              0 5px 0 #aaa,
              0 6px 1px rgba(0,0,0,.1),
              0 0 5px rgba(0,0,0,.1),
              0 1px 3px rgba(0,0,0,.3),
              0 3px 5px rgba(0,0,0,.2),
              0 5px 10px rgba(0,0,0,.25),
              0 10px 10px rgba(0,0,0,.2),
              0 20px 20px rgba(0,0,0,.15);
}
.m_logo:hover,
.m_logo:focus {
  text-decoration:none;
}

.title {
  text-shadow:0 0 6px rgba(255,255,255,0.7);
}

.menubar_o {
  position:relative;
  color:black;
  width:100%;
  background-color:#e0f0e07f;
}
.menubar {
  margin:0 auto;
  min-width:1280px;
  width:1280px;
  vertical-align:top;
}

.banner_none {
  display:flex;
  height:1px;
  min-height:1px;
  _background-color:#1f7f1f;
  background-color:#355e3b;
  box-shadow:rgba(0, 0, 0, 0.5) 0 0 17px 0;
}
.banner {
  display:flex;
  align-items:center;
  justify-content:center;
  height:420px;
  min-height:333px;
  _background:black url(/images/banners/osoyoos-pan-bd.avif) no-repeat center;
  _background-position-y:32%;
  background-color:black;
  background-repeat:no-repeat;
  background-position:center;
  background-image:var(--banner-bg);
  background-size:cover;
  box-shadow:rgba(0, 0, 0, 0.5) 0 0 17px 0;
}
.banner-text {
  display:block;
  text-align:center;
  line-height:88%;
  font-size:500%;
  font-weight:900;
  text-shadow:0px 4px 3px rgba(0,0,0,0.4),
              0px 8px 13px rgba(0,0,0,0.1),
              0px 18px 23px rgba(0,0,0,0.1),
              0px 0px 8px rgba(0,0,0,0.3);
  color:white;
}

/* Dropdown Button */
.menu-button {
  color:black;
  padding:24px;
  _transform:scalex(0.8);
  _font-size:1.2em;
  border:none;
  cursor:pointer;
  background:transparent url(/images/chevron-down.svg);
  background-size:24px 24px;
  background-position:center right 20px;
  background-repeat:no-repeat;
  padding-right:53px;
}

/* Dropdown button on hover & focus */
.menu-button:hover,
.menu-button:focus {
  background-color:#00ff002f;
}

/* The container <div> - needed to position the dropdown frame */
.dropdown {
  position:relative;
  display:inline-block;
  margin:0 -3px;
}

/* Dropdown frame (hidden by default) */
.dropdown-frame {
  position:fixed;
  display:none;
  cursor:default;
  box-shadow:0 8px 56px 0 rgba(0,0,0,0.15);
  _z-index:1;
  max-width:1200px;
  background-color:white;
  color:black;
  overflow:auto;
  text-align:left;
  padding:32px;
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
}

/* Dropdown content that goes inside of the frame */
.dropdown-content {
  display:flex;
}

/* Links inside the dropdown */
.dropdown-content a {
  _background-color:#00ff002f;
  _color:black;
  _color:#00cf00;
  padding:3px 2px;
  text-decoration:none;
  font-weight:bold;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover,
.dropdown-content a:focus {
  background-color:#00ff005f;;
  color:black;
}

/* Images inside the dropdown */
.dropdown-content img {
  color:black;
  padding:12px 16px;
  text-decoration:none;
  display:block;
}

.col {
  float:left;
  display:block;
  vertical-align:top;
  width:auto;
}
.col:not(:nth-child(1)) {
  margin-left:10px;
  padding-left:20px;
  _border-left:1px solid #1f7f1f;
  border-left:1px solid #355e3b;
}

main_o {
  display:block;
  background-color:white;
  color:black;
  _width:100%;
  overflow-x:scroll;
}
main {
  display:block;
  margin:2% auto;
  padding:12px 5%;
  _min-width:1280px;
  _width:1280px;
  height:100%;
}

.footer {
  display:block;
  _background-color:#1f7f1f;
  background-color:#355e3b;
  color:limegreen;
  line-height:1.1em;
  margin:auto 0 0 0;
  padding:1% 3% 0.1% 3%;
  font-size:80%;
  box-shadow:rgba(0, 0, 0, 0.5) 0 0 17px 0;
  _width:100%;
}
.footer a {
  color:#dfdfdf;
}
.footer i {
  color:#33cc33;
  font-size:90%;
  line-height:1.0em;
}
.footer i a {
  color:inherit;
}
.footer span {
  _display:inherit;
  width:100%;
  margin:auto 0;
  color:#11aa11;
  align-items:center;
  height:1px;
}
.footer span i {
  color:#11aa11;
}
.m_footer {
  font-size:65%;
  line-height:111%;
  padding:0 3%;
}
.m_footer span i,
.m_footer span i a {
  font-size:88%;
  color:#7f7f7f;
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-frame container when the user clicks on the dropdown button) */
.show {
  display:block;
}

@font-face {
  font-family:ProximaNova;
  src:url('/images/ProximaNova-Regular.woff2') format('woff2');
  font-weight:normal;
  font-style:normal;
  font-display:swap;
}
@font-face {
  font-family:ProximaNova;
  src:url('/images/ProximaNova-RegularIt.woff2') format('woff2');
  font-weight:normal;
  font-style:italic;
  font-display:swap;
}
@font-face {
  font-family:ProximaNova;
  src:url('/images/ProximaNova-Bold.woff2') format('woff2');
  font-weight:bold;
  font-style:normal;
  font-display:swap;
}
@font-face {
  font-family:ProximaNova;
  src:url('/images/ProximaNova-BoldIt.woff2') format('woff2');
  font-weight:bold;
  font-style:italic;
  font-display:swap;
}

input[type=file]::file-selector-button,
input[type=reset],
input[type=submit],
button:not(.menu-button), .button {
  background-color:#3fbf3f;
  color:white;
  background-size:auto 100%
  _text-shadow:rgba(0, 0, 0, 0.5) 0 0 3px 0;
  text-shadow:0 0 8px rgba(31, 127, 31, 0.8),
              -2px 2px 3px rgba(31, 127, 31, 0.65);
  padding:0.5% 1.5%;
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
  border-radius:12px;
}
input[type=file]::file-selector-button {
  font-size:88%;
  padding:1.5% 4%;
  margin-right:12px;
}
textarea {
  display:block;
  clear:none;
  padding:0.5em;
  width:100%;
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
  background-color:#e0f0e07f;
}
input {
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
  background-color:#e0f0e07f;
}
input[type=file] {
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
  border-radius:12px;
}
.form-final {
  padding-left:12px;
  padding-right:12px;
  _border:1px solid #1f7f1f;
  border:1px solid #355e3b;
  background-color:#e0f0e07f;
}

#tab_off {
  background:#3fbf3f;
  _font-weight:bold;
  display:inline-block;
  text-align:left;
  cursor:pointer;
  border:1px solid white;
  _padding:8px 16px;
  padding:12px 32px;
}
#tab_on {
  background:#3f3fbf;
  color:white;
  _font-weight:bold;
  display:inline-block;
  text-align:left;
  cursor:pointer;
  border:1px solid white;
  _padding:8px 16px;
  padding:12px 32px;
}