@import url("https://fonts.googleapis.com/css?family=Macondo+Swash+Caps&display=swap");
@import url("https://fonts.googleapis.com/css?family=Alegreya+SC&display=swap");
:root {
  --ol-margin-width: 4;
  --ol-margin-left: 4em;
  --ol-margin-left-negative: -4em;
  --black: #000000;
  --white: #FFFFFF;
  --red: #EE0000;
  --green: #00CC00;
  --blue: #0000EE;
  --yellow: #EEEE00;
  --grey: #DDDDDD;
  --cyan: #00EEEE;
  --purple: #EE00EE;
  --medium-red: #990000;
  --medium-green: #008800;
  --medium-blue: #000099;
  --medium-grey: #CCCCCC;
  --medium-purple: #990099;
  --medium-yellow: #999900;
  --medium-cyan: #00AAAA;
  --medium-dark-red: #880000;
  --medium-dark-green: #007700;
  --medium-dark-blue: #000088;
  --medium-dark-purple: #880077;
  --medium-dark-yellow: #888800;
  --dark-red: #770000;
  --dark-green: #005500;
  --dark-blue: #000077;
  --dark-grey: #777777;
  --dark-purple: #550055;
  --dark-yellow: #777700;
  --charcoal: #343434;
  --very-dark-red: #550000;
  --normal-font: Times New Roman;
  --welcome-font: Trebuchet MS;
  --title-font: Book Antiqua;
  --link-font: Book Antiqua;
  --funny-font: Alegreya SC;
  --giant-font-size: 24pt;
  --large-font-size: 16pt;
  --medium-font-size: 14pt;
  --normal-font-size: 12pt;
  --nearsmall-font-size: 11pt;
  --small-font-size: 10pt;
  --neartiny-font-size: 9pt;
  --tiny-font-size: 8pt;
  --bg-clr: #05833D;
  --bg-img: wallpaper/c529c971dd8ccc9aa278af90197a2dc4.jpg;
  --body-clr: #FFFFFF;
  --body-clr-dark: #FFFFFF;
  --bold-clr: #FFFFFF;
  --bold-shadow-clr: #1E432B;
  --borders-clr: #255235;
  --button-bg: #00AC00;
  --button-clr: #000000;
  --gradient-dark: #1E432B;
  --gradient-light: #255235;
  --input-bg: #FFFFFF;
  --input-box-shadow-clr: #000000;
  --input-clr: #000000;
  --input-text-shadow-clr: #B0B0B0;
  --italic-shadow-clr: #1E432B;
  --link-clr: #FFFF00;
  --select-bg: #FFFFFF;
  --select-clr: #000000;
  --subtitle-clr: #FFFFFF;
  --subtitle-shadow-clr: #255235;
  --title-clr: #FFFFFF;
  --title-shadow-clr: #255235; }

*, *::before, *::after {
  -webkit-font-smoothing: subpixel-antialiased;
  box-sizing: border-box;
  font-smooth: antialiased;
  font-weight: normal;
  margin: 0;
  padding: 0;
  scroll-behavior: smooth; }

html {
  box-sizing: border-box;
  cursor: url("/images/site/cursor2.png"), auto;
  font-size: var(--normal-font-size);
  height: 100%;
  width: 100%; }

body {
  box-sizing: border-box;
  height: inherit;
  width: inherit; }

.bordered {
  border: 1px solid var(--borders-clr); }

.bordered-outset {
  border: 1px outset var(--borders-clr); }

.hide {
  position: relative; }
  .hide::before {
    content: '';
    background-color: var(--gradient-light);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 1; }
  .hide:hover::before {
    opacity: 0; }

.scrollable, .scrolling_both {
  overflow: scroll;
  padding-right: 3px; }
  .scrollable::-webkit-scrollbar, .scrolling_both::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrollable::-webkit-scrollbar-thumb, .scrolling_both::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrollable::-webkit-scrollbar-track, .scrolling_both::-webkit-scrollbar-track {
    background-color: transparent; }

.scrollable-auto, .scrolling_both-auto {
  overflow: auto;
  padding-right: 3px; }
  .scrollable-auto::-webkit-scrollbar, .scrolling_both-auto::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrollable-auto::-webkit-scrollbar-thumb, .scrolling_both-auto::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrollable-auto::-webkit-scrollbar-track, .scrolling_both-auto::-webkit-scrollbar-track {
    background-color: transparent; }

.scrolling_vertical {
  overflow-x: hidden;
  overflow-y: scroll;
  padding-right: 3px; }
  .scrolling_vertical::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrolling_vertical::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrolling_vertical::-webkit-scrollbar-track {
    background-color: transparent; }

.scrolling_vertical-auto {
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 3px; }
  .scrolling_vertical-auto::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrolling_vertical-auto::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrolling_vertical-auto::-webkit-scrollbar-track {
    background-color: transparent; }

.scrolling_horizontal {
  overflow-x: scroll;
  overflow-y: hidden;
  padding-right: 3px; }
  .scrolling_horizontal::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrolling_horizontal::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrolling_horizontal::-webkit-scrollbar-track {
    background-color: transparent; }

.scrolling_horizontal-auto {
  overflow-x: auto;
  overflow-y: hidden;
  padding-right: 3px; }
  .scrolling_horizontal-auto::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrolling_horizontal-auto::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrolling_horizontal-auto::-webkit-scrollbar-track {
    background-color: transparent; }

.enlarge {
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  transform: translateY(0); }
  .enlarge:disabled {
    transition: none; }
  .enlarge:disabled {
    transform: none; }
  .enlarge:hover, .enlarge:focus {
    backface-visibility: hidden;
    filter: brightness(105%);
    transform: translateY(3);
    transform: scale(1.1) translate3d(0, 0, 50px); }

.uc {
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 0 2px 0 2px; }
  .uc ::first-letter {
    font-size: +1; }

.subnavbar {
  background-color: #255235 !important;
  color: var(--bold-clr);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--title-font);
  font-size: var(--normal-font-size);
  font-weight: bold;
  display: inline-block;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 1px;
  padding-left: 5px;
  text-align: center; }
  .subnavbar.title, .subnavbar.subtitle {
    color: var(--title-clr) !important; }

.subnavbar_sunken {
  background-color: #255235 !important;
  color: var(--bold-clr);
  display: block;
  border-radius: 5px;
  border: 3px inset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--title-font);
  font-size: var(--normal-font-size);
  font-weight: bold;
  display: inline-block;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 1px;
  padding-left: 5px;
  text-align: center; }
  .subnavbar_sunken.title, .subnavbar_sunken.subtitle {
    color: var(--title-clr) !important; }

.subnavbar_dark {
  background-color: #1E432B !important;
  color: var(--bold-clr);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--title-font);
  font-size: var(--normal-font-size);
  font-weight: bold;
  color: inherit;
  display: inline-block;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 1px;
  padding-left: 5px;
  text-align: center; }

.title {
  font-family: var(--title-font) !important;
  font-size: var(--giant-font-size);
  font-weight: bold !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
  color: var(--title-clr) !important; }

.subtitle {
  font-family: var(--title-font);
  font-size: var(--large-font-size);
  font-weight: bold !important;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
  color: var(--subtitle-clr) !important; }

.container {
  display: inline-block;
  margin: 0 auto; }

.center {
  text-align: center;
  justify-content: center; }

.center-auto {
  margin: auto auto; }

.centered {
  margin: auto auto !important; }

.centered-top {
  margin: top center !important; }

.centered-bottom {
  margin: bottom center !important; }

.centered-left {
  margin: center left !important; }

.centered-right {
  margin: center right !important; }

.danger {
  background-color: #990000 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--red);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  border-width: 3px;
  padding-top: 25px;
  padding-right: 25px;
  padding-bottom: 25px;
  padding-left: 25px; }
  .danger button, .danger select {
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }
  .danger b {
    color: white;
    font-weight: bold; }

.vh {
  min-height: 100vh; }

.vw {
  min-width: 100vw; }

.titlebar {
  background-color: #255235 !important;
  color: var(--bold-clr);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: var(--giant-font-size);
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }

.hilite:hover, .hilite:focus {
  filter: brightness(108%); }

.highlight {
  color: var(--black) !important;
  background-color: var(--medium-green) !important;
  border-radius: inherit; }

.copyright {
  font-size: var(--tiny-font-size) !important; }

.seethrufont {
  font-family: inherit;
  font-size: 2.5rem;
  background-image: url("https://unsplash.it/50");
  background-size: cover;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent; }

.right-aligned {
  display: grid;
  justify-content: right;
  min-width: 100%;
  min-height: 100%; }

.green-panel,
.yellow-panel,
.white-panel,
.purple-panel,
.purple-light-panel,
.red-panel,
.blue-panel,
.cyan-panel,
.normal-panel,
.error,
.notice,
.description {
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }

.notice, .description {
  background-color: #999900 !important;
  color: var(--black);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--yellow);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 10px;
  padding-bottom: 0;
  padding-left: 10px; }
  .notice a, .notice a:visited, .notice a:hover, .description a, .description a:visited, .description a:hover {
    color: blue; }
  .notice b, .notice i, .description b, .description i {
    color: black; }

.notice {
  animation: noticeblink 250ms;
  animation-iteration-count: 8; }

@keyframes noticeblink {
  50% {
    background-color: yellow; } }

.description {
  background-color: var(--gradient-dark);
  background-image: radial-gradient(center, yellow, yellow, var(--dark-yellow));
  background-image: -o-radial-gradient(center, yellow, yellow, var(--dark-yellow));
  background-image: -ms-radial-gradient(center, yellow, yellow, var(--dark-yellow));
  background-image: -moz-radial-gradient(center, yellow, yellow, var(--dark-yellow));
  background-image: -webkit-radial-gradient(center, yellow, yellow, var(--dark-yellow)); }

.error {
  animation: errorblink 250ms;
  animation-iteration-count: 8;
  background-color: #990000 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--red);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--caps-font);
  font-size: inherit;
  font-weight: bold;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }

@keyframes errorblink {
  50% {
    background-color: red; } }
  .error i {
    color: var(--white); }
  .error a, .error b {
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .error a, .error a:visited, .error a:hover {
    color: yellow; }
  .error b, .error i {
    color: white; }

.red-panel {
  background-color: #990000 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--red);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .red-panel a, .red-panel a:visited, .red-panel a:hover {
    color: yellow; }
  .red-panel b, .red-panel i {
    color: white !important; }
  .red-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--white); }

.green-panel {
  background-color: #008800 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--green);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .green-panel a, .green-panel a:visited, .green-panel a:hover {
    color: yellow; }
  .green-panel b, .green-panel i {
    color: white !important; }
  .green-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--black); }

.yellow-panel {
  background-color: #999900 !important;
  color: var(--black);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--yellow);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .yellow-panel a, .yellow-panel a:visited, .yellow-panel a:hover {
    color: blue; }
  .yellow-panel b, .yellow-panel i {
    color: black !important; }
  .yellow-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--black); }

.white-panel {
  background-color: #FFFFFF !important;
  color: var(--black);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--black);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .white-panel a, .white-panel a:visited, .white-panel a:hover {
    color: blue; }
  .white-panel b, .white-panel i {
    color: black !important; }
  .white-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--black); }

.purple-panel {
  background-color: #550055 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--medium-purple);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .purple-panel a, .purple-panel a:visited, .purple-panel a:hover {
    color: yellow; }
  .purple-panel b, .purple-panel i {
    color: white !important; }
  .purple-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--white); }

.purple-light-panel {
  background-color: #880077 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--purple);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .purple-light-panel a, .purple-light-panel a:visited, .purple-light-panel a:hover {
    color: yellow; }
  .purple-light-panel b, .purple-light-panel i {
    color: white !important; }
  .purple-light-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--white); }

.blue-panel {
  background-color: #000099 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--blue);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .blue-panel a, .blue-panel a:visited, .blue-panel a:hover {
    color: yellow; }
  .blue-panel b, .blue-panel i {
    color: white !important; }
  .blue-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--white); }

.cyan-panel {
  background-color: #00AAAA !important;
  color: var(--black);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--cyan);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }
  .cyan-panel a, .cyan-panel a:visited, .cyan-panel a:hover {
    color: blue; }
  .cyan-panel b, .cyan-panel i {
    color: black !important; }
  .cyan-panel hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid var(--black); }

.normal-panel {
  background-color: #255235 !important;
  color: var(--body-clr-dark);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px; }

.button-panel {
  background-color: #00AC00 !important;
  color: var(--white);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--button-bg);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal;
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  margin-top: 2px; }

.block {
  display: block !important; }

.tall {
  height: 100% !important; }

.wide {
  width: 100% !important; }

.hidden {
  opacity: 0;
  transform: scale(0);
  min-width: 5px;
  transition: all 1500ms linear;
  backface-visibility: hidden; }
  .hidden:disabled {
    transition: none; }

.inline {
  display: inline; }

.minititle {
  color: #FFFFFF;
  font-family: Book Antiqua;
  font-size: 12pt;
  font-style: italic;
  font-weight: bold;
  text-shadow: 0px 1px 1px #255235, 1px 1px 1px #255235;
  white-space: nowrap; }

.clickable, .pointer {
  cursor: url("/images/site/pointer.png"), auto; }

.credits {
  max-height: 330px;
  overflow: hidden;
  text-align: center !important;
  width: 100%; }

.floating-menu {
  position: fixed;
  text-align: center;
  width: 100%;
  z-index: 1000;
  height: 23px; }

.special_thanks {
  background-color: #004400;
  border: 3px ridge #000000;
  color: #FFFFFF;
  text-align: center; }

.subdesclink, .subdesclink:visited {
  background: var(--body_bg);
  border: 1px solid var(--borders_clr);
  box-shadow: 3px 3px 3px var(--input_box_shadow_clr);
  color: var(--body_clr);
  font-weight: normal;
  padding: 1px 3px 1px 3px; }

*::-webkit-input-placeholder, *:-moz-placeholder, *::-moz-placeholder, *:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
  text-shadow: var(--bold-shadow-clr) !important; }

.as_body_textcolor {
  color: var(--body-clr); }

.mailsubject, .mailbody, .mailto {
  width: 400px; }
  @media screen and (max-width: 480px) {
    .mailsubject, .mailbody, .mailto {
      width: 250px; } }
.noscroll {
  overflow-x: hidden;
  overflow-y: hidden;
  overflow: hidden; }

.snakey-link {
  color: var(--link-clr);
  position: relative; }
  .snakey-link:hover {
    cursor: pointer; }
  .snakey-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: var(--link-clr);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 250ms ease-in-out; }
  .snakey-link:hover::after {
    transform: scaleX(1);
    transform-origin: left; }

.modal {
  border-radius: 5px;
  border: 3px ridge #888888;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  position: fixed;
  z-index: 1000;
  top: 15px;
  bottom: 15px;
  left: 15px;
  right: 15px;
  box-shadow: 0 0 0 15px rgba(0, 0, 0, 0.5);
  display: none;
  background-color: var(--gradient-dark);
  background-image: radial-gradient(center, rgba(0, 0, 0, 0.25), var(--charcoal), var(--charcoal));
  background-image: -o-radial-gradient(center, rgba(0, 0, 0, 0.25), var(--charcoal), var(--charcoal));
  background-image: -ms-radial-gradient(center, rgba(0, 0, 0, 0.25), var(--charcoal), var(--charcoal));
  background-image: -moz-radial-gradient(center, rgba(0, 0, 0, 0.25), var(--charcoal), var(--charcoal));
  background-image: -webkit-radial-gradient(center, rgba(0, 0, 0, 0.25), var(--charcoal), var(--charcoal)); }
  .modal:disabled {
    transition: none; }
  .modal.is-open {
    display: block; }
  .modal .modal-close {
    background: var(--medium-red);
    position: fixed;
    left: 7px;
    top: 7px;
    border: 0;
    width: 30px;
    height: 25px;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    transform: translateY(0); }
    .modal .modal-close:disabled {
      transform: none; }
    .modal .modal-close:hover, .modal .modal-close:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
  .modal .modal-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: min-content 1fr min-content;
    column-gap: 7px;
    row-gap: 7px;
    height: 100%; }
    .modal .modal-container .modal-header {
      text-align: center;
      padding: 10px; }
    .modal .modal-container .modal-content {
      margin: auto auto !important;
      padding: 5px;
      text-align: center;
      padding-right: 3px;
      overflow: scroll;
      padding-right: 3px; }
      .modal .modal-container .modal-content::-webkit-scrollbar {
        border: 1px inset var(--borders-clr);
        background-color: var(--gradient-dark);
        height: 12px;
        width: 12px;
        border-radius: 5px; }
      .modal .modal-container .modal-content::-webkit-scrollbar-thumb {
        border: 1px outset var(--borders-clr);
        background-color: var(--gradient-light);
        width: 10px;
        border-radius: 5px; }
      .modal .modal-container .modal-content::-webkit-scrollbar-track {
        background-color: transparent; }
      .modal .modal-container .modal-content::-webkit-scrollbar {
        border: 1px inset var(--borders-clr);
        background-color: var(--gradient-dark);
        height: 12px;
        width: 12px;
        border-radius: 5px; }
      .modal .modal-container .modal-content::-webkit-scrollbar-thumb {
        border: 1px outset var(--borders-clr);
        background-color: var(--gradient-light);
        width: 10px;
        border-radius: 5px; }
      .modal .modal-container .modal-content::-webkit-scrollbar-track {
        background-color: transparent; }
    .modal .modal-container .modal-footer {
      text-align: center;
      padding: 10px; }
  .modal a {
    color: yellow; }

@keyframes modalFadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes modalFadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

.nowrap {
  white-space: nowrap; }

.small {
  font-size: var(--small-font-size) !important; }

.neartiny {
  font-size: var(--neartiny-font-size) !important; }

.gradient {
  background-color: var(--bg-clr);
  background-image: linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -o-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -ms-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -moz-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -webkit-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light)); }

.gradient-circle {
  background-color: var(--gradient-dark);
  background-image: radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -o-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -ms-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -moz-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -webkit-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45)); }

.photo-modal {
  background-color: var(--gradient-dark);
  background-image: radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -o-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -ms-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -moz-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
  background-image: -webkit-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45)); }

.nohand {
  cursor: url("/images/site/cursor.png"), auto; }

.vbordered {
  text-color: var(--borders-clr);
  border: 2px outset var(--borders-clr);
  min-height: 10px; }

.hbordered {
  text-color: var(--borders-clr);
  border: 2px outset var(--borders-clr);
  min-width: 10px; }

.faded_panel {
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  border: 1px solid transparent;
  margin-bottom: 2px; }
  .faded_panel:disabled {
    transition: none; }

.faded_panel:hover {
  background-color: #255235 !important;
  color: var(--body-clr-dark);
  display: block;
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  font-family: var(--normal-font);
  font-size: inherit;
  font-weight: normal; }

.chatwrap {
  white-space: pre-wrap;
  /* CSS3 */
  white-space: -moz-pre-wrap;
  /* Firefox */
  white-space: -pre-wrap;
  /* Opera <7 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  word-wrap: break-word;
  /* IE */
  word-break: break-word;
  /* Chrome */ }

.padded {
  padding: 5px 15px !important; }

.padded-bottom {
  padding-bottom: 5px !important; }

.padded-bottom-large {
  padding-bottom: 8px !important; }

.padded-large {
  padding: 10px 25px !important; }

.padded-left {
  padding-left: 8px; }

.padded-left-right {
  padding-left: 8px;
  padding-right: 8px; }

.padded-left-right-small {
  padding-left: 3px;
  padding-right: 3px; }

.padded-left-right-tiny {
  padding-left: 2px;
  padding-right: 2px; }

.padded-right {
  padding-right: 8px; }

.padded-tiny {
  padding: 2px 2px !important; }

.padded-top-bottom {
  padding-top: 5px;
  padding-bottom: 5px; }

.padded-top-bottom-large {
  padding-top: 8px;
  padding-bottom: 8px; }

.padded-top-bottom-small {
  padding-top: 3px;
  padding-bottom: 3px; }

.padded-small {
  padding: 3px 5px !important; }

.padding-auto {
  padding: auto auto !important; }

.padding-none {
  padding: 0 !important; }

.caps {
  font-family: var(--funny-font) !important; }

.embolden {
  font-weight: 900; }

.rounded {
  border-radius: 5px; }

.rounded-large {
  border-radius: 10px; }

.rounded-larger {
  border-radius: 15px; }

.rounded-largest {
  border-radius: 20px; }

.rounded-ends {
  border-radius: 500px; }

.circular {
  border-radius: 50%; }

.translucent,
.translucent-red,
.translucent-green,
.translucent-grey,
.translucent-blue,
.translucent-yellow,
.translucent-purple,
.translucent-cyan {
  border-radius: 5px;
  font-size: var(--normal-font-size);
  margin: 5px 5px 5px 5px;
  padding: 5px 5px 5px 5px; }

.translucent {
  border: 1px solid var(--borders-clr);
  color: var(--body-clr);
  background-color: rgba(0, 0, 0, 0.35) !important;
  color: rgba(255, 255, 255, 0.85) !important; }
  .translucent b, .translucent i {
    color: inherit; }
  .translucent a {
    color: var(--link-clr);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .translucent a:visited, .translucent a:hover, .translucent a:focus {
    color: yellow; }
  .translucent .notice {
    border: 1px solid var(--yellow); }

.translucent-red {
  border: 1px solid var(--red);
  color: white;
  background-color: rgba(200, 0, 0, 0.5) !important; }
  .translucent-red a, .translucent-red b, .translucent-red button {
    color: yellow;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .translucent-red a:visited, .translucent-red a:hover, .translucent-red a:focus {
    color: yellow; }
  .translucent-red .notice {
    border: 1px solid var(--yellow); }

.translucent-green {
  border: 1px solid var(--medium-green);
  color: white;
  background-color: rgba(0, 55, 0, 0.5) !important; }

.translucent-blue {
  border: 1px solid var(--blue);
  color: white;
  background-color: rgba(0, 0, 200, 0.5) !important; }

.translucent-yellow {
  border: 1px solid var(--yellow);
  color: white;
  background-color: rgba(200, 200, 0, 0.5) !important; }

.translucent-purple {
  border: 1px solid var(--purple);
  color: white;
  background-color: rgba(200, 0, 200, 0.5) !important; }

.translucent-cyan {
  border: 1px solid var(--cyan);
  color: black;
  background-color: rgba(0, 200, 200, 0.5) !important; }

.translucent-grey {
  border: 1px solid var(--grey);
  color: rgba(255, 255, 255, 0.75);
  background-color: rgba(127, 127, 127, 0.5) !important; }
  .translucent-grey a, .translucent-grey b, .translucent-grey button {
    color: yellow;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .translucent-grey a:visited, .translucent-grey a:hover, .translucent-grey a:focus {
    color: yellow; }
  .translucent-grey .notice {
    border: 1px solid var(--yellow); }

.translucent-fadein {
  border: 1px solid transparent;
  border-radius: 5px;
  color: rgba(255, 255, 255, 0.75);
  background-color: transparent;
  width: min-content;
  padding: 8px;
  margin-bottom: 5px; }

.translucent-fadein:hover {
  border: 1px solid var(--borders-clr);
  border-radius: 5px;
  color: rgba(255, 255, 255, 0.75);
  background-color: rgba(0, 0, 0, 0.3); }

.sticky {
  position: sticky;
  top: 2px;
  z-index: 1000000; }

.margins {
  margin: 5px !important; }

.margins-auto {
  margin: auto auto !important; }

.margins-bottom {
  margin-bottom: 5px !important; }

.margins-bottom-large {
  margin-bottom: 8px !important; }

.margins-bottom-larger {
  margin-bottom: 10px !important; }

.margins-bottom-largest {
  margin-bottom: 15px !important; }

.margins-mini {
  margin: 2px !important; }

.margins-large {
  margin: 8px !important; }

.margins-none {
  margin: 0 !important; }

.margins-left {
  margin-left: 5px !important; }

.margins-left-large {
  margin-left: 8px !important; }

.margins-left-larger {
  margin-left: 10px !important; }

.margins-left-largest {
  margin-left: 15px !important; }

.margins-left-auto {
  margin-left: auto !important; }

.margins-left-right {
  margin-left: 5px !important;
  margin-right: 5px !important; }

.margins-left-right-auto {
  margin-left: auto !important;
  margin-right: auto !important; }

.margins-left-right-mini {
  margin-left: 2px !important;
  margin-right: 2px !important; }

.margins-left-right-small {
  margin-left: 2px !important;
  margin-right: 2px !important; }

.margins-left-right-tiny {
  margin-left: 1px !important;
  margin-right: 1px !important; }

.margins-right {
  margin-right: 5px !important; }

.margins-top {
  margin-top: 5px !important; }

.margins-top-large {
  margin-top: 8px !important; }

.margins-top-larger {
  margin-top: 10px !important; }

.margins-top-largest {
  margin-top: 15px !important; }

.margins-top-bottom {
  margin-top: 5px !important;
  margin-bottom: 5px !important; }

.margins-top-bottom-auto {
  margin-top: auto !important;
  margin-bottom: auto !important; }

.margins-top-bottom-large {
  margin-top: 8px !important;
  margin-bottom: 8px !important; }

.margins-top-bottom-small {
  margin-top: 3px !important;
  margin-bottom: 3px !important; }

.margins-top-bottom-tiny {
  margin-top: 2px !important;
  margin-bottom: 2px !important; }

.margins-top-none {
  margin-top: 0 !important; }

.margins-top-small {
  margin-top: 3px !important; }

.hoverborder {
  border: 1px solid transparent; }

.hoverborder:hover {
  border: 1px solid var(--borders-clr); }

.hoverbg:hover {
  background-color: rgba(0, 0, 0, 0.15); }

.blue-bg,
.green-bg,
.yellow-bg,
.red-bg {
  text-shadow: 1px 1px 1px black; }

.blue-bg {
  background-color: var(--blue);
  color: var(--white); }

.dark-blue-bg {
  background-color: var(--dark-blue);
  color: var(--grey); }

.green-bg {
  background-color: var(--green);
  color: var(--black); }

.dark-green-bg {
  background-color: var(--dark-green);
  color: var(--grey); }

.yellow-bg {
  background-color: var(--medium-yellow) !important;
  color: var(--white); }

.red-bg {
  background-color: var(--red);
  color: var(--white); }

.inline-block {
  display: inline-block; }

.inline {
  display: inline; }

.giant-font-size {
  font-size: var(--giant-font-size); }

.large-font-size {
  font-size: var(--large-font-size); }

.medium-font-size {
  font-size: var(--medium-font-size); }

.normal-font-size {
  font-size: var(--normal-font-size); }

.nearsmall-font-size {
  font-size: var(--nearsmall-font-size); }

.small-font-size {
  font-size: var(--small-font-size); }

.neartiny-font-size {
  font-size: var(--neartiny-font-size); }

.tiny-font-size {
  font-size: var(--tiny-font-size); }

.fieldset-plain {
  background-color: transparent;
  border: 1px solid var(--borders-clr); }

.faded {
  color: rgba(0, 0, 0, 0.75); }

.no-transitions {
  transition: none !important;
  transform: none !important;
  cursor: url(/images/site/cursor2.png), auto; }

.no-transitions:hover {
  transform: none !important;
  filter: none !important;
  cursor: url(/images/site/cursor2.png), auto !important; }

.scrollbarred {
  padding-right: 3px; }
  .scrollbarred::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  .scrollbarred::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  .scrollbarred::-webkit-scrollbar-track {
    background-color: transparent; }

.min-content {
  height: min-content;
  width: min-content; }

.flexboxed {
  display: flex;
  flex-flow: row wrap;
  justify-content: start; }

.flexboxed > * {
  flex-shrink: 0;
  flex-grow: 0;
  flex-basis: auto;
  margin: 0 0 0px 0;
  padding: 5px; }

.boxshadowed {
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }

.blink {
  animation: blink 200ms;
  animation-iteration-count: 8; }

@keyframes blink {
  50% {
    filter: brightness(150%); } }

.notice-msg {
  border-style: solid;
  border-width: 2px;
  border-radius: 5px;
  padding: 15px; }

.error-msg {
  border-style: solid;
  border-width: 2px;
  border-radius: 5px;
  padding: 15px; }

.flexed-col {
  display: flex;
  flex-direction: column;
  align-items: center; }

.outlined-none {
  outline: none; }

.as_button {
  background-color: #0000EE;
  color: var(--button-clr);
  font-weight: bold;
  background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  transform: translateY(0);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9) !important;
  text-align: center; }
  .as_button:hover {
    cursor: url("/images/site/pointer.png"), auto; }
  .as_button:focus {
    outline: none;
    border: 1px solid black; }
  .as_button:disabled {
    transition: none; }
  .as_button:disabled {
    transform: none; }
  .as_button:hover, .as_button:focus {
    backface-visibility: hidden;
    filter: brightness(105%);
    transform: translateY(3);
    transform: scale(1.1) translate3d(0, 0, 50px); }

.italic {
  font-style: italic; }

.dynamic_blend {
  background-color: inherit;
  background-image: inherit;
  background-blend-mode: darken; }

.text-align-left {
  text-align: left !important; }

.text-align-right {
  text-align: right !important; }

.text-align-center {
  text-align: center !important; }

.transparent {
  background-color: transparent;
  border: transparent;
  box-shadow: none; }

.sunken {
  border: 2px inset var(--borders-clr);
  border-radius: 5px;
  background-color: var(--gradient-dark);
  background-color: var(--bg-clr);
  background-image: linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -o-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -ms-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -moz-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light));
  background-image: -webkit-linear-gradient(left, var(--gradient-light), var(--gradient-dark), var(--gradient-light)); }

.super {
  vertical-align: super; }

.nobgimg {
  background-image: none !important; }

.noborders {
  border: none !important; }

.fullsize {
  min-height: 100%;
  max-width: 100%;
  min-width: 100%;
  width: 100%; }

.nodisabled {
  background-color: var(--input-bg) !important;
  color: var(--input-clr) !important; }

.yellow-text {
  color: var(--yellow) !important; }

.green {
  color: green; }

.red {
  color: red; }

.boxshadow {
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }

.glass {
  backdrop-filter: blur(20px);
  background-clip: padding-box;
  border: 2px solid transparent;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }

button, input[type='button'] {
  margin-left: 2px;
  margin-right: 2px; }

button, input[type='button'], input[type='submit'], input[type='reset'], input[type='cancel'] {
  background-color: #00AC00;
  color: var(--button-clr);
  font-weight: bold;
  background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  transform: translateY(0);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5) !important;
  margin-top: 2px;
  margin-right: 5px;
  margin-bottom: 5px;
  margin-left: 2px; }
  button:hover, input[type='button']:hover, input[type='submit']:hover, input[type='reset']:hover, input[type='cancel']:hover {
    cursor: url("/images/site/pointer.png"), auto; }
  button:focus, input[type='button']:focus, input[type='submit']:focus, input[type='reset']:focus, input[type='cancel']:focus {
    outline: none;
    border: 1px solid black; }
  button:disabled, input[type='button']:disabled, input[type='submit']:disabled, input[type='reset']:disabled, input[type='cancel']:disabled {
    transition: none; }
  button:disabled, input[type='button']:disabled, input[type='submit']:disabled, input[type='reset']:disabled, input[type='cancel']:disabled {
    transform: none; }
  button:hover, button:focus, input[type='button']:hover, input[type='button']:focus, input[type='submit']:hover, input[type='submit']:focus, input[type='reset']:hover, input[type='reset']:focus, input[type='cancel']:hover, input[type='cancel']:focus {
    backface-visibility: hidden;
    filter: brightness(105%);
    transform: translateY(3);
    transform: scale(1.1) translate3d(0, 0, 50px); }
  button:disabled, input[type='button']:disabled, input[type='submit']:disabled, input[type='reset']:disabled, input[type='cancel']:disabled {
    background-color: #DDDDDD;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset grey;
    color: white; }
    button:disabled:hover, input[type='button']:disabled:hover, input[type='submit']:disabled:hover, input[type='reset']:disabled:hover, input[type='cancel']:disabled:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button:disabled:focus, input[type='button']:disabled:focus, input[type='submit']:disabled:focus, input[type='reset']:disabled:focus, input[type='cancel']:disabled:focus {
      outline: none;
      border: 1px solid black; }
    button:disabled:disabled, input[type='button']:disabled:disabled, input[type='submit']:disabled:disabled, input[type='reset']:disabled:disabled, input[type='cancel']:disabled:disabled {
      transition: none; }
    button:disabled:disabled, input[type='button']:disabled:disabled, input[type='submit']:disabled:disabled, input[type='reset']:disabled:disabled, input[type='cancel']:disabled:disabled {
      transform: none; }
    button:disabled:hover, button:disabled:focus, input[type='button']:disabled:hover, input[type='button']:disabled:focus, input[type='submit']:disabled:hover, input[type='submit']:disabled:focus, input[type='reset']:disabled:hover, input[type='reset']:disabled:focus, input[type='cancel']:disabled:hover, input[type='cancel']:disabled:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button:disabled:hover, input[type='button']:disabled:hover, input[type='submit']:disabled:hover, input[type='reset']:disabled:hover, input[type='cancel']:disabled:hover {
      transition: none;
      filter: none;
      transform: none;
      cursor: url("/images/site/cursor2.png"), auto; }
    button:disabled input[type='checkbox']:disabled, input[type='button']:disabled input[type='checkbox']:disabled, input[type='submit']:disabled input[type='checkbox']:disabled, input[type='reset']:disabled input[type='checkbox']:disabled, input[type='cancel']:disabled input[type='checkbox']:disabled {
      background-color: var(--white) !important;
      color: var(--input-clr) !important; }
  button.tiny, input[type='button'].tiny, input[type='submit'].tiny, input[type='reset'].tiny, input[type='cancel'].tiny {
    font-size: var(--tiny-font-size);
    margin: 2px;
    margin-bottom: 6px;
    padding: 2px; }
  button.save, input[type='button'].save, input[type='submit'].save, input[type='reset'].save, input[type='cancel'].save {
    background-color: #00CC00;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset green;
    color: white; }
    button.save:hover, input[type='button'].save:hover, input[type='submit'].save:hover, input[type='reset'].save:hover, input[type='cancel'].save:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.save:focus, input[type='button'].save:focus, input[type='submit'].save:focus, input[type='reset'].save:focus, input[type='cancel'].save:focus {
      outline: none;
      border: 1px solid black; }
    button.save:disabled, input[type='button'].save:disabled, input[type='submit'].save:disabled, input[type='reset'].save:disabled, input[type='cancel'].save:disabled {
      transition: none; }
    button.save:disabled, input[type='button'].save:disabled, input[type='submit'].save:disabled, input[type='reset'].save:disabled, input[type='cancel'].save:disabled {
      transform: none; }
    button.save:hover, button.save:focus, input[type='button'].save:hover, input[type='button'].save:focus, input[type='submit'].save:hover, input[type='submit'].save:focus, input[type='reset'].save:hover, input[type='reset'].save:focus, input[type='cancel'].save:hover, input[type='cancel'].save:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.save b, button.save i, input[type='button'].save b, input[type='button'].save i, input[type='submit'].save b, input[type='submit'].save i, input[type='reset'].save b, input[type='reset'].save i, input[type='cancel'].save b, input[type='cancel'].save i {
      color: white; }
  button.reset, input[type='button'].reset, input[type='submit'].reset, input[type='reset'].reset, input[type='cancel'].reset {
    background-color: #EEEE00;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset yellow;
    color: black;
    text-shadow: 0 0 4px rgba(255, 255, 255, 0.9) !important; }
    button.reset:hover, input[type='button'].reset:hover, input[type='submit'].reset:hover, input[type='reset'].reset:hover, input[type='cancel'].reset:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.reset:focus, input[type='button'].reset:focus, input[type='submit'].reset:focus, input[type='reset'].reset:focus, input[type='cancel'].reset:focus {
      outline: none;
      border: 1px solid black; }
    button.reset:disabled, input[type='button'].reset:disabled, input[type='submit'].reset:disabled, input[type='reset'].reset:disabled, input[type='cancel'].reset:disabled {
      transition: none; }
    button.reset:disabled, input[type='button'].reset:disabled, input[type='submit'].reset:disabled, input[type='reset'].reset:disabled, input[type='cancel'].reset:disabled {
      transform: none; }
    button.reset:hover, button.reset:focus, input[type='button'].reset:hover, input[type='button'].reset:focus, input[type='submit'].reset:hover, input[type='submit'].reset:focus, input[type='reset'].reset:hover, input[type='reset'].reset:focus, input[type='cancel'].reset:hover, input[type='cancel'].reset:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.reset b, button.reset i, input[type='button'].reset b, input[type='button'].reset i, input[type='submit'].reset b, input[type='submit'].reset i, input[type='reset'].reset b, input[type='reset'].reset i, input[type='cancel'].reset b, input[type='cancel'].reset i {
      color: black; }
  button.cancel, input[type='button'].cancel, input[type='submit'].cancel, input[type='reset'].cancel, input[type='cancel'].cancel {
    background-color: #EE0000;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset red;
    color: white; }
    button.cancel:hover, input[type='button'].cancel:hover, input[type='submit'].cancel:hover, input[type='reset'].cancel:hover, input[type='cancel'].cancel:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.cancel:focus, input[type='button'].cancel:focus, input[type='submit'].cancel:focus, input[type='reset'].cancel:focus, input[type='cancel'].cancel:focus {
      outline: none;
      border: 1px solid black; }
    button.cancel:disabled, input[type='button'].cancel:disabled, input[type='submit'].cancel:disabled, input[type='reset'].cancel:disabled, input[type='cancel'].cancel:disabled {
      transition: none; }
    button.cancel:disabled, input[type='button'].cancel:disabled, input[type='submit'].cancel:disabled, input[type='reset'].cancel:disabled, input[type='cancel'].cancel:disabled {
      transform: none; }
    button.cancel:hover, button.cancel:focus, input[type='button'].cancel:hover, input[type='button'].cancel:focus, input[type='submit'].cancel:hover, input[type='submit'].cancel:focus, input[type='reset'].cancel:hover, input[type='reset'].cancel:focus, input[type='cancel'].cancel:hover, input[type='cancel'].cancel:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.cancel b, button.cancel i, input[type='button'].cancel b, input[type='button'].cancel i, input[type='submit'].cancel b, input[type='submit'].cancel i, input[type='reset'].cancel b, input[type='reset'].cancel i, input[type='cancel'].cancel b, input[type='cancel'].cancel i {
      color: white; }
  button.blue-button, button.blue, input[type='button'].blue-button, input[type='button'].blue, input[type='submit'].blue-button, input[type='submit'].blue, input[type='reset'].blue-button, input[type='reset'].blue, input[type='cancel'].blue-button, input[type='cancel'].blue {
    background-color: #0000EE;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset blue;
    color: white; }
    button.blue-button:hover, button.blue:hover, input[type='button'].blue-button:hover, input[type='button'].blue:hover, input[type='submit'].blue-button:hover, input[type='submit'].blue:hover, input[type='reset'].blue-button:hover, input[type='reset'].blue:hover, input[type='cancel'].blue-button:hover, input[type='cancel'].blue:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.blue-button:focus, button.blue:focus, input[type='button'].blue-button:focus, input[type='button'].blue:focus, input[type='submit'].blue-button:focus, input[type='submit'].blue:focus, input[type='reset'].blue-button:focus, input[type='reset'].blue:focus, input[type='cancel'].blue-button:focus, input[type='cancel'].blue:focus {
      outline: none;
      border: 1px solid black; }
    button.blue-button:disabled, button.blue:disabled, input[type='button'].blue-button:disabled, input[type='button'].blue:disabled, input[type='submit'].blue-button:disabled, input[type='submit'].blue:disabled, input[type='reset'].blue-button:disabled, input[type='reset'].blue:disabled, input[type='cancel'].blue-button:disabled, input[type='cancel'].blue:disabled {
      transition: none; }
    button.blue-button:disabled, button.blue:disabled, input[type='button'].blue-button:disabled, input[type='button'].blue:disabled, input[type='submit'].blue-button:disabled, input[type='submit'].blue:disabled, input[type='reset'].blue-button:disabled, input[type='reset'].blue:disabled, input[type='cancel'].blue-button:disabled, input[type='cancel'].blue:disabled {
      transform: none; }
    button.blue-button:hover, button.blue-button:focus, button.blue:hover, button.blue:focus, input[type='button'].blue-button:hover, input[type='button'].blue-button:focus, input[type='button'].blue:hover, input[type='button'].blue:focus, input[type='submit'].blue-button:hover, input[type='submit'].blue-button:focus, input[type='submit'].blue:hover, input[type='submit'].blue:focus, input[type='reset'].blue-button:hover, input[type='reset'].blue-button:focus, input[type='reset'].blue:hover, input[type='reset'].blue:focus, input[type='cancel'].blue-button:hover, input[type='cancel'].blue-button:focus, input[type='cancel'].blue:hover, input[type='cancel'].blue:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.blue-button b, button.blue-button i, button.blue b, button.blue i, input[type='button'].blue-button b, input[type='button'].blue-button i, input[type='button'].blue b, input[type='button'].blue i, input[type='submit'].blue-button b, input[type='submit'].blue-button i, input[type='submit'].blue b, input[type='submit'].blue i, input[type='reset'].blue-button b, input[type='reset'].blue-button i, input[type='reset'].blue b, input[type='reset'].blue i, input[type='cancel'].blue-button b, input[type='cancel'].blue-button i, input[type='cancel'].blue b, input[type='cancel'].blue i {
      color: white; }
  button.cyan-button, button.cyan, input[type='button'].cyan-button, input[type='button'].cyan, input[type='submit'].cyan-button, input[type='submit'].cyan, input[type='reset'].cyan-button, input[type='reset'].cyan, input[type='cancel'].cyan-button, input[type='cancel'].cyan {
    background-color: #00AAAA;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset cyan;
    color: white; }
    button.cyan-button:hover, button.cyan:hover, input[type='button'].cyan-button:hover, input[type='button'].cyan:hover, input[type='submit'].cyan-button:hover, input[type='submit'].cyan:hover, input[type='reset'].cyan-button:hover, input[type='reset'].cyan:hover, input[type='cancel'].cyan-button:hover, input[type='cancel'].cyan:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.cyan-button:focus, button.cyan:focus, input[type='button'].cyan-button:focus, input[type='button'].cyan:focus, input[type='submit'].cyan-button:focus, input[type='submit'].cyan:focus, input[type='reset'].cyan-button:focus, input[type='reset'].cyan:focus, input[type='cancel'].cyan-button:focus, input[type='cancel'].cyan:focus {
      outline: none;
      border: 1px solid black; }
    button.cyan-button:disabled, button.cyan:disabled, input[type='button'].cyan-button:disabled, input[type='button'].cyan:disabled, input[type='submit'].cyan-button:disabled, input[type='submit'].cyan:disabled, input[type='reset'].cyan-button:disabled, input[type='reset'].cyan:disabled, input[type='cancel'].cyan-button:disabled, input[type='cancel'].cyan:disabled {
      transition: none; }
    button.cyan-button:disabled, button.cyan:disabled, input[type='button'].cyan-button:disabled, input[type='button'].cyan:disabled, input[type='submit'].cyan-button:disabled, input[type='submit'].cyan:disabled, input[type='reset'].cyan-button:disabled, input[type='reset'].cyan:disabled, input[type='cancel'].cyan-button:disabled, input[type='cancel'].cyan:disabled {
      transform: none; }
    button.cyan-button:hover, button.cyan-button:focus, button.cyan:hover, button.cyan:focus, input[type='button'].cyan-button:hover, input[type='button'].cyan-button:focus, input[type='button'].cyan:hover, input[type='button'].cyan:focus, input[type='submit'].cyan-button:hover, input[type='submit'].cyan-button:focus, input[type='submit'].cyan:hover, input[type='submit'].cyan:focus, input[type='reset'].cyan-button:hover, input[type='reset'].cyan-button:focus, input[type='reset'].cyan:hover, input[type='reset'].cyan:focus, input[type='cancel'].cyan-button:hover, input[type='cancel'].cyan-button:focus, input[type='cancel'].cyan:hover, input[type='cancel'].cyan:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.cyan-button b, button.cyan-button i, button.cyan b, button.cyan i, input[type='button'].cyan-button b, input[type='button'].cyan-button i, input[type='button'].cyan b, input[type='button'].cyan i, input[type='submit'].cyan-button b, input[type='submit'].cyan-button i, input[type='submit'].cyan b, input[type='submit'].cyan i, input[type='reset'].cyan-button b, input[type='reset'].cyan-button i, input[type='reset'].cyan b, input[type='reset'].cyan i, input[type='cancel'].cyan-button b, input[type='cancel'].cyan-button i, input[type='cancel'].cyan b, input[type='cancel'].cyan i {
      color: white; }
  button.green-button, button.green, input[type='button'].green-button, input[type='button'].green, input[type='submit'].green-button, input[type='submit'].green, input[type='reset'].green-button, input[type='reset'].green, input[type='cancel'].green-button, input[type='cancel'].green {
    background-color: #00CC00;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset green;
    color: white; }
    button.green-button:hover, button.green:hover, input[type='button'].green-button:hover, input[type='button'].green:hover, input[type='submit'].green-button:hover, input[type='submit'].green:hover, input[type='reset'].green-button:hover, input[type='reset'].green:hover, input[type='cancel'].green-button:hover, input[type='cancel'].green:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.green-button:focus, button.green:focus, input[type='button'].green-button:focus, input[type='button'].green:focus, input[type='submit'].green-button:focus, input[type='submit'].green:focus, input[type='reset'].green-button:focus, input[type='reset'].green:focus, input[type='cancel'].green-button:focus, input[type='cancel'].green:focus {
      outline: none;
      border: 1px solid black; }
    button.green-button:disabled, button.green:disabled, input[type='button'].green-button:disabled, input[type='button'].green:disabled, input[type='submit'].green-button:disabled, input[type='submit'].green:disabled, input[type='reset'].green-button:disabled, input[type='reset'].green:disabled, input[type='cancel'].green-button:disabled, input[type='cancel'].green:disabled {
      transition: none; }
    button.green-button:disabled, button.green:disabled, input[type='button'].green-button:disabled, input[type='button'].green:disabled, input[type='submit'].green-button:disabled, input[type='submit'].green:disabled, input[type='reset'].green-button:disabled, input[type='reset'].green:disabled, input[type='cancel'].green-button:disabled, input[type='cancel'].green:disabled {
      transform: none; }
    button.green-button:hover, button.green-button:focus, button.green:hover, button.green:focus, input[type='button'].green-button:hover, input[type='button'].green-button:focus, input[type='button'].green:hover, input[type='button'].green:focus, input[type='submit'].green-button:hover, input[type='submit'].green-button:focus, input[type='submit'].green:hover, input[type='submit'].green:focus, input[type='reset'].green-button:hover, input[type='reset'].green-button:focus, input[type='reset'].green:hover, input[type='reset'].green:focus, input[type='cancel'].green-button:hover, input[type='cancel'].green-button:focus, input[type='cancel'].green:hover, input[type='cancel'].green:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.green-button b, button.green-button i, button.green b, button.green i, input[type='button'].green-button b, input[type='button'].green-button i, input[type='button'].green b, input[type='button'].green i, input[type='submit'].green-button b, input[type='submit'].green-button i, input[type='submit'].green b, input[type='submit'].green i, input[type='reset'].green-button b, input[type='reset'].green-button i, input[type='reset'].green b, input[type='reset'].green i, input[type='cancel'].green-button b, input[type='cancel'].green-button i, input[type='cancel'].green b, input[type='cancel'].green i {
      color: white; }
  button.red-button, button.red, input[type='button'].red-button, input[type='button'].red, input[type='submit'].red-button, input[type='submit'].red, input[type='reset'].red-button, input[type='reset'].red, input[type='cancel'].red-button, input[type='cancel'].red {
    background-color: #EE0000;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset red;
    color: white; }
    button.red-button:hover, button.red:hover, input[type='button'].red-button:hover, input[type='button'].red:hover, input[type='submit'].red-button:hover, input[type='submit'].red:hover, input[type='reset'].red-button:hover, input[type='reset'].red:hover, input[type='cancel'].red-button:hover, input[type='cancel'].red:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.red-button:focus, button.red:focus, input[type='button'].red-button:focus, input[type='button'].red:focus, input[type='submit'].red-button:focus, input[type='submit'].red:focus, input[type='reset'].red-button:focus, input[type='reset'].red:focus, input[type='cancel'].red-button:focus, input[type='cancel'].red:focus {
      outline: none;
      border: 1px solid black; }
    button.red-button:disabled, button.red:disabled, input[type='button'].red-button:disabled, input[type='button'].red:disabled, input[type='submit'].red-button:disabled, input[type='submit'].red:disabled, input[type='reset'].red-button:disabled, input[type='reset'].red:disabled, input[type='cancel'].red-button:disabled, input[type='cancel'].red:disabled {
      transition: none; }
    button.red-button:disabled, button.red:disabled, input[type='button'].red-button:disabled, input[type='button'].red:disabled, input[type='submit'].red-button:disabled, input[type='submit'].red:disabled, input[type='reset'].red-button:disabled, input[type='reset'].red:disabled, input[type='cancel'].red-button:disabled, input[type='cancel'].red:disabled {
      transform: none; }
    button.red-button:hover, button.red-button:focus, button.red:hover, button.red:focus, input[type='button'].red-button:hover, input[type='button'].red-button:focus, input[type='button'].red:hover, input[type='button'].red:focus, input[type='submit'].red-button:hover, input[type='submit'].red-button:focus, input[type='submit'].red:hover, input[type='submit'].red:focus, input[type='reset'].red-button:hover, input[type='reset'].red-button:focus, input[type='reset'].red:hover, input[type='reset'].red:focus, input[type='cancel'].red-button:hover, input[type='cancel'].red-button:focus, input[type='cancel'].red:hover, input[type='cancel'].red:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.red-button b, button.red-button i, button.red b, button.red i, input[type='button'].red-button b, input[type='button'].red-button i, input[type='button'].red b, input[type='button'].red i, input[type='submit'].red-button b, input[type='submit'].red-button i, input[type='submit'].red b, input[type='submit'].red i, input[type='reset'].red-button b, input[type='reset'].red-button i, input[type='reset'].red b, input[type='reset'].red i, input[type='cancel'].red-button b, input[type='cancel'].red-button i, input[type='cancel'].red b, input[type='cancel'].red i {
      color: white; }
  button.yellow-button, button.yellow, input[type='button'].yellow-button, input[type='button'].yellow, input[type='submit'].yellow-button, input[type='submit'].yellow, input[type='reset'].yellow-button, input[type='reset'].yellow, input[type='cancel'].yellow-button, input[type='cancel'].yellow {
    background-color: #999900;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset yellow;
    color: white; }
    button.yellow-button:hover, button.yellow:hover, input[type='button'].yellow-button:hover, input[type='button'].yellow:hover, input[type='submit'].yellow-button:hover, input[type='submit'].yellow:hover, input[type='reset'].yellow-button:hover, input[type='reset'].yellow:hover, input[type='cancel'].yellow-button:hover, input[type='cancel'].yellow:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.yellow-button:focus, button.yellow:focus, input[type='button'].yellow-button:focus, input[type='button'].yellow:focus, input[type='submit'].yellow-button:focus, input[type='submit'].yellow:focus, input[type='reset'].yellow-button:focus, input[type='reset'].yellow:focus, input[type='cancel'].yellow-button:focus, input[type='cancel'].yellow:focus {
      outline: none;
      border: 1px solid black; }
    button.yellow-button:disabled, button.yellow:disabled, input[type='button'].yellow-button:disabled, input[type='button'].yellow:disabled, input[type='submit'].yellow-button:disabled, input[type='submit'].yellow:disabled, input[type='reset'].yellow-button:disabled, input[type='reset'].yellow:disabled, input[type='cancel'].yellow-button:disabled, input[type='cancel'].yellow:disabled {
      transition: none; }
    button.yellow-button:disabled, button.yellow:disabled, input[type='button'].yellow-button:disabled, input[type='button'].yellow:disabled, input[type='submit'].yellow-button:disabled, input[type='submit'].yellow:disabled, input[type='reset'].yellow-button:disabled, input[type='reset'].yellow:disabled, input[type='cancel'].yellow-button:disabled, input[type='cancel'].yellow:disabled {
      transform: none; }
    button.yellow-button:hover, button.yellow-button:focus, button.yellow:hover, button.yellow:focus, input[type='button'].yellow-button:hover, input[type='button'].yellow-button:focus, input[type='button'].yellow:hover, input[type='button'].yellow:focus, input[type='submit'].yellow-button:hover, input[type='submit'].yellow-button:focus, input[type='submit'].yellow:hover, input[type='submit'].yellow:focus, input[type='reset'].yellow-button:hover, input[type='reset'].yellow-button:focus, input[type='reset'].yellow:hover, input[type='reset'].yellow:focus, input[type='cancel'].yellow-button:hover, input[type='cancel'].yellow-button:focus, input[type='cancel'].yellow:hover, input[type='cancel'].yellow:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.yellow-button b, button.yellow-button i, button.yellow b, button.yellow i, input[type='button'].yellow-button b, input[type='button'].yellow-button i, input[type='button'].yellow b, input[type='button'].yellow i, input[type='submit'].yellow-button b, input[type='submit'].yellow-button i, input[type='submit'].yellow b, input[type='submit'].yellow i, input[type='reset'].yellow-button b, input[type='reset'].yellow-button i, input[type='reset'].yellow b, input[type='reset'].yellow i, input[type='cancel'].yellow-button b, input[type='cancel'].yellow-button i, input[type='cancel'].yellow b, input[type='cancel'].yellow i {
      color: white; }
  button.purple-button, button.purple, input[type='button'].purple-button, input[type='button'].purple, input[type='submit'].purple-button, input[type='submit'].purple, input[type='reset'].purple-button, input[type='reset'].purple, input[type='cancel'].purple-button, input[type='cancel'].purple {
    background-color: #EE00EE;
    color: var(--button-clr);
    font-weight: bold;
    background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    border-radius: 5px;
    border: 1px outset var(--borders-clr);
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    transition: all 250ms ease-in-out;
    backface-visibility: hidden;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    transform: translateY(0);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
    border: 1px outset purple;
    color: white; }
    button.purple-button:hover, button.purple:hover, input[type='button'].purple-button:hover, input[type='button'].purple:hover, input[type='submit'].purple-button:hover, input[type='submit'].purple:hover, input[type='reset'].purple-button:hover, input[type='reset'].purple:hover, input[type='cancel'].purple-button:hover, input[type='cancel'].purple:hover {
      cursor: url("/images/site/pointer.png"), auto; }
    button.purple-button:focus, button.purple:focus, input[type='button'].purple-button:focus, input[type='button'].purple:focus, input[type='submit'].purple-button:focus, input[type='submit'].purple:focus, input[type='reset'].purple-button:focus, input[type='reset'].purple:focus, input[type='cancel'].purple-button:focus, input[type='cancel'].purple:focus {
      outline: none;
      border: 1px solid black; }
    button.purple-button:disabled, button.purple:disabled, input[type='button'].purple-button:disabled, input[type='button'].purple:disabled, input[type='submit'].purple-button:disabled, input[type='submit'].purple:disabled, input[type='reset'].purple-button:disabled, input[type='reset'].purple:disabled, input[type='cancel'].purple-button:disabled, input[type='cancel'].purple:disabled {
      transition: none; }
    button.purple-button:disabled, button.purple:disabled, input[type='button'].purple-button:disabled, input[type='button'].purple:disabled, input[type='submit'].purple-button:disabled, input[type='submit'].purple:disabled, input[type='reset'].purple-button:disabled, input[type='reset'].purple:disabled, input[type='cancel'].purple-button:disabled, input[type='cancel'].purple:disabled {
      transform: none; }
    button.purple-button:hover, button.purple-button:focus, button.purple:hover, button.purple:focus, input[type='button'].purple-button:hover, input[type='button'].purple-button:focus, input[type='button'].purple:hover, input[type='button'].purple:focus, input[type='submit'].purple-button:hover, input[type='submit'].purple-button:focus, input[type='submit'].purple:hover, input[type='submit'].purple:focus, input[type='reset'].purple-button:hover, input[type='reset'].purple-button:focus, input[type='reset'].purple:hover, input[type='reset'].purple:focus, input[type='cancel'].purple-button:hover, input[type='cancel'].purple-button:focus, input[type='cancel'].purple:hover, input[type='cancel'].purple:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
    button.purple-button b, button.purple-button i, button.purple b, button.purple i, input[type='button'].purple-button b, input[type='button'].purple-button i, input[type='button'].purple b, input[type='button'].purple i, input[type='submit'].purple-button b, input[type='submit'].purple-button i, input[type='submit'].purple b, input[type='submit'].purple i, input[type='reset'].purple-button b, input[type='reset'].purple-button i, input[type='reset'].purple b, input[type='reset'].purple i, input[type='cancel'].purple-button b, input[type='cancel'].purple-button i, input[type='cancel'].purple b, input[type='cancel'].purple i {
      color: white; }
  button.as_link, input[type='button'].as_link, input[type='submit'].as_link, input[type='reset'].as_link, input[type='cancel'].as_link {
    background: none;
    border-color: transparent;
    box-shadow: none;
    color: var(--link-clr);
    transform: none;
    cursor: pointer;
    height: min-content; }
    button.as_link b, button.as_link i, input[type='button'].as_link b, input[type='button'].as_link i, input[type='submit'].as_link b, input[type='submit'].as_link i, input[type='reset'].as_link b, input[type='reset'].as_link i, input[type='cancel'].as_link b, input[type='cancel'].as_link i {
      color: --link-clr; }
  button.big_button, input[type='button'].big_button, input[type='submit'].big_button, input[type='reset'].big_button, input[type='cancel'].big_button {
    border-width: 3px;
    border-style: outset;
    border-radius: 10px;
    font-size: var(--giant-font-size);
    padding: 12px 18px 12px 18px; }
  button.login_button, input[type='button'].login_button, input[type='submit'].login_button, input[type='reset'].login_button, input[type='cancel'].login_button {
    border-width: 3px;
    border-style: outset;
    border-radius: 10px;
    font-size: var(--normal-font-size);
    padding: 18px 18px 18px 18px; }
  button:hover, input[type='button']:hover, input[type='submit']:hover, input[type='reset']:hover, input[type='cancel']:hover {
    cursor: url("/images/site/pointer.png"), auto; }

/************************************/
.dropbtn {
  background-color: #00AC00;
  color: var(--button-clr);
  font-weight: bold;
  background-image: radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -o-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -ms-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -moz-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  background-image: -webkit-radial-gradient(top left, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
  border-radius: 5px;
  border: 1px outset var(--borders-clr);
  padding-top: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  transform: translateY(0);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
  height: 20px;
  min-width: 20px;
  white-space: nowrap;
  margin: 0;
  margin-top: 2px; }
  .dropbtn:hover {
    cursor: url("/images/site/pointer.png"), auto; }
  .dropbtn:focus {
    outline: none;
    border: 1px solid black; }
  .dropbtn:disabled {
    transition: none; }
  .dropbtn:disabled {
    transform: none; }
  .dropbtn:hover, .dropbtn:focus {
    backface-visibility: hidden;
    filter: brightness(105%);
    transform: translateY(3);
    transform: scale(1.1) translate3d(0, 0, 50px); }

.dropdown {
  position: relative;
  display: inline-block; }

.dropdown-content {
  background-color: #1E432B;
  border: 1px solid #255235;
  border-radius: 5px;
  color: #000000;
  left: 25%;
  max-height: 500px;
  min-width: 140px;
  opacity: 0.25;
  overflow-x: hidden;
  overflow-y: hidden;
  position: absolute;
  top: calc(100% + 8px);
  transform: scale(0);
  transform-origin: top left;
  transition: all 200ms cubic-bezier(0.18, 0.89, 0.32, 1.08);
  /* transition: all 100ms ease-in-out; */
  z-index: 9999; }
  .dropdown-content a {
    background-color: #1E432B;
    border-bottom: 1px solid #1E432B;
    border-top: 1px solid #1E432B;
    color: #000000;
    padding: 2px 3px;
    text-decoration: none;
    display: block;
    white-space: nowrap; }
    .dropdown-content a:hover {
      transform: translateY(0);
      background-color: #255235;
      border-bottom: 1px solid #255235;
      border-top: 1px solid #255235; }
      .dropdown-content a:hover:disabled {
        transform: none; }
      .dropdown-content a:hover:hover, .dropdown-content a:hover:focus {
        backface-visibility: hidden;
        filter: brightness(105%);
        transform: translateY(3);
        transform: scale(1.05) translate3d(0, 0, 50px); }
  .dropdown-content hr {
    background-color: #1E432B; }

.show {
  opacity: 1;
  transform: scale(1); }
  .show a {
    opacity: 1;
    transition: opacity 350ms ease-in-out 150ms; }

/************************************/
.navbutton {
  background-color: var(--gradient-light);
  border: 1px outset var(--borders-clr);
  border-radius: 5px;
  box-shadow: 3px 3px 3px var(--input-box-shadow-clr);
  padding: 0 3px 0 3px;
  margin: 0;
  text-align: center;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden; }
  .navbutton:disabled {
    transition: none; }

.navbutton:hover {
  box-shadow: 1px 10px 8px -3px var(--input-box-shadow-clr);
  cursor: pointer;
  transform: translateY(-3px);
  transform: scale(1.1);
  background-color: var(--gradient-dark); }

.navbutton_selected {
  background-color: var(--gradient-dark);
  border: 1px outset var(--borders-clr);
  border-radius: 3px;
  box-shadow: 3px 3px 3px var(--input-box-shadow-clr);
  padding: 0 3px 0 3px;
  margin: 0;
  text-align: center;
  transform: translateY(3px);
  transform: scale(0.8);
  transition: all 250ms ease-in-out;
  backface-visibility: hidden; }
  .navbutton_selected:disabled {
    transition: none; }

/*
  button inputs are found in buttons.sass
*/
input {
  color: var(--input-clr);
  background-color: var(--input-bg);
  cursor: url("/images/site/cursor2.png"), auto;
  padding: 0 2px 0 2px;
  margin: 0;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  border: 2px inset var(--borders-clr);
  border-radius: 5px; }
  input:disabled {
    transition: none; }
  input::placeholder {
    background-color: transparent;
    color: gray;
    text-align: center;
    font-size: var(--tiny-font-size); }
  input::-moz-placeholder {
    background-color: transparent;
    color: gray;
    text-align: center;
    font-size: var(--tiny-font-size); }
  input::-ms-placeholder {
    background-color: transparent;
    color: gray;
    text-align: center;
    font-size: var(--tiny-font-size); }
  input::-webkit-input-placeholder {
    background-color: transparent;
    color: gray;
    text-align: center;
    font-size: var(--tiny-font-size); }
  input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none; }
  input[type='number'] {
    -moz-appearance: textfield; }
  input[type='button'], input[type='image'], input[type='reset'], input[type='submit'] {
    transform: translateY(0);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }
    input[type='button']:disabled, input[type='image']:disabled, input[type='reset']:disabled, input[type='submit']:disabled {
      transform: none; }
    input[type='button']:hover, input[type='button']:focus, input[type='image']:hover, input[type='image']:focus, input[type='reset']:hover, input[type='reset']:focus, input[type='submit']:hover, input[type='submit']:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
  input[type='color'], input[type='checkbox'], input[type='radio'] {
    transform: translateY(0); }
    input[type='color']:disabled, input[type='checkbox']:disabled, input[type='radio']:disabled {
      transform: none; }
    input[type='color']:hover, input[type='color']:focus, input[type='checkbox']:hover, input[type='checkbox']:focus, input[type='radio']:hover, input[type='radio']:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.2) translate3d(0, 0, 50px); }
  input[type='checkbox'], input[type='radio'] {
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }
  input[type='checkbox'].copyright, input[type='checkbox'].small {
    height: 10px;
    width: 10px; }
  input:not(:placeholder-shown):invalid, input:indeterminate, input:out-of-range {
    background-color: dark-red; }
  input:disabled, input:read-only {
    border-color: black;
    background-color: #737373;
    color: black; }
  input[type='checkbox'] {
    transform: translateY(2px); }
  input:focus {
    outline: none;
    border: 2px solid black; }

textarea {
  color: var(--input-clr);
  cursor: url("/images/site/cursor.png"), auto;
  background-color: var(--input-bg);
  margin: 0;
  padding: 0;
  border: 2px inset var(--borders-clr);
  border-radius: 5px;
  padding-right: 3px;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden; }
  textarea::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  textarea::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  textarea::-webkit-scrollbar-track {
    background-color: transparent; }
  textarea:disabled {
    transition: none; }
  textarea:disabled, textarea:read-only {
    background-color: #8c8c8c; }

select {
  background-color: var(--select-bg);
  color: var(--select-clr);
  font-size: var(--normal-font-size);
  cursor: url("/images/site/pointer.png"), auto;
  border: 1px outset var(--borders-clr);
  border-radius: 5px;
  transition: all 250ms ease-in-out;
  backface-visibility: hidden;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  padding-right: 3px; }
  select:disabled {
    transition: none; }
  select::-webkit-scrollbar {
    border: 1px inset var(--borders-clr);
    background-color: var(--gradient-dark);
    height: 12px;
    width: 12px;
    border-radius: 5px; }
  select::-webkit-scrollbar-thumb {
    border: 1px outset var(--borders-clr);
    background-color: var(--gradient-light);
    width: 10px;
    border-radius: 5px; }
  select::-webkit-scrollbar-track {
    background-color: transparent; }
  select.tiny {
    font-size: var(--tiny-font-size);
    -webkit-appearance: none;
    color: transparent;
    background: url(/images/site/friends\.png) no-repeat center;
    background-color: var(--input-bg) !important;
    background-size: contain !important;
    max-width: 16px;
    min-width: 16px;
    margin-right: 2px;
    transform: translateY(0); }
    select.tiny:disabled {
      transform: none; }
    select.tiny:hover, select.tiny:focus {
      backface-visibility: hidden;
      filter: brightness(105%);
      transform: translateY(3);
      transform: scale(1.1) translate3d(0, 0, 50px); }
  select:disabled {
    background-color: #8c8c8c;
    color: black;
    cursor: url("/images/site/cursor.png"), auto; }

option {
  font-size: inherit;
  color: #000000;
  background-color: inherit; }

input.hiddenfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1; }

body {
  color: var(--body-clr);
  background-color: var(--bg-clr);
  background-attachment: fixed;
  background-image: url("/img.pl?s=f&i=wallpaper/c529c971dd8ccc9aa278af90197a2dc4.jpg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding-top: 5px;
  padding-right: 7px;
  padding-bottom: 5px;
  padding-left: 5px;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: min-content 1fr min-content;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "header" "container" "footer"; }
  body::-webkit-scrollbar {
    background-color: var(--bg-clr);
    width: 10px;
    border-radius: 5px; }
  body::-webkit-scrollbar-thumb {
    background-color: var(--body-clr);
    border-radius: 5px; }
  @media screen and (max-width: 480px) {
    body {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: min-content 1fr min-content;
      column-gap: 7px;
      row-gap: 7px; } }
.head {
  grid-area: header;
  display: grid;
  grid-template-columns: 25% 50% 25%;
  grid-template-rows: min-content;
  column-gap: 3px;
  row-gap: 7px;
  grid-template-areas: "logo msgs login"; }
  .head .head-logo {
    display: flex;
    align-items: center;
    grid-area: logo;
    background-color: var(--gradient-light);
    color: var(--body-clr-dark);
    display: inline-block;
    padding-top: 2px;
    padding-right: 5px;
    padding-bottom: 1px;
    padding-left: 5px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid var(--borders-clr);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
    width: min-content;
    cursor: pointer;
    color: #FFFF00;
    font-style: italic; }
    .head .head-logo .title, .head .head-logo .subtitle {
      text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .head .head-msgs {
    grid-area: msgs;
    white-space: nowrap;
    text-align: center;
    margin: auto auto !important; }
  .head .head-login {
    grid-area: login;
    width: min-content;
    justify-self: end;
    background-color: var(--gradient-light);
    color: var(--body-clr-dark);
    display: inline-block;
    padding-top: 2px;
    padding-right: 5px;
    padding-bottom: 1px;
    padding-left: 5px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid var(--borders-clr);
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }
    .head .head-login .title, .head .head-login .subtitle {
      text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
    @media screen and (max-width: 370px) {
      .head .head-login button {
        border-width: 3px;
        border-style: outset;
        border-radius: 10px;
        font-size: var(--normal-font-size);
        padding: 18px 8px 18px 8px; } }
  @media screen and (max-width: 600px) {
    .head {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, min-content);
      column-gap: 3px;
      row-gap: 7px;
      grid-template-areas: "logo" "msgs" "login"; }
      .head .head-logo, .head .head-login {
        margin: auto auto !important; } }
.navi {
  grid-area: nav;
  display: grid;
  grid-template-columns: 1fr min-content;
  grid-template-rows: 1fr;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "menu search"; }
  .navi .navi-menu {
    grid-area: menu; }
  .navi .navi-search {
    grid-area: search;
    display: grid;
    grid-template-columns: repeat(7, min-content);
    grid-template-rows: min-content;
    column-gap: 7px;
    row-gap: 7px;
    grid-template-areas: "age gender city country seeking search advanced"; }
    .navi .navi-search .age {
      grid-area: age; }
    .navi .navi-search .gender {
      grid-area: gender; }
    .navi .navi-search .city {
      grid-area: city; }
    .navi .navi-search .country {
      grid-area: country; }
    .navi .navi-search .seeking {
      grid-area: seeking; }
    .navi .navi-search .search {
      grid-area: search; }
    .navi .navi-search .advanced {
      grid-area: advanced;
      padding-left: 3px; }
    @media screen and (max-width: 750px) {
      .navi .navi-search #gendersDropdown {
        -webkit-appearance: none;
        color: transparent;
        background: url(/images/site/sex\.png) no-repeat center;
        background-color: var(--input-bg) !important;
        background-size: contain !important;
        max-width: 16px;
        min-width: 16px;
        margin-right: 2px;
        transform: translateY(0); }
        .navi .navi-search #gendersDropdown:disabled {
          transform: none; }
        .navi .navi-search #gendersDropdown:hover, .navi .navi-search #gendersDropdown:focus {
          backface-visibility: hidden;
          filter: brightness(105%);
          transform: translateY(3);
          transform: scale(1.1) translate3d(0, 0, 50px); } }
    @media screen and (max-width: 685px) {
      .navi .navi-search #citiesDropdown {
        -webkit-appearance: none;
        color: transparent;
        background: url(/images/brown/house\.png) no-repeat center;
        background-color: var(--input-bg) !important;
        background-size: contain !important;
        max-width: 16px;
        min-width: 16px;
        margin-right: 2px;
        transform: translateY(0); }
        .navi .navi-search #citiesDropdown:disabled {
          transform: none; }
        .navi .navi-search #citiesDropdown:hover, .navi .navi-search #citiesDropdown:focus {
          backface-visibility: hidden;
          filter: brightness(105%);
          transform: translateY(3);
          transform: scale(1.1) translate3d(0, 0, 50px); }
      .navi .navi-search #countriesDropdown {
        -webkit-appearance: none;
        color: transparent;
        background: url(/images/red/flag_canada\.png) no-repeat center;
        background-color: var(--input-bg) !important;
        background-size: contain !important;
        max-width: 16px;
        min-width: 16px;
        margin-right: 2px;
        transform: translateY(0); }
        .navi .navi-search #countriesDropdown:disabled {
          transform: none; }
        .navi .navi-search #countriesDropdown:hover, .navi .navi-search #countriesDropdown:focus {
          backface-visibility: hidden;
          filter: brightness(105%);
          transform: translateY(3);
          transform: scale(1.1) translate3d(0, 0, 50px); } }
    @media screen and (max-width: 525px) {
      .navi .navi-search {
        column-gap: 1px; }
        .navi .navi-search select {
          margin: 2px; }
        .navi .navi-search #agesDropdown {
          -webkit-appearance: none;
          color: transparent;
          background: url(/images/red/date\.png) no-repeat center;
          background-color: var(--input-bg) !important;
          background-size: contain !important;
          max-width: 16px;
          min-width: 16px;
          margin-right: 2px;
          transform: translateY(0); }
          .navi .navi-search #agesDropdown:disabled {
            transform: none; }
          .navi .navi-search #agesDropdown:hover, .navi .navi-search #agesDropdown:focus {
            backface-visibility: hidden;
            filter: brightness(105%);
            transform: translateY(3);
            transform: scale(1.1) translate3d(0, 0, 50px); } }
    @media screen and (max-width: 500px) {
      .navi .navi-search #seekingDropdown {
        -webkit-appearance: none;
        color: transparent;
        background: url(/images/orange/party_hat\.png) no-repeat center;
        background-color: var(--input-bg) !important;
        background-size: contain !important;
        max-width: 16px;
        min-width: 16px;
        margin-right: 2px;
        transform: translateY(0); }
        .navi .navi-search #seekingDropdown:disabled {
          transform: none; }
        .navi .navi-search #seekingDropdown:hover, .navi .navi-search #seekingDropdown:focus {
          backface-visibility: hidden;
          filter: brightness(105%);
          transform: translateY(3);
          transform: scale(1.1) translate3d(0, 0, 50px); } }
.content {
  grid-area: container;
  margin: auto auto !important; }

.foot {
  grid-area: footer;
  margin-top: 10px;
  justify-content: center;
  margin: auto auto !important; }
  .foot .footer {
    grid-area: footnav;
    margin: auto auto !important;
    padding-bottom: 5px; }

.profile {
  display: grid;
  grid-template-columns: min-content min-content;
  grid-template-rows: min-content;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "card photos"; }
  .profile .card-extended {
    grid-area: card;
    width: 350px; }
  .profile .card {
    grid-area: card;
    width: 250px; }
  .profile .photos {
    grid-area: photos;
    height: 100%; }
  @media screen and (max-width: 980px) {
    .profile {
      display: grid;
      grid-template-columns: min-content;
      grid-template-rows: min-content min-content;
      column-gap: 7px;
      row-gap: 7px;
      grid-template-areas: "card" "photos"; } }
.settings-nav {
  grid-area: settings-nav;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, min-content);
  column-gap: 3px;
  row-gap: 3px;
  grid-template-areas: "bio        vitals   loc   " "desc       password theme " "membership coins    blocks"; }
  .settings-nav .vitals-nav {
    grid-area: vitals; }
  .settings-nav .bio-nav {
    grid-area: bio; }
  .settings-nav .loc-nav {
    grid-area: loc; }
  .settings-nav .desc-nav {
    grid-area: desc; }
  .settings-nav .password-nav {
    grid-area: password; }
  .settings-nav .theme-nav {
    grid-area: theme; }
  .settings-nav .membership-nav {
    grid-area: membership; }
  .settings-nav .coins-nav {
    grid-area: coins; }
  .settings-nav .blocks-nav {
    grid-area: blocks; }

.friends-list, .search-list {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .friends-list .item, .search-list .item {
    align-self: center;
    padding: 5px; }

.login-container {
  display: grid;
  grid-template-columns: repeat(3, min-content);
  grid-template-rows: min-content min-content;
  column-gap: 0;
  row-gap: 0;
  grid-template-areas: "login-name   login-password login-button" "login-create login-forgot   login-stayin"; }
  .login-container .login-name {
    grid-area: login-name; }
  .login-container .login-password {
    grid-area: login-password; }
  .login-container .login-button {
    grid-area: login-button;
    margin: auto auto !important; }
  .login-container .login-create {
    grid-area: login-create;
    margin: center right !important; }
  .login-container .login-forgot {
    grid-area: login-forgot;
    margin: center right !important; }
  .login-container .login-stayin {
    grid-area: login-stayin;
    margin: center right !important; }
  @media screen and (max-width: 370px) {
    .login-container {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(4, min-content);
      column-gap: 0;
      row-gap: 0;
      grid-template-areas: "login-name login-button" "login-create login-button" "login-password login-button" "login-forgot login-stayin"; }
      .login-container .login-button {
        align-content: end;
        justify-content: right; } }
.about-container {
  display: grid;
  grid-template-columns: 1fr min-content;
  grid-template-rows: repeat(2, min-content);
  column-gap: 10px;
  row-gap: 15px;
  grid-template-areas: "promise credits" "blurb   blurb"; }
  .about-container .about-promise {
    grid-area: promise; }
  .about-container .about-credits {
    grid-area: credits;
    max-height: 385px; }
  .about-container .about-blurb {
    grid-area: blurb; }
  @media screen and (max-width: 480px) {
    .about-container {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, min-content);
      column-gap: 7px;
      row-gap: 7px;
      grid-template-areas: "promise" "blurb" "credits"; } }
.signup-container {
  display: grid;
  grid-template-columns: 1fr min-content;
  grid-template-rows: min-content;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "account beta"; }
  .signup-container .signup-beta {
    grid-area: beta; }
  .signup-container .signup-account {
    grid-area: account; }
  @media screen and (max-width: 480px) {
    .signup-container {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: min-content min-content;
      column-gap: 7px;
      row-gap: 7px;
      grid-template-areas: "beta" "account"; } }
.pics {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .pics .item {
    align-self: start;
    padding: 5px; }

.homepage {
  margin: auto auto !important;
  display: grid;
  grid-template-columns: min-content;
  grid-template-rows: min-content;
  column-gap: 7px;
  row-gap: 7px; }
  .homepage .phrase, .homepage .mail, .homepage .fbr, .homepage .browse {
    text-align: center; }
  .homepage .mail {
    margin: auto auto !important; }
  .homepage .top10s {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content;
    column-gap: 7px;
    row-gap: 7px;
    grid-template-areas: "top10members top10matches"; }
    @media screen and (max-width: 1050px) {
      .homepage .top10s {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: min-content min-content;
        column-gap: 7px;
        row-gap: 7px;
        grid-template-areas: "top10members" "top10matches"; } }
.server_error_msg {
  height: calc(100vh - 5px);
  margin: auto auto !important;
  display: grid;
  grid-template-columns: min-content min-content;
  grid-template-rows: 1fr;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "logo msg"; }
  .server_error_msg .logo {
    grid-area: logo; }
  .server_error_msg .msg {
    grid-area: msg; }
  .server_error_msg .error {
    max-width: 190px;
    word-wrap: break-word; }
  @media screen and (max-width: 480px) {
    .server_error_msg {
      display: grid;
      grid-template-columns: min-content;
      grid-template-rows: 0.5fr 0.5fr;
      column-gap: 7px;
      row-gap: 7px;
      grid-template-areas: "msg" "logo"; } }
.stats-container {
  height: 222px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr min-content;
  column-gap: 7px;
  row-gap: 7px;
  grid-template-areas: "divs" "buttons"; }
  .stats-container .stats-divs {
    margin: auto auto !important;
    grid-area: divs;
    max-width: 100%; }
  .stats-container .stats-buttons {
    grid-area: buttons;
    width: 100%; }

.album {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .album .item {
    align-self: center;
    padding: 5px; }

.flex-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .flex-container .item {
    align-self: center;
    padding: 5px; }

.flex-container-top {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .flex-container-top .item {
    align-self: start;
    padding: 5px; }

.source-list {
  white-space: nowrap;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center; }
  .source-list .item {
    align-self: center;
    padding: 5px; }
  .source-list .title {
    width: 100%;
    text-align: center; }
  .source-list .file {
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px; }
    .source-list .file::after {
      content: ' -';
      padding-left: 5px; }

.source {
  white-space: nowrap;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center; }
  .source .item {
    align-self: center;
    padding: 5px; }
  .source .file {
    padding-top: 0;
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px; }
    .source .file::after {
      content: ' -';
      padding-left: 5px; }
  .source .title {
    width: 100%;
    text-align: center; }
  .source .count {
    color: var(--bold-clr);
    font-weight: bold;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }
  .source .code {
    border: 2px inset var(--borders-clr);
    border-radius: 5px;
    background-color: var(--gradient-dark);
    background-color: var(--gradient-dark);
    background-image: radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
    background-image: -o-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
    background-image: -ms-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
    background-image: -moz-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
    background-image: -webkit-radial-gradient(center, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.45));
    overflow-x: hidden;
    overflow-y: scroll;
    padding-right: 3px;
    max-height: 280px;
    max-width: 780px;
    min-height: 280px;
    min-width: 180px;
    padding: 8px; }
    .source .code::-webkit-scrollbar {
      border: 1px inset var(--borders-clr);
      background-color: var(--gradient-dark);
      height: 12px;
      width: 12px;
      border-radius: 5px; }
    .source .code::-webkit-scrollbar-thumb {
      border: 1px outset var(--borders-clr);
      background-color: var(--gradient-light);
      width: 10px;
      border-radius: 5px; }
    .source .code::-webkit-scrollbar-track {
      background-color: transparent; }
    .source .code td {
      border-bottom: 0;
      border-top: 0; }
      .source .code td.linenum {
        background-color: blue;
        border-left: 1px solid white;
        border-right: 1px solid white;
        color: white;
        text-align: right;
        padding-left: 2px;
        padding-right: 2px; }
    .source .code tr:hover {
      background-color: var(--bg-clr); }

.small-footer {
  font-size: var(--small-font-size); }
  @media screen and (max-width: 480px) {
    .small-footer {
      font-size: var(--tiny-font-size); } }
.ueditor_navbar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: space-between;
  width: 72%;
  padding-bottom: 4px; }

a, b, i, label, legend {
  font-weight: bold;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }

a, a:hover, a:visited, a:focus {
  color: var(--link-clr);
  text-decoration: none; }
  a:hover, a:hover:hover, a:visited:hover, a:focus:hover {
    cursor: url("/images/site/pointer.png"), auto; }
  a.copyright, a:hover.copyright, a:visited.copyright, a:focus.copyright {
    font-size: var(--small-font-size);
    font-weight: bold; }
  a.anchor, a:hover.anchor, a:visited.anchor, a:focus.anchor {
    display: block;
    position: relative;
    top: -50px;
    visibility: hidden; }

a:hover, a:focus {
  color: brighten(link-clr); }

b {
  color: var(--bold-clr); }

big {
  font-size: var(--normal-font-size) !important; }

i {
  color: var(--body-clr); }

fieldset {
  color: var(--body-clr-dark);
  background-color: var(--gradient-light);
  border: 1px outset var(--borders-clr);
  border-radius: 5px;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55); }

form {
  margin: 0 auto; }

h1, h2, h3, h4, h5, h6 {
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }

h1 {
  font-family: var(--normal-font);
  font-size: var(--giant-font-size);
  font-weight: normal; }

h2 {
  font-family: var(--normal-font);
  font-size: var(--large-font-size);
  font-weight: normal; }

h3 {
  font-family: var(--normal-font);
  font-size: var(--medium-font-size);
  font-weight: normal; }

h4 {
  font-family: var(--normal-font);
  font-size: var(--normal-font-size);
  font-weight: normal; }

h5 {
  font-family: var(--normal-font);
  font-size: var(--nearsmall-font-size);
  font-weight: normal; }

h6 {
  font-family: var(--normal-font);
  font-size: var(--small-font-size);
  font-weight: normal; }

label {
  color: var(--link-clr);
  cursor: pointer;
  font-weight: bold;
  user-select: none; }

legend {
  color: var(--subtitle-clr);
  border: 1px outset var(--borders-clr);
  background-color: var(--bg-clr);
  background-image: linear-gradient(left, var(--gradient-dark), var(--gradient-light), var(--gradient-dark));
  background-image: -o-linear-gradient(left, var(--gradient-dark), var(--gradient-light), var(--gradient-dark));
  background-image: -ms-linear-gradient(left, var(--gradient-dark), var(--gradient-light), var(--gradient-dark));
  background-image: -moz-linear-gradient(left, var(--gradient-dark), var(--gradient-light), var(--gradient-dark));
  background-image: -webkit-linear-gradient(left, var(--gradient-dark), var(--gradient-light), var(--gradient-dark));
  border-radius: 5px;
  padding-top: 0;
  padding-right: 10px;
  padding-bottom: 0;
  padding-left: 10px;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.55);
  margin-top: 2px;
  margin-right: 8px;
  margin-bottom: 8px;
  margin-left: 2px; }
  legend.transparent {
    border-color: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none; }
  legend.green {
    background-color: var(--green);
    background-image: none !important;
    border: 1px outset var(--green); }
    legend.green:hover {
      transform: translateY(0); }
      legend.green:hover:disabled {
        transform: none; }
      legend.green:hover:hover, legend.green:hover:focus {
        backface-visibility: hidden;
        filter: brightness(105%);
        transform: translateY(3);
        transform: scale(1.1) translate3d(0, 0, 50px); }

hr {
  border: 0;
  height: 1px;
  background: var(--borders-clr);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  margin-top: 5px;
  margin-bottom: 5px; }
  hr.tiny {
    width: 25%;
    position: relative;
    left: calc(50% - calc(25% / 2)); }
  hr:hover {
    cursor: url("/images/site/cursor2.png"), auto; }

li {
  margin-left: initial; }

ol, ul {
  margin-left: 30px; }

ul {
  list-style-type: disc;
  list-style-position: inside; }

ol.rj {
  counter-reset: li -1;
  /* Initiate a counter */
  margin-left: var(--ol-margin-left);
  /* Alter the default left margin */
  padding-left: 36px;
  /* Override default left padding */
  padding-right: 4px;
  padding-top: 4px;
  border: 2px solid black;
  border-radius: 5px;
  background-color: var(--gradient-light);
  width: min-content; }

ol.rj > li {
  position: relative;
  /* Create a positioning context */
  margin: 0 0 1px var(--ol-margin-left);
  /* Give each list item a left margin to make room for the numbers */
  padding: 2px 8px 6px 8px;
  /* Add some spacing around the content */
  list-style: none;
  /* Disable the normal item numbering */
  border-top: 2px solid black;
  color: var(--body-clr);
  white-space: nowrap; }

ol.rj > li:before {
  content: "[ " counter(li) " ]";
  /* Use the counter as content */
  counter-increment: li;
  /* Increment the counter by 1 */
  /* Position and style the number */
  position: absolute;
  top: -2px;
  left: var(--ol-margin-left-negative);
  width: var(--ol-margin-left);
  /* Some space between the number and the content in browsers that support
       generated content but not positioning it (Camino 2 is one example) */
  margin-right: 8px;
  padding: 2px;
  border: 2px solid black;
  border-radius: 5px;
  color: var(--body-clr);
  background: var(--gradient-dark);
  font-weight: bold;
  text-align: center; }

li ol.rj {
  margin-top: 6px; }

ol.rj li:last-child {
  margin-bottom: 0; }

img {
  -ms-interpolation-mode: bicubic;
  border: 0;
  vertical-align: middle;
  loading: lazy; }

small {
  font-size: var(--small-font-size); }

big {
  font-size: var(--giant-font-size); }

iframe {
  border: 1px inset var(--borders-clr); }

.spacerx {
  width: 5px;
  max-width: 5px;
  min-width: 5px; }

.spacerx_big {
  width: 10px;
  max-width: 10px;
  min-width: 10px; }

.spacerx_large {
  max-width: 15px;
  min-width: 15px;
  width: 15px; }

.spacerx_largest {
  max-width: 20px;
  min-width: 20px;
  width: 20px; }

.spacery_tiny {
  max-height: 2px;
  min-height: 2px;
  height: 2px; }

.spacery {
  height: 5px;
  max-height: 5px;
  min-height: 5px; }

.spacery_large {
  height: 10px;
  max-height: 10px;
  min-height: 10px; }

.spacery_larger {
  height: 15px;
  max-height: 15px;
  min-height: 15px; }

.spacery_largest {
  height: 20px;
  max-height: 20px;
  min-height: 20px; }

.spacery_giant {
  max-height: 35px;
  min-height: 35px;
  height: 35px; }

.spacery_big {
  max-height: 100px;
  min-height: 100px;
  height: 100px; }

.spacery_bigger {
  max-height: 275px;
  min-height: 275px;
  height: 275px; }

.spacery_gargantuan {
  max-height: 350px;
  min-height: 350px;
  height: 350px; }