html {
  scroll-behavior: smooth;
}
body {
  background-image: url("https://i.imgur.com/iG1ec6R.jpg");
  background-position: center;
  background-size: 20vw;
  background-attachment: fixed;
}
#inicio {
  text-align: center;
  background-color: #999dcc;
  padding: 0vw;
  margin-left: 10vw;
  width: 78vw;
  border-radius: 1vw;
}
#casa {
  margin: 0vw;
  width: 2vw;
  height: 2vw;
  padding: 0vw 0vw 0vw 1vw;
}
#flecha {
  position: fixed;
  bottom: 0;
  right: 0;
  margin: -2.5vw;
}
h1 {
  text-align: left;
  text-shadow: 0.15vw 0.15vw 0.5vw #3c4177;
  position: absolute;
  top: 32vw;
  right: 47vw;
  font-size: 6vw;
  margin: 0vw;
  font-family: "Oswald", sans-serif;
}
h2 {
  text-align: left;
  text-shadow: 0.15vw 0.15vw 0.5vw #3c4177;
  font-size: 3vw;
  margin: 0.5vw 0vw 5vw 3vw;
  font-family: "Oswald", sans-serif;
}
a {
  text-decoration: none;
  font-size: 1.9vw;
  color: #1a1a1a;
  font-family: "Oswald", sans-serif;
}
#foto {
  max-width: 18vw;
  max-height: 26vw;
  border-radius: 5vw;
  border: 0.8vw double;
  position: absolute;
  top: 5.5vw;
  right: 52vw;
  border-color: #3c4177;
  overflow: hidden;
}
.botones {
  background: linear-gradient(to top, #666db2, #666db2, #888dc3);
  text-align: center;
  color: #3c4177;
  border: 0.35vw solid;
  width: 12vw;
  height: 2.2vw;
  border-radius: 0.7vw;
  transition-duration: 0.8s;
  padding: 1.3vw 4vw;
  margin: 2.2vw 0vw 0vw 50vw;
}
.botones:hover {
  background: linear-gradient(to top, #888dc3, #666db2, #666db2);
  background-size: 100% 115%;
  border-color: #3c4177;
  width: 13vw;
  height: 2.5vw;
}
h3 {
  text-align: center;
  text-shadow: 0.15vw 0.15vw 0.5vw #3c4177;
  background-color: #b0c4de;
  font-family: "Oswald", sans-serif;
  font-size: 4vw;
  color: #333766;
  margin: 2vw 5vw 0vw 5vw;
  border-radius: 1.5vw;
}
h4 {
  font-size: 2vw;
  text-align: justify;
  line-height: 2.5vw;
  padding: 0vw 4vw 0vw 4vw;
  font-family: "Oswald", sans-serif;
}
h5 {
  text-align: left;
  text-decoration: underline #333766 double 0.2vw;
  text-shadow: 0.15vw 0.15vw 0.5vw #3c4177;
  font-family: "Oswald", sans-serif;
  font-size: 3vw;
  color: #1a1a1a;
  line-height: 0vw;
  padding: 0vw 0vw 0vw 4vw;
}
#patin {
  margin-top: -2vw;
  float: right;
  border-radius: 0.5vw;
  margin-right: 8vw;
  filter: brightness(70%);
}
#patin:hover {
  filter: drop-shadow(1.5vw 2vw 1.7vw #2b2e55) brightness(70%) grayscale(70%);
}
#listad {
  text-align: left;
  font-size: 2vw;
  line-height: 3vw;
  padding: 0vw 0vw 0vw 4vw;
  font-family: "Oswald", sans-serif;
}
#uni {
  margin: 2.4vw;
  float: right;
  border-radius: 1vw;
  margin-right: 6vw;
}
h6 {
  font-size: 2vw;
  text-align: justify;
  line-height: 2.5vw;
  padding: 0vw 30vw 0vw 4vw;
  font-family: "Oswald", sans-serif;
}
#f1 {
  margin: 1vw;
  min-height: 20vw;
  max-height: 20vw;
  transition: transform 1s;
  border: 1vw solid #b0c4de;
  border-radius: 0.5vw;
}
#f1:hover {
  transform: scale(1.1);
}
#pys {
  max-height: 30vw;
  padding: 0.2vw;
  margin: 0.3vw;
  transition: transform 1s;
}
#pys:hover {
  transform: scale(1.1);
}