html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.site-header {
  justify-content:space-between; 
  display:flex; 
  margin: 10px;
  height: 10vh;
}

.logo {
  display:flex;
  justify-content: center;
  flex-direction: column;
}

/* Base */
@font-face {
  font-family: PixelCastle;
  src: url("Pixelcastle-Regular.otf");
}
@font-face {
  font-family: Alagard;
  src: url("alagard_by_pix3m-d6awiwp.ttf");
}

html{
  font-family: Alagard !important; 
  background-color: #000000;
  color: #949494;
}
body{
  font-family: Alagard !important; 
  background-color: #000000;
  color: #949494;
}
/* Layout */

/* Module */
    .game{
      padding: 5px;
      border: 5px inset black;
      width: 66%;
      margin: 1px auto 1px auto;
      
      &.output{
          max-height: 55vh;
          height: 55vh;
          overflow: scroll;
      }

      &.input{
      }
  }

  #view {
      height: 65vh;
      margin-bottom: 1rem;
  }

  #carousel {
      display: flex;
      position: sticky;
      flex-direction: column;
      margin: 1vw 1vh;
      height: 25vh;
      justify-content: center;
      text-align: center;
      top:40vh;
  }

  #content {
      display: flex;
      margin: 1vw 1vh;
      border: 1px solid #949494;
  }
/* State */

/* Theme */