* {margin: 0}

html {font-size: 16px}
header {text-align: center; 
    background-image: url(../img/fondo.jpg); 
    background-size: cover;
    background-position: center;
    align-content: center; width: 100%;}

body{
    background-color: blanchedalmond;
    color: deeppink;
    font-family: sans-serif; line-height: 1rem;}

h1{font-size: 3rem; margin: 2rem; color:#fff; text-align: center; line-height: 2.5rem;
@import url(<link href="https://fonts.googleapis.com/css?family=Crete+Round" rel="stylesheet">); font-family: 'Crete Round', serif; }

h2{color:#fff; font-size: 1.5rem; background: #ea96c3; text-align: center; padding: 0.5rem 1rem 0.5rem 1rem; line-height: 1.5rem; @import url(<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">); font-family: 'Poiret One', cursive;}

.destacado{color: #ea96c3; font-weight: 700}

ul{text-align: center}
ul li {list-style-type: none; display: inline-block}
ul li a {color:#fff; text-decoration: none; font-size: 1rem; font-weight:bold; background: #ea96c3; border:0.1rem solid blanchedalmond; font-weight: normal; display: inline-block; padding: 0.5rem 1rem 0.5rem 1rem;}
ul li a:hover {text-decoration: none; font-weight: normal; color: #a7107e; border-bottom-color: #a7107e; border-color: #a7107e; border-left-color: #a7107e}
h3{font-size: 1.2rem; box-sizing: border-box; margin: 0.2rem; color:#a20d5e; line-height: 1rem; display: inline-block; padding: 0.5rem 1rem 0.5rem 1rem; background: pink; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; align-content: center; line-height: 1.2rem}
.destacado{color: #eb0883; font-weight: 700; {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: stretch;
}
@import url(<link href="https://fonts.googleapis.com/css?family=Handlee" rel="stylesheet">); font-family: 'Handlee', cursive;}
.materias {justify-content: center; text-align: center; width: 100%; display: flex; margin-top: 1rem; line-height: 0.2rem;}
img {border-radius: 1rem; margin: 2rem; box-shadow: 0.2rem;}
.primero p {line-height: 1.5rem;}
.segundo p {line-height: 1.5rem;}
.tercero p {line-height: 1.5rem;}
.trabajo {padding: 0rem 0rem 0.2rem 0rem; margin-top: 1rem}
.alumnos {padding: 0rem 0rem 0.2rem 0rem;}
footer {font-size: 0.7rem; margin-top:4rem; margin-left: 0.2rem; margin-right: 0.2rem; font-style: italic; text-align: center; align-content: center; margin-bottom: 0.5rem;}
.app {font-size: 1rem;}


@media (max-width:540px){
    .materias {flex-direction: column}
}