* {
        box-sizing: border-box;
      }

      body {
        margin: 0;
        font-family: sans-serif;
        font-size: 17px;
        background: #000 url("media/background.png") no-repeat center;
        background-size: contain;; 
      }

      h1 {
        font-family: 'Pinyon Script', cursive;
        font-weight: lighter;
        margin: 0;
        font-size: 3em;
        line-height: 1em;
      }

      #media {
        position: fixed;
        right: 0;
        bottom: 0;
        min-width: 100%; 
        min-height: 100%;
        height: 100%;
        max-height: 200%;
        object-fit: cover;
      }

      header {
        position: fixed;
        top: 0;
        color: #f1f1f1;
        width: 100%;
        padding: 1em;
      }

      header #logo {
        width: 4%;
        max-width: 200px;
        min-width: 50px;
        background: url("media/logo.png") no-repeat center;
        background-size: contain;
        filter: invert(100%) brightness(80%);
      }

      header #logo:after {
        content: "";
        display: block;
        padding-bottom: 110%;
      }

      main {
        position: fixed;
        left: 0;
        padding: 2em;
        padding-left: 4em;
        top: 8em;
        color: rgb(240, 240, 240);
      }

      main img {
        width: 50%;
      }

      footer {
        position: fixed;
        bottom: 0;
        right: 0;
        padding: 1em;
        padding-right: .25em;
        padding-bottom: .5em;
        font-size: 2em;
      }

      footer ul {
        list-style: none;
        display: inline-block;
        margin: 0;
        padding: 0;
      }

      footer li {
        display: inline-block;
        padding-right: .25em;
      }

      footer a {
        text-decoration: none;
        color: #000;
      }

      footer a:hover {
        color: rgba(0,0,0,0.5);
      }

      .divider {
        display: flex;
      }
      .divider:before, .divider:after {
        content: "";
        flex: 1;
      }

      .line {
        align-items: center;
        margin: 1em -1em;
        margin-top: 0;
      }
      .line:before, .line:after {
        height: 1px;
        margin: 0 1em;
      }

      .one-line:before, .one-line:after {
        background: rgb(210, 210, 210);
      }

      .noselect {
        -webkit-touch-callout: none; /* iOS Safari */
          -webkit-user-select: none; /* Safari */
          -khtml-user-select: none; /* Konqueror HTML */
            -moz-user-select: none; /* Old versions of Firefox */
              -ms-user-select: none; /* Internet Explorer/Edge */
                  user-select: none; /* Non-prefixed version, currently
                                        supported by Chrome, Opera and Firefox */
      }

      img::-moz-selection {
          background-color: transparent;
          color: #000;
      }

      img::selection {
          background-color: transparent;
          color: #000;
      }

      @media only screen and (max-width: 935px) {
        main {
          top: unset;
          bottom: 8em;
        }
        main img {
          width: 100%;
        }
      }

      @media only screen and (max-aspect-ratio: 700/500) {
        @media only screen and (max-width: 600px) {
          #media {
            right: -150px;
          }
        }
      }