@media only screen and (min-width: 919px) {

  body{
    text-align:center;
    background-color: white;
  }

  h1{
    font-family: 'Cute Font', cursive;
    font-size: 60px;
    text-align:center;
    line-height:0.7;
    padding-top:10px;
    padding-bottom:10px;
    color:#FF5733;
  }

  h2{
    font-family: 'Cute Font', cursive;
    font-size: 38px;
    text-align:center;
    color:#FFB709;
  }

  p{
    font-family: 'Cute Font', cursive;
    font-size:30px;
    text-align:left;
    color:#900C3F;
  }

  #openingstatement{
  width:85%;
  margin-left:auto;
  margin-right:auto;
  opacity:0;
  animation-name:fadein;
  animation-fill-mode: forwards;
  animation-duration:2.5s;
  animation-delay:0.2s
  }

  #information1{
    width:65%;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:1.2s;
  }
  #information2{
    width:65%;
    margin-top:0px;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:2.3s;
  }
  #information3{
    width:65%;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:3.8s;
  }
  #information4{
    width:65%;
    margin-top:12px;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:5s;
  }

  @keyframes fadein{
  0% {opacity:0;}
  100%{opacity:1;}
  }

  form{
  margin-top:55px;
  padding-bottom:100px;
  }

  textarea{
  width:40%;
  height:150px;
  overflow-x:hidden;
  overflow-y:scroll;
  outline:none;
  resize:none;
  color:#FF5733;
  font-family: 'Cute Font', cursive;
  font-size:25px;
  }

  input[type=button]{
  background-color: #FFB709;
  border:none;
  font-family: 'Cute Font', cursive;
  font-size: 30px;
  color:#C70039;
  padding:4px;
  margin-top:5px;
  }

  input[type=button]:hover{
  background-color: white;
  border: 2px solid #FFB709;
  padding:2px;
  font-family: 'Cute Font', cursive;
  font-size: 30px;
  color:#C70039;
  margin-top:5px;
  }

  #flames{
    width:100%;
    margin-top:-550px;
    margin-left:auto;
    margin-right:auto;
    display:none;
  }

  footer{
    position:fixed;
    width:100%;
    bottom:0;
    color:black;
    font-family: 'Cute Font', cursive;
    font-size:25px;
    background-color: #FFB709;

  }


}

@media only screen and (max-width: 919px) {

  body{
    text-align:center;
    background-color: white;
  }

  h1{
    font-family: 'Cute Font', cursive;
    font-size: 60px;
    text-align:center;
    line-height:0.7;
    padding-top:10px;
    padding-bottom:10px;
    color:#FF5733;
  }

  h2{
    font-family: 'Cute Font', cursive;
    font-size: 38px;
    text-align:center;
    color:#FFB709;
  }

  p{
    font-family: 'Cute Font', cursive;
    font-size:30px;
    text-align:left;
    color:#900C3F;
  }

#openingstatement{
  width:85%;
  margin-left:auto;
  margin-right:auto;
  opacity:0;
  animation-name:fadein;
  animation-fill-mode: forwards;
  animation-duration:2.5s;
  animation-delay:0.2s
}

  #information1{
    width:75%;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:1.2s;
  }
  #information2{
    width:75%;
    margin-top:0px;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:2.3s;
  }
  #information3{
    width:75%;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:3.8s;
  }
  #information4{
    width:75%;
    margin-top:12px;
    margin-left: auto;
    margin-right:auto;
    opacity:0;
    animation-name:fadein;
    animation-duration:2.5s;
    animation-fill-mode: forwards;
    animation-delay:5s;
  }

@keyframes fadein{
  0% {opacity:0;}
  100%{opacity:1;}
}

form{
  margin-top:20px;
  margin-bottom:80px;
}

textarea{
  width:60%;
  height:150px;
  overflow-x:hidden;
  overflow-y:scroll;
  outline:none;
  resize:none;
  color:#FF5733;
  font-family: 'Cute Font', cursive;
  font-size:25px;
}

input[type=button]{
  background-color: #FFB709;
  border:none;
  font-family: 'Cute Font', cursive;
  font-size: 30px;
  color:#C70039;
  padding:4px;
  margin-top:5px;
}

input[type=button]:hover{
  background-color: white;
  border: 2px solid #FFB709;
  padding:2px;
  font-family: 'Cute Font', cursive;
  font-size: 30px;
  color:#C70039;
  margin-top:5px;
}

#flames{
  width:90%;
  margin-top:-480px;
  margin-left:auto;
  margin-right:auto;
  display:none;
}

footer{
  position:fixed;
  width:100%;
  bottom:0;
  color:black;
  font-family: 'Cute Font', cursive;
  font-size:25px;
  background-color: #FFB709;

}

}
