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



header {background: #3630c1; padding: 1rem; text-align: center }
h1 {color: #ffffff; font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: 3rem; margin-bottom: 1rem}
.vn11 {color: white; font-size: 2rem; margin-top: 1rem}
h2 {font-family: 'Montserrat', sans-serif; font-size: 2rem; text-align: center; margin-top: 3rem;
    margin-bottom: 2rem;}
h3 {font-family: 'Montserrat', sans-serif; font-weight: 400; text-align: center}

nav {background:#130d88; padding: 1rem; color:white; text-align: center; }
nav a{color:white; display:inline-block; text-decoration: none; padding:1rem;}



.link-activo-1:hover {background: #040048; border-radius: 3.75rem}
.link-activo-2:hover {background: #040048; border-radius: 3.75rem}
.link-activo-3:hover {background: #040048; border-radius: 3.75rem}
.link-activo-4:hover {background: #040048; border-radius: 3.75rem}
.link-activo-5:hover {background: #040048; border-radius: 3.75rem}
.link-activo-6:hover {background: #040048; border-radius: 3.75rem}



header img { border-radius: 50%; border: 1px solid #ffffff}

.inicio{display: flex; justify-content: center;}
.columna-1 {width: 30%; text-align: center}
.columna-2 {width: 30%; text-align: center}
.columna-3 {width: 30%; text-align: center}

.integrantes {display: flex; justify-content: center; margin-top: 2rem;
margin-bottom: 3rem;  }

.integrante-1 { text-decoration: none; width: 30%;background-color: #040048; padding: 1rem 1rem 1rem 1rem;border-radius: 3.75rem;color: white;margin-left: 2rem; margin-right: 1rem}
.integrante-2 { text-decoration: none; width: 30%; margin-left: 2rem;margin-right: 1rem; background-color: #040048; padding: 1rem 1rem 1rem 1rem;border-radius: 3.75rem;color: white;}


li {font-family: 'Montserrat', sans-serif; font-weight: 400; text-align: left;}


body {background: #fffbf8; font-family: sans-serif;margin:0; padding: 0;}

.ultimobloque {background: #717171; color: white}

.datos {background: #717171; color: white; font-size: 0.8rem; padding: 1rem; display: flex; justify-content: center}
.legal1 {width: 30%; margin-top: 1rem; text-align: center}
.legal2 {width: 30%; margin-top: 1rem; text-align: center}
.legal3 {width: 30%; margin-top: 1rem; text-align: center}

.legal {margin-left: 1rem; margin-right: 2rem; margin-bottom: 3rem; background-color: #717171; padding-bottom: 2rem; color: #ffffff ; font-size: 0.8rem; text-align: center}

@media screen and (max-width: 720px){
    .inicio{display:block;width: 100%;box-sizing: border-box;}
    .columna-1{width: 100%;}
    .columna-1 ul{padding:0;list-style:none;}
    .columna-2{width: 100%;}
    .columna-2 ul{padding:0;list-style:none;}
    .columna-3{width: 100%;}
    .columna-3 ul{padding:0;list-style:none;}
    li { text-align: center; }

    .datos{display:block;width: 100%;box-sizing: border-box;}
    .legal1{width: 100%;}
    .legal1 ul{padding:0;list-style:none;}
    .legal2{width: 100%;}
    .legal2 ul{padding:0;list-style:none;}
    .legal3{width: 100%;}
    .legal3 ul{padding:0;list-style:none;}
}