body{
    font-family: sans-serif;
    font-size: 1.4rem;
    margin: 0%;
    padding: 0%;
    color: #13005A;
    background: radial-gradient(circle, #ffffff 0.5%, #c0dcfd 100%);
}
p{
 font-family: "Merriweather sans";   
}
h1{
    font-family: Inter;
    filter: drop-shadow(0px 0px 0.2px rgba(0,0,0,0.5));
}
header{
    font-size: 0.5rem;
}

nav{
    font-size: 1rem;
    margin-right: 2%;
    margin-left: 2%;
    display: grid;
    grid-template-columns: 1vh 1fr;
}
main{
    opacity: 1;
    min-height: 140vh;
    margin: 0 2.5%;
    display: flex;
    gap: 1;
}

aside{
    display: flex;
    align-items: center;
    align-content:end;
    margin: 0 5%;
}

#navButtons{
    display: flex;
    justify-content: end;
    align-items: center;
}
.navButton{
   margin-left: 1%;
   margin-right: 1%;
   text-decoration: none;
   color: #13005A;
   align-items: center;
   font-family: Inter;
}
#logo{
    display: flex;
    justify-content: start;
    text-align: end;
}
.redes{
    max-width: 80vh;
}
.redes a{
    color: #13005A;
}
.imgs{
    width: 60px;
    height: 60px;
}
.imga{
    display: inline-flex; 
    align-items: center; 
    gap: 1vh;           
}
@keyframes fade-in {
    from{
        opacity: 0;
    }
    to {
       opacity: 1;
    }
}

main, aside{
    opacity: 0;
    animation: fade-in 0.5s ease forwards;
}
@media (max-width: 768px) {

    main {
        display: flex;
        flex-direction: column; 
        align-items: center;    
        text-align: center;     
        gap: 4vh;               
    }

    aside {
        margin: 0; 
        justify-content: center; 
        width: 100%;             
    }

    nav {
        grid-template-columns: 1fr;
        gap: 2vh; 
        margin-top: 2vh;
    }

    #logo {
        justify-content: center;
    }

    #navButtons {
        justify-content: center;
        flex-wrap: wrap; 
        gap: 2vh;
    }

    .navButton {
        font-size: 1.2rem;
        margin: 0 2%;
    }
    iframe{
        width: 40vh;
        height: 35vh;
        margin-bottom: 2vh;
    }
  
}