html, body {
  height: 100%;
}

  body {
    background-image: url("https://media.istockphoto.com/photos/beautiful-wave-lines-background-blue-purple-abstract-copy-space-picture-id1277127522?b=1&k=20&m=1277127522&s=612x612&w=0&h=TH0E3jT8OsNzASTO3B0il7GQPXcHIzq3zH3E9rXK3X4=");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    color: white;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 16px;
    padding: 0;
    margin: 0;
    min-height: 100vh;
  }

  header {
display: flex;
word-spacing: 5px;
text-align: right;
padding: 0px;
margin:0px;
box-sizing: border-box;
justify-content: fill;
background-color: white;
border: solid;
width: auto;
height: 3.5rem;
}

  li {
display: inline;
color: black;
}

  h1 {
Font-Family: 'Playfair Display', Serif;
Font-Size: 30px;
text-align: center;
font-size: 400%;
}

  h2 {
font-size: 20px;
Font-Family: 'Playfair Display', Serif;

}

  #lang {
background-image: url("https://www.freepnglogos.com/uploads/javascript/logo-html-5-css-javascript-source-code-for-the-taking-23.png");
height: 80px;
width: 200px;
background-repeat: no-repeat;
background-position: contain;
background-size: 80%; 
}

  button {
display: inline;
position: bottom;
background-color: black;
border-radius: 30px;
border-color: black;
}

  a {
text-decoration: none;
color: white;
Font-Family: 'Source Sans Pro', Sans-Serif;
Font-Size: 16px;
  }

  p {
font-size: 120%;
}

  .box {
display: inline-block;
position: center;
margin: 10px;
position: center;
text-align: center;
 }

  #page {
padding: 0em;
margin: 5em;
 
 }

/*@media (min-width: 13rem) {
  body {
    background-size: max-content, 100%;
    text-align: center;
    width:auto;
    height:auto;
   
  }

  header {
    text-align: center;
    display: block;
    height:3.5rem;
  }
 
  #lang {
    margin: 0rem 5rem 0rem 5rem;
  }
}

@media (min-width: 25rem) {
  body {
    background-size: max-content, 100%;
    text-align: center;
    width:auto;
    height:auto;
  }

  header {
    text-align: center;
    display: block;
    height: 3.5rem;
  }

  #lang {
    margin: 0rem 7rem 0rem 7rem;

  }


}

@media (min-width: 50rem) {
  body {
    background-size: max-content, 100%;
    text-align: center;
    width:auto;
    height:auto;
  }

  header {
    text-align: center;
    display: block;
    height:3.5rem;
  }

  #lang {
    margin: 0rem 38rem 0rem 38rem;

  }


}

*/