@import url('https://fonts.googleapis.com/css?family=Fredoka+One&display=swap');

body {
  background-image: radial-gradient(transparent, 80%, black), /*Vignette*/
    linear-gradient(to bottom right, blue, purple, pink, teal);  /*Gradient Background*/   
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  height: 100vh;
  
  color: whitesmoke;
}

h1 {
  font-size: 50px;
}
header:first-letter {
  font-size: 44px;
}
header:first-line {
  color: rgba(255, 0, 0, 0.98);
}

h2 {
  transform: rotate(10deg) translate(500px, -10px);
}

div {
  margin-left: 1em;
  text-align: center;
  width: 30%;
  padding: 1.5em;
  font-family: 'Fredoka One';
  margin-top:15px;
}

#box1 {
  background-color: #a5bf5e;
  color: black;
  border: 15px ridge blue;
  border-radius: 20px;
}

#box2 {
  background-image: linear-gradient(to top, red, #272727);
  border: 20px dashed blue;
  border-radius: 25px;
  background-clip: padding-box;
  text-shadow: 4px 4px 1px grey;
}