body {
    background-color: #FAFAFC;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: space-between;
    color: #fff;
    text-align: center;
    width: 100%;
    font-family: "Titillium Web", sans-serif;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}


header {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    flex-wrap: wrap;
    height: 4vh;
}
.btn-header {
    color: #fff;
    background-color: #18396C;
    padding: 3% 10%;
}
.btn-header {
    background-color: #031941;
}

nav.navbar {
    display: flex;
    justify-content: space-between;
    width: 100%;
    background-color: #16458D;
    padding: 1% 5%;
    height:6vh;
}

.main-content {
    min-height: 90vh;
    height: fit-content;
    display: flex;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    align-content: flex-start;
}

.home {
    background-image: url(../images/Fondo_85Aniversario_2.jpg);
    width: 100%;
    min-height: 91vh;
    background-size: cover;
    background-position: bottom;
    color: #0F4F9B;
    display: flex;
    justify-content: center;
}


.contenedor {
    width: 40%;
    height: fit-content;
    border-radius: 5px;
    color: #0F4F9B;
    padding: 2%;
    margin-top: 5%;
}
.contenedor-2{
    margin: -20%;
}

.centrar {
    align-content: center;
    width: 35%;
    height: 100%;
}


.titular {
    width: 100%;
    font-size: 2.5rem;
    font-weight: bold;
    margin: 8% 0 0 0;
    color: #001E55;
}

h1 {
    font-size: 28px;
    font-weight: bold;
    color: #001E55;
}
.lead {
    font-size: medium;
    width:60%;
    justify-self: center;
    margin: 3%;
}

.btn-link {
    text-decoration: none;
    font-size: small;
    padding: 0 .5%;
}
.titular-2 {
    text-align: center;
    font-size: 36px;
    color: #16458D;
    margin-top: 2%;
}


footer {
    width: 100%;
    align-self: flex-end;
    background-color: #16458D;
    height: fit-content;
    padding: 1%;
}





.horizontal-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;    
}

.linkSitio {
    width: 15%;
    margin: 0 1%;
    padding: 2% 1%;
    opacity: .8;
    border-radius: 10px;
}

    .linkSitio:hover {
        opacity: 1;
        transform: scale(1.1);
    }

img.logo-img.footer-img {
    width: 75%;
    height: 75%;
    object-fit: contain;
}





.footer-links {
    margin-top: 8%;
    display: flex;
    justify-content: center;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
}


p {
    font-size: small;
    margin: 0;
}

label {
    color: #0F4F9B;
    font-weight: bold;
    margin-left: 0;
    margin-bottom: 3px;
    font-size: 12px;
    font-weight: 600;
}
.form-control{
    font-size: 12px;
}
.full{
    width:100%;
}

element.style {
    width: 100%;
}

.contenedor-contraseņa {
    width: 100% ;
    text-align: left;
    margin: 8% 0 0 0;
}
.align-left {
    text-align: left;
    margin: 4% 0;
}
.nav-link.active {
    background-color: #0F4F9B !important;
    color: #fff !important;
    font-size: 12px;
    font-weight: 600;
}

.nav-link {
    color: #0F4F9B;
    font-size: 12px;
}
.form-group {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-bottom: 2% !important;
}
.grupo-botones{
    display:flex;
    margin: 5% 0;
}
.grupo-botones .btn-primary {
    margin-right: 3%;
}

.btn-primary {
    padding: 8px 16px;
    font-size: 12px;
    border-radius: 5px;
    border: none;
    background-color: #16458D;
    color: #fff;
}
.btn-primary:hover {
    background-color: #18396C;
}
.btn-secondary {
    padding: 8px 16px;
    font-size: 12px;
    border-radius: 5px;
    border: none;
    border: solid 1px #16458D;
    color: #16458D;
    background-color: #F4F7FA;
}
    .btn-secondary:hover {
        background-color: #fff;
        color: #16458D;
    }


ul#recoveryTabs {
    display: flex;
    flex-direction: row;
    width: 100%;
}

@media (max-width: 1024px) {
    h1{
        font-size: 26px;
    }
    .grupo-botones .btn-primary, .nav-link.active, label, .form-control, .btn-secondary, .btn-secondary, .nav-tabs .nav-link {
        font-size: 11px;
    }
    .mt-4 {
        margin-top: 3% !important;
    }
}


    @media (max-width: 769px) {

        .contenedor_contraseņa {
            width: 80%;
        }

        h1 {
            font-size: 2rem;
            margin-bottom: 4%;
        }

        .linkSitio {
            width: 34%;
            margin: 0 1%;
        }

        .contenedor {
            width: 60%;
        }

        .nav-link {
            width: 100%;
        }

            .nav-link.active {
                width: 100%;
            }
        .lead {
            padding: 0 3%;
        }
    }

    @media (max-width: 426px) {
        .main-content{
            width: 80%;
        }
        .contenedor-contraseņa {
            width: 80%;
        }

        h1 {
            font-size: 1.9rem;
            margin-bottom: 6%;
        }

        .grupo-botones {
            margin: 8% 0;
        }
    }