/* styling */
h1 {
  font-family: "Caveat Brush", cursive;
  color:purple;
  background-color: gold;
  padding: 10px 25px 5px 0px;
  margin: 5px 10px 0px 25px;
  border-radius: 1em;
  text-align:center;
}
h2 {
  font-family: "Caveat Brush", cursive;
  color:green;
}
h3 {
  font-family: "Caveat Brush", cursive;
  color:green;
}
body {
   max-width: 100%;
}

p {
  font-family: "Caveat Brush", cursive;
  font-style:italic;
  border-radius: 3em;
}
div {
 	background-color: lightgreen;
 	padding: 15px 30px 15px 30px;
 	margin: 10px 10px 0px 25px;
}
ul {
  font-family: "Passero One", sans-serif;
  display: inline-block;
  color:purple;
  padding: 15px 15px 15px 30px;
  background: linear-gradient(to right, white, lightgreen);
  border-radius:.2em;
  text-align:left;
}
ol {
  font-family: "Passero One", sans-serif;
  display: inline-block;
  color:purple;
  padding: 15px 15px 15px 30px;
  background:linear-gradient(to left, gold, white);
  border-radius: .2em;
  text-align:left;
}
audio {
  max-width:100%;
}

/* ID */

#wind,#spice,#heart {
  background-color: gold;
}
#pepper{  
  background-color: lightgreen;
}
#fire{
  background-color: lightgreen;
  font-size:24px;
}
#navigation{
 	background-color: lightgreen;
 	border-radius: .2em;
 	text-align:center;
}

/* classes */

.section {
  text-align: center;
  border-radius: 3em;
  max-width:100%;
}

/* fonts */

.passero-one-regular {
  font-family: "Passero One", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.caveat-brush-regular {
  font-family: "Caveat Brush", cursive;
  font-weight: 400;
  font-style: normal;
}