* {
  box-sizing: border-box;
}
html, body {
  background: rgb(40,30,140);
  background: radial-gradient(circle, rgba(40,30,140,1) 30%, rgba(38,62,180,1) 70%, rgba(0,1,198,1) 100%);
  font-family: 'Press Start 2P', cursive;
  font-size: clamp( 0.375rem, 2vw, 2vh);
  margin: 0;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
}
a { 
  color: white;
  text-decoration: none;
} 
a:visited {
  color: white;
} 
a:active {
  text-decoration: none;
}
a:hover {
  color: red;
}
/*@media (max-width: 480px) {
  html, body {
    font-size: 3vmin;
  }
}*/

.navbar {
  background: rgb(35, 31, 33);
  border-radius: 0 0 5vh 5vh;
  line-height: 10vh;
  padding: 0 10vw;
  margin: 0 1vw;
  height: 10vh;
}
.logo{
  border-radius: 30%;
  height: 8vh;
  margin-top: 1vh;
  width: auto;
}
.toolbar {
  height: 10vh;
  float: right;
}
.toolbar div {
  display: inline-block;
  line-height: 10vh;
  margin: 0 clamp( 0.375rem, 2vw, 2vh);
  text-align: center;
  text-shadow: 0 0 10px black;
  width: auto;
}
.toolbar a {
  color: white;
}
.toolbar a:hover {
  color: red;
}

main {
  background: url(../img/bg.svg) no-repeat center;
  background-size: 100vw auto;
  color: white;
  height: 90vh;
  /*font-size: 2vh;*/
  padding: 1vh 0 0 0;
  text-shadow: 0 0 10px black;
}
.phrase {
  background: rgba(35, 31, 33, 0.8);
  /*font-size: 3vmin;*/
  height: 10vh;
  line-height: 10vh;
  margin: 20vh 0 0 0;
  padding-left: 10vw;
  width: auto;
}
.main-text {
  height: 60vh;
  line-height: 60vh;
  padding: 3vh 3vw;
}
.container {
  display: inline-block;
  line-height: 5vh;
  width: auto;
}
ul {
  padding-left: 1vw;
}
ul li {
  list-style-type: none;
}
ul li:before {
  content: "★ ";
}
.button-start {
  background: rgba(35, 31, 33, 0.8);
  border-radius: 2vh;
  display: inline-block;
  padding: 2vh;
}
.button-start a { 
  color: white;
  text-decoration: none;
} 
.button-start a:visited {
  color: white;
} 
.button-start a:active {
  color: rgb(255, 204, 0);
}
.button-start a:hover {
  color: red;
}

footer {
  background: rgb(35, 31, 33);
  color: white;
  height: 20vh;
  line-height: 20vh;
  text-align: center;
}
footer .footer-text {
  display: inline-block;
  line-height: 2vh;
}
footer .footer-text .title {
  margin-bottom: 2vh;
}
