body{
    background-image: url("https://i.pinimg.com/originals/41/c6/7d/41c67d7a002eb172146032d3f9d2adec.png");
   } /* esta es la iamgen que utilicé de fondo de la pagina */
   nav{
     background-color: #474b4e; /* aqui definimos el color del "encabezado" */
     font-family: Arial, Helvetica, sans-serif; /* fuente del menu */
     margin: 0vmin;
   }
   .menu{
     display: flex; /* sirve para poner horizontal los elementos del menú */
     justify-content: center; /* sirve para alinear los elementos del menú */
     list-style-type: none; /* sirve para sacarle los puntos a la lista */
     /* lo de margin y padding 0 me sirve para que quede más prolijo el menú */
     margin: 0vmin; 
     padding: 0vmin;
     text-align: center;
   }
   .menu li a{
     text-decoration: none; /* sirve para que las palabras no aparezcan como un enlace */
     color: white; /* acá definimos el color de los elemnetos del menú*/
   }
   li{
     padding: 2vmin; /* sirve para separar los elemntos del menú*/
   }
   .menuli:hover{
     background-color:#C3A5FC ;  /* sirve para que cambie de color el elemento que tocas*/
  }
   .botonlink{
     font-size: 2.5vmax; /* tamaño de la fuente */
     font-family: Old English Text MT; /* fuente */
     color: black; /* color de la letra */
     padding:0.5vmax;
     width: min-content;
     position:fixed;
     bottom:0.6vmin;
     right: 1.5vh;
     display:flex;
     flex-direction: row;
     align-items: center;
     height: 4vh;
     margin-bottom:1vmax;
     background: #474b4e;
     border-radius: 1cm;
     text-decoration: none;
   }
   .botonlink:hover{
     background-color:#C3A5FC ; /* esto sirve para que cuando toques el boton se ponga de cierto color */
   }
   .titulo{
     font-family: Old English Text MT; /* fuente de los titulos*/
     font-size: 4vmax; /* tamaño de la fuente de los titulos*/
     text-align: center; /* alineación de los titulos*/
     color: #474b4e; /* color de los titulos*/
   }
   .titulo2{
     font-family: Old English Text MT; /* fuente de los titulos*/
     font-size: 2.5vmax; /* tamaño de la fuente de los titulos*/
     text-align: center; /* alineación de los titulos*/
     color: black; /* color de los titulos*/ 
   }
   .titulo3{
     font-family: Old English Text MT; /* fuente de los titulos*/
     font-size: 3vmax; /* tamaño de la fuente de los titulos*/
     text-align: center; /* alineación de los titulos*/
     color: black; /* color de los titulos*/  
   }
   .titulo4{
     font-family: Old English Text MT; /* fuente de los titulos*/
     font-size: 3vmax; /* tamaño de la fuente de los titulos*/
     text-align: center; /* alineación de los titulos*/
     color: #C3A5FC; /* color de los titulos*/  
     background-color: #474b4e;
   }
   .titulo5{
    font-family: Old English Text MT; /* fuente de los titulos*/
    font-size: 2.5vmax; /* tamaño de la fuente de los titulos*/
    text-align: center; /* alineación de los titulos*/
    color: black; /* color de los titulos*/  
   }
   .presentacion{
     font-family:Arial, Helvetica, sans-serif;/* fuente del parrafo*/
     font-size: 1.4vmax; /* tamaño de la fuente del parrafo*/
     text-align:center; /* alineación del parrafo*/
     color: black; /* color del parrafo*/ 
     margin-left: 200px; /* margen a la izquierda */
     margin-right: 200PX; /* margen a la derecha */
     text-align: justify; /* alineación del texto */
   }
   .parrafo{
     font-family:Arial, Helvetica, sans-serif;/* fuente del parrafo*/
     font-size: 1.7vmax; /* tamaño de la fuente del parrafo*/
     text-align:center; /* alineación del parrafo*/
     color: black; /* color del parrafo*/ 
     margin-left: 200px; /* margen a la izquierda */
     margin-right: 200PX; /* margen a la derecha */
     text-align: justify; /* alineación del texto */
   }
   .datos{
     font-family:Arial, Helvetica, sans-serif;/* fuente del parrafo*/
     font-size: 1.7vmax; /* tamaño de la fuente del parrafo*/
     text-align:center; /* alineación del parrafo*/
     color: black; /* color del parrafo*/ 
     text-align: center; /* alineación del texto */
   } 
   .fotoyo{
     width: 15%; /* establece el ancho de la imagen*/
     height: 20%; /* establece el alto de la imagen*/
     display: block; /* sirve para centrar la imagen*/
     margin: auto; /* sirve para establecer el margen de los cuatro lados*/
     border-radius: 1vmax; /* sirve para poner el tipo de borde y la cantidad */
   }
   #fotosprimero{
     text-align: center; /* alineación de las fotos */
   }
   #fotossegundotercero{
     text-align: center; /* alineación de las fotos */ 
   }
   #fotoscuarto{
     text-align: center; /* alineación de las fotos */ 
   }
   #fotosquinto{
     text-align: center; /* alineación de las fotos */ 
   }
   #fotossexto{
     text-align: center; /* alineación de las fotos */ 
   }
   #fotosfuturo{
     text-align: center; /* alineación de las fotos */  
   }
   #fotosfuturo2{
     text-align: center; /* alineación de las fotos */ 
     padding: 2vmin;
   }
   .listaredessociales{
     font-family:Arial, Helvetica, sans-serif; /* fuente del parrafo*/
     font-size: 1.7vmax; /* tamaño de la fuente del parrafo*/
     text-align: center; 
     color: black; /* color del parrafo*/ 
     list-style-type: none; /* sirve para sacarle los puntos a la lista */
   }
   footer{
     background-color: #474b4e; /* indica el color del pie de pagina*/
     color: white; /* indica el color de la fuente del pie de pagina*/
     text-align: center; /*alineación del texto en el pie de pagina */
   }