*{
    margin: 0;
    padding: 0;
}
@font-face{
    src: url(fonts/WorkSans-VariableFont_wght.ttf);
    font-family: worksans;
}
@font-face{
    src: url(fonts/SpaceMono-Regular.ttf);
    font-family: spacemono;
}
*{
    box-sizing: border-box;
}
  body{
      height: 100vh;
      position: relative;
      overflow: hidden;
      -moz-overflow:hidden;
      /*background-image: url(./assets/welcome.jpg);*/
      background-size: cover;
      background-position: center;
  }
  main{
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50% , -50%);
  }

  nav a{
      font-family: spacemono;
      text-decoration: none;
      background: white;
      border: 1px solid black;
      color: black;
      padding: 10px 20px;
      position: absolute;
      top: 50px;
      right: 50px;
      border-radius: 8px;
  }
  nav a:hover{
      background:black;
      color: white;
  }

  /*-------LOGO + TEXT------*/
  .landing{
      height: 80vh;
      position: relative;
  }
  .landing img{
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-45%);
      width: 600px;
  }
  #title h1{
    font-family: worksans;
    font-style: normal;
    font-weight: 600;
    font-size: 4em;
    text-align: center;
    color: #000000;
}

/*-------LINKS------*/

.links{
    padding-top: 2vh;
}
.links ul{
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin: 0;
}
.links li{
    list-style: none;
}

.links a{
    position: relative;
    color: #000000;
    font-family: spacemono;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    text-align: center;
    text-decoration: none;
    padding: 2vw;
}

#span{
    margin: 0 auto;
    display: block;
}

.links a:hover{
    text-decoration: 2px underline;
}

/*-------MOBILE------*/
@media only screen and (max-width: 600px) {
    nav a{
        top: 15px;
        right: 15px;
    }
    .landing{
        height: 50vh;
    }
    .landing img{
        width: 380px;
        top: 60%;
    }
    .links{
        width: 100vw;
    }
    .links ul{
        display: block;
        text-align: center;
        padding: 0;
    }
    .links li{
        margin: 2vh 0;
    }
    #span{
        width: 100%;
    }    
  }