@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,400;0,600;1,200;1,600&display=swap');

*{padding: 0; margin: 0; box-sizing: border-box;transition: 1s all;}

/* Estilos Generales */
body {
    font-family: 'Poppins', sans-serif;
    font-weight: 200; 
    font-size: 1rem;
}

header {
    color: rgb(255, 255, 255); 
    background: #2a2a60; 
    padding: 1rem; 
    text-align: center;
}

header h1 {
    font-family: 'Poppins', sans-serif; 
    font-weight: 600; 
    font-size: 1.5rem;
}

header h2 {
    font-family: 'Poppins', sans-serif; 
    font-weight: 200; 
    font-style: italic; 
    font-size: 1rem; 
}

main section article {
    padding: 1rem;
}

main section article {
    background: #8d88fc; 
    text-align: center; 
    padding: 1rem; 
}

h3 {
    font-family: 'Poppins', sans-serif; 
    font-weight: 600;  
    padding: 1rem;
    font-size: 1rem;
}

h4 {
    font-family: 'Poppins', sans-serif; 
    font-weight: 600; 
    padding: 1rem;
    font-size: 1.3rem;
    font-style: italic;
}

h5 {
    font-family: 'Poppins', sans-serif; 
    font-weight: 600; 
    font-size: 1.3rem;
    font-style: italic;
}

div {
    display: block;
}




.inicio {
  background:#8d88fc;  
}

.imagem {
    border-radius: 2rem;
}

.titulo {
    text-align: center;
    color: white;
}

.materia {
    font-family: 'Poppins', sans-serif; 
    font-weight: 600; 
    font-size: 1.8rem;
}

.subtitulo {
    font-family: 'Poppins', sans-serif; 
    font-weight: 400;
    font-style: italic;
    font-size: 1rem;  
}

.navegador {
    width: 100%;
}

.materias-aprobadas { 
    width: 100%;
    text-align: center;
    font-family: 'Poppins', sans-serif; 
    font-weight: 400; 
}

.materias-en-curso {
    width: 100%;
    text-align: center;
    font-family: 'Poppins', sans-serif; 
    font-weight: 400;
}


footer {
    font-size: 0.8rem; 
    color: rgb(255, 255, 255); 
    background: #1f1f48; 
    padding: 1rem; 
    text-align: center;
}

/* Menu */ 

img {
    height: 7rem;
    width: 10rem;
    border-radius: 100%;
}

nav { 
    background:rgb(131, 244, 217); 
    text-align: center; 
    border-radius: 2rem;
    height: 40px;
}

nav ul li{ 
    font-family: 'Poppins', sans-serif; 
    font-weight: 600; 
    display: inline-block; 
    font-size: 2,5rem; 
    padding: 7px 7px 7px 7px;
}

nav ul li a{ 
    color: rgb(255, 255, 255); 
    text-decoration: none; 
    padding: 10px 10px 10px 10px;
}

.link-activo {
    background:rgb(20, 154, 122);
    border-radius: 2rem;
    padding: 7px 7px 7px 7px;
}



/* CUANDO ES MAYOR A 768PX */

@media screen and (min-width:48rem) { 

        .inicio {
            display: flex;
        }
    
        .imagen {
            background:#8d88fc; 
            width: 33,5%;
        }
    
        .materias-aprobadas {
            background:#8d88fc; 
            width: 33,5%;
        }
    
        .materias-en-curso {
            background:#8d88fc; 
            width: 33,5%;
        }

}