@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@100..900&display=swap');

body {
  position: relative; 
  background-color: #FFFEF1;
  color: #6A6A6A;
  margin: 0;
  font-family: "Alexandria", sans-serif;
  font-weight: 100;
  font-size: 18px;
  text-align: justify;
 overflow: hidden;
}


#contenedor4 {
  width: 400px;
  position: absolute; 
  top: 100px;
  left:200px;
}
#texto {
  font-weight: 100;
  text-align: justify;
  font-family: "Alexandria", sans-serif;
}
#contenedor5 {
  width: 400px;
  position: absolute; 
  top: 215px;
  left:200px;
}
#texto1 {
  font-weight: 100;
  text-align: justify;
  font-family: "Alexandria", sans-serif;
}
#contenedor6 {
  width: 400px;
  position: absolute; 
  top: 320px;
  left:200px;
}
#texto2 {
  font-weight: 100;
  text-align: justify;
  font-family: "Alexandria", sans-serif;
}

.item img {
  position: absolute;
  width: 100%;
  height: auto;
}
.ascii {
  position: absolute;
  opacity: 1;
}

.real {
  position: absolute;
  opacity: 0;
}

.item.activo .real {
  opacity: 1;
}

.item.activo .ascii {
  opacity: 0;
}
#a1,
#a1:visited,
#a1:hover,
#a1:active,
#a1:focus {
  text-decoration: none;
  color: #6A6A6A;
}
#a1:hover {
  opacity: 0.65;
}

#siguiente{
  position: absolute;
   font-weight: 100;
  text-align: justify;
  font-family: "Alexandria", sans-serif;
  top: 420px;
  left: 200px;
}
#azul{
  position:absolute;
  width: 750px;
  top: 400px;
  left: 950px;
}
#lavanda{
  position: absolute;
  width: 100px;
  top: 500px;
  left: 250px;
}
#naranja{
  position: absolute;
  width: 150px;
  top: 500px;
  left: 400px;
}
#pajaro{
  position: absolute;
  width: 100px;
  top: 40px;
  left: 1200px;
}
#pajaro2{
  position: absolute;
  width: 100px;
  top: 150px;
  left: 1150px;
}
#roja{
  position: absolute;
  width: 100px;
  top: 550px;
  left: 1200px;
}
#rosada{
  position: absolute;
  width: 100px;
  top: 150px;
  left: 800px;
}
#amarilla{
  position: absolute;
  width: 100px;
  top: 250px;
  left: 1000px;
 
}
#bugambilia{
  position: absolute;
  width: 100px;
  top: 640px;
  left: 900px;

}
#hortencia{
  position: absolute;
  width: 150px;
  top: 300px;
  left: 1150px;
 
}
#orquidea{
  position: absolute;
  width: 100px;
  top: 500px;
  left: 100px;
}

#fresa{
  position: absolute;
  width: 100px;
  top: 300px;
  right: 650px;
  z-index: 2;
}
#hoja1{
  position: absolute;
  width: 150px;
  top: 500px;
  right: 600px;
  z-index: 2;
}
#hoja2{
  position: absolute;
  width: 100px;
  top: 370px;
  right: 90px;
  z-index:2;
}
#hoja3{
  position: absolute;
  width: 150px;
  top: 250px;
  left: 30px;
  z-index: 2;
}

#mango{
  position: absolute;
  width: 150px;
  top: 100px;
  right: 300px;
  z-index: 2;
}

#papaya{
  position: absolute;
  width: 100px;
  top: 500px;
  right: 700px;
  z-index: 2;
}
#uva{
  position: absolute;
  width: 100px;
  top: 400px;
  right: 500px;
  z-index: 2;
}