@import url ('https://fonts.googleapis.com/css2? family = Montserrat: wght @ 300 & display = swap');@import url ('https://fonts.googleapis.com/css2? family = Work + Sans: wght @ 200 & display = swap');
*{ padding: 0; margin: 0; box-sizing: border-box; transition: 0.5s all}
*{list-style-type: none;}

body {font-family: 'Work Sans', sans-serif; background-color: #ffffff;}
header {background-color: #10776b; ; font-family:'Work Sans', sans-serif; background-image: url("https://wallpaperaccess.com/full/734355.jpg" ); padding: 8rem; text-align:center; font-size: 30px; text-shadow:3px 3px 5px #1a1a1a }
.belen {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
.lucasa {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
.lucasb {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
img {margin-left: 16rem; padding: 2rem}


/* Menu */
nav{background-color: #2f2f2f; text-align: center; flex-wrap: wrap; }
nav ul li {display: inline-block; }
nav ul li a {color:#ffffff; text-decoration: none; padding: 10px;}
nav ul li a:hover{background-color: #4bc6b8}
a {font-size: 20px; display: inline-block; color: #10776b; margin-left: 15px }
.adesso {font-size: 18px;}
.amadori {font-size: 17px; margin-left: 5px}
.bartomeo {font-size: 16px; margin-left: 5px}
li{line-height: 45px; padding 90px}
.navegacion {padding: 5px}
.link-activo {background: #868686; }
h1 {font-family: 'Work Sans', sans-serif; color: white; }
h2 {font-size: 25px; color: #776552; margin-bottom: 0.5rem; letter-spacing: 2.5px; font-family:'Work Sans', sans-serif; 
    text-shadow: 4 4 4 4 #000000}
h3 {padding: 5px;  background-color: #bfa488; color: white; text-align: center}
h4 {font-size:1.5rem; padding: 4rem; line-height: 30px; color: #454545; margin:10px 40px;}
i {color: #ff8617;}
.datos {font-size: 20px}
.fa-check {color: #003900}


article p {font-family: 'Work Sans', sans-serif; font-weight: 200; font-size: 1rem; margin-bottom: 1rem; color:#ffffff}
p {padding:5px; display: inline-block; line-height: 45px; text-align: center; color:#ffffff}
h5 {padding:12px; display: inline-block; text-align: center; 
    line-height: 35px; color:#ffffff; font-size: 15px}
strong {font-size: 20px}
section, article {background:#a3a3a3; padding: 0.5rem; font-family:'Work Sans', sans-serif}

.inicio {display: flex; justify-content: space-between;}
.columna-1 {width: 33%; margin-top: none; padding: 30px; background-color: #cbcbcb; padding: 80px}
.columna-2 {width: 33%; margin-top: none; padding: 30px; background-color: #cbcbcb; padding: 80px}
.columna-3 {width: 33%; margin-top: none; padding: 30px; background-color: #cbcbcb; padding: 80px}
.docentes{ margin-top: none; width: 40%; padding: 30px; background-color: #717171; line-height: 40px;}

aside{display: inline-block; padding: 25px}


footer{ padding: 5px; background: #262626; font-weight: 200px}
footer p {font-size: 10px; ; margin-left: 30px; text-align:center; font-family: 'Montserrat', sans-serif;}
.pie {color: white}


.marginado {padding:20px ; font-size: 1.25rem}
.titulo {padding:20px; color: #dbdbdb; background-color: #868686}
.primero{padding:20px; color: #dbdbdb; background-color: #868686}
.segundo{padding:20px; color: #dbdbdb; background-color: #868686}
.tercero{padding:20px; color: #dbdbdb; background-color: #868686}

@media screen and (max-width:90rem) {
    
    header {padding: 5rem; text-align: center; background-size: auto}
    h1 { font-size: 3rem}
    nav{background-color: #2f2f2f; text-align: center;}
    nav ul li {display: inline-table}
    nav ul li a{color:#ffffff; text-decoration: none; padding: 5px;}
    a {font-size: 18px; display: block}
    .adesso {font-size: 18px;}
    .amadori {font-size: 18px;}
    .bartomeo {font-size: 18px}
    .belen {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
    .belen:hover {color: #000000}
    .lucasa {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
    .lucasb {margin: 20px; padding: 0px; border: 5px solid #10776b; width:170px;height:170px;
        border-radius: 100%; line-height: 10px; box-shadow: 0px 1px 14px 3px rgba(41,27,6,0.30);}
    article { margin-bottom: 5px}
    .link-activo {padding:5px; font-family: 'Montserrat', sans-serif; }
    section{padding: 1rem; text-align: center}
    .inicio {display: block; justify-content: space-between; margin: auto}
    .columna-1 {width: 90%; font-size: 15px; padding: 1px; margin-left: 20px}
    .columna-2 {width: 90%; font-size: 15px; padding: 1px;  margin-left: 20px}
    .columna-3 {width: 90%; font-size: 15px; padding: 1px;  margin-left: 20px}
    .docentes {width: 90%; font-size: 10px; padding: 1px;  margin-left: 20px}
    img {margin-left: 5px; padding: 2rem width: 100%; height: 100%}
    
    

    
    
    p {font-size: 5px; line-height: 20px}
    
    
}

@media screen and (max-width:50rem) {
    header {padding: 4rem; text-align: center; background-size: auto}
    h1 { font-size: 2rem}
    nav{background-color: #2f2f2f; text-align: center;}
    nav ul li {display: inline-table}
    nav ul li a{color:#ffffff; text-decoration: none; padding: 5px;}
    a {font-size: 18px; display: block}
    article { margin-bottom: 5px}
    .link-activo {padding:5px; font-family: 'Montserrat', sans-serif; }
    section{padding: 1rem; text-align: center}
    .inicio {display: block; justify-content: space-between; margin: auto}
    .columna-1 {width: 90%; font-size: 15px; padding: 1px; margin-left: 20px}
    .columna-2 {width: 90%; font-size: 15px; padding: 1px;  margin-left: 20px}
    .columna-3 {width: 90%; font-size: 15px; padding: 1px;  margin-left: 20px}
    .docentes {width: 90%; font-size: 10px; padding: 1px;  margin-left: 20px}
    img {padding: 5px; width: 100%; height: 100%}