@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;200;300;400;500;600;700&family=Noto+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap');

body {
  font-family:  "Noto Sans", "Gill", "gill sans", "Trebuchet MS", "Helvetica Neue", "Helvetica", "Arial", "sans-serif";


}

* {
    box-sizing: border-box;
}
main{
  max-width: 90vw;
  height: 80%;
  margin: auto;
  font-weight: 300;
}

html {
  background: url(images/index/1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.info {
  padding-top: 2vh;
  text-align: center;
  color: white;
  font-size: 40%;
}

.menu{
  font-size: 500%;
  color: white;
  font-weight: 300;
  padding-bottom: 2%;
  padding-top: 4%;
}

.name a:link {
  color: white;
  text-decoration: none;

}

.name a:visited {
  color: white;
}

.name a:hover {
  color: grey;
}

.name {
  font-family:  "Josefin Sans", "Futura", "Futura PT", "Gill", "gill sans", "Trebuchet MS", "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
  text-decoration: none;
  text-align: center;
  font-weight: 400;
  color: white;
  padding-top: 20vh;
}


.info a:link {
  color: white;
  text-decoration: none;

}

.info a:visited {
  color: white;
}

.info a:hover {
  color: grey;
}


@media only screen
  and (orientation: portrait)
  and (max-width: 1090px) {

    .menu{
      padding-top: 10%;
    }

    .name {
      text-decoration: none;
      color: white;
      font-size: 80%;
      text-align: center;
    }

    .info {
      padding-top: 2vh;
      text-align: center;
      color: white;
      font-size: 30%;
    }


}