body{
opacity: 1;
background-image:url(https://i.imgur.com/vufaBqL.jpeg);
background-repeat:repeat;
background-size:cover;
}

h1{color: #FFD3B4;
  font-size: 50px;
  font-family: volkron;
  text-align:center}

#perfil{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 30%; right: 88%; 
 border-radius: 10px;}

#Familia{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 65%; right: 88%; 
 border-radius: 10px;}

#PasoporelIllia{
  background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 100%; right: 88%; 
 border-radius: 10px;
}

#Gustos{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 320%; right: 88%; 
  border-radius: 10px;}

#ramdon{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 390%; right: 88%; 
 border-radius: 10px;}

#Futuro{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 430%; right: 90%; 
 border-radius: 10px;}

ul1{background-color: #FF2442;
  color: pink;
  font-size: 20px;
  font-family: 'rakkas', cursive;
  text-align: left; 
  position: absolute; width: 50%; top: 40%; right: 50%; 
 border-radius: 10px;}

ul2 {background-color: #F6A9A9;
  color: brown;
  font-size: 20px;
  font-family: arial', cursive;
  text-align: left; 
  position: absolute; width: 215%; top: 100%; right: 0%; 
 border-radius: 10px}

ul3 {
  background-color: orchid;
  color: white;
  font-size: 20px;
  font-family: arial, cursive;
  text-align: center; 
  position: absolute; width: 20%; top: 20%; right: 35%; 
 border-radius: 10px;} 

ul4 {
  background-color: #CDFFFC;
  color: #00A19D;
  font-size: 20px;
  font-family: 'yatra one',cursive;
  text-align: center; 
  position: absolute; width: 60%; top:340%;  right: 40%; 
  border-radius: 10px
}

ul5 {
  background-color: #FDE49C;
  color: #FF2442;
  font-size: 20px;
  font-family: abril fatface;
  text-align: left; 
  position: absolute; width: 600%; top: 300%;  right:-480%; 
 border-radius: 10px;}

ul6 {
  background-color: orange;
  color: red;
  font-size: 20px;
  font-family: 'arial', cursive;
  text-align: center; 
  position: absolute; width: 50%; top: 400%;  right: 80%; 
 border-radius: 10px;}

ol7 {
  background-color: #F6A9A9;
  color: red;
  font-size: 20px;
  font-family: abril fatface, cursive;
  text-align: center; 
  position: absolute; width: 80%; top: 440%;  right: 20%; 
 border-radius: 10px;}


.gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  position: absolute; width: 80%; top: 110%; right: 38%;
  grid-gap: 20px;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-row-end: 3;
  align-content: start;
  max-width: 700px;
  margin: 0 auto;
  transition: all 150ms linear;
}

.gallery input[type="radio"] {
  display: none;
}

.gallery label {
  position: relative;
  display: block;
  padding-bottom: 60%;
  margin: 5px;
  cursor: pointer;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}

.gallery label:before {
  border: 1px solid #e3e3e3;
  content: '';
  position: absolute;
  left: -5px;
  right: -5px;
  bottom: -5px;
  top: -5px;
}

.gallery img {
  display: none;
  grid-column-start: 1;
  grid-column-end: 5;
  grid-row-start: 1;
  grid-row-end: 2;
  width: 100%;
  transition: all 150ms linear;
}

.gallery input[name="select"]:checked + label + img {
  display: block;
}

.gallery input[name="select"]:checked + label:before {
  border: 1px solid #000;
}

.subir{
  position: fixed;
    bottom: 0;
    right: 0;
    margin-right: 15px;
    margin-bottom: 10px;
    z-index:2;}

#zona15{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 88%; 
 border-radius: 10px;} 

#zona16{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 77%; 
 border-radius: 10px;}

#zona17{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 15%; top: 20%; right: 61%; 
 border-radius: 10px;}

#zona18{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 50%; 
 border-radius: 10px;}

#zona19{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 39%; 
 border-radius: 10px;}

#zona20{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 28%; 
 border-radius: 10px;}

#zona21{background-color:#C67ACE;
  color: pink;
  font-size: 20px;
  font-family: rakkas;
  position: absolute; 
  text-align:center;
  width: 10%; top: 20%; right: 17%; 
 border-radius: 10px;}