/* https://www.w3schools.com/ */

html, body {
  margin: 0;
  scroll-behavior: smooth;
}

a {
  text-decoration: none;
  color: black;
}

#Portada {
  /*background-color: LightSteelBlue;*/
background-image: url("https://i.pinimg.com/564x/94/98/f4/9498f445608d1ae45356a3cbf3c3ed32.jpg");
  background-size: cover;
  width: 100vw;
  height: 100vh;
}
#Titulo {
  font-size: 10vw;
  font-family: Satisfy;
  text-align: center;
  color:white;
  text-shadow:4px 1px 1px black;
}
#Subtitulo {
  font-size: 5vw;
  font-family: Satisfy;
  text-align: center;
  color:white;
  text-shadow:4px 1px 1px black;
}
#PieDePagina {
  width: 100vw;
  height: 3vh;
  position: fixed;
  bottom: 0;
  font-family: Amatic SC;
  font-size: 3vh ;
  background-color: white;
  text-align: center;
}

/* BOTONES*/ 

#Botonera {
  width: 90%;
  margin: auto;
  margin-top: 13vh;
  height: 10vh;
  justify-content: space-around;
  display: flex;
}

#BotonPerfil {
  background-image: url("https://i.pinimg.com/236x/6c/e8/2c/6ce82c3d5433d9da6c4f24b323080add.jpg");
  background-size: cover;
  background-color: MediumSeaGreen;
  width: 13vw;
  height: 13vw;
}
#BotonPerfil:hover {
 cursor: pointer;
 background-image: url("https://i.pinimg.com/564x/ca/db/77/cadb778bf0f0f2c369e6a8f771117308.jpg");
}

 #BotonMisPasosPorElIllia {
  background-image: url("https://i.pinimg.com/236x/c0/35/0d/c0350d0a819449367c8d61578188b3c4.jpg");
  background-size: cover;
  width: 13vw;
  height: 13vw;  
}
#BotonMisPasosPorElIllia:hover {
 cursor: pointer;
 background-image: url("https://i.pinimg.com/564x/ac/ba/70/acba700b0a5ae93c4bb0961cea775523.jpg");
}
#BotonRandom {
  background-image: url("https://i.pinimg.com/236x/e4/d8/21/e4d82130a6e515d5613c015890276852.jpg");
  background-size: cover;
  background-color: MediumSeaGreen;
  width: 13vw;
  height: 13vw;
}
#BotonRandom:hover {
 cursor: pointer;
 background-image: url("https://i.pinimg.com/564x/ac/4a/2d/ac4a2ddf81171aae729e43d1ccb45839.jpg");
}
#BotonAudioVisual {
  background-image: url("https://i.pinimg.com/236x/35/f2/66/35f2667dadc8fb64e73665394a52bfb0.jpg");
  background-size: cover;
  width: 13vw;
  height: 13vw;  
}
#BotonAudioVisual:hover {
 cursor: pointer;
 background-image: url("https://i.pinimg.com/564x/63/ee/81/63ee8186615881d31771ecb4a806c1d5.jpg");
}
#BotonFuturo {
  background-image: url("https://i.pinimg.com/236x/35/42/d6/3542d63c395a66bae1ac6787c76c8de0.jpg");
  background-size: cover;
  width: 13vw;
  height: 13vw;  
}
#BotonFuturo:hover {
  cursor: pointer;
 background-image: url("https://i.pinimg.com/564x/54/63/09/5463094b1e14e51cc9b93600d554e15d.jpg");
}
#botonvolver {
  font-size: 2vw;
  font-family: Amatic SC;
  text-align: ;
}

/* PAGINAS*/

#Perfil{
  background-color: MediumSeaGreen;
  width: 100vw;
  height: 100vh;
}

#MisPasosPorElIllia {
  background-color: Khaki;
  width: 100vw;
  height: 100vh;
}

#Random {
  background-color: MediumOrchid;
  width: 100vw;
  height: 100vh;
}

#AudioVisual {
  background-color: Red;
  width: 100vw;
  height: 100vh;
}
#Futuro {
  background-color: PaleTurquoise;
  width: 100vw;
  height: 100vh;
}


/* TITULOS */
#TituloPerfil{
   font-size: 4vw;
  font-family: Anton;
  text-align: left;
}
#Titulomppei {
  font-size: 4vw;
  font-family: Anton;
  text-align: left;
} 
#TituloAudioVisual {
 font-size: 4vw;
  font-family: Anton;
  text-align:left ; 
}
#TituloFuturo {
  font-size: 4vw;
  font-family: Anton;
  text-align:left ;
}

#TituloRandom {
  font-size: 4vw;
  font-family: Anton;
  text-align:left ;
}

/* TEXTOS*/

#Texto {
 font-size: 2vw;
 font-family: Indie Flower;
 text-align: center;

}

/* FOTOS*/
#galeria {
 display: flex;
  justify-content: space-evenly;
}
  
/* VIDEOS */ 
#Videos {
  display: flex;
  justify-content:space-evenly ;
}
#Video {
 display: flex;
  justify-content: center;
 
}
/* PERFIL*/
/*#FotoPerfil1 {
 position: absolute;
  left:20vw;
 
}
#FotoPerfil2 {
  position: absolute;
  left:40vw;
  
}
#FotoPerfil3 {
position: absolute;
  left:60vw;
  
 
}

/* MIS PASOS POR EL ILLIA*/
/*#Fotomispasos1 {
 position: absolute;
 justify-content: center;
}
#Fotosmispasos2 {
  position: absolute;
justify-content: center;
}
#Fotosmispasos3 {
   position: absolute;
justify-content: center;
}
#Fotosmispasos4 {
   position: absolute;
  justify-content: center;
}

/* RANDOM */
/* AUDIOVISUAL */ 
/* FUTURO */