/* --== Coloring ==-- */

html {
  color: #b0e0ff;
  background-color: black;
}

html,
a,
button {
  color: #b0e0ff;
}

#background {
  background-color: #1f2325;
}

#backgroundTop {
  background-color: #66757c;
}

#backgroundBottom {
  background-color: #3d4549;
}

#helmetTop {
  background-color: #20283b;
  border-color: #000000;
}

#helmetBottom {
  background-color: #16181d;
  border-color: #000000;
}

#custom-pointer {
  filter: brightness(0.5);
}

#currentTitle,
#currentArtist {
  color: #b0ffe0;
}

#musicTopBorder {
  border-color: #25292d;
  border-left-color: transparent;
  border-right-color: transparent;
}

#screenBorder1,
#musicBorder1 {
  border-color: #252525;
}

#screenBorder2,
#musicBorder2 {
  border-image: linear-gradient(to top right, #262c2f, #33383d) 1;
}

#screenBorder3,
#musicBorder3 {
  border-color: #161616;
}

#screenBorder4,
#musicBorder4 {
  border-color: #17191a;
  border-bottom-color: #25292d;
  border-top-color: #25292d;
}

#musicBorder4 {
  border-top-color: #191c1f;
}

#monitorBackground {
  background-color: #000;
}

#monitorOff {
  background-color: #000;
}

#musicOff {
  background-color: #000;
}

#restartPanelConnection hr {
  background: linear-gradient(180deg, #3d4549, #1f2325);
}

#restartPanel {
  border-color: #252525;
  background: #33383d;
}

#restartButtonOuterCircle {
  background: #4b4b4b;
  border-color: #252525;
}

#restartButtonInnerCircle {
  background: #83354e;
  border-color: #252525;
}

#musicPlayer {
  background-color: #000;
}

#monitorDetail,
#musicPlayer {
  background-image: linear-gradient(to right, #080e16, #090b0c, #080e16);
}

.divider {
  background-image: linear-gradient(to right, #b0e0ff 75%, transparent 25%);
}

.dividerLight {
  background-image: linear-gradient(to right, #b0dfff80 75%, transparent 25%);
}

.textInput {
  border-color: #b0e0ff;
}

hr {
  background-color: #0e1116;
  border-color: #0e1116;
}

#contactLine,
#socials,
#socials a,
#latestCommit div,
#restartLabel {
  color: #0e1116;
}

.audioSlider::-webkit-slider-thumb {
  background: #fff;
}

.audioSlider {
  background: #b0e0ff;
}

#textEditorSizeInput::-webkit-slider-thumb {
  background: #fff;
}

#textEditorSizeInput {
  background: #b0e0ff;
}

#doorsCanvas {
  background-color: #000;
  border: 2px solid #b0e0ff;
}

#doorsMenu {
  background-color: #000;
}

#textEditorText {
  background-color: transparent;
  border-color: #b0e0ff;
  color: #ffffff;
}

.TimelineIndicator7117 {
  background-color: #fff;
}

#TimelineCenter7117 {
  background: repeating-linear-gradient(
    to bottom,
    #e0b0ff 0px,
    #e0b0ff 15.2185px,
    #dfb0ffdc 15.2185px,
    #dfb0ffdc 30.437px,
    #dfb0ff8e 30.437px,
    #dfb0ff8e 45.6555px,
    #dfb0ff71 45.6555px,
    #dfb0ff71 60.874px
  );
}

.TimelineEventTitle7117 {
  color: #e0b0ff;
}

.TimelineEventImage7117 {
  border: 1px solid #b0e0ff;
}

#TimelineNowIndicator7117 {
  border: 2px solid #b0e0ff;
  background-color: #00000083;
}

.tellerBill,
.tellerCoin {
  background-color: #000;
}

.tellerCoin.quarter,
.tellerCoin.dime,
.tellerCoin.nickel {
  border-color: #c0c0c0;
  color: #999999;
}

.tellerCoin.penny {
  border-color: #b87333;
  color: #999999;
}

.tellerBill {
  border-color: #4caf50;
  color: #ffffff;
}

.identityWord {
  border-color: #b0e0ff;
}

.identityWord:hover {
  background-color: #b0e0ff;
  color: #1f2325;
}

.identityWord.locked:hover {
  background-color: transparent;
  color: #b0e0ff;
}

#identityConfirmArrow.available,
#identityAliasConfirm.available {
  color: #4caf50;
}

#identityConfirmArrow.own {
  color: #ffdd55;
}

#identityConfirmArrow.taken {
  color: #ff3b3b;
}

.AppreciationWord7117 {
  color: #e0b0ff;
}

#lightSwitchPlate {
  background-color: #33383d;
  border-color: #252525;
}

#lightSwitchToggle {
  background: linear-gradient(to bottom, #b0e0ff 0 50%, #5e7180 50% 100%);
}

body.lightsOff #lightSwitchToggle {
  background: linear-gradient(to top, #b0e0ff 0 50%, #5e7180 50% 100%);
}

#pullString {
  background-color: #b0e0ff;
}

#pullBallEl {
  background-color: #e0b0ff;
  border: 2px solid #b0e0ff;
}

#revolverWheel {
  background-color: #33383d;
  border-color: #b0e0ff;
}

.revolverChamber {
  background-color: #1f2325;
  border-color: #b0e0ff;
}

.bubble {
  background-color: #b0e0ff80;
}

.bubble.popped {
  background-color: #1f2325;
}

#bubbleResetButton {
  border-color: #b0e0ff;
}

#stressMusicOverride {
  accent-color: #b0e0ff;
}

#bouncyBallsPlayfield {
  border-color: #b0e0ff;
  background-color: #1f2325;
}

.bouncyBall:nth-child(6n + 1) {
  background-color: #ffb0c0;
}

.bouncyBall:nth-child(6n + 2) {
  background-color: #e0b0ff;
}

.bouncyBall:nth-child(6n + 3) {
  background-color: #b0e0ff;
}

.bouncyBall:nth-child(6n + 4) {
  background-color: #b0ffc0;
}

.bouncyBall:nth-child(6n + 5) {
  background-color: #ffe0b0;
}

.bouncyBall:nth-child(6n + 6) {
  background-color: #d0b0ff;
}

#bouncyBallsControls button {
  border-color: #b0e0ff;
}

#squishBallEl {
  background-color: #ffb0c0;
}

body.lightsOff #screenBorder1,
body.lightsOff #musicBorder1 {
  border-color: #050505;
}

body.lightsOff {
  color: #070b10;
  background-color: #010204;
}

body.lightsOff #background {
  background-color: #080b0f;
}

body.lightsOff #backgroundTop {
  background-color: #111820;
}

body.lightsOff #backgroundBottom {
  background-color: #05070a;
}

body.lightsOff #backgroundView {
  background: radial-gradient(ellipse at center, #09151c 0%, #020304 78%);
}

body.lightsOff #monitorBackground,
body.lightsOff #musicPlayer {
  color: #b0e0ff;
  background-color: #040d12;
  background-image: radial-gradient(
    ellipse at 50% 45%,
    #0e2731 0%,
    #081820 42%,
    #02090d 78%,
    #010304 100%
  );
}

body.lightsOff #musicTopBorder {
  border-color: #06151c;
  border-left-color: transparent;
  border-right-color: transparent;
}

body.lightsOff #monitorDetail {
  background-image: none;
}

body.lightsOff #screenBorder2,
body.lightsOff #musicBorder2 {
  border-image: none;
  border-color: #030506;
  box-shadow: none;
}

body.lightsOff #screenBorder3,
body.lightsOff #musicBorder3 {
  border-color: #050505;
  box-shadow: none;
}

body.lightsOff #screenBorder4,
body.lightsOff #musicBorder4 {
  border: 25px solid #06151c;
  border-image: none;
  border-style: solid;
  border-color: #06151c;
  box-shadow: 0 0 120px rgb(13 38 50);
}

#loopButton {
  color: #2e443b !important;
}

#loopButton.buttonEnabled {
  color: #b0ffe0 !important;
}

/* --== Mobile ==-- */
@media (max-width: 1024px) {
  body.lightsOff #screenBorder4,
  body.lightsOff #musicBorder4 {
    border-width: 6px;
    box-shadow: 0 0 40px rgb(13 38 50);
  }
}