/* Comentarios */

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;600&display=swap');

*{padding: 0; margin: 0; font-family: sans-serif; box-sizing: border-box; transition: 2s;}


/*MOBILE*/

/*INICIO BODY*/
body{background: white; color: black;}

/*INICIO HEADER*/

header{height: 300px; background-image: url("https://wallpaperaccess.com/full/864178.jpg"); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; background-color: black;}

header h1{color: #684162; text-align: center; margin-top: 1rem; font-family: 'Work Sans', sans-serif; font-weight: 600; font-size: 1rem; margin-bottom: 0.5rem;}

/*IMÁGEN*/
            
img{height: 10rem; width: 10rem; border-radius: 100%; margin-bottom: 0.5rem; display: block;}
figcaption p{font-size: 0.8rem; padding-top: 0.5rem;}
figcaption p a{text-decoration: none; color: white; text-align: center;}


/*INICIO NAV*/

nav{background: rgba(250 184 194 / 23%); height: 50px; display: flex; flex-wrap: wrap; justify-content: space-around; margin: auto;}
nav ul li{display: inline-block; padding: 1rem;}
nav ul li a{text-decoration: none; color: white; list-style: none; font-size: 1rem; font-family: 'Work Sans', sans-serif; font-weight: 400;}
nav ul li a:hover{color: #935c8b;}

/*INICIO MAIN*/
            
section{margin: 0.6rem;}
.titulos{text-align: center; letter-spacing: 2px; border-top: 2px solid #e5aec1; border-bottom: 2px solid #e5aec1; padding: 0.5rem; line-height: 1.5rem; color: #684162;}
.titulos h2{font-family: 'Work Sans', sans-serif; font-weight: 400;}
.titulos p{color: #e5aec1; font-family: 'Work Sans', sans-serif; font-weight: 400;}


/*MATERIAS*/
.contenedor{display: flex; flex-wrap: nowrap; flex-direction: column;width: 100%;}
.marco{margin: 0.5rem; padding: 0.5rem; width: 100%; height: 15rem; border: 3px solid #935c8b;}
.materias{list-style: none; font-family: 'Work Sans', sans-serif; font-weight: 300; text-align: center; margin-top: 1.5rem;}
.nivel{color: #935c8b; font-size: 2rem; font-family: 'Work Sans', sans-serif; font-weight: 400; line-height: 3rem; text-align: center;}
.cursando{margin-top: 1rem; color: #db90aa; font-family:  'Work Sans', sans-serif; font-weight: 300; text-align: center; line-height: 0.5rem;}


/*INICIO ASIDE*/
            
aside h2{border-bottom: 2px solid #e5aec1; border-top: 2px solid #e5aec1; padding: 1rem; text-align: center; letter-spacing: 3px; margin-top: 0.5rem; color: #935c8b; font-family: 'Work Sans', sans-serif; font-weight: 300; font-size: 1.5rem;}
            
.subtitulos a{text-decoration: none; color: #db90aa; font-family: 'Work Sans', sans-serif; font-weight: 300;}
.datos{padding: 2rem; line-height: 1.5rem; display: inline-block;}
.datos p{font-family: 'Work Sans', sans-serif; font-weight: 300;}
.vertical-line{width: 2px; background-color: #935c8b; height: 22.5rem; float: left; margin-right: 1rem;}
.logo{margin-left: 10rem; margin-top: 1rem;}


/*INICIO FOOTER*/
footer{bottom:0; background: #e5aec1; color: #935c8b; font-size: 0.8rem; padding: 1rem;}
    





/*PANTALLA GRANDE*/

@media screen and (min-width: 48rem){
    
    
/*INICIO HEADER*/
header{height: 500px; background-image: url("https://wallpaperaccess.com/full/864178.jpg");}

header h1{margin-top: 3rem; font-family: 'Work Sans', sans-serif; font-weight: 600; font-size: 2rem;}
    
/*IMÁGEN*/    
img{height: 16rem; width: 16rem;}

/*INICIO NAV*/
nav{height: 80px;}
nav ul li{margin: 1rem;}
nav ul li a{position: relative; font-size: 1.3rem; font-family: 'Work Sans', sans-serif; font-weight: 400;}


/*INICIO MAIN*/
section{margin: 1rem;}
.titulos{letter-spacing: 3px; padding: 1rem; line-height: 2rem;}
.titulos h2{font-family: 'Work Sans', sans-serif; font-weight: 400;}
.titulos p{color: #e5aec1; font-family: 'Work Sans', sans-serif; font-weight: 400;}


/*MATERIAS*/
.contenedor{display: flex; justify-content:space-around; text-align: center; flex-direction: row; align-items: center;}
.marco{width: 12rem; height: 15rem;}
.materias{font-family: 'Work Sans', sans-serif; font-weight: 300;}
.nivel{font-family: 'Work Sans', sans-serif; font-weight: 400; line-height: 2rem; margin-top: 1rem;}
.cursando{margin-top: 0,5rem; font-family:  'Work Sans', sans-serif; font-weight: 300;}


/*INICIO ASIDE*/    
.datos p{font-family: 'Work Sans', sans-serif; font-weight: 300;}
.vertical-line{width: 2px; background-color: #935c8b; height: 21rem; float: left; margin-right: 1rem;}
.logo{margin-left: 35%; margin-bottom: 3%; width: 200px; height: 200px; display: inline-block;}


    }
        



