html{
    scroll-behavior: smooth;
}

/*Header*/
.header{
    position: fixed;
    margin: 0;
    margin-bottom: 50vh;
    width: 100%;
    height: 10%;
    box-sizing: border-box;
    border-bottom: 3px, black, solid;
    position: absolute;
    top: 0%;
    left: 0%;
    background-color: rgb(171, 205, 216);
}

/*Enlaces*/
.enlaces{
    height: 8vh;
    width: 100vw;
    font-family:'Courier New', Courier, monospace; 
    margin: 0;
    background-color:rgb(171, 205, 216);
}

.enlaces ul{
    width: 100vw;
    display: flex;
    justify-content: space-evenly;
    height: 8vh;
    align-items: center;
}

.enlaces ul a{
    font-family:'Courier New', Courier, monospace; 
    font-size: 1.5vw;
}

.enlaces ul a:hover{
    color:rgb(245, 186, 213)
}
/*Cuerpo*/

.general{
    padding-top: 18vh;
}

.img1{
    float: right; 
    margin: 0.8vw 2vw;  
    width: 15vw;
    height: 15vw;
    object-fit: cover;
    border-radius: 50%;
    border: 0.3vw solid rgb(171, 205, 216);
    display: flex;
    text-align: right;
}

body{
    background-image:url(/Imagenes/fondo.jpg);
    background-size: cover;
    background-attachment: scroll;
    font-family: 'Courier New', Courier, monospace;
}
/*Divisiones*/

.div-presentacion{
    display: flex;
    align-items: center;
}

.redes{
    display: block;
    align-items: center;
    text-align: center;
}

.div-img{
    margin-top: 4vh;
}

li{
    display: inline-block;
}


/*Textos*/

.titulo{
    text-align: center;
    font-size: 3vw;
    font-family:'Courier New', Courier, monospace; 
    margin: 0;
}

.subtitulos{
    font-family: 'Courier New', Courier, monospace;
    font-size: 2vw;
    background-color:rgb(245, 190, 190) ;
    padding-left: 5vh;
}
.parrafos{
    font-family:Arial, Helvetica, sans-serif;
    font-size: 3vmin;
    text-align: justify;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: 4vmin;
    margin: 2vmax;
    display: block;
}
/*Galeria*/
/*tiene un error, no puedo hacer que las imagenes se vean completas*/
.foto{
  width: 90px;
  height: auto;
  
  
}
#muestra {
  position: relative; 
  margin: 1rem auto; 
  width: 55vw; height: 65vh; 
  border: solid 5px rgb(171, 205, 216); 
  background-color: rgb(245, 190, 190); 
  overflow: hidden; 
  box-shadow: 0 0 0 10px rgb(171, 205, 216), 10px 10px 20px 8px rgba(0,0,0,.2); 
  }
  #selectores {
  position: absolute; 
  left: 0; top: 0; 
  width: 7vw; height: 70vh; 
  padding: 0.5vmin; 
  font-size: 0; 
  overflow: hidden; 
  background-color: rgb(171, 205, 216); 
  }
  #selectores img{
  margin: none; 
  border: solid 3px transparent; 
  cursor: pointer; 
  }
  #visor {
  position: absolute; 
  font-size: 0; 
  left: 14vmin; 
  top: 0; 
  width: 55vw; height: 65vh; 
  object-fit: cover;
  }
  #visor:before {
  content: 'Haz click la imagen que quieres ver';
  position: absolute;
  left: 0; right: 0; top: 48%;
  font-size: 1.7rem;
  color: rgb(27, 116, 146);
  text-align: center;
  }
  #visor img {
  position: absolute; 
 
  top: 0; left: 0; 
  }
  /*Collage*/
  * {
    box-sizing: border-box;
  }
  
  .columna {
    float: left;
    padding-right: 1vw;
  }
  
  .fila::after {
    content: "";
    clear: both;
    display: table;
  }