.menu{

    display: flex;
  flex-direction: row;
  background-color: DodgerBlue;
}

.menu > div  {
    background-color: #f1f1f1;
    margin: 10px;
    padding: 20px;
    font-size: 25px;
    font-family: 'Lato', sans-serif;
    
  }

  .menu > div:hover{
    background-color: #000000;
  }

  a:hover{
    
    color:#ffffff;
    background-color: #000000;
  }

  

.header{
    display: flex;
    flex-direction: row;
    justify-content: center;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
}

.header > img{
    vertical-align:middle;
    margin:0px 100px;
}

.header > h1{

    vertical-align:middle;
    text-align: center;
    margin:100px 100px;
}

.introduccion{
  display: flex;
  flex-direction: column;
  margin: 30px 100px 10px;
  padding: 5px 5px;
  align-items: center;
  text-align: justify;
}
.introduccion > h3{
  font-size: 30px;
}
.introduccion > p{
  font-size: 20px;
}

p{
  font-family: 'Ubuntu', sans-serif;
  padding: 5px 15px;
  text-align: justify;
}

h2{
  font-family: 'Inter', sans-serif;
  padding: 10px 25px;
}

h3{
  font-family: 'Mukta', sans-serif;
  padding: 5px 20px;
  font-size: 20px;

}

h4{
  font-family: 'Work Sans', sans-serif;
  padding: 10px 20px;
}

.album{
  display: flex;
  flex-direction: column;
  align-items:flex-start;

}
#tituloAlbum1{

  margin:10px 50px 10px;
  padding: 10px 5px;
  background-color: #006611;

}

.album div:not(#tituloAlbum1){
  
  padding: 10px 5px;
  background-color: #000000;
  margin:5px 50px 5px;
  color:#ffffff;
}

.album > div > div > img{
  height: auto; 
  width: auto; 
  max-width: 100%; 
  max-height: 100%;
}
.album > div > div > video{ /*Primer video de secciones*/
  height: auto; 
  width: auto; 
  max-width: 100%; 
  max-height: 100%;
  grid-area: 1 / 1 / 2 / 3;

}



#Fin{
  grid-area: 6 / 1 / 7 / 3;
}

#Inicio{
  grid-area: 1 / 1 / 2 / 3;
}

#Medio{
  grid-area: 4 / 1 / 6/ 2;
 
}


.album div:not(#tituloAlbum1) > div{ /* Titulo para inicio de secciones*/
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  grid-gap: 10px;
  justify-content: space-around;
}

#CascadaAcampar{
  grid-area: 3 / 2 / 4 / 4;
}

#CascadaArtificial1{
  grid-area: 3 / 1 / 5 / 2;
}

#CascadaArtificial2{
  grid-area: 3 / 2 / 4 / 4;
  
}

#CascadaEscondidaNov{
grid-area: 2 / 1 / 3 / 3;

}

#redes_sociales{
  
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.album{
  background-color: #009494;
}