@font-face {
  font-family: 'Pixel Emulator';
  src: url('/fonts/Pixel Emulator.ttf') format('ttf'); 
}
@font-face {
  font-family: 'slkscre';
  src: url('/fonts/slkscre.ttf') format('ttf'); 
}

body {
    background-image: url("bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 100vh;
    margin: 0;
  }
  
  .box {
  background-color: #cfbff7;
  width: 400px;
  height: 200px;
  border: 2px solid purple;
  border-radius: 10px;
  padding: 300px;
  margin: 0px;
}

.box {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: -50px;
  margin-bottom: auto;
  width: 40%;
}

  .box2 {
  background-color: #e1d6fc;
  width: 400px;
  height: 50px;
  border: 2px solid purple;
  padding: 200px;
  margin: 0px;
}

.box2 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: -150px;
  margin-bottom: auto;
  width: 40%;
}

  h1 {
  text-align: center;
  position: relative;
  left: 0px;
  top: 70px;
}

  nav {
  text-align: center;
  position: relative;
  left: 0px;
  top: 70px;
}

   h1 {
    font-family: 'Pixel Emulator';
   }
  nav {
    font-family: 'Pixel Emulator';
  }
  
  img {
  width: 100%;
  margin-left:0px;
  margin-top:10px;
}