@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700;800&display=swap');

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

/* Estilos generales */

body {font-family: Poppins;}

header {color: #F2D1C6; background: #3E474B; padding: 1rem;}


/* Menu */
header{ background:#3E474B; padding: 3rem; text-align: center}
header ul li{ display: inline-block; list-style-type: none;}
header ul li a{ color: #fff; text-decoration: none;  padding: 1rem; }


.datos-personales { border-radius: 50%; padding: 1rem; margin-top: 1rem; text-align: center}
.foto { border-radius: 50%; padding: 1rem; margin-top: 1rem;}
.nombre{padding: 1rem; color: #5888C8;}
.materias-aprobadas {margin-bottom: 1rem;}



.columna-1{ background: #F6F0EC; padding: 2rem; color: #3E474B; text-align: center}
.columna-2{ background: #F2D1C6; padding: 2rem; width: 100%; font-size: 1rem;; color: #3E474B; text-align: center}
.columna-3{ background: #5888C8;  padding: 2rem; color: floralwhite; width: 100%; font-size: 1rem; text-align: center}


main { font-size: 1rem; color: #171753;}

footer {color: #000000; background: #ff9c78; padding: 1rem;}
footer p{ font-size: 0.7rem; color: #3E474B;}


@media screen and (min-width:48rem) {
    
.datos-universidad-catedra {display: flex; justify-content: space-between; text-align: left}

.columna-1{ background: #F6F0EC; padding: 2rem; color: #3E474B;
display: flex; justify-content: center; align-items: center;}

.columna-2{ background: #F2D1C6; padding: 2rem; width: 100%; font-size: 1rem; color: #3E474B; text-align: center}
.columna-3{ background: #5888C8;  padding: 2rem; color: floralwhite; width: 100%; font-size: 1rem; text-align: center}


.columna-1 div {padding: 2rem;}

main h3{margin: auto;}

main { font-size: 1rem; color: #171753;}

footer {color: #000000; background: #ff9c78; padding: 1rem;}
footer p{ font-size: 0.7rem; color: #3E474B;}

    
    header{ background:#3E474B; padding: 3rem; text-align: left}
    header ul li{ display: inline-block; list-style-type: none; float: right}
    header ul li a{ color: #fff; text-decoration: none;  padding: 1rem; }
    
    article class datos-personales { border-radius: 50%; padding: 1rem; margin-top: 1rem;}
    .foto { border-radius: 50%; padding: 1rem; margin-top: 1rem;}
    .nombre{padding: 1rem; color: #5888C8;}
    
    
    
    }
