@font-face {font-family: 'Open Sans';src: url(https://fonts.gstatic.com/s/opensans/v26/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4gaVI.woff2) format('woff2');}
@font-face {font-family: 'Default';src: url('assets/fonts/default-regular.ttf');}

body{
    background: #000;
    margin: 0;
    color: #fff;
    font-family: "Default", Arial, Helvetica, sans-serif;
    padding: 0 0 0 22vw;
  }
  
.media{
    user-select: none;
    width: 100%;
    display: block;
    text-align: center;
  }
  
img, video{
    width: 90%;
    display: inline;
  }
  
.content h1{
  font-family: "Open Sans", "Default", Arial, Helvetica, sans-serif;
  width: 100%;
  text-align: center;
  letter-spacing: .1em;
  font-size: 2.8em;
  text-transform: uppercase;
  margin: .6em 0 0 0;
}

.content{
  /* font-family: consolas sans-serif; */
  height: auto;
  margin-bottom: 3vh;
  padding: 0 30vh 10vh 30vh;  
  text-align: justify;
}

.menu{
  position: fixed;
  top: 0;
  left: 0;
  width: auto;
  padding: 10px;
  user-select: none;
  background: rgb(8, 8, 8);
  height: 100vh;
  width: 22vw;
  font-size: 2.4vh;
  overflow: scroll;
}

.menu ul{
  margin: 0;
  padding: 0 0 0 2vw;
}

.menu li{
  padding: .2em 0 .2em .4em;
  display: block;
  cursor: pointer;
}

.menu li:hover{
  background: rgb(30, 30, 35);
}

.menu li:hover ul{
  background: rgb(16, 22, 24);
}

.menu h2{
  margin: 0;
  font-size: 1.5em;
}