:root {
    --lightshade:       #ffffff;
    --verylightprimary: #95e7c4;
    --lightprimary:     #75c7a4;
    --primary:          #459774;
    --darkprimary:      #226632;
    --contrast:         #a50f88;
    --darkshade:        #343a40;
    --menubg:           #243030;
}

html input {
    font-size: 20px;
}

a { color: var(--darkprimary); }
/*a:visited { color: inherit; }*/
a:hover, a:active { color: var(--contrast); }

.clear{ clear: both; }

.bg-black{ background: black; }
.bg-white{ background: white; }
.bg-dark{ background: var(--darkshade); }
.bg-menu{ background: var(--menubg); }
.bg-contrast{ background: var(--contrast); }

.text-danger { color: var(--contrast); }
.text-primary{ color: var(--primary); }
.text-center { text-align: center; }
.text-white  { color: white; }
.text-black  { color: black; }

.float-right { float: right; }
.float-left { float: left; }
.d-inline-block { display: inline-block; }
.rounded     { border-radius: 10px; }
.box-shadow  { box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.4); }
.list-unstyled { padding-left: 0; list-style: none; }

.row{ display:flex; flex-wrap: wrap; }
.col{ flex-basis: 0; flex-grow: 1; max-width: 1; }
.w-100{ width: 100%; }


.container-fluid{ max-width:1200px; margin: 0 auto; }

/* Fancy Select Input - also tag with btn to pick up common formatting */
.dropdown-el {
  min-width: 12em;
  position: relative;
  display: inline-block;
  margin: 0;
  min-height: 2em;
  max-height: 2em;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
  color: #444;
  outline: none;
  border: 0.06em solid transparent;
  border-radius: 1em;
  background-color: #cde4f5;
  transition: 0.3s all ease-in-out;
}

.dropdown-el input:focus + label {
}
.dropdown-el input {
  width: 1px;
  height: 1px;
  display: inline-block;
  position: absolute;
  opacity: 0.01;
}
.dropdown-el label {
  border-top: 0.06em solid #d9d9d9;
  display: block;
  height: 2em;
  line-height: 2em;
  padding-left: 1em;
  padding-right: 3em;
  cursor: pointer;
  position: relative;
  transition: 0.3s color ease-in-out;
}
.dropdown-el label:nth-child(2) {
  margin-top: 2em;
  border-top: 0.06em solid #d9d9d9;
}
.dropdown-el input:checked + label {
  display: block;
  border-top: none;
  position: absolute;
  top: 0;
  width: 100%;
}
.dropdown-el input:checked + label:nth-child(2) {
  margin-top: 0;
  position: relative;
}
.dropdown-el::after {
  content: "";
  position: absolute;
  right: 0.8em;
  top: 0.9em;
  border: 0.3em solid #3694d7;
  border-color: #3694d7 transparent transparent transparent;
  transition: 0.4s all ease-in-out;
}
.dropdown-el.expanded {
  border: 0.06em solid #3694d7;
  background: #fff;
  border-radius: 0.25em;
  padding: 0;
  box-shadow: rgba(0, 0, 0, 0.1) 3px 3px 5px 0px;
  max-height: 15em;
}
.dropdown-el.expanded label {
  border-top: 0.06em solid #d9d9d9;
}
.dropdown-el.expanded label:hover {
  color: #3694d7;
}
.dropdown-el.expanded input:checked + label {
  color: #3694d7;
}
.dropdown-el.expanded::after {
  transform: rotate(-180deg);
  top: 0.55em;
}


/* General Buttons */
.btn {
  display: inline-block;
  min-width: 200px;
  width: fit-content;
  width: -moz-fit-content;
  min-height: 60px;
  margin: 12px 0;
  padding: 1px 6px;
  position: relative;
  background: #800;
  margin-top: 12px;
  margin-bottom: 25px;
  outline: none;
  border-radius: 32px;
  border: 2px solid rgba(0,0,0,1);
  text-align: center;
  cursor: pointer;
  transition: all 0.1s ease-in-out;
  line-height: 50px;
  font-size: 24px;
  font-weight: semibold;
  color: #fff;
}

.btn.small {
    min-width: 100px;
    border-radius: 16px;
    min-height: 32px;
    line-height: 32px;
    font-size:16px;
}
.btn:hover {
  background: white;
  color: black;
  border-color: #400;
}
.btn.btn-active {
    background:var(--contrast);
    color: var(--lightshade);
}
.btn:active {
  opacity: 1;
  color: #79e3b6;
}

.dark {
}

.shade       { background: rgba(255,255,255,0.2); }
.shade-red   { background: rgba(255,200,200,0.2); }
.shade-green { background: rgba(200,255,200,0.2); }
.shade-blue  { background: rgba(200,200,255,0.2); }

.inset { padding: 4px; margin-bottom: 12px; }
.inset p:first-of-type { margin-top: 0; }
.inset p:last-of-type  { margin-bottom: 0; }

.nobullets { list-style: none; }


.btn.dark:hover {
    background: white;
    color: black;
    box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.4), -6px -6px 10px rgba(80, 80, 80, 0.2);
}
.btn.dark:active {
  opacity: 1;
  box-shadow: inset 4px 4px 8px rgba(0, 0, 0, 0.3), inset 8px 8px 16px rgba(80, 80, 80, 0.1);
  color: #79e3b6;
}

.btn.btn-disabled{
    color: darkgray;
    background: gray;
}

.btn.btn-disabled:hover{
    color: darkgray;
    background: gray;
}

.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    margin: .375rem 0;
    font-size: max(16px,1rem);
    line-height: 1.5;
    color: #495057;
    background-color: #eff;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}


h1, h2, .ny5-fancy-title{ font-family: 'Raleway'; }
.ny5-body-text{ font-family: 'Dosis'; }

.ul-stripes li:nth-child(even){ color: #152e23; }
.ul-stripes li:nth-child(odd){ color: #000000; }


body{
    font-family: 'Dosis';
    background: var(--lightshade);
    color: var(--darkshade);
    margin: 0;
}

body.ADMIN, body.admin, body.SECURE{
    background: white;
    color: var(--darkshade);
}


.dropdown-item:hover, .dropdown-item:focus {
    background-color: #d1e5dd;
    color: #000000;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #131414;
    color: #ffffff;
}