@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Display:ital,wght@0,100..900;1,100..900&display=swap');
*{margin: o; 
padding:0;
font-family: 'Noto Sans Display';
}

header{
     width: 100%;
      height: 10rem;}

section{
     width: 100%; 
     height: 20rem; 
     display: flex; 
     justify-content: space-around;}

    main{
        background: url("../img/IMG_20190426_155530151.jpg");
        
    }
section article{
    width: 10%; 
    height: 20rem; 
}

section aside{
    width: 25%; 
    height: 20rem; 
    text-align: center; 
    background: #1d5ca5}

body{
    background-color: #1d5ca5;
    text-align: center;
    justify-content: center;
    align-items: center;
}
img{
    margin: 1rem 0 0 0;
    width: 25%;
    justify-content: center;
    border-radius: 100%;
    border: 1rem solid #333;
    box-shadow: 8px 8px 25px #00000080;
}

nav ul li a {
text-decoration: none;
text-align: center;
padding: 0.5rem;
}

h1{
    color: #fd9711;
    font-size: 4rem;
    padding: 2rem;

}
h2{
    font-size: 2rem;
        color: #f78e2d;
        margin: 1rem 0rem 1rem 0rem;
}
h3{
    padding: 0.5rem;
    border-radius: 2rem;
    margin: 1rem;
}
nav{
	max-width: 100%;
	margin: auto;
	background-color: #333;
	font-size: 1.1rem;
}

a {
    color: rgb(255, 255, 255);
    font-size: medium;
    font-weight: 200;
}

.nivel{
    padding: 1.5rem;
    color: rgb(255, 255, 255);
}

footer{
    background-color: black;
    color: #ffffff;
    height: 100%rem;
}
footer p{
padding: 1rem;
}

.integrantes{
    list-style: none;
	display: flex;
	justify-content: space-around;
    background-color: #333;
}
.integrantes li a{
    display: block;
	padding: 15px 20px;
	color: white;
	text-decoration: none;
}

.datos{
    padding: 1.5rem;
    display: flex;

}
.academicos2{
padding: 30px;
    list-style: none;
    text-align: left;
    width: 30%;
}
.titulo{
    padding-top: 10px;
    margin-top: 10px;
    font-weight: bold;
}
.materias{
    border-radius: 3%;
    color: #ffffff;
    padding: 0 0 30px 0;
    font-size: larger;
    }

@media (max-width: 695px) {
    body {
        position: relative;
    }
    
header{
 width: 100%;
 height: 10%;
}
h1{
 font-size: 30px;
 padding: 1rem;
}
h2{
    font-size: 23px;
}
h3{
    margin: 0px;
}
    img{
        width:70%;
    }

    section aside{
        margin-top: 1rem;
        margin: 0auto;
        padding: 1rem;
        width: 100%;
        height: 80%;
        color:aliceblue;
        border-radius: 0.5rem 1.5rem;
        flex-wrap: wrap;
    }

    section article {
        width: 60%;
        height: auto;
        display: block;
    }

    
    section {
        width: 100%;
        height: 100%;
        display: block;
    }

    footer {
        bottom: 0;
        left: 0;
        width: 100%;
        min-height: 10rem;
    }
    .integrantes li a{
    font-size: 14px;
    padding: 15px 5px;
    }
.datos{
    flex-wrap: wrap;
    width: 100%;
}
.academicos2{
    width:100%
}
    p{
        font-size: 12px;
    }
    footer{
        background-color: black;
    }

    }