body {
  background-color: beige;
  background-image: url(images/image1.jpg)
}

h1 {
  color: blueviolet;
  background-color: rgb(241, 219, 191);
  text-align: center;
  letter-spacing: 10px;
  font-size: 5em;
  font-family: "Gill Sans", sans-serif;
  transition: 1s;
}

h1:hover {
  color: black;
  border-radius: 20%;
  transform: scale(0.5);
}

h1 {
  width: min-content;
  height: min-content;
  border-style: inset;
  border-width: 5px;
  border-color: blueviolet;
  border-radius: 10px;
  /*border: 5px inset blueviolet;  un modo mas simple de determinar ciertos elementos*/

  padding: 10px;
  box-shadow: 0px 0px 5px 5px #00a000;
}



h2 {
  color: blueviolet;
  background-color: rgb(241, 219, 191);
}

h2::first-letter {
  font-size: xx-large;
}

footer {
  background-color: rgb(241, 219, 191);
}

p {
  line-height: 2.5; /*interlineado*/
}

main > p {
  background-color: cadetblue; /*direct child*/
  opacity: 0.7;
}

/*h1, h2 = estilo a todos los que se vayan enumerando 
h1 h2 = estilo a los h2 dentro de h1
h1 > h2 = estilo a los h2 que siguen inmediatamente a los h1
h1 + h2 = estilo a los h2 que estan no dentro de los h1, pero inmediatamente seguido debajo

*/

input[type="email"] {
  color: darkgoldenrod; /*cambia el color de lo que ingrese dentro del input de tipo email*/
}

img {
  border: 1px solid black;
  border-radius: 10px;
  padding: 1px;
  margin: 10px;
}