html{
  scroll-behavior:smooth;
}
body{
  background-color:#9C6644;
  color:black;
  font-family: 'Limelight', cursive;
  font-size:15vw;
  text-align:center;
}
a{
  text-decoration:none;
}
#contenido{
  padding-top:5vw;
  text-align:center;
}
#botonillia{
  background-color:#B08968;
  color:black;
  transition:2s;
  width:20vw;
  font-size:2vw;
  margin-left:0vw;
  position:absolute;
}
#botonillia:hover{
  color:black;
  opacity:0.7;
  border-radius:2vw;
  }
#botonfotos{
  background-color:#7F5539;
  color:black;
  transition:2s;
  width:20vw;
  font-size:2vw;
  margin-left:25vw;
  position:absolute;
}
#botonfotos:hover{
  color:black;
  opacity:0.7;
  border-radius:2vw;
}
#botonfuturo{
  background-color:#DDB892;
  color:black;
  transition:2s;
  width:20vw;
  font-size:2vw;
  margin-left:50vw;
  position:absolute; 
}
#botonfuturo:hover{
  color:black;
  opacity:0.7;
  border-radius:2vw;
}
#botonrandom{
  background-color:#EDE0D4;
  color:black;
  transition:2s; 
  width:20vw;
  font-size:2vw;
  margin-left:75vw;
  position:absolute;
}
#botonrandom:hover{
  color:black;
  opacity:0.7;
  border-radius:2vw;
}
.nombre{
  color:black;
  opacity:0.7;
  border-radius:2vw;
  background-color:#E6CCB2;
  font-size:3.5vw;
  text-align:center;
  padding:2vw;
  border-radius:2.5vw;
}   
.introduccion{
  font-size:3.5vw;
  text-align: left;
  padding:0.5vw;
  color:black;
}
.info{
  font-size:3vw;
  text-align:left;
  color:white;
}
.info2{
  font-family: 'Open Sans Condensed', sans-serif;
  text-align:right;
  font-size:3vw;
}
#illia{
  background-color:#B08968;
  font-size:3.5vw;
  border-radius:2vw;
  text-align:center;
  padding:1vw;
  color:black;
}
.aclaracionesillia{
  font-size:2.5vw;
  text-align:left;
  color:white;
}
#botonvolver{
  background-color:#DDB892;
  color:black;
  transition:2s;
  width:20vw;
  font-size:3vw;
  text-align:center;
}
#botonvolver:hover{
 color:black;
  opacity:0.7;
  border-radius:2vw; 
}
#fotos{
  color:black;
  background-color:#7F5539;
  text-align:center;
  font-size:3.5vw;
  border-radius:2vw;
  padding:1vw;
}
.textofotos{
  font-size:2.5vw;
  text-align:left;
  color:white;
}
#boton2volver{
  background-color:#EDE0D4;
  color:black;
  transition:2s;
  width:20vw;
  font-size:3vw;
  text-align:center;
}
#boton2volver:hover{
 color:black;
  opacity:0.7;
  border-radius:2vw; 
}
#thefuture{
  background-color:#DDB892;
  color:black;
  text-align:center;
  font-size:3.5vw;
  border-radius:2vw;
  padding:1vw;
}
.infofuture{
  color:white;
  font-size:3vw;
  text-align:left;
}
.futuropt1{
  text-align:right;
  color:black;
  padding:1vw;
  font-size:3.5vw;
}
.infoft1{
  font-family: 'Open Sans Condensed', sans-serif;
  text-align:right;
  color:white;
  font-size:3vw;
  padding:1vw;
}
.futuropt2{
  text-align:left;
  color:white; 
  padding:1vw;
  font-size:3.5vw;
}
.infoft2{
  font-family: 'Open Sans Condensed', sans-serif;
  text-align:left;
  font-size:3vw;
  color:black; 
  padding:1vw;
}
#boton3volver{
  background-color:#DDB892;
  color:black;
  transition:2s;
  width:20vw;
  font-size:3vw;
  text-align:center;
}
#boton3volver:hover{
 color:black;
  opacity:0.7;
  border-radius:2vw; 
}
#random{
  background-color:#EDE0D4;
  color:black;
  text-align:center;
  font-size:3.5vw;
  border-radius:2vw;
  padding:1vw;
}
.rtextito{
  font-family: 'Open Sans Condensed', sans-serif;
  text-align:left;
  font-size:3vw;
  color:white; 
  padding:1vw; 
}
.flex-container {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: center;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }

.flex-item:nth-child(1) {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(2) {
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(3) {
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(4) {
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(5) {
    -webkit-order: 5;
    -ms-flex-order: 5;
    order: 5;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(6) {
    -webkit-order: 6;
    -ms-flex-order: 6;
    order: 6;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(7) {
    -webkit-order: 7;
    -ms-flex-order: 7;
    order: 7;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(8) {
    -webkit-order: 8;
    -ms-flex-order: 8;
    order: 8;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(9) {
    -webkit-order: 9;
    -ms-flex-order: 9;
    order: 9;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(10) {
    -webkit-order: 10;
    -ms-flex-order: 10;
    order: 10;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(11) {
    -webkit-order: 11;
    -ms-flex-order: 11;
    order: 11;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(12) {
    -webkit-order: 12;
    -ms-flex-order: 12;
    order: 12;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(13) {
    -webkit-order: 13;
    -ms-flex-order: 13;
    order: 13;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(14) {
    -webkit-order: 14;
    -ms-flex-order: 14;
    order: 14;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(15) {
    -webkit-order: 15;
    -ms-flex-order: 15;
    order: 15;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(16) {
    -webkit-order: 16;
    -ms-flex-order: 16;
    order: 16;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(17) {
    -webkit-order: 17;
    -ms-flex-order: 17;
    order: 17;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(18) {
    -webkit-order: 18;
    -ms-flex-order: 18;
    order: 18;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(19) {
    -webkit-order: 19;
    -ms-flex-order: 19;
    order: 19;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(20) {
    -webkit-order: 20;
    -ms-flex-order: 20;
    order: 20;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(21) {
    -webkit-order: 21;
    -ms-flex-order: 21;
    order: 21;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(22) {
    -webkit-order: 22;
    -ms-flex-order: 22;
    order: 22;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(23) {
    -webkit-order: 23;
    -ms-flex-order: 23;
    order: 23;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(24) {
    -webkit-order: 24;
    -ms-flex-order: 24;
    order: 24;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(25) {
    -webkit-order: 25;
    -ms-flex-order: 25;
    order: 25;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(26) {
    -webkit-order: 26;
    -ms-flex-order: 26;
    order: 26;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(27) {
    -webkit-order: 27;
    -ms-flex-order: 27;
    order: 27;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(28) {
    -webkit-order: 28;
    -ms-flex-order: 28;
    order: 28;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(29) {
    -webkit-order: 29;
    -ms-flex-order: 29;
    order: 29;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(30) {
    -webkit-order: 30;
    -ms-flex-order: 30;
    order: 30;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(31) {
    -webkit-order: 31;
    -ms-flex-order: 31;
    order: 31;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(32) {
    -webkit-order: 32;
    -ms-flex-order: 32;
    order: 32;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(33) {
    -webkit-order: 33;
    -ms-flex-order: 33;
    order: 33;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.flex-item:nth-child(34) {
    -webkit-order: 34;
    -ms-flex-order: 34;
    order: 34;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }
#boton4volver{
  background-color:#EDE0D4;
  color:black;
  transition:2s;
  width:20vw;
  font-size:3vw;
  text-align:center;
}
#boton4volver:hover{
 color:black;
  opacity:0.7;
  border-radius:2vw; 
}