:root {
  --corridor: 84.8333rem;
  --font:     'Arial';

  --body-back:            #ffffff;
  --body-text:            #000000;
  --footer-back:          #000000;
  --footer-text:          #ffffff;
  --trim:                 #EFA630;
  --alternate-trim:       #ed6826;
  --button-back:          var(--trim);
  --button-text:          #ffffff;
  --button-hover-back:    #ffffff;
  --button-hover-text:    var(--trim);
  --dimmer-back:          rgba(30, 30, 30, 0.7);
  --dimmer-text:          #ffffff;
  --link-text:            var(--trim);
  --link-visited-text:    var(--alternate-trim);
}

html.dark-mode,
body.dark-mode {
  --body-back:            #222222;
  --body-text:            #ffffff;
  --footer-back:          #000000;
  --footer-text:          #ffffff;
  --trim:                 #EDAB28;
  --alternate-trim:       #f1854f;
  --button-back:          var(--trim);
  --button-text:          #ffffff;
  --button-hover-back:    #ffffff;
  --button-hover-text:    var(--trim);
  --dimmer-back:          rgba(90, 90, 90, 0.7);
  --dimmer-text:          var(--trim);
  --link-text:            var(--trim);
  --link-visited-text:    var(--alternate-trim);
}

::-moz-selection,
::selection {color: var(--button-text); background-color: var(--button-back);}

* {box-sizing: border-box; outline: none; min-width: 0;}

html {font-size: 18px; background-color: var(--body-back); width: 100%; overflow-x: hidden}
html, body {min-height: 100vh;}

body {padding: 0; margin: 0; font-family: var(--font); color: var(--body-text); letter-spacing: 0; line-height: 1.33rem; max-width: 100%; font-size: 1rem;}

a {color: var(--link-text); text-decoration: underline; margin: 0}
a:hover,
a:focus {text-decoration: underline;}
a:active {text-decoration: underline;}
a:visited {color: var(--alternate-trim)}

.button,
input[type="submit"],
button,
a.button {border: 1px solid var(--button-back); font-size: 1rem; line-height: 1; padding: 10px 20px; text-decoration: none; text-transform: uppercase; font-weight: normal; background-color: var(--button-back); color: var(--button-text); cursor: pointer; display: inline-block;}

.button:hover,
input[type="submit"]:hover,
button:hover {color: var(--button-hover-text); background-color: var(--button-hover-back)}

strong {font-weight: bold;}
em {font-style: italic;}

form {}
  form label {}

.image {}
  .image img {display: block; height: auto; max-width: 100%; width: auto}

.hide-text {display: inline-block; overflow: hidden; text-indent: 100%; line-height: 100%; color: transparent;}

input:-webkit-autofill::first-line,
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active {-webkit-box-shadow: 0 0 0 1.6666rem var(--body-back) inset !important; font-family: var(--font) !important; font-size: 1rem !important;}


a.select-field {text-decoration: none !important;}
.select-field * {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: var(--body-text)}

.select-field {position: relative; font-size: 0.8888rem; background: transparent; cursor: pointer; display: block; text-decoration: none;}
.select-field::before,

.select-field.active {}
.select-field.active::before {transform: translateY(-50%) rotate(180deg);}
  .select-field .select-inner {}
    .select-field .selected {padding: 0.5rem 0.5555rem; border: 0.02777rem solid var(--trim);}

    .select-field .options {display: none; position: absolute; top: 100%; left: 0; width: 100%; z-index: 1000; border-top: 0}
    .select-field.active .options {display: block;}
      .select-field .options .option {color: var(--body-text); padding: 0.2755rem 0.5555rem; display: block; text-decoration: none !important;}
      .select-field .options .option:hover {}


.privacy-modal {padding: 25px; background-color: var(--dimmer-back); position: fixed; bottom: 0; left: 0; width: 100%;}
  .privacy-modal .privacy-modal-inner {}
    .privacy-modal h4 {color: var(--dimmer-text)}
    .privacy-modal p {color: var(--dimmer-text)}
    .privacy-modal p.ack {text-align: right;}

.footer-buttons-container {position: fixed; bottom: 50px; right: 50px; z-index: 9999}
.clearing-cache {position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(255, 255, 255, 0.6) url(../../images/loader.svg) 50% 50% / 200px no-repeat; z-index: 9999} 

header .dark-mode {float: right; width: 1.5rem; height: 1.5rem; background: transparent url(../../images/default/night-mode.png) 50% / 100% no-repeat; top: 50%; transform: translateY(-50%); position: relative; border-radius: 50%; cursor: pointer;}
html.dark-mode header .dark-mode {background-image: url(../../images/default/day-mode.png)}