body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #F5DADF;
  font-family: Futura, 'Trebuchet MS', Arial, sans-serif; }

header {
  top: 0;
  z-index: 9;
  width: 100%;
  padding: 25px;
  text-align: center;
  box-sizing: border-box;
  position: absolute; }
  header #logo {
    width: 40px;
    cursor: pointer; }
    header #logo path {
      transition: all 0.8s ease-in-out; }
    header #logo.black path {
      fill: black; }
    header #logo.white path {
      fill: white; }

#content {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute; }

#game {
  left: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
  position: fixed;
  overflow: visible; }
  #game #arc {
    fill: none;
    opacity: 0;
    stroke-width: 4;
    pointer-events: none;
    stroke: url("#arcgradient"); }
  #game #arrow line {
    fill: none;
    stroke: #000;
    stroke-width: 2; }
  #game #arrow polygon {
    fill: #000; }
  #game #target path:nth-of-type(odd) {
    fill: #fff; }
  #game #target path:nth-of-type(even) {
    fill: #f4531c; }
  #game #bow {
    fill: none;
    pointer-events: none;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke; }
    #game #bow polyline {
      fill: none;
      stroke: #000;
      stroke-linecap: round; }
    #game #bow path {
      fill: none;
      stroke: #000;
      stroke-width: 3;
      stroke-linecap: round; }

#miss {
  width: 25%;
  opacity: 0;
  display: block;
  pointer-events: none;
  transition: opacity 0.4s ease;
  top: 50%;
  left: 50%;
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
  #miss.show {
    opacity: 1; }

#video {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  overflow: hidden;
  background: black;
  margin-left: 100%;
  position: absolute;
  transition: margin-left 0.8s ease-in-out; }
  #video.show {
    margin-left: 0%; }
  #video .container {
    width: 100vw;
    height: 100%;
    position: absolute; }
  #video #player {
    width: 75vw;
    height: 32vw;
    top: 50%;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }

#message {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  pointer-events: none; }
  #message.show {
    pointer-events: auto; }
    #message.show #terminal {
      opacity: 1; }
  #message #terminal {
    width: 40%;
    opacity: 0;
    height: 33%;
    z-index: 10;
    position: absolute;
    background: #E1C7D9;
    border: solid black 1px;
    border-top: solid black 25px;
    transition: opacity 0.5s ease-in-out; }
    #message #terminal .ui-resizable-se {
      right: 0;
      bottom: 0;
      width: 25px;
      z-index: 10;
      height: 25px;
      position: absolute; }
      #message #terminal .ui-resizable-se:hover {
        cursor: se-resize; }
    #message #terminal #close {
      top: -24px;
      right: 7px;
      color: white;
      font-size: 18px;
      position: absolute; }
      #message #terminal #close:hover {
        cursor: pointer; }
    #message #terminal #screen {
      width: 100%;
      height: 100%;
      overflow: hidden;
      position: relative;
      box-sizing: border-box; }
      #message #terminal #screen #code {
        left: 25px;
        right: 25px;
        bottom: 0px;
        font-size: 14px;
        position: absolute;
        padding-bottom: 8px;
        box-sizing: border-box;
        font-family: 'Inconsolata', Arial, serif; }

footer {
  left: 0px;
  right: 0px;
  bottom: 0px;
  padding: 10px;
  position: absolute;
  text-align: center; }
  footer #controls {
    width: 0;
    border: 0;
    z-index: 2;
    height: 16px;
    margin: 0 auto;
    cursor: pointer;
    position: relative;
    border-style: solid;
    box-sizing: border-box;
    background: transparent;
    border-width: 8px 0 8px 16px;
    border-color: transparent transparent transparent black;
    transition: 0.2s border ease-in-out, border-color 0.5s ease-in-out, -webkit-transform 0.15s ease-in-out;
    transition: 0.2s border ease-in-out, border-color 0.5s ease-in-out, transform 0.15s ease-in-out;
    transition: 0.2s border ease-in-out, border-color 0.5s ease-in-out, transform 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out; }
    footer #controls:hover {
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
    footer #controls.paused {
      border-style: double;
      border-width: 0px 0 0px 16px; }
  footer .select {
    bottom: 0;
    z-index: 2;
    cursor: pointer;
    font-size: 14px;
    background: white;
    position: absolute;
    transition: all 0.3s ease; }
    footer .select a {
      color: black;
      padding: 8px 20px;
      display: inline-block;
      text-decoration: none;
      transition: all 0.3s ease; }
    footer .select:hover {
      background: black; }
      footer .select:hover a {
        color: white; }
  footer #mtn {
    left: 0; }
  footer #rain {
    right: 0; }

/* Vietnamese */
@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 400;
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"), url(https://fonts.gstatic.com/s/inconsolata/v16/BjAYBlHtW3CJxDcjzrnZCNDiNsR5a-9Oe_Ivpu8XWlY.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; }

/* Latin-ext */
@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 400;
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"), url(https://fonts.gstatic.com/s/inconsolata/v16/BjAYBlHtW3CJxDcjzrnZCKE8kM4xWR1_1bYURRojRGc.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; }

/* Latin */
@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 400;
  src: local("Inconsolata Regular"), local("Inconsolata-Regular"), url(https://fonts.gstatic.com/s/inconsolata/v16/BjAYBlHtW3CJxDcjzrnZCIgp9Q8gbYrhqGlRav_IXfk.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215; }
/*# sourceMappingURL=missathing.css.map */