body {
  background-color: #001f3f;
}

h1, form {
  text-align: center;
}

form {
  margin-bottom: 20px;
}
/* h1 animation and style */

h1 {
  font-family: cursive;
  color: #DDDDDD;
  animation-duration: 3s;
  animation-name: slidein;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%;
  }
  
  to {
    margin-left: 0%;
    width: 100%;
  }
}

input, button {
  padding: 7px 15px;
  border-radius: 5px;
  border: none;
  background-color: #DDDDDD;
}

button {
 background-color: #39CCCC;
}
button:hover {
  background-color: #7FDBFF;
  cursor: pointer;
}

.imgClass {
  border-radius: 5px;
  margin: 5px 5px 18.5px 18.5px;
  box-shadow: 0px 0px 4px #DDDDDD;
  width: 42%;
}

@media screen and (min-width: 600px) {
  .imgClass {
    width: 10%;
  }
}