@charset "UTF-8";

@font-face {
  font-family: Carattere;
  src: url('/fonts/Carattere/Carattere-Regular.ttf') format('truetype');
}

@font-face {
  font-family: Nunito;
  src: url('/fonts/Nunito/Nunito-Regular.ttf') format('truetype');
}

@font-face {
  font-family: Quicksand;
  src: url('/fonts/quicksand/Quicksand-Regular.otf') format('opentype');
}

@font-face {
  font-family: Schoolbook;
  src: url('/fonts/Schoolbook/CENSCBK.TTF') format('truetype');
}

@font-face {
  font-family: Receipt;
  src: url('/fonts/FAKERECE.ttf') format('truetype');
}

html, body {
  height:100%;
  color:#1a1a1a;
  line-height:1.5;
}

html {
  font-size:18px;
}

body {
  font-size:100%;
  margin:0;
}

body, h1,h2,h3,h4,h5,h6 { font-family: Nunito, Quicksand, sans-serif; }

h1,h2,h3,h4,h5,h6,b,strong { font-weight:600; }

#myNavbar {
  background-color:#000;
  color:linen;
}

#myNavbar a:link, 
#myNavbar a:hover {
  color:inherit;
  text-decoration:none;
}

#myNavbar a:last-of-type {float:right;}

#content {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-top:43px;
  width:100%;
  min-height: 96vh;
}

#box {
  position:relative;
  width:inherit;
  max-width:1280px;
  margin:0 auto;
}

#footer {
  position:relative;
  bottom:0;
  height:4vh;
  width:100%;
}

a {
  color:#8A2BE2;
  text-decoration:none;
}

a:hover {text-decoration:none;}

a.link {text-decoration:underline;}

.mid-ctr {
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  height:50%;
}

.mid-ctr > img {
  width:auto;
  margin:0;
}

.desc {
  padding: 15px;
  text-align: center;
}

.seethru {
  opacity:0.91;
}

.serif {font-family:Schoolbook, serif;}

.mono {font-family: "Roboto Mono", "Courier New", monospace;}

.receipt {font-family:Receipt;}

.posh {
  font-family: Carattere, Nunito, sans-serif;
  font-weight: normal;
  font-style: normal;
}

.big-font {
  font-size: clamp(2.25rem, 1.467rem + 3.913vw, 4.5rem);
}

.glow {
  color:linen;
}

.tint {
  background-color: rgba(128,128,128,0.3);
}

.dark-tint {
  background-color: rgba(0,0,0,0.5);
}

.b-shadow {
  box-shadow:0 5px 4px -3px #333;
}

.t-shadow, .btn-text {
  text-shadow: 0px 2px 1px rgba(16,16,16,0.9);
}

.btn-text:hover { text-shadow:none; }

.shade:hover {
  box-shadow: 0 2px 3px -1px #333;
  text-shadow:0px 1px 2px #000;
}

.attn {color:#483D8B}

.error {
  font-family: monospace;
  font-weight:normal;
  font-size:smaller;
}

.alert-box {
  box-shadow:0 0 1px #900, 0 0 2px #f33;
  padding:2pt 4pt 3pt 4pt;
}

.warning { color:#c00;}

.warning-icon::before {
  content:"\26A0";
  line-height:inherit;
  vertical-align:baseline;
  font-size:inherit;
  height:initial;
  max-height:inherit;
  padding:0 0.25em;
  background-color:#fcc; 
  text-shadow: 0 0 1px yellow, 0 1px 3px silver;
}

.good2go, a:hover {
  color:forestgreen;
}

.hover:hover { box-shadow: 0 2px 3px -1px #101010; text-decoration:none; }

.result { background-color:cornsilk; }

.sm-sq {
  height:1em;
  width:auto;
  line-height:1em;
  padding:2px;
  border-radius:4px;
  display:inline-block;
}

.collapsible {
  cursor: pointer;
  padding:6px 4px;
  width: 100%;
  outline: none;
  font-size: inherit;
}

.collapsible:hover, .collapsible.active {
  background-color:Thistle;
  color:initial;
}

.contents {
  background-color: linen;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.my-table tr td {
  vertical-align:top;
}

.my-table-style td:nth-of-type(odd) {
  text-align:right;
  font-weight:600;
  border-right:2px solid gray;
}

.text-normal-size {
  font-size:medium;
}

.reset-text {
  font-size:initial;
  color:#000;
}

.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 14em;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 4px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  vertical-align:middle;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: gainsboro;
  box-shadow: 0 0 2px DimGray inset;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 2px;
  bottom: 2px;
  box-shadow:0 1px 2px #666;
  background-color: whitesmoke;
  -webkit-transition: .4s;
  transition: .4s;
}

/* Rounded sliders */
.slider.round {
  border-radius: 24px;
}

.slider.round:before {
  border-radius: 50%;
}

input:checked + .slider {
  background-color: limegreen;
  box-shadow: 0 0 2px Green inset;
}

input:checked + .slider:before {
  -webkit-transform: translateX(18px);
  -ms-transform: translateX(18px);
  transform: translateX(18px);
}

input[contenteditable="true"]:focus {
  outline: none;
}

.clearfix::after {
  content: "";
  clear: both;
  display: block;
}

.top-rad {
  border-top-left-radius:20px;
  border-top-right-radius:20px;
}

.checkbox-custom:checked ~ .input-box {
  display:none;
  opacity: 0;
}