@import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alex+Brush&family=Amatic+SC:wght@700&family=Great+Vibes&family=Mrs+Saint+Delafield&family=Spectral+SC:wght@200&display=swap');

/*BODY*/
body{
    width: 100vmax;
    height: 100vmax;
    margin: 0;
    padding: 0;
    text-align: justify;
    margin-left: 0;
    margin-right: 0;
    background-size: cover;
    background-image: url(../Imagenes/3326-puntos.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: absolute ;
}

/*NAVEGADOR*/
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #e7e8e9;
    position: fixed;
    top: 0;
    width: 100%;
}

li {
    float: left;
    
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-family: 'Julius Sans One', sans-serif;
    font-weight:bold;
}

li a:hover {
    background-color: gray;
}

/*SECCIONES*/

.secciones{
    background-color: 
    rgba(255, 255, 255, 0.671);
    width: 100vmax ;
    height: 50vmin;
    margin-top: 5%;
    margin-bottom: 5%;

}

/*TITULOS SECCIONES*/ 
h1{
 font-family: 'Julius Sans One', sans-serif;
 font-size: x-large ;
 text-align:center;
 background-color: #e7e8e9;
 color: rgb(163, 156, 156);
 letter-spacing: 4px;
 font-weight: bold;
 width: 100%;
}

/*SECCION 1*/ 
#primero{
    margin-top: 10%;
} 
.texto /*texto*/{
    font-family: 'Spectral SC', serif;
    text-align: justify;
    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: 2%;
    margin-right: 25%;
    color: black;
    font-size: 2.1vmin;
    font-weight:bold;
}

/*MI FOTO*/ img{
    float: right;
    width: 15%;
    height: 80%;
    margin-right: 4%;
border-radius: 3%;
} 


/*SECCION 2*/ 

.seis /*texto*/{
    font-family: 'Spectral SC', serif;
    text-align: justify;
    margin-top: 1%;
    margin-bottom: 1%;
    margin-left: 2%;
    margin-right: 25%;
    color: black;
    font-size: 2.4vmin;
    font-weight:bold;
}

.imagen{
    width: 10%;
    height: 60%;
    margin-top: 1.5%;
    margin-left: 1%;
    float: left;
}

.recuerdos{
    width: 15%;
    height: 80%;
    margin-left: 4%;
border-radius: 3%;

    float: left;
}  

/*SECCION 3*/ 

/*redes sociales */ 
.social-bar {
	position: absolute;
	right:0;
	top: 70;
	font-size: 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	z-index: 100;
    
}

.icon {
	color: white;
	text-decoration: none;
	padding: .7rem;
	display: flex;
	transition: all .5s;
}

.icon-facebook {
	background: #2E406E;
}

.icon-twitter {
	background: #339DC5;
}

.icon-linkedin2 {
	background: #83aaf1;
}

.icon-instagram {
	background: #eb5575;
}

.icon:hover {
	padding-right: 3rem;
	border-radius: 1rem 0 0 1rem;
	box-shadow: 0 0 .5rem rgba(0, 0, 0, 0.42);
}

/*texto de la seccion*/ 
.gustos /*texto*/{
    font-family: 'Spectral SC', serif;
    margin-top: 4%;
    text-align: center;
    margin-left: 2%;
    color: black;
    font-size: 2.5vmin;
    font-weight:bold;
}

/*SECCION 4*/ 


#cuarto{
    background-color: 
    rgba(255, 255, 255, 0.671);
    width: 100vmax ;
    height: 80vmin;
    margin-top: 5%;
    margin-bottom: 5%;
}
.mifuturo{
    width: 50%;
    height: 70%;
    margin-bottom: 5%;
    margin-left: 5%;
    float: left;
    align-self: start;
}

.esperanza /*texto*/ {
    font-family: 'Spectral SC', serif;
    text-align: justify;
   align-items: flex-end;
    color: black;
    font-size: 2.5vmin;
    margin-right: 5%;
    font-weight:bold;
}
 /*boton de galeria personal*/ 
a.boton{
    display:inline-block;
    padding:0.35em 1.2em;
    border:0.1em solid gray;
    margin:0 0.3em 0.3em 0;
    border-radius:0.12em;
    box-sizing: border-box;
    text-decoration:none;
    font-family:'Julius Sans One', sans-serif;
    font-weight:300;
    color:#e7e8e9;
    text-align:center;
    transition: all 0.2s;
    background-color: grey;
    
    }

    a.boton:hover{
color:#000000;
background-color:#e7e8e9;
  }
        
       

/*FOTTER*/ 
footer{
    background-color: #e7e8e9;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    width: 100vmax;
    height: 15vmin;
    
    
}