@charset "UTF-8";
.tomorrownight-theme .minute-positive {
  color: #33A6CC; }
.tomorrownight-theme .minute-negative {
  color: #cc6666; }
.tomorrownight-theme .hour {
  color: #f0c674; }
.tomorrownight-theme .settings-button {
  background-color: #1D1F21; }

body.tomorrownight-theme {
  background: #1D1F21; }

.ooo-theme .minute-positive {
  color: #B1EDE8; }
.ooo-theme .minute-negative {
  color: #FF6978; }
.ooo-theme .hour {
  color: #FFFCF9; }
.ooo-theme .settings-button {
  background-color: #340068; }

body.ooo-theme {
  background: #340068; }

.reddish-theme .minute-positive {
  color: #00FFCD; }
.reddish-theme .minute-negative {
  color: #DF8199; }
.reddish-theme .hour {
  color: #E3D3E4; }
.reddish-theme .settings-button {
  background-color: #873D48; }

body.reddish-theme {
  background: #873D48; }

.pinkblue-theme .minute-positive {
  color: #B892FF; }
.pinkblue-theme .minute-negative {
  color: #EF7A85; }
.pinkblue-theme .hour {
  color: #FFC2E2; }
.pinkblue-theme .settings-button {
  background-color: #001D4A; }

body.pinkblue-theme {
  background: #001D4A; }

.yellblue-theme .minute-positive {
  color: #2E84A5; }
.yellblue-theme .minute-negative {
  color: #ECA400; }
.yellblue-theme .hour {
  color: #EAF8BF; }
.yellblue-theme .settings-button {
  background-color: #001D4A; }

body.yellblue-theme {
  background: #001D4A; }

.vibrant-theme .minute-positive {
  color: #66D7D1; }
.vibrant-theme .minute-negative {
  color: #FC7753; }
.vibrant-theme .hour {
  color: #DBD56E; }
.vibrant-theme .settings-button {
  background-color: #403D58; }

body.vibrant-theme {
  background: #403D58; }

.greenfire-theme .minute-positive {
  color: #178C58; }
.greenfire-theme .minute-negative {
  color: #EF2917; }
.greenfire-theme .hour {
  color: #EF8A17; }
.greenfire-theme .settings-button {
  background-color: #034732; }

body.greenfire-theme {
  background: #034732; }

.cw-theme .minute-positive {
  color: #FFCC00; }
.cw-theme .minute-negative {
  color: #444444; }
.cw-theme .hour {
  color: #FFFFFF; }
.cw-theme .settings-button {
  background-color: #000000; }

body.cw-theme {
  background: #000000; }

.nair-theme .minute-positive {
  color: #2591AF; }
.nair-theme .minute-negative {
  color: #A189F0; }
.nair-theme .hour {
  color: #37AD8B; }
.nair-theme .settings-button {
  background-color: #1D1F21; }

body.nair-theme {
  background: #1D1F21; }

#time_phrase {
  font-size: 120px;
  font-weight: 300; }

.font-josefin {
  font-family: 'Josefin Sans', sans-serif; }

.font-open {
  font-family: 'Open Sans', sans-serif; }

.font-heebo {
  font-family: 'Heebo', sans-serif; }

.font-overpass {
  font-family: 'Overpass Mono', monospace; }

.font-quicksand {
  font-family: 'Quicksand', sans-serif; }

.font-roboto {
  font-family: 'Roboto Condensed', sans-serif; }

.font-roboto-slab {
  font-family: 'Roboto Slab', serif; }

.font-shrikhand {
  font-family: 'Shrikhand', cursive; }

.font-ultra {
  font-family: 'Ultra', serif; }

.font-yellowtail {
  font-family: 'Yellowtail', cursive; }

.font-courier {
  font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace; }

.settings-button {
  position: absolute;
  top: 32px;
  right: 32px;
  z-index: 9001;
  border: none; }

#clock_canvas {
  position: fixed;
  /* Makes it overlay the entire screen */
  top: 0;
  left: 0;
  width: 100vw;
  /* Full width of the viewport */
  height: 100vh;
  /* Full height of the viewport */
  pointer-events: none;
  /* Ensures it doesn’t interfere with clicks */
  background: transparent;
  /* Keep it fully transparent */
  z-index: 100;
  /* Ensure it stays above other content */ }

/* FLEXBOX STYLES */
.main-container {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  height: 95vh;
  width: 95vw;
  margin: auto; }

.time-child {
  margin: auto; }

.time-box {
  text-align: center;
  padding: 32px; }

.settings-child {
  display: none;
  margin: auto;
  width: 440px;
  height: 350px; }

.display-case-upper {
  text-transform: uppercase; }

.display-case-lower {
  text-transform: lowercase; }

/*# sourceMappingURL=styles.css.map */