@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap');

*{margin: 0; padding: 0; box-sizing: border-box}


body{ background-color: #fbfbfb; color: #18191f; font-family: 'Inter', sans-serif;}

a {text-decoration: none;}

h1{font-family: 'Montserrat', serif; font-size: 2.3em; font-family: 900;}
h3{font-family: 'Montserrat', serif; font-size: 2em; font-family: 700; margin: 1em;}

header {color: #18191f; background: #ffc5ae; padding: 2rem; display: flex; justify-content: space-between;}

nav {background: #ffc5ae; padding: 1rem;}
nav ul li {display: inline-block; padding-left: 2rem;}
nav ul li a {color: #00c6ae; font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 1rem;  padding: 4px 16px 4px 16px; background: #FFFFFF; border: 2px solid #00c6ae; box-shadow: 0px 2px 0px #00c6ae; border-radius: 15px; height: 25; width: 90px;}     

nav ul li a:hover {color: #18191f; background: #FFFFFF; border: 2px solid #18191f; box-shadow: 0px 2px 0px #18191f }

.container {
	/*display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
    align-content: center;*/
    margin-left: 1rem;
} 

.contenedor {width: 100%}
.eugenia {margin-top: 6%; position: relative;margin-left: 30%;}
.alum {font-family: "Montserrat"; font-weight: 500; letter-spacing: 2px; position: absolute; top: 90px; left: 150px; }
.eugenom {font-family: "Montserrat"; font-weight: 800; letter-spacing: 2px; color: #00c6ae; font-size: 300%; position: absolute; top: 100px; left: +150px;}
.carrerita {font-family: "Montserrat"; font-weight: 500; letter-spacing: 2px; position: absolute; top: 160px; left: 210px; }

.title {font-family: 'Montserrat', serif; font-size: 20px; font-weight: 500; letter-spacing: 1px; padding-bottom: 1rem;}

article ul { list-style-type: none; padding-left: 0px;}

.carrera { margin-top: 5%;margin-left: 10%;
    display: flex; flex-direction: row; justify-content: center; 
}
.carrera article{margin-right: 10%;}

div .companeros {margin-top: 5%; display: flex; flex-direction: row; justify-content: center;}	
.companeros ul li  {display: inline-block;}     
div ul li {padding-left: 2rem; }
div ul li a {color: #18191f; font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 10pxrem;  padding: 4px 16px 4px 16px; background: #FFFFFF; border: 2px solid #18191f; box-shadow: 0px 2px 0px #18191f; border-radius: 15px; height: 25; width: 90px;}     

div ul li a:hover {color: #00c6ae; background: #FFFFFF; border: 2px solid #00c6ae; box-shadow: 0px 2px 0px #00c6ae }
.compas {font-family: "Montserrat"; font-weight: 800; letter-spacing: 2px; color: #18191f; font-size: 150%; margin-bottom: 15px;}

footer {background-color: #18191f; color: white; text-align: center; font-size: 12px; padding: 2% 15% 2% 15%; margin-top: 5%; font-style: italic}
footer a {color: white; font-style: normal; font-family: 'Inter', sans-serif;}
footer a:hover {color: #ffbd12}

footer p {margin-bottom: 15px;}




@media screen and (max-width: 600px) {


	nav ul li { font-size: 1rem;  margin: 16px 16px 16px 16px; padding: 0px;}     
	.eugenia {margin-left: 1%;}
	.carrera {margin-left: 0%;}
	.alum {top: 0px; left: 120px; }
	.eugenom {top: 0px; left: 100px;}
	.compas {margin-bottom: 20px;}
	.companeros ul li  { margin: 16px 16px 16px 16px; padding: 0px;}     




}