body {
  background-attachment: fixed;
  background-image:url('moon.png');
    background-size: cover;
    overflow-x: hidden;
    background-color: #79166c
}

a:link {
  text-decoration: none;
  color: #7a0155;

}

a:visited {
    text-decoration: none;
    color: #7a0155;
}


.container {
  width: 1000px;
  height: 355px;
  margin: auto;
  text-align: center;
  border: 10px solid;
  border-style: double;
  border-color: #a00044;
  background-color: #f48db3
}

.hiya {
  width: 1000px;
  height: 100px;
  background-color: #ffcddf;
  border: 10px solid;
  border-style: double;
  border-color: #a00044;
  margin: auto;
  margin-top: 1em;
  padding-bottom: 2em;
  text-align: center;
}

.warnings {
  width: 700px;
  height: 300px;
  margin-right: 2em;
}

.warnings2 {
  width: 700px;
  height: 200px;
  margin-right: 2em;
  border: 10px solid;
  border-style: double;
  border-color:  #e64781;
  overflow-y: scroll;
}

.fellow {
  width: 400px;
  height: auto;
  margin-top: 1em;
  z-index: 1;
}

.stuff {
  display: flex;
}

.enter {
  text-align: center;
  p {
    font-size: 5em;
  }
}


h1 { 
  font-size: 3em;
  color: #e64781;
}

h2 { 
  font-size: 2.5em;
  color: #a00044
}

p, li {
  font-size: 1.3em;
}

.wrapper {
  opacity: 0.97;
}

.wrapper {
    position: relative;
    animation: float 3s ease-in-out infinite;
    
        }

        @keyframes float {
            0% {
                transform: translateY(0);
            }

            50% {
                transform: translateY(-3px);
            }

            100% {
                transform: translateY(0);
            }
        }
        
        
  @media (max-width: 740px) {
    .stuff {
      flex-direction: column;
    }
    
    .hiya {
      width: 94%;
    }
    
    .container {
    width: 94%;
    }
    h1 {
       font-size: 155%;
         margin-top:1.5em;
    }
    
    h2 {
       font-size: 150%;
    }
    
    p, li {
       font-size: 97%;
      margin-left: 1em;
    }
    li {
      margin-right: 1em;
    }
    .warnings {
      width: 94%;
      order: -3;
    }
    
    .warnings2 {
      width: 85%;
      height: 70%;
      margin-top: 0.5em;
     margin-left: 0.8em;
     padding-right: 1.3em;
    }
    
    .fellow {
      width: 40%;
      order: -2;
    }
    
    .enter {
      order: -1;
      p {
        font-size: 220%;
      }
    }
  }