html{font-size: 16px;}
*{margin: 0; padding: 0;}
*{box-sizing: border-box}
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700');

body{background: #2c365d; font-family: Raleway; font-weight: 300}
h1 {color: #ff5e3a; padding: 10rem 1rem 1rem 1rem; font-size: 3rem; font-weight: 700; text-align: center}
h2 {color: #fff; margin: 2.5rem ; font-size: 2rem; text-align: center;}
h3 {color: #fff; margin: 1rem;}

nav ul li{list-style-type: none; margin:1rem 0.5rem 4rem 0rem; float:right; }
nav ul li a{ color: #f5f5f5; text-decoration: none; font-size: 1rem; background: #2c365d; padding: 0.6rem;}
nav ul li a:hover{ background: #2c365d; color: #ff5e3a}

.perfil{border-radius: 50%;
    display: flex; margin: auto;
    border: #ff5e3a 0.5rem solid;
}

.materias{
    display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: stretch;
	align-content: stretch;
}

li{ color: white;
    margin: 0.1rem 2rem
}

p{
    margin:1rem 0rem 0rem 0rem; 
    padding: 1rem; 
    font-size: 0.75rem; 
    background: #f2f2f0;
}

footer{
    margin: 3.5rem 0rem 0rem 0rem;
}


@media (max-width:520px) {
    .materias {display: list-item; }
    }