@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');


h1 {font-weight: 700;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}
h2 {font-weight: 400;color: rgb(0, 0, 36);font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}
h3 {font-weight: 300;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}


.grilla {
display: grid;
gap: 2em;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: 0.6fr 1fr 1fr 0.2fr;
}

/*sector grilla web*/

.primero {text-align: center;
grid-column: 2/5;
grid-row: 1}

.lateral {
    grid-row: 1/5;}

.carreras {
    grid-row: 2/4;
    grid-column: 2/5;}

.footer {
    grid-row: 4;
    grid-column: 2/5;
}

/*sector grilla web*/

.primero {display: flex;
flex-direction: row;
justify-content: center;}

.myname {text-align: left; margin-left: 5%;align-content: center;align-items: center;padding-top: 10%;}
.mifoto {border-radius: 50%;box-shadow: 5px 5px 5px rgba(0, 0, 36, 0.445);}


.lateral {
    background-color: rgba(223, 209, 209, 0.493);
    box-shadow: 5px 5px 5px rgba(0, 0, 36, 0.445);
}


.legales {
    font-size: 65%;
    opacity: 65%;
    margin: 40px;

}

.fadu {margin-top: 100px;margin: 40px;}
.ocampo {margin-bottom: -60px;}

.textolate {margin: 40px;}

.box {display: flex;
flex-direction: row;
flex-wrap: wrap;}



footer p{font-style: italic;font-size: 0.8rem;color: rgba(0, 0, 36, 0.400);}
.light {color: rgba(0, 0, 36, 0.445);}
.team:hover {font-size: 1.5rem;color: rgb(0, 0, 36)}


.dis {padding: 5px;
    margin-top: 10px; 
    margin-bottom: 10px;
    border-bottom: 4px solid rgb(0, 0, 36);}
    
.equipo {display: flex;justify-content: space-around;}
.eq {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    margin-top: 90px;
}

.niveles {
    margin: 20px;
    padding: 30px;
    border-radius: 5%;
    box-shadow: 5px 5px 5px gainsboro;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.completo {
    margin: 20px;
    padding: 30px;
    border-radius: 5%;
    box-shadow: 5px 5px 5px green;
    width: fit-content;
    color: green;
}
.link {text-decoration: none;color: rgb(39, 38, 38);font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;margin-top: 2rem;}
.link:hover {font-size: 1.3rem;color: rgba(0, 0, 36, 0.445);}



@media (max-width:576px){


/*sector grilla mobile*/

.grilla {
    display: grid;
    grid-column: 1fr;
    grid-template-rows: 0.2fr 1fr 1fr 0.1fr;
    }
    
    
    .primero {display: flex;
        flex-direction: column;
        justify-content: center;
        grid-column: 1/5;
    grid-row: 1;
    width: 150px;}
    

    .lateral {
        grid-column: 1/5;
        grid-row: 3;
        justify-content: center;
        align-content: center;
        text-align: center;}
    
    .carreras {
        margin: 20px;
        grid-column: 1/5;
        grid-row: 2;
}
    
    .footer {
        grid-column: 1/5;
        grid-row: 4;
;
    }

    
    /*sector grilla mobile*/

.mifoto {width: 200px; height: 200px;justify-content: center;align-content: center;grid-template-columns: 1/5;margin-top: 40px;margin-left: 70px;}
.myname {margin-left: 70px;text-size-adjust: 50%;}


}