:root {
    font-family: "Ubuntu", system-ui;
      font-size: 14px;
      --backgroundColor: #DDE6EB;
      --menuTextColor: #000000;
  }
  
  .conceal {
      -webkit-text-security: disc;
  }
  
  #mainBody {
      background-color: #484848;
  }
  
  ::-webkit-scrollbar {
      width: 6px;
      height: 0;
  }
  
  ::-webkit-scrollbar-track {
      border-radius: 3px;
      background: oklch(0% 0 0 / 15%);
  }
  
  ::-webkit-scrollbar-thumb {
      border-radius: 3px;
      background: oklch(0% 0 0 / 30%);
  }
  
  html,
  body {
      overflow: hidden;
      height: 100%;
      position: fixed;
      -webkit-overflow-scrolling: touch;
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none;
  }
  body {
    font-family: "Ubuntu", system-ui;
      font-size: 14px;
      background-image: url("https://deltafyrex.github.io/neroassets/nero-logo-text.png?v=1746742162513");
      background-repeat: repeat;
      background-color: #484848;
  }
  
  html,
  body,
  canvas[id=gameCanvas] {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
  }
  
  canvas[id=gameCanvas] {
      image-rendering: optimizeSpeed;
      image-rendering: pixelated;
  }
  
  #content {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
  }
  
  canvas[id=musiccanvas] {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  
  audio {
    position: fixed;
    left: 10px;
    bottom: 10px;
    width: calc(100% - 20px);
  }
  
  #gameName {
      padding: 0;
      margin-top: 5px;
      margin-bottom: 10px;
      text-align: center;
      font-size: xx-large;
      font-weight: bolder;
      font-family: "Ubuntu";
  }
  #gameName:active {
      padding: 0;
      margin-top: 5px;
      margin-bottom: 10px;
      text-align: center;
      font-size: xx-large;
      font-weight: bolder;
      animation:pfpDefault 800ms linear both;
  }
  h2 {
      font-size: small;
      color: #000000;
      font-weight: bold;
      text-align: center;
  }
  
  options_header {
      display: block;
      margin: 5px 0 4px;
      font: bold 13px/1 "Ubuntu";
      color: #000000;
      text-align: center;
  }
  
  miniupdate {
      font-size: medium;
      color: #000000;
      font-weight: bold;
      text-align: center;
      font-size: 16px;
      animation:pfpDefault 800ms linear both;
  }
  
  h3 {
      font-size: small;
      color: #484848;
      text-align: center;
      animation:pfpDefault 800ms linear both;
  }
  
  h3:hover {
     animation:pfpDefault 800ms linear both;
  }
  
  h4 {
      font-size: small;
      color: #1B3353;
      /*color: #8ABC3F;*/
      text-align: center;
  }
  
  h5 {
      font-size: x-small;
      color: #484848;
      text-align: center;
  }
  
  small {
      font-size: x-small;
  }
  
  a:link,
  a:visited {
      color: #484848;
  }
  
  a:hover {
      color: #B5B5B9;
  }
  
  ul {
      padding-left: 15px;
      margin-left: 10px;
  }
  
  input {
      text-align: center;
      font-family: "Ubuntu";
      width: 100%;
      padding: 10px;
      border: solid 1px #dcdcdc;
      transition: box-shadow 0.3s, border 0.3s;
      box-sizing: border-box;
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      margin-top: 10px;
      margin-bottom: -10px;
      outline: none;
  }
  
  input.checkbox {
      width: 15px;
      height: 15px;
      padding: 0;
      margin: 0;
      vertical-align: bottom;
      position: relative;
      top: -1px;
      overflow: hidden;
      font-family: "Ubuntu";
  }
  input.checkbox:focus,
  input.checkbox.focus {
      border: none;
      box-shadow: 0 0 0px 0px #DDDDDD;
  }
  
  #optColors {
      width: 220px;
  }
  #optMobile {
      display: none;
  }
  body.mobile #optColors {
      width: 346px;
      margin-bottom: 4px;
    }
  body.mobile #optMobile, body.mobile #optBorders {
      width: 170px;
      margin-bottom: 4px;
      display: inline-block;
  }
  
  #playerNameInput {
      padding: 10px;
      font-size: medium;
       border-radius: 15px;
      -moz-border-radius: 15px;
      -webkit-border-radius: 15px;
  }
  
  #playerKeyInput {
      padding: 3px;
      color: gray;
  
  }
  
  input:focus,
  input.focus {
      border: solid 1px #CCCCCC;
      box-shadow: 0 0 3px 1px #DDDDDD;
  }
  
  div {
      -webkit-user-select: none;
      /* webkit (safari, chrome) browsers */
      -moz-user-select: none;
      /* mozilla browsers */
      -khtml-user-select: none;
      /* webkit (konqueror) browsers */
      -ms-user-select: none;
      /* IE10+ */
  }
  div.optionsHeader {
      display: block;
      margin: 10px 0 4px;
      font: bold 13px/1 "Ubuntu";
      color: #000000;
      text-align: center;
  }
  
  .serverSelector {
      height: 100px;
      text-align: center;
      font-size: 14px;
      font-weight: bold;
      line-height: 14px;
      padding-left: 10px;
      padding-top: 10px;
      overflow-y: scroll;
      scroll-behavior: smooth;
      scrollbar-width: thin;
      scrollbar-color: oklch(0% 0 0 / 30%) oklch(0% 0 0 / 15%);
  }
  
  body.mobile .serverSelector {
      height: 140px;
  }
  
  .serverSelector tr {
      color: #828282;
      cursor: pointer;
  }
  
  .serverSelector tr.selected {
      color: #1B3353;
      /*color: #8ABC3F;*/
      cursor: default;
  }
  
  .serverSelector tr:hover {
      color: #8ABC3F;
  }
  .serverSelector tr.selected:hover {
      color: #1B3353;
      cursor: default;
  }
  
  
  #startMenu {
      position: relative;
      margin: auto;
      width: 393px;
      padding: 10px;
      margin-top: 100px;
      margin-bottom: 100px;
      border-radius: 25px;
      -moz-border-radius: 25px;
      -webkit-border-radius: 25px;
      background-color: #DDE6EB;
      box-sizing: border-box;
      overflow: hidden;
      outline-width: 15px;
      outline: #000000 solid;
      -moz-outline-width: 15px;
      -webkit-outline-width: 15px;
  }
  body.mobile #startMenu {
      width: 393px;
      height: 350px;
      bottom: 100px;
  }
  body.mobile .icon {
      display: none;
  }
  body.mobile #startMenuSlidingContent {
      height: 250px;
  }
  
  #startMenuHeader {
      text-align: left;
      width: 100%;
      height: 100%;
  }
  
  .startMenuHolder {
      width: 350px;
      height: 365px;
      padding: 10px;
      overflow: hidden;
      display: inline-block;
      vertical-align: text-top;
  }
  .replace1 {
  right: 0;
  }
  .replace2 {
  right: -50;
  }
  a.menuTab {
    float: right;
    height: 13px;
    font: 13px "Black Ops One";
    border-radius: 0px 0px 5px 5px;
    padding: 6px 10px 7px 10px;
    color: #FFFFFF !important;
    text-decoration: none;
    margin-right: 10px;
  }
  a.menuTab.discordbutton {
     padding: 6px 10px 7px 28px;
          border-bottom: 2px solid #6175ba;
      box-shadow: inset 0 -2px #6175ba;
      -webkit-box-shadow: inset 0 -2px #6175ba;
        animation:pfpDefault 800ms linear both;
    background: #7289DA url("https://cloud-cube.s3.amazonaws.com/m660o440l0wv/public/svg0.svg") 4px 3px/21px no-repeat;
  }
  a.menuTab.discordbutton:active,
  a.menuTab.discordbutton:hover {
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  a.menuTab.catto {
    background: #FF0000 url("https://cloud-cube.s3.amazonaws.com/m660o440l0wv/public/coder.png") 8px 6px no-repeat;
    padding: 6px 10px 7px 28px;
        border-bottom: 2px solid #c91a1a;
      box-shadow: inset 0 -2px #c91a1a;
      -webkit-box-shadow: inset 0 -2px #c91a1a;
        animation:pfpDefault 800ms linear both;
  }
  a.menuTab.catto:active,
  a.menuTab.catto:hover {
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  body.mobile a.menuTab.catto {
  display: none;
  }
  
  a.menuTab.ach {
    background: #2bab2f  url("https://deltafyrex.github.io/neroassets/Trophy.png?v=1708025693434") 3px 2px/23px no-repeat;
    padding: 6px 10px 7px 28px;
    border-bottom: 2px solid #2a802d;
    box-shadow: inset 0 -2px #2a802d;
    -webkit-box-shadow: inset 0 -2px #2a802d;
    animation:pfpDefault 800ms linear both;
  }
  a.menuTab.ach:active,
  a.menuTab.ach:hover {
      top: 1px;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  
  a.menuTab.skin {
    background: #9900FF  url("https://deltafyrex.github.io/neroassets2/stick.png?v=1708440293253") 3px 2px/23px no-repeat;
    padding: 6px 10px 7px 28px;
          border-bottom: 2px solid #7b11c2;
      box-shadow: inset 0 -2px #7b11c2;
      -webkit-box-shadow: inset 0 -2px #7b11c2;
        animation:pfpDefault 800ms linear both;
  }
  a.menuTab.skin:active,
  a.menuTab.skin:hover {
      top: 1px;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  
  a.menuTab.stat {
    background: #1E8449  url("https://cloud-cube.s3.amazonaws.com/m660o440l0wv/public/play.png") 3px 2px/23px no-repeat;
    padding: 6px 10px 7px 28px;
          border-bottom: 2px solid #156637;
      box-shadow: inset 0 -2px #156637;
      -webkit-box-shadow: inset 0 -2px #156637;
        animation:pfpDefault 800ms linear both;
  }
  a.menuTab.stat:active,
  a.menuTab.stat:hover {
      top: 1px;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
  }
  body.mobile a.menuTab.stat {
  display: none;
  }
  
  a.menuTab.??? {
    background: #FFFFFF  url("https://deltafyrex.github.io/neroassets/2022_06_23_11e_Kleki.png?v=1675997243695") 3px 2px/23px no-repeat;
    padding: 6px 10px 7px 28px;
        animation:pfpDefault 800ms linear both;
  }
  a.menuTab:link:hover, a.menuTab:visited:hover {
    text-decoration: underline;
      animation:pfpHoverOn 800ms linear both;
  }
  .sliderHolder {
      width: 350px;
      height: 323px;
      overflow: hidden;
  }
  
  .sliderHolder2 {
      width: 350px;
      height: 325px;
      overflow: hidden;
  }
  
  tfoot {
      text-align: center;
      opacity: 0.5;
      margin: 10px;
  }
  
  td {
      width: 50%;
  }
  
  table {
      width: 100%;
      color: black;
  }
  
  .slider {
      position: relative;
      top: 0px;
      width: 100%;
      opacity: 1;
      -webkit-transition: top 500ms;
      -moz-transition: top 500ms;
      -o-transition: top 500ms;
      transition: top 500ms, opacity 500ms;
      animation:pfpDefault 800ms linear both;
        transition-timing-function: cubic-bezier(0.175, 0.585, 0.32, 1.2)
  }
  
  .slider2 {
      position: relative;
      right: 0px;
      width: 100%;
      z-index: 0;
      display: inline-block;
      -webkit-transition: right 1000ms;
      -moz-transition: right 1000ms;
      -o-transition: right 1000ms;
      transition: right 1000ms;
      animation:pfpDefault 800ms linear both;
        transition-timing-function: cubic-bezier(0.175, 0.585, 0.32, 1)
  }
  .slider3 {
      position: absolute;
      z-index: -6;
      right: 400px;
      width: 100%;
      display: inline-block;
      -webkit-transition: right 1000ms;
      -moz-transition: right 1000ms;
      -o-transition: right 1000ms;
      transition: right 1000ms;
      animation:pfpDefault 800ms linear both;
        transition-timing-function: cubic-bezier(0.175, 0.585, 0.32, 1)
  }
  
  .slided .slider {
      top: -255px;
  }
  #startMenuSlidingContent {
      height: 305px;
  }
  body.mobile .desktopControlTab {
      display: none;
  }
  .mobileOptions {
      display: none;
  }
  body.mobile .mobileOptions {
      display: block;
  }
  .mobileOptionsHeader {
      display: none;
  }
  body.mobile .mobileOptionsHeader {
      display: block;
      margin: 10px 0 4px;
      font: bold 13px/1 "Ubuntu";
      color: #000000;
      text-align: center;
  }
  
  .slidingtrigger3 {
      position: relative;
      top: 0px;
      width: 100%;
      -webkit-transition: top 500ms;
      -moz-transition: top 500ms;
      -o-transition: top 500ms;
      transition: top 500ms;
  }
  
  #startMenuSlidingContent {
      height: 300px;
  }
  
  #startMenuSlidingTrigger {
      cursor: pointer;
      height: 15px;
      margin-top: -15px;
  }
  #startMenuSlidingTrigger:hover {
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  }
  #startMenuSlidingTrigger:active > h3 {
    color: #323232;
    animation:pfpDefault 800ms linear both;
  }
  
  #startMenuSlidingTrigger:hover > h3 > i.arrow {
    border-color: #323232;
  }
  
  #startMenuSlidingTrigger2 {
      cursor: pointer;
  }
  #startMenuSlidingTrigger2:hover {
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  }
  #startMenuSlidingTrigger2:active > h3 {
    color: #323232;
    animation:pfpDefault 800ms linear both;
  }
  #startMenuSlidingTrigger2:hover > h3 > i.arrow {
    border-color: #323232;
  }
  #startMenuSlidingTrigger3 {
      cursor: pointer;
      height: 15px;
  }
  
  #startMenuSlidingTrigger3:hover {
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  }
  
  .menuTabs {
    height: 26px;
    margin: 0 8px;
  }
  update {
      color: #D83848;
        animation:pfpDefault 800ms linear both;
  
      font-weight: bold;
  }
  
  .titleSpan {
      padding-left: 10px;
      font-size: x-large;
      font-weight: bold;
      text-align: justify;
  }
  .horizontalSelector {
    padding: 4px 0;
    margin-bottom: 4px;
    font: bold 12px "Black Ops One";
    text-align: center;
  }
  .horizontalSelector span {
    padding: 4px 10px;
    color: #343434;
    cursor: pointer;
  }
  .horizontalSelector span:hover {
    color: #5f5f5f;
  }
  .horizontalSelector span.active {
    background: #335099;
    color: #ffffff;
    border-radius: 5px;
    cursor: default;
  }
  
  .shrinkable {
      padding-left: 0px;
      width: 360px;
  }
  
  .dropdown-check-list {
    display: inline-block;
  }
  
  .dropdown-check-list .anchor {
    position: relative;
    cursor: pointer;
    display: inline-block;
    padding: 5px 50px 5px 10px;
    border: 1px solid #cccccc;
  }
  
  .dropdown-check-list .anchor:after {
    position: absolute;
    content: "";
    border-left: 2px solid black;
    border-top: 2px solid black;
    padding: 5px;
    right: 10px;
    top: 20%;
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }
  
  .dropdown-check-list .anchor:active:after {
    right: 8px;
    top: 21%;
  }
  
  .dropdown-check-list ul.items {
    padding: 2px;
    display: none;
    margin: 10px 10px 10px 10px;
    border: 1px solid #cccccc;
    border-top: none;
    height: 75px;
  }
  
  .dropdown-check-list ul.items li {
      padding: 0;
      margin-top: 8px;
      position: relative;
      top: -7px;
  }
  
  .dropdown-check-list.visible .anchor {
    color: #0094ff;
  }
  
  .dropdown-check-list.visible .items {
    display: block;
  }
  
  #credits {
      max-width: 330px;
      /*animation:pfpDefault 800ms linear both;*/
      height: calc(100% - 100px);
      padding: 5px 20px 10px;
      overflow: hidden auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.15);
  }
  
  #credits div {
      > .title {
          margin: 0;
          font-size: 1.5em;
          font-weight: bold;
      }
  
      > date {
          color: rgba(0, 0, 0, 0.45);
          font-style: italic;
      }
  
      > ul li {
          margin-left: 1em;
          margin-bottom: .5em;
      }
  
      position: relative;
      /*animation:pfpDefault 800ms linear both;*/
  
      &::before {
          content: '';
          position: absolute;
          bottom: 0;
          width: 100%;
          height: .1em;
          background-color: gray;
      }
  }
  body.mobile #credits {
      height: calc(100% - 150px);
  }
  
  #patchNotes {
      max-width: 330px;
      /*animation:pfpDefault 800ms linear both;*/
      height: calc(100% - 100px);
      padding: 5px 20px 10px;
      overflow: hidden auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.15);
  }
  
  body.mobile #patchNotes {
      height: calc(100% - 150px);
  }
  
  #patchNotes div {
      > .title {
          margin: 0;
          font-size: 1.5em;
          font-weight: bold;
    }
    
      > date {
          color: rgba(0, 0, 0, 0.45);
          font-style: italic;
      }
  
      > ul li {
          margin-left: 1em;
          margin-bottom: .5em;
      }
  
      position: relative;
      /*animation:pfpDefault 800ms linear both;*/
  
      &::before {
          content: '';
          position: absolute;
          bottom: 0;
          width: 100%;
          height: .1em;
          background-color: gray;
      }
  }
  
  select {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      font: 13px/1 "Ubuntu";
      padding: 2px 28px 2px 8px;
      height: 21px;
      margin-left: 3px;
      background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAICAYAAAD0g6+qAAAAwklEQVQoU42QMQrCQBBFZxeGgJ7BI1jYa2GzTTY3sRUECy1yA0svEQhhEHIHLdRrqF2a5EuCkbgmmin/zLz5f5QxZsTMK2ZeR1F0p5ay1i7zPD+LiLT1S01Za7dEtCGiY5Zl8zRNH81h3/d3SqkFgFOSJJNOUBAEAwAHIpq6sAbkprWexXF86QSVjTaY53nhy8lfSBWtvuDAKhlAL8gHyHUGAFrr8a84zZhvR7VojBkyc1gUxV5Erl0/cfUvUN9Fd+4JA1JkCdbmVf8AAAAASUVORK5CYII=) 100% no-repeat #eee;
      border-radius: 4px;
      border: 1px solid #ccc;
  }
  select:hover {
      background-color: #ccc;
  }
  select:active {
      background-color: #eee;
  }
  
  .shadowScroll {
      overflow-y: scroll;
      background:
          /* Shadow covers */
          linear-gradient(#dde6eb 30%, rgba(255, 255, 255, 0)),
          linear-gradient(rgba(255, 255, 255, 0), #dde6eb 70%) 0 100%,
          /* Shadows */
          radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)),
          radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
      background-repeat: no-repeat;
      background-color: #dde6eb;
      background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
      background-attachment: local, local, scroll, scroll;
  }
  
  #startButton {
      font-family: "Ubuntu";
      position: relative;
      margin: auto;
      width: 100%;
      height: 40px;
      box-sizing: border-box;
      font-size: larger;
      line-height: 0;
      color: white;
        animation:pfpDefault 800ms linear both;
      text-align: center;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
      background: #335099;
      /*background: #A9D86D;*/
      border: 0;
      border-bottom: 2px solid #1B3353;
      /*border-bottom: 2px solid #8ABC3F;*/
      cursor: pointer;
      -webkit-box-shadow: inset 0 -2px #1B3353;
      /*-webkit-box-shadow: inset 0 -2px #8ABC3F;*/
      box-shadow: inset 0 -2px #1B3353;
      /*box-shadow: inset 0 -2px #8ABC3F;*/
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
  }
  
  #hideongamestart {
    position: relative;
    z-index: 3;
    }
  
  #resetachievementsbutton {
      font-family: "Ubuntu";
      line-height: 0;
      top: 30px;
      width: 100%;
      height: 40px;
      max-height: 100px;
      top: 443px;
      z-index: 3;
      color: white;
      animation:pfpDefault 800ms linear both;
      text-align: center;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
      background: #70b5ff;
      font-family: "Ubuntu";
      position: relative;
      border: 0;
      border-bottom: 2px solid #1B3353;
      cursor: pointer;
      -webkit-box-shadow: inset 0 -2px #1B3353;
      box-shadow: inset 0 -2px #1B3353;
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      float: left;
  }
  
  .icon {
    animation:pfpDefault 800ms linear both;
  }
  
  .icon:hover {
    animation:pfpHoverOn 800ms linear both;
  }
  
  .icon:active {
    animation:pfpDefault 400ms linear both;
  }
  
  #startButton:active,
  #startButton:hover {
      top: 1px;
      background: #335099;
      /*background: #A9D86D;*/
      border: 0;
      border-bottom: 3px solid #1B3353;
      /*background: #1B3353;*/
      /*background: #8ABC3F;*/
        line-height: 25px;
      text-align: center;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
      height: 39px;
  }
  
  #resetachievementsbutton:active,
  #resetachievementsbutton:hover {
      line-height: 25px;
      text-align: center;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
      height: 39px;
      border: 0;
      border-bottom: 3px solid #1B3353;
      top: 444px;
  
  }
  
  #bottomHolder {
      width: 370px;
      display: grid;
      grid-template-columns: auto auto auto;
  }
  
  a.link {
      border-radius: 5px;
      box-sizing: border-box;
      color: white;
      cursor: pointer;
      display: inline-block;
      font-size: smaller;
      margin: 2px;
      padding: 5px;
      position: relative;
      width: 120px;
      text-align: center;
      text-decoration: none;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
  }
  
  .discord {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #7289da;
      line-height: 15px;
      border-bottom: 2px solid #6175ba;
      box-shadow: inset 0 -2px #6175ba;
      -webkit-box-shadow: inset 0 -2px #6175ba;
  }
  .discord:active,
  .discord:hover {
      top: 3px;
      background: #7289da;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #6175ba;
      box-shadow: inset 0 -2px #6175ba;
      -webkit-box-shadow: inset 0 -2px #6175ba;
  }
  
  .reddit {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #f75401;
      line-height: 15px;
      border-bottom: 2px solid #d24a01;
      box-shadow: inset 0 -2px #d24a01;
      -webkit-box-shadow: inset 0 -2px #d24a01;
  }
  
  .reddit:active,
  .reddit:hover {
      top: 3px;
      background: #f75401;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #d24a01;
      box-shadow: inset 0 -2px #d24a01;
      -webkit-box-shadow: inset 0 -2px #d24a01;
  }
  
  .original {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #77bf79;
      line-height: 15px;
      border-bottom: 2px solid #679c68;
      box-shadow: inset 0 -2px #679c68;
      -webkit-box-shadow: inset 0 -2px #679c68;
  }
  
  .original:active,
  .original:hover {
      top: 3px;
      background: #77bf79;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #679c68;
      box-shadow: inset 0 -2px #679c68;
      -webkit-box-shadow: inset 0 -2px #679c68;
  }
  
  .developer {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #454b7f;
      line-height: 15px;
      border-bottom: 2px solid #313454;
      box-shadow: inset 0 -2px #313454;
      -webkit-box-shadow: inset 0 -2px #313454;
  }
  .developer:active,
  .developer:hover {
      top: 3px;
      background: #454b7f;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #313454;
      box-shadow: inset 0 -2px #313454;
      -webkit-box-shadow: inset 0 -2px #313454;
  }
  
  .youtube {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #f71701;
      line-height: 15px;
      border-bottom: 2px solid #d21401;
      box-shadow: inset 0 -2px #d21401;
      -webkit-box-shadow: inset 0 -2px #d21401;
  }
  
  .youtube:active,
  .youtube:hover {
      top: 3px;
      background: #f71701;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #d21401;
      box-shadow: inset 0 -2px #d21401;
      -webkit-box-shadow: inset 0 -2px #d21401;
  }
  
  .github {
      top: 2px;
      animation:pfpDefault 800ms linear both;
      background: #666666;
      line-height: 15px;
      border-bottom: 2px solid #333333;
      box-shadow: inset 0 -2px #333333;
      -webkit-box-shadow: inset 0 -2px #333333;
  }
  .github:active,
  .github:hover {
      top: 3px;
      background: #666666;
      outline: none;
      height: 85%;
      line-height: 15px;
      border-bottom: 1px solid #333333;
      box-shadow: inset 0 -2px #333333;
      -webkit-box-shadow: inset 0 -2px #333333;
  }
  
  #startMenuWrapper {
      -webkit-transition: max-height 1s;
      -moz-transition: max-height 1s;
      -ms-transition: max-height 1s;
      -o-transition: max-height 1s;
      transition: max-height 1s;
      overflow: hidden;
      animation: fadezoomin 300ms f; 
  }
  
  .nopadding {
      padding: 0;
      margin: 0;
  }
  
  #startMenu ul {
      margin: 10px;
      padding: 10px;
      margin-top: 0;
  }
  
  #startMenu .input-error {
      color: red;
      opacity: 0;
      font-size: 12px;
  }
  
  #startMenuWrapper {
      z-index: 2;
  }
  
  #gameAreaWrapper {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
  }
  
  #gameCanvas {
      position: absolute;
  }
  
  #chatInput {
      position: absolute;
      z-index: 1;
      width: 300px;
      height: 30px;
      top: 60%;
      left: calc(50% - 149px);
      box-shadow: 0px 0px 5px 2px darkgray;
      border: 2px solid black;
      border-radius: 10px;
      color: black;
      background-color: #ffffff88;
  }
  p.vsaucereference {
       animation:pfpHoverOn 400ms linear both;
    font-size: 13px;
  }
  p.vsaucereference:hover {
       animation:pfpHoverOn 400ms linear both;
  }
  
  p.vsaucereference:active {
    animation: pfpDefault 800ms linear both;
  }
  
  input [type="image"]:focus {
      border: none;
      outline: 1px solid transparent;
      border-style: none;
  }
  
  *:focus {
      outline: 1px solid transparent;
      border-style: none;
  }
  .popup {
      position: absolute;
      display: block;
      width: auto;
      max-width: 42%;
      height: auto;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
      border-radius: 10px;
      background: var(--backgroundColor);
      padding: 10px;
      font-size: larger;
      text-align: center;
      border-style: solid;
      border-color: #c1cfd8;
      color: var(--menuTextColor);
  }
  
  .popup button {
      margin: 15px;
      padding: 10px 50px 10px 50px;
      width: auto;
      box-sizing: border-box;
      color: white;
      text-align: center;
      text-shadow: 0 0 3px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2);
      background: #A9D86D;
      border: 0;
      border-bottom: 2px solid #8ABC3F;
      cursor: pointer;
      box-shadow: inset 0 -2px #8ABC3F;
      border-radius: 5px;
      font: 18px "Ubuntu";
  }
  
  .popup button:hover {
      border-bottom: 1px solid #8ABC3F;
  }
  
  .popup button:active {
      background: #FFFFFF;
      border-bottom: 0;
      outline: none;
      box-shadow: none;
  }
  
  .popup span.small {
      font-size: xx-large;
      font-weight: bold;
      color: black;
      white-space: pre-line;
  }
  
  .popup span {
      font-size: x-large;
      white-space: pre-line;
      font-weight: light;
      color: black;
  }
  .achievementsHolder {
      position: absolute;
      display: block;
      width: 700px;
      height: 550px;
      padding-top: 50px;
      top: 47.5%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
      background: var(--backgroundColor);
      padding: 10px;
      font-size: larger;
      text-align: center;
      border-style: solid;
      border-color: #c1cfd8;
      color: black;
      display: none;
  }
  
  .achievementsHolder span.small {
      font-size: xx-large;
      font-weight: bold;
      color: black;
      animation:pfpDefault 800ms linear both;
  }
  
  .achievementsHolder span {
      font-size: x-large;
      font-weight: lighter;
      color: black;
      animation:pfpDefault 800ms linear both;
  }
  body.mobile .achievementsHolder {
    top: 50%;
    width: calc(100% - 30px);
    height: calc(100% - 25px);
  }
  
  #achievementsClose {
      height: 45px;
      width: 50px;
      float: right;
      position: relative;
      opacity: .8;
      background-image: url('data:image/svg+xml,%3Csvg xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" fill%3D"%23DD0000" viewBox%3D"0 0 16 16" width%3D"30" height%3D"30"%3E%3Cpath d%3D"M3 0 0 3 6 8 0 13 3 16 8 10 13 16 16 13 10 8 16 3 13 0 8 6 3 0Z"%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
      background-repeat: no-repeat;
      background-position: center;
  }
  
  #achievementsClose:hover {
      cursor: pointer;
      opacity: 1;
  }
  
  #achievementsDisplay {
      height: 450px;
      margin-top: -20px;
      position: absolute;
      animation:pfpDefault 800ms linear both;
      width: 96.5%;
      border-style: solid;
      border-color: #c1cfd8;
      background-color: rgba(0, 0, 0, 0.2);
      background: url("https://deltafyrex.github.io/neroassets/41R6Ok5aeKL.jpg?v=1713446403687") 0px -550px/100% repeat;
  }
  body.mobile #achievementsDisplay {
    width: calc(100% - 25px);
    height: calc(100% - 78px);
  }
  
  .achievementsItem {
      margin: 16px 16px 12px 16px;
      border-radius: 14px;
      animation:pfpDefault 800ms linear both;
      padding: 6px;
  
  }
  
  .achievementsItem h1 {
      font-size: 22px;
      animation:pfpDefault 800ms linear both;
      font-weight: bold;
      color: #22160b;
  }
  
  .achievementsItem span {
      font-size: 17px;
      font-weight: bold;
      animation:pfpDefault 800ms linear both;
      color: #22160b;
  }
  
  .greenachievement {
      background-color: rgb(138, 187, 68);
  }
  
  .greyachievement {
      background-color: rgb(159, 159, 159);
  }
  
  .bleenachievement {
      background-color: rgb(125, 195, 235);
  }
  
  .grueachievement {
      background-color: rgb(160, 170, 180);
  }
  
  #achievementsStatsTable td {
      animation:pfpDefault 800ms linear both;
      font-size: 18px;
  }
  
  #achievementsStatsTable tr b {
      animation:pfpDefault 800ms linear both;
      font-size: 22px;
  }
  .autoBorder {
      display: block;
      border: 3.5px solid rgba(0, 0, 0, 0.35);
  }
  .metasip {
      height: 10px;
      width: 10px;
      background-image: "https://cloud-cube.s3.amazonaws.com/m660o440l0wv/public/svg0.svg"
  }
  #wikiTankThing {
    display: none;
    position: absolute;
    top: 58.5vh;
    left: 40%;
    z-index: 5;
    width: 20%;
  }
  .skinHolder {
      position: absolute;
      display: block;
      width: 650px;
      height: 600px;
      top: 47.5%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
      background: var(--backgroundColor);
      padding: 10px;
      font-size: larger;
      text-align: center;
      border-style: solid;
      border-color: #c1cfd8;
      color: black;
      display: none;
  }
  
  .skinHolder span.small {
      font-size: xx-large;
      font-weight: bold;
      color: black;
      animation:pfpDefault 800ms linear both;
  }
  
  .skinHolder span {
      font-size: x-large;
      font-weight: light;
      color: black;
      animation:pfpDefault 800ms linear both;
  }
  
  #skinClose {
      height: 45px;
      width: 50px;
      float: right;
      position: relative;
      opacity: .8;
      background-image: url('data:image/svg+xml,%3Csvg xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" fill%3D"%23DD0000" viewBox%3D"0 0 16 16" width%3D"30" height%3D"30"%3E%3Cpath d%3D"M3 0 0 3 6 8 0 13 3 16 8 10 13 16 16 13 10 8 16 3 13 0 8 6 3 0Z"%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
      background-repeat: no-repeat;
      background-position: center;
  }
  
  #skinClose:hover {
      cursor: pointer;
      opacity: 1;
  }
  
  #skinDisplay {
      height: 448px;
      margin-top: -20px;
      position: absolute;
      animation:pfpDefault 800ms linear both;
      width: 96.5%;
      border-style: solid;
      border-color: #c1cfd8;
      background-color: rgba(0, 0, 0, 0.2);
  }
  
  body.mobile .skinHolder {
    top: 50%;
    width: calc(100% - 30px);
    height: calc(100% - 25px);
  }
  body.mobile #skinDisplay {
    width: calc(100% - 25px);
    height: calc(100% - 78px);
  }
  
  .skinItem {
      margin: 16px 16px 12px 16px;
      border-radius: 14px;
      animation:pfpDefault 800ms linear both;
      padding: 6px;
  
  }
  
  .skinItem h1 {
      font-size: 22px;
      animation:pfpDefault 800ms linear both;
      font-weight: light;
      color: #22160b;
  }
  
  .skinItem span {
      font-size: 17px;
      font-weight: bold;
      animation:pfpDefault 800ms linear both;
      color: #22160b;
  }
  
  #leftarrowbutton {
      position: relative;
      float: left;
      height: 20%;
      width: 20%;
  }
  #rightarrowbutton {
      position: relative;
      float: right;
      height: 20%;
      width: 20%;
  }
  #leftarrowbutton:active {
      animation:pfpDefault 800ms linear both;
  }
  #rightarrowbutton:active {
      animation:pfpDefault 800ms linear both;
  }
  .displaytest {
      top: 0;
      position: relative;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      margin-top: auto;
  }
  .displayskinname {
      top: -2%;
      position: relative;
  }
  #skinpdiv {
      top: -3%;
      position: relative;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
  }
  body.mobile #skinpdiv {
    width: 25%;
  }
  #skinpreview {
      vertical-align: bottom;   
      width: 100%;
      height: 100%;
      z-index: 3;
  
  }
  #selectskin {
      vertical-align: bottom;   
      float: center;
      margin-left: auto;
      margin-right: auto;
      height: 130px;
      width: 260px;
      z-index: 3;
  }
  #lockedskin {
      display: none;
      width: 100%;
      height: 100%; 
      top: 0;
      left: 0;
      position: absolute;
      z-index: 3;
  }
  #lockbg {
      display: inline-block;
      width: 100%;
      height: 100%; 
      top: 0;
      left: 0;
      position: absolute;
      opacity: 0.4;
      z-index: -5;
  }
  #eventtitle {
    position: absolute;
    float: center;
    top: 600px;
    width: 70%;
    left: 15%;
    color: white;
    outline: #000000 solid;
    z-index: 0;
    text-align: center;
    cursor: pointer;
    text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
    background: #202020 url("https://deltafyrex.github.io/neroassets/2024_04_22_0fb_Kleki.png?v=1713786234204") 0px 0px/100px repeat;
  }
  #controls {
    height: 200px;
  }
  .animpop {
        animation:pfpDefault 800ms linear both;
  }
  .animinvert {
        animation:invertation 2s linear both;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
  }
  .incog:active {
        animation:wack2 2s linear 3;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear
  }
  .popuptaskbar {
    display: block;
    position: relative;
    height: 50px;
    width: 102.8%;
    left: -10px;
    top: -32px;
    background: #2bab2f  url("https://deltafyrex.github.io/neroassets/Trophy.png?v=1708025693434") 0px 0px/50px no-repeat;
  }
  #achievementsHeader {
    padding: 5px;
    text-align: left;
    margin-left: 50px;
    color: #FFFFFF
  }
  .popuptaskbar2 {
    display: block;
    position: relative;
    height: 50px;
    width: 102.8%;
    left: -10px;
    top: -32px;
    background: #9900FF  url("https://deltafyrex.github.io/neroassets2/stick.png?v=1708440293253") 0px 0px/50px no-repeat;
  }
  #skinHeader {
    padding: 5px;
    text-align: left;
    margin-left: 50px;
    color: #FFFFFF
  }
  .atthebottom {
    position: relative;
    top: 425px; 
  }
  body.mobile .atthebottom {
    top: 60%;
  }
  #yes {
    opacity: 0;
    position: absolute;
  }
  
  @keyframes pfpHoverOn { 
    0% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.4% { transform: matrix3d(1.032, 0, 0, 0, 0, 1.041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.7% { transform: matrix3d(1.045, 0, 0, 0, 0, 1.06, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.81% { transform: matrix3d(1.066, 0, 0, 0, 0, 1.089, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.41% { transform: matrix3d(1.088, 0, 0, 0, 0, 1.117, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    10.21% { transform: matrix3d(1.094, 0, 0, 0, 0, 1.123, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.61% { transform: matrix3d(1.112, 0, 0, 0, 0, 1.133, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    14.11% { transform: matrix3d(1.114, 0, 0, 0, 0, 1.133, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.52% { transform: matrix3d(1.121, 0, 0, 0, 0, 1.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.72% { transform: matrix3d(1.121, 0, 0, 0, 0, 1.119, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    21.32% { transform: matrix3d(1.12, 0, 0, 0, 0, 1.107, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    24.32% { transform: matrix3d(1.115, 0, 0, 0, 0, 1.096, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { transform: matrix3d(1.113, 0, 0, 0, 0, 1.094, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { transform: matrix3d(1.106, 0, 0, 0, 0, 1.09, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.93% { transform: matrix3d(1.105, 0, 0, 0, 0, 1.09, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    35.54% { transform: matrix3d(1.098, 0, 0, 0, 0, 1.096, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    36.74% { transform: matrix3d(1.097, 0, 0, 0, 0, 1.098, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    41.04% { transform: matrix3d(1.096, 0, 0, 0, 0, 1.102, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    44.44% { transform: matrix3d(1.097, 0, 0, 0, 0, 1.103, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    52.15% { transform: matrix3d(1.099, 0, 0, 0, 0, 1.101, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    59.86% { transform: matrix3d(1.101, 0, 0, 0, 0, 1.099, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    63.26% { transform: matrix3d(1.101, 0, 0, 0, 0, 1.099, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    75.28% { transform: matrix3d(1.1, 0, 0, 0, 0, 1.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    85.49% { transform: matrix3d(1.1, 0, 0, 0, 0, 1.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    90.69% { transform: matrix3d(1.1, 0, 0, 0, 0, 1.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { transform: matrix3d(1.1, 0, 0, 0, 0, 1.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
  }
  
  @keyframes pfpDefault { 
    0% { transform: matrix3d(1.1, 0, 0, 0, 0, 1.1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.4% { transform: matrix3d(1.068, 0, 0, 0, 0, 1.059, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.7% { transform: matrix3d(1.055, 0, 0, 0, 0, 1.04, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.81% { transform: matrix3d(1.034, 0, 0, 0, 0, 1.011, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.41% { transform: matrix3d(1.012, 0, 0, 0, 0, 0.983, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    10.21% { transform: matrix3d(1.006, 0, 0, 0, 0, 0.977, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.61% { transform: matrix3d(0.988, 0, 0, 0, 0, 0.967, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    14.11% { transform: matrix3d(0.986, 0, 0, 0, 0, 0.967, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.52% { transform: matrix3d(0.979, 0, 0, 0, 0, 0.976, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.72% { transform: matrix3d(0.979, 0, 0, 0, 0, 0.981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    21.32% { transform: matrix3d(0.98, 0, 0, 0, 0, 0.993, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    24.32% { transform: matrix3d(0.985, 0, 0, 0, 0, 1.004, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { transform: matrix3d(0.987, 0, 0, 0, 0, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { transform: matrix3d(0.994, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.93% { transform: matrix3d(0.995, 0, 0, 0, 0, 1.01, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    35.54% { transform: matrix3d(1.002, 0, 0, 0, 0, 1.004, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    36.74% { transform: matrix3d(1.003, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    41.04% { transform: matrix3d(1.004, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    44.44% { transform: matrix3d(1.003, 0, 0, 0, 0, 0.997, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    52.15% { transform: matrix3d(1.001, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    59.86% { transform: matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    63.26% { transform: matrix3d(0.999, 0, 0, 0, 0, 1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    75.28% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    85.49% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    90.69% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
  }
  @keyframes invertation {
      0% {
          background-color: black;
          color: white;
      }
  
      50% {
          background-color: white;
          -webkit-filter: invert(1);
          filter: invert(1);
      }
  }
  @keyframes wack {
    25% {
      transform: scale(1, 5);
    }
    75% {
      transform: scale(5, 1)
    }
  }
  @keyframes wack2 {
    20% {
      transform: scale(100, 5);
    }
    40% {
      transform: scale(2, 10)
    }
    60% {
      transform: scale(0.2, 15);
    }
    80% {
      transform: scale(-10, 6)
    }
    100% {
      transform: scale(-3, -1)
    }
  }
  @keyframes flashing {
      0% {
          background-color: black;
          color: white;
                      -webkit-filter: invert(0);
          filter: invert(0);
      }
      5% {
          background-color: black;
          -webkit-filter: invert(1);
          filter: invert(1);
      }
      10% {
          background-color: red;
          color: white;
                      -webkit-filter: invert(0);
          filter: invert(0);
      }
      15% {
          background-color: red;
          -webkit-filter: invert(1);
          filter: invert(1);
      }
      20% {
          background-color: black;
                color: white;
                      -webkit-filter: invert(0);
          filter: invert(0);
      }
      25% {
          background-color: black;
          -webkit-filter: invert(1);
          filter: invert(1);
      }
      30% {
          background-color: white;
                color: white;
                      -webkit-filter: invert(0);
          filter: invert(0);
      }
      35% {
          background-color: white;
          -webkit-filter: invert(1);
          filter: invert(1);
      }
      40% {
          background-color: red;
                color: white;
                      -webkit-filter: invert(0);
          filter: invert(0);
  
      }
      45% {
          background-color: black;
      }
      50% {
          background-color: orange;
          color: white;
      }
      55% {
          background-color: white;
      }
      60% {
          background-color: yellow;
      }
      65% {
          background-color: black;
      }
      70% {
          background-color: green;
      }
  
      75% {
          background-color: white;
      }
      80% {
          background-color: blue;
      }
      85% {
          background-color: black;
      }
      90% {
          background-color: purple;
      }
      95% {
          background-color: white;
      }
  }
  @keyframes pop {
        0% {
        transform: scale(1, 1);
      }
      5% {
        transform: scale(0.9, 0.9);
      }
      10% {
        transform: scale(0.8, 0.8);
      }
      15% {
        transform: scale(0.7, 0.7);
      }
      20% {
        transform: scale(0.6, 0.6);
      }
      25% {
        transform: scale(0.5, 0.5);
      }
      30% {
        transform: scale(0.4, 0.4);
      }
      35% {
        transform: scale(0.3, 0.3);
      }
      40% {
        transform: scale(0.2, 0.2);
      }
      45% {
        transform: scale(0.1, 0.1);
      }
      50% {
        transform: scale(0, 0);
      }
      55% {
        transform: scale(0.1, 0.1);
      }
      60% {
        transform: scale(0.2, 0.2);
      }
      65% {
        transform: scale(0.3, 0.3);
      }
      70% {
        transform: scale(0.4, 0.4);
      }
      75% {
        transform: scale(0.5, 0.5);
      }
      80% {
        transform: scale(0.6, 0.6);
      }
      85% {
        transform: scale(0.7, 0.7);
      }
      90% {
        transform: scale(0.8, 0.8);
      }
      95% {
        transform: scale(0.9, 0.9);
      }
  }
  @keyframes movedown {
    0% {
    padding: 6px 10px 7px 28px;
    }
    100% {
    padding: 6px 10px 70px 28px;
    }
  }
  @keyframes moveup {
    0% {
      transform: translatey(100px);
    }
    100% {
      transform: translatey(0px);
    }
  }
  @keyFrames fadezoomin {
    0% {
      opacity: 0;
        transform: translateY(0px) scale(1.1);
    }
      100% {
      opacity: 1;
        transform: translateY(0px) scale(1);
    }
  }
  @keyFrames fadezoomout {
    0% {
      opacity: 1;
        transform: translateY(0px) scale(1);
    }
      100% {
      opacity: 0;
        transform: translateY(0px) scale(1.1);
    }
  }
  
  #startMenu[closing] {
    display: block;
    pointer-events: none;
    inset: 0;
    animation: fade-out 300ms forwards;
  }
  #optMobile {
      display: none;
  }
  body.mobile #optColors {
      width: 346px;
      margin-bottom: 4px;
    }
  body.mobile #optMobile, body.mobile #optBorders {
      width: 170px;
      margin-bottom: 4px;
      display: inline-block;
  }
  .greyText {
      opacity: 0.5;
  }
  .container {
      position: relative;
      padding-left: 20px;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
  }
  .container input {
      position: absolute;
      visibility: hidden;
      width: 0;
      height: 0;
      cursor: pointer;
  }
  .checkmark {
      position: absolute;
      top: 0;
      left: 0;
      height: 14px;
      width: 14px;
      border-radius: 4px;
      background-color: #eee;
      border: 1px solid #ccc;
  }
  .radio {
      position: absolute;
      top: 0;
      left: 0;
      height: 14px;
      width: 14px;
      border-radius: 50%;
      background-color: #eee;
      border: 1px solid #ccc;
  }
  .container:hover input ~ .checkmark, .container:hover input ~ .radio {
      background-color: #ccc;
  }
  .container input:disabled ~ .checkmark, .container input:disabled ~ .radio {
      background-color: #ddd;
  }
  .container input:checked ~ .checkmark, .container input:checked ~ .radio {
      background-color: #0074DA;
      border: 1px solid #0074DA;
  }
  .container:hover input:checked ~ .checkmark, .container:hover input:checked ~ .radio {
      background-color: #004894;
      border: 1px solid #004894;
  }
  .container input:disabled:checked ~ .checkmark, .container input:disabled:checked ~ .radio {
      background-color: #002C5B;
      border: 1px solid #002C5B;
  }
  .container .checkmark:after {
      content: '';
      position: absolute;
      display: none;
      left: 4px;
      top: 1px;
      width: 4px;
      height: 8px;
      border: solid white;
      border-width: 0 2px 2px 0;
      transform: rotate(45deg);
  }
  .container .radio:after {
      content: '';
      display: none;
      margin: 4px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #fff;
  }
  .container input:checked ~ .checkmark:after, .container input:checked ~ .radio:after {
      display: block;
  }
  .resetControls {
      opacity: 0;
      transform: rotate(0deg);
      transition: opacity 1000ms, margin 1000ms;
      margin: 0 -6px;
  }
  .resetControls.spin {
      transition: transform 500ms, opacity 1000ms 150ms, margin 1000ms 150ms;
      transform: rotate(360deg);
  }
  .resetControls.active {
      opacity: 1;
      margin: 0 5px;
      cursor: pointer;
  }
  td b {
      display: inline-block;
      cursor: pointer;
      text-align: right;
      vertical-align: bottom;
  }
  td b:hover {
      color: #777;
  }
  td.editing b {
      background: #fff;
      color: #333;
      border: 1px solid #dcdcdc;
      border-radius: 4px;
      padding: 1px 4px;
      margin: -2px -7px -2px -3px;
      text-align: center;
      cursor: text;
      -webkit-user-select: auto;
      -moz-user-select: auto;
      -ms-user-select: auto;
      user-select: auto;
  }
  td.editing span {
      visibility: hidden;
  }
  td b {
      display: inline-block;
      width: 12px;
      height: 17px;
      cursor: pointer;
      text-align: right;
      vertical-align: bottom;
  }
  
  .tdLeft {
      width: 25%;
  }
  .tdCenter {
      width: 350px;
  }
  
  *:focus {
      outline: 1px solid transparent;
      border-style: none;
  }
  i {
      transition: transform 500ms;
  }
  i.arrow {
      border: solid #484848;
      border-width: 0 2px 2px 0;
      display: inline-block;
      padding: 3px;
  }
  i.reset {
      display: inline-block;
      width: 8px;
      height: 8px;
      border: #000000 2px solid;
      border-right-color: transparent;
      border-radius: 50%;
      position: relative;
      top: 3px;
  }
  i.reset::after {
      content: '';
      display: inline-block;
      border: 3px solid;
      border-color: transparent #000000 #000000 transparent;
      position: relative;
      left: 3px;
      bottom: 8px;
  }
  i.cross {
      display: inline-block;
      width: 2px;
      height: 2px;
      margin: 0 5px -3px;
      padding: 6px;
  }
  i.cross.x {
      transform: rotate(135deg);
  }
  i.cross::before, i.cross::after {
      content: '';
      display: inline-block;
      background-color: #000000;
      border-radius: 2px;
      float: left;
  }
  i.cross::before {
      width: 12px;
      height: 2px;
      margin-left: -5px;
  }
  i.cross::after {
      width: 2px;
      height: 12px;
      margin-top: -7px;
  }
  i.flag {
      display: inline-block;
      width: 2px;
      height: 12px;
      background: #000000;
      margin: 0 15px 0 5px;
  }
  i.flag::before {
      content: '';
      display: inline-block;
      width: 9px;
      height: 7px;
      background-color: #000000;
      margin: 0 0 5px 3px;
      transition: margin-bottom 500ms;
  }
  i.flag.down::before {
      margin-bottom: 2px;
  }
  .resetControls {
      opacity: 0;
      transform: rotate(0deg);
      transition: opacity 1000ms, margin 1000ms;
      margin: 0 -6px;
  }
  .resetControls.spin {
      transition: transform 500ms, opacity 1000ms 150ms, margin 1000ms 150ms;
      transform: rotate(360deg);
  }
  .resetControls.active {
      opacity: 1;
      margin: 0 5px;
      cursor: pointer;
  }
  body.mobile .controlTable {
      display: none;
  }
  .moreControls {
      cursor: pointer;
  }
  .controlTable {
      border-collapse: collapse;
      margin: 0 2px;
  }
  .controlTable tr {
      border: 0;
      transition: opacity 500ms;
  }
  .controlTable tr.hidden {
      opacity: 0;
      pointer-events: none;
  }
  .controlTable td {
      transition: padding 500ms;
      width: 0%;
  }
  
  .controlTable div {
      position: relative;
      top: 0px;
      height: 18px;
      transition: height 500ms, top 500ms;
  }
  .controlTable tr.hidden td {
      padding: 0 1px;
  }
  .controlTable tr.hidden div {
      top: -20px;
      height: 0;
  }
  .controlTable td b {
      display: inline-block;
      width: 12px;
      height: 16px;
      cursor: pointer;
      text-align: right;
      vertical-align: bottom;
  }
  .controlTable td b:hover {
      color: #777;
  }
  .controlTable td.editing b {
      background: #fff;
      color: #333;
      border: 1px solid #dcdcdc;
      border-radius: 4px;
      padding: 1px 4px;
      margin: -2px -7px -2px -3px;
      text-align: center;
      cursor: text;
      -webkit-user-select: auto;
      -moz-user-select: auto;
      -ms-user-select: auto;
      user-select: auto;
  }
  .controlTable td.editing span {
      visibility: hidden;
  }
  .asdfasfsfaf {
      width: 40%;
      vertical-align: center;   
      position: relative;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      margin-top: auto;
  }
  
  .FUCKINGBACONCHEESEBURGER {
        border-radius: 25px;
      -moz-border-radius: 25px;
      -webkit-border-radius: 25px;
      background-color: #DDE6EB;
      box-sizing: border-box;
      overflow: hidden;
  }
  
  .IHATEEVERYTHING {
    margin: auto;
    display: flex;
    width: 1248px;
  }
  body.mobile .IHATEEVERYTHING {
    width: 100%;
  }
  .skibidiplaybutton {
  position: relative;
   bottom: -10px;
  }
  
  body.mobile .skibidiplaybutton {
   bottom: 40px;
  }

  @media (max-width: 1240px) {
  .linkHolder {
    display: none;
  }
   .IHATEEVERYTHING {
    width: 100%;
  } 
}