@import url('https://fonts.googleapis.com/css?family=Catamaran:300,400|Hind+Madurai:400,600');
@import url('https://fonts.googleapis.com/css?family=Nunito');

*{ margin: 0; padding: 0;  box-sizing: border-box; max-width: 1920px; margin: auto;}

/***********/
/* General */
/***********/

body{}
header {display: flex; position: relative; background: url(../img/bg%20gif.gif); background-size: cover; background-repeat: no-repeat; background-position: center;}
img {height: 300px; width: 300px; justify-content: flex-end; border-radius: 9rem; padding: 0rem }
h1 {font-family: 'Nunito', sans-serif; padding: 4rem; text-align: center; color: #fff; font-size: 3rem; }
h2{font-family: 'Hind Madurai', sans-serif; font-weight: 200;padding: 2rem; text-align: center;}
.carrera {color: white; background: #3C2470;}
.materia {width: 25%;}
section {display: flex; color: white; font-family: 'Catamaran', sans-serif;letter-spacing: 0.8pt; width: 100%; height: auto; padding: 11rem 1rem; justify-content: space-between; /*background: #e3e3e3;*/; background: url(../img/bg.jpg); background-size: cover; background-repeat: no-repeat;}
section article {display: inline-block; flex-wrap: wrap; text-align: center; justify-content:top; padding: 1rem; width:25%; height: 50%; max-height: 100%; font-size: 2vw; }
section article h3 {font-weight: 400; text-align: center; padding: 0.5 rem; font-size: 1.6rem;}
section article h4 {font-size: 60%; font-weight: 200;}
div.volver {text-align: center; padding: 1rem; }
div.volver a {text-decoration: none; color: #521189; font-family: Helvetica; }
footer {padding: 1rem; font-family: Helvetica; font-style: italic; text-align: center; width: auto; height: auto;}


@media only screen and (max-width: 768px)
{
header {display: block; position: relative; background: url(../img/bg%20gif.gif); background-size: cover; background-repeat: no-repeat; background-position: center; justify-content: center;}

h1 {font-family: 'Nunito', sans-serif; padding: 4rem; text-align: center; color: #fff; font-size: 3rem; }   
img {height: 300px; width: 300px; justify-content: center; border-radius: 9rem; padding: 0rem }
section {display: block;}
section article {display: block;}

}

/***********/
/* Navegación */
/***********/
nav {background: grey; text-align: center; }
nav ul li{ display: inline-block;padding: 1rem;text-align: center;list-style-type: none;}
nav ul li a {text-decoration: none; color: #fff; }



/*************/