body,
html {
    font-family: "Montserrat", sans-serif;
    background-color: #0a1431;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #fff;
    scroll-behavior: smooth;


}

/* general */
header {
    display: flex;
    justify-content: space-between;
    padding: 20px;
    background-color: #050c1f;
    height: 20px;
    width: 100%;
    top: 0;
    position: fixed;
    color: #000000;
    z-index: 10010;

}

.container-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;


}

.logo {
    width: 45px;
    height: auto;
}

.container-menu {
    display: flex;
    align-items: center;
    gap: 50px;
    padding: 0 40px;
    color: #dad9d9;


}

.container-icon-menu {
    display: none;
    font-size: 30px;
    cursor: pointer;




}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1.8s ease, transform 1.8s ease;
}

footer {
    margin-top: 40px;
    padding: 25px;
    background-color: #020617;
    font-size: 14px;
    color: #94a3b8;
    text-align: center;

}





.paginas {
    color: inherit;
    text-decoration: none;

}

.paginas:hover {
    color: #797979;

}

/* index */

.inicio {

    display: flex;
    max-width: 100%;
    margin-top: 59px;
    width: 1310px;
    text-align: left;
    height: 582px;

}

.inicio-img {
    background-image: url(fotos/img\ inicio.jpeg);
    width: 2010px;
    max-width: 100%;

}




.inicio-texto {
    max-width: 900px;
    width: 700px;
    margin-left: 39px;

    text-align: left;


}

.inicio-texto h1 {
    max-width: 700px;
    font-size: 5rem;
    text-align: left;
    margin: 0;
    margin-top: 40px;


}

.inicio-texto span {
    color: #3b82f6;
    display: flex;
    font-family: "Caveat", cursive;
    font-size: 90px;
    margin: -30px 0px 60px 180px;


}

.inicio-texto p {
    max-width: 500px;
    font-size: 18px;
    margin-top: -19px;
    color: rgb(209, 209, 209);



}

.btn {
    font-size: 23px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 18px;
    border-radius: 35px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 20px;
    margin-left: 39px;
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;

}

.btn:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-15px) scale(1.01);
    transition: 0.25s;


}

.btn2 {
    font-size: 23px;
    display: inline-block;
    background: linear-gradient(45deg, #3c13ac09, #3e3bf610);
    padding: 18px;
    border-radius: 35px;
    color: #2145e7;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 20px;
    margin-left: 20px;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;

}

.btn2:hover {
    background: linear-gradient(45deg, #02059c, #02389c);
    box-shadow: 0 8px 18px #0205af;
    transform: translateY(-15px) scale(1.01);
    transition: 0.25s;
    color: white;
}

.inicio-familia {

    display: flex;
    max-width: 1310px;
    height: 500px;

    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.inicio-familia h3 {
    font-size: 28px;
    color: #3b82f6;
    margin: 0;

}

.inicio-familia h2 {
    font-size: 36px;
    margin: 0;
    margin-top: 5px;


}

.inicio-familia p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);
    margin-top: 35px;


}

.btn3 {
    font-size: 23px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 18px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 30px;
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;

}

.btn3:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-15px) scale(1.01);
    transition: 0.25s;


}



.inicio-entrenamiento {
    padding: 20px;
    background-color: #05117c3f;
    max-width: 1270px;
    text-align: center;
    text-shadow: 2px 2px 5px black;
    height: 550px;
    justify-content: center;

}

.inicio-entrenamiento h2 {
    font-size: 36px;
    color: #3b82f6;
}

.inicio-entrenamiento h3 {
    font-size: 28px;

}

.inicio-entrenamiento h3 span {
    color: #0762ebc0;


}

.container-entrenamientos {
    display: flex;
    justify-content: center;
    gap: 0px;
    margin-top: 50px;

}

.container-entrenamientos hr {
    background: linear-gradient(45deg, #086ece, #0823637c);
    width: 2px;
    border: none;
    color: #000000;

}

.entrenamiento {

    width: 250px;
    height: 250px;

}

.entrenamiento h3 {
    font-size: 28px;
}

.entrenamiento p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}

.entrenamiento i {
    font-size: 60px;
    color: #085bd8;

}





.inicio-tops {
    height: auto;

    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background-image: url(fotos/fondo.png);



}

.container-top-texto {
    flex-direction: row;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 1300px;
    height: 60px;
}

.container-top-texto h2 {
    font-size: 36px;
    color: #1567e2;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: "Archivo Black", sans-serif;
    margin: 0;


}

.btn4 {
    display: flex;
    font-size: 30px;
    color: #1567e2;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0;
    margin-left: 223px;



    text-decoration: none;
    text-shadow: 0 8px 18px #2726267a;
    transition: 0.25s;
    font-family: "Archivo Black", sans-serif;

}


.btn4:hover {
    text-shadow: 0 8px 18px #0c0ea1d2;

    transition: 0.55s;
}


.container-tops {
    flex-direction: row;
    margin: 0;
    width: 93%;
    height: auto;
    gap: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 30px;


}

.top-1:hover {
    transform: scale(1.06);

}


.top-1 {
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-image: url(https://us.123rf.com/450wm/panychev/panychev1605/panychev160500587/56861640-resumen-de-fondo-azul-oscuro-y-negro-plantilla-de-diseño-telón-de-fondo-con-textura.jpg?ver=6);
    width: 227px;
    height: 340px;
    border-radius: 15px;
    transition: 0.6s;
    background-color: #000000;



}

.numero-top {
    background-color: #0644a0;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: absolute;
    font-family: "Archivo Black", sans-serif;
    font-size: 20px;
    margin-top: -300px;
    margin-left: -180px;
}

.top-1 img {
    width: 190px;
    height: 215px;
}

.top-1 h2 {
    font-size: 36px;
    margin: 0;
    margin-top: 15px;
    color: #1567e2;

}

.top-1 p {
    font-size: 18px;
    font-family: "Archivo Black", sans-serif;

}

.top-1 span {
    color: #1567e2;

}


.inicio-eventos {
    height: 550px;
}

.inicio-eventos h2 {
    color: #3b82f6;
    font-size: 36px;


}


.container-eventos {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 20px;

}

.evento {
    border-radius: 10px;
    background-color: #123b945b;
    width: 400px;
    height: 320px;
    transition: 0.9s;

}

.evento:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.20);
    transform: scale(1.05);


}


.fecha {
    background-color: #0644a0e0;
    width: 60px;
    height: 60px;
    text-align: center;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
    margin-left: 320px;
    margin-top: 10px;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
}


.evento img {
    margin-top: 10px;
    border-radius: 7px;
    width: 380px;

    height: 170px;

}

.evento-img {
    display: flex;
    flex-direction: row;
    justify-content: center;
}


.evento-texto {
    display: flex;
    flex-direction: column;
    text-align: left;

}

.evento-texto h2 {
    font-size: 36px;
    margin: 0;
    color: white;
    margin-left: 12px;
    font-family: "Oswald", sans-serif;
}

.evento-texto p {
    font-size: 18px;
    margin: 0;
    margin-left: 12px;
    margin-top: 5px;
    color: rgba(226, 221, 221, 0.918);

}

.evento-texto span {
    color: #085bd8;

}


.btn5 {
    font-size: 23px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 18px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 30px;
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;

}

.btn5:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-15px) scale(1.01);
    transition: 0.25s;


}


.inicio-ubicación {
    background-color: #030b1f;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: left;
    height: 550px;
    gap: 30px;

}

.container-ubicación-texto {

    height: 400px;
    width: 500px;
}

.container-ubicación-texto i {
    color: #085bd8;

}

.container-ubicación-texto h2 {
    font-size: 36px;
    margin: 0%;
    color: #085bd8;


}

.container-ubicación-texto h3 {
    font-size: 28px;
    margin-top: 65px;

}

.container-ubicación-texto p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);

}

#mapa {
    width: 55%;
    height: 400px;
    border-radius: 15px;
}

.inicio-final {
    padding: 20px;
    text-shadow: 2px 2px 5px black;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: left;
    height: 480px;

}

.container-final {


    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 40px;
}

.container-final-texto {

    width: 530px;
    height: 430px;
    display: flex;
    flex-direction: column;
    justify-content: center;

    text-align: left;



}

.container-final-texto h2 {
    font-size: 36px;

}

.container-final-texto p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);

}

.btn6 {
    font-size: 30px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 13px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 30px;
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;
    text-align: center;
    width: 463px;
}

.btn6:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-10px) scale(1.01);
    transition: 0.25s;


}




.container-final-logo {

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.container-final-logo img {
    width: 300px;
    height: 300px;


}

.container-final-contactos {

    width: 350px;
    display: flex;
    flex-direction: column;
    justify-content: center;

    text-align: left;

}

.container-final-contactos h3 {
    font-size: 28px;
    margin-top: 30px;
}

.container-final-contactos p {
    font-size: 18px;
    margin-top: 3px;
}

.social-icons {
    display: flex;
    gap: 20px;
}

.social-icons a {
    width: 60px;
    height: 60px;
    background-color: rgba(16, 4, 80, 0.479);
    border: 2px solid rgba(19, 3, 109, 0.479);
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: white;
    font-size: 35px;

    transition:
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;
}

.social-icons a:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 25px rgba(37, 99, 235, 0.4);
}

.instagram:hover {
    background: linear-gradient(-45deg, #760aa1, #990986, rgba(235, 73, 9, 0.808), #df7f11);
    border: 2px solid rgba(19, 3, 109, 0.801);

}

.tiktok:hover {
    background: linear-gradient(-45deg, rgba(255, 0, 0, 0.705), rgba(0, 110, 255, 0.658));
    border: 2px solid rgba(19, 3, 109, 0.801);

}

.container-final hr {
    background: linear-gradient(45deg, #103769, #0e1f55c9);
    width: 2px;
    border: none;
    color: #000000;

}


/* Nosotros */

.nosotros {
    background-color: #020e22ee;
    display: flex;
    max-width: 100%;
    margin-top: 59px;
    width: 1310px;
    height: 582px;

}

.container-nosotros {
    display: flex;
    flex-direction: column;
    margin: 0 15px;

}

.container-nosotros-cuadros {
    display: flex;
    justify-content: center;
    gap: 0px;
    margin-top: 15px;
    flex-direction: row;

}


.container-nosotros-texto {
    text-align: left;

}

.container-nosotros-texto h1 {
    font-size: 40px;

}

.container-nosotros-texto p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}

.container-nosotros-texto hr {
    background: linear-gradient(45deg, #086ece91, #020e22);
    height: 2px;
    width: 30%;
    display: flex;
    margin-left: 0px;

    border: none;



}

.tag {
    color: #085bd8;
}

.tag h5 {
    font-size: 22px;
    margin: 0;
    margin-top: 15px;
}



.cuadro {

    width: 150px;
    height: 180px;

}

.cuadro h3 {
    font-size: 18px;
}

.cuadro p {
    font-size: 11px;
    color: rgba(226, 221, 221, 0.918);



}


.cuadro i {
    font-size: 30px;
    color: #085bd8;
}

.container-nosotros-cuadros hr {
    background: linear-gradient(45deg, #086ece91, #020e22bd);
    width: 2px;
    border: none;
    color: #000000;

}




.nosotros-inicio-img {
    max-width: 100%;
}

.nosotros-inicio-img img {
    width: 780px;
    height: 582px;



}

.pilares {
    width: 100%;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;


}

.container-nosotros-pilares {
    display: flex;
    justify-content: center;
    gap: 0px;
    margin-top: 15px;
    flex-direction: row;
}

.pilares h2 {
    font-size: 36px;
}


.pilar {

    width: 230px;
    height: 240px;
    margin: 10px;

}

.pilar h3 {
    font-size: 24px;
}

.pilar p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}


.pilar i {
    font-size: 30px;
    color: #085bd8;
}

.container-nosotros-pilares hr {
    background: linear-gradient(45deg, #086ece91, #020e22bd);
    width: 2px;
    border: none;
    color: #000000;

}



.nosotros-final {
    background-color: #09234b;
    display: flex;
    max-width: 100%;
    margin-top: 59px;
    width: 1310px;
    height: 400px;

}


.container-nosotros-final-mensaje {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 400px;
    margin: 15px;


}


.container-nosotros-final-texto {
    text-align: left;
    width: 470px;
    margin: 15px;

}

.container-nosotros-final-texto h2 {
    font-size: 36px;
    font-family: "Oswald", sans-serif;
    color: #2c63fc;



}

.container-nosotros-final-texto p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}

.container-nosotros-final-texto img {
    margin: 0;
    width: 200px;
    height: 200px;
    margin-top: -50px;
    margin-left: 105px;
}

.tag p{
        color: #2c63fc;
        font-family: "Bebas Neue", sans-serif;
        font-size: 58px;
        text-shadow: #000000 5px 5px 7px;

}



.mensaje {

    width: 350px;
    height: 220px;
    text-align: left;


}

.mensaje h3 {
    font-size: 28px;
}

.mensaje p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}


.mensaje i {
    font-size: 30px;
    color: #2c63fc;
}

.nosotros-final hr {
    background: linear-gradient(45deg, #086ece91, #09254e);
    width: 2px;
    border: none;
    color: #000000;

}




.nosotros-final-img {
    max-width: 100%;
}

.nosotros-final-img img {
    width: 450px;
    height: 400px;



}


/* TOP */
.top-inicio {
    background-color: #040c1d;
    display: flex;
    max-width: 100%;

    height: 542px;

}

.container-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 15px;
    width: 550px;
}

.container-texto-top {
    text-align: left;
}

.container-texto-top h1 {
    font-size: 68px;
    font-family: "Bebas Neue", sans-serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 0.9;

}
.container-texto-top h5 {
    font-size: 22px;

}

.container-texto-top span {
    font-size: 26px;
     font-family: "Oswald", sans-serif;
}


.container-texto-top p {
    font-size: 18px;
    color: rgba(226, 221, 221, 0.918);



}

.btn7 {
    font-size: 30px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 13px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 10px;
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;
    text-align: center;
    width: 458px;
}

.btn7:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-10px) scale(1.01);
    transition: 0.25s;


}

.container-texto-top hr {
    background: linear-gradient(45deg, #086ece91, #020e22);
    height: 2px;
    width: 30%;
    display: flex;
    margin-left: 0px;

    border: none;



}


.top-inicio-img {
    max-width: 100%;
}

.top-inicio-img img {
    width: 780px;
    height: 100%;



}

.top-reglas {
    height: 450px;
    display: flex;
    justify-content: center; 
    align-items: center;
    flex-direction: column;
   
}

.container-top-cuadros {
    display: flex;
    justify-content: center;
    gap: 0px;
    margin-top: 40px;
    flex-direction: row;
    border: 2px solid #2c63fc;
    border-radius: 15px;
    width: 90%;

}

.container-top-cuadros hr {
    background-color: #2c63fc;
    width: 2px;
    border: none;
    color: #000000;

}


.cuadro-top {
    width: 240px;
    display: flex;
    justify-content: center;
    flex-direction: row;
     align-items: center;
    margin: 10px 40px;
    height: 140px;

}

.cuadro-top h3 {
    font-size: 22px;
    margin:10px;
}

.cuadro-top p {
    font-size: 17px;
    color: rgba(226, 221, 221, 0.918);



}


.cuadro-top i {
    font-size: 40px;
    color: #085bd8;
    margin: 20px ;
}


.btn8 {
    font-size: 20px;
    display: inline-block;
    background: linear-gradient(45deg, #1205c2, #0c38c7);
    padding: 13px;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    
    justify-content: center;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px #02059c;
    text-align: center;
    width: 150px;
}
.btn8 i {
    font-size: 20px;
    color: white;
    margin: 0;
}
.btn8:hover {
    background: linear-gradient(45deg, #0f04aa, #092da3);
    box-shadow: 0 8px 18px #0104b6;
    transform: translateY(-10px) scale(1.01);
    transition: 0.25s;


}


/* contactos */




.redes {
    margin: 50px 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    display: flex;
    

}

.redes h1 {
    font-size: 48px;
}

.redes p {
    font-size: 18px;
     color: rgba(209, 209, 209, 0.753);
     margin: 0 5px;
}


.contacto1 {
    border-radius: 25px;
    border: 1px solid rgba(4, 148, 16, 0.473);
    background-color: rgba(4, 148, 16, 0.123);
    width: 50%;
    margin: 30px;
    height: 300px;
    text-align: left;
    transition: all 0.8s;
    
}
.contacto1:hover {
   
    border: 1px solid rgba(5, 212, 23, 0.473);
    background-color: rgba(5, 189, 20, 0.151);
   
    
}
.contacto1 .p-1{
    color: rgb(24, 219, 112) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-top: -45px;
    margin-left: 100px;

}

.contacto1 h3 {
    font-size: 28px;
    margin-left: 100px;

}
.contacto1 .p-2 {
    color:  rgba(209, 209, 209, 0.603) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
}
.btn9 {

    font-size: 20px;
    display: inline-block;
     background: linear-gradient(45deg, rgb(24, 219, 112), rgba(4, 148, 16, 0.473));
    padding: 15px ;
    border-radius: 45px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 35px;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px rgba(7, 128, 17, 0.795); 
    margin-left: 100px;
     transition: 0.25s;
    margin-top: 15px;
}
.btn9:hover{  
    background: linear-gradient(45deg rgb(4, 36, 18), rgba(5, 65, 10, 0.473));
    box-shadow: 0 8px 18px rgba(7, 150, 19, 0.795); 
    transform: translateY(-6px) scale(1.01);
           

}

.icon-contacto1 {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    font-size: 40px;
    background-color:rgb(8, 224, 106);
    border: 2px solid rgb(7, 184, 87);
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
     margin-left: 15px;

}




.contacto2 {
    border-radius: 25px;
    border: 1px solid #020846;
    background: linear-gradient(to bottom, #0207336e, #01042267);
     width: 50%;
    margin: 30px;
    height: 300px;
    text-align: left;
    transition: all 0.8s;
    
}
.contacto2:hover {
   
    border: 1px solid #061299c5;
    background: linear-gradient(to bottom, #030b5848, #02073b4b);
   
    
}
.contacto2 .p-1{
    color: #392da7 ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
    margin-top: -45px;
}

.contacto2 h3 {
    margin-left: 100px;
    font-size: 28px;

}
.contacto2 .p-2 {
    color:  rgba(209, 209, 209, 0.603) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
}
.btn10 {

    font-size: 20px;
    display: inline-block;
     background: linear-gradient(-45deg, rgba(255, 0, 0, 0.582), rgba(0, 110, 255, 0.534));
    padding: 15px ;
    border-radius: 45px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
   margin-top: 35px;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px rgba(31, 9, 153, 0.479); 
    margin-left: 100px;
     transition: 0.25s;
    
}
.btn10:hover{  
    background: linear-gradient(-45deg, rgba(255, 0, 0, 0.705), rgba(0, 110, 255, 0.658));
    box-shadow: 0 8px 18px rgba(31, 6, 175, 0.479); 
    transform: translateY(-6px) scale(1.01);
           

}

.icon-contacto2 {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    font-size: 40px;
    background-color:rgba(16, 4, 80, 0.479);
    border: 2px solid rgba(19, 3, 109, 0.479);
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
     margin-left: 15px;

}







.contacto3 {
    border-radius: 25px;
    border: 1px solid #6d4a164f;
    background:linear-gradient(-45deg, #760aa133,#99098633,rgba(235, 73, 9, 0.144),#df7f111f);
    width: 50%;
    margin: 30px;
    height: 300px;
    text-align: left;
    transition: all 1.2s;
    
}
.contacto3:hover {
   
     border: 1px solid #81520b8e;
    background:linear-gradient(-45deg, #760aa156,#9909864d,rgba(235, 73, 9, 0.24),#df7f1131);
   
    
}
.contacto3 .p-1{
    color: #b1770d ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
    margin-top: -45px;
}

.contacto3 h3 {
    margin-left: 100px;
    font-size: 28px;

}
.contacto3 .p-2 {
    color:  rgba(209, 209, 209, 0.603) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
}
.btn11 {

    font-size: 20px;
    display: inline-block;
     background:linear-gradient(-45deg, #760aa1,#990986,rgba(235, 73, 9, 0.808),#df7f11);
    padding: 15px ;
    border-radius: 45px;
    color: white;
    text-decoration: none;
    transition: 0.3s;
    margin-top: 35px;
    font-family: "Oswald", sans-serif;
    box-shadow: 0 5px 15px rgba(184, 106, 4, 0.664); 
   
    margin-left: 100px;
     transition: 0.25s;
    
}
.btn11:hover{  
     background:linear-gradient(-45deg, #65088a,#7a056b,rgba(126, 38, 4, 0.808)rgb(153, 85, 7)5);
    box-shadow: 0 8px 18px rgba(184, 106, 4, 0.479); 
    transform: translateY(-6px) scale(1.01);
           

}

.icon-contacto3 {
    border-radius: 100%;
    height: 60px;
    width: 60px;
    font-size: 40px;
     background:linear-gradient(-45deg, #760aa1,#990986,rgba(235, 73, 9, 0.808),#df7f11);
    border: 2px solid rgba(196, 98, 7, 0.479);
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
     margin-left: 15px;

}


.redes2 {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    display: flex;

}



.contacto21 {
    border-radius: 25px;
    border: 1px solid rgba(53, 52, 52, 0.856);
   background-color: rgba(31, 30, 30, 0.479);
    width: 50%;
    margin: 5px;
    height: 90px;
    text-align: left;
    transition: all 1.2s;
    
}
.contacto21:hover {
   
     border: 1px solid #0d0b8149;
    background-color: #0330921c;
    
}
.contacto21 .p-1{
    color:  rgba(209, 209, 209, 0.603)  ;
    font-family: "Oswald", sans-serif;
    font-size: 28px;
    margin: 0 ;
    margin-left: 100px;
    margin-top: -60px;
}

.contacto21 .p-2 {
    color:  rgba(245, 242, 242, 0.795) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
    margin-top: -0px;
}


.icon-contacto21 {
    border-radius: 100%;
    height: 50px;
    width: 50px;
    font-size: 30px;
     background-color: #06244b;
    border: 2px solid #0756a0;
    color: #e0d9d9c4;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 18px;
     margin-left: 15px;

}







.contacto22 {
    border-radius: 25px;
    border: 1px solid rgba(53, 52, 52, 0.856);
   background-color: rgba(31, 30, 30, 0.479);
    width: 50%;
    margin: 5px;
    height: 90px;
    text-align: left;
    transition: all 1.2s;
    
}
.contacto22:hover {
   border: 1px solid #0d0b8149;
    background-color: #0330921c;
   
    
}
.contacto22 .p-1{
    color:  rgba(209, 209, 209, 0.603)  ;
    font-family: "Oswald", sans-serif;
    font-size: 28px;
    margin: 0 ;
    margin-left: 100px;
    margin-top: -60px;

}

.contacto22 h3 {
    margin-left: 100px;

}
.contacto22 .p-2 {
    color:  rgba(245, 242, 242, 0.795) ;
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    margin-left: 100px;
    margin-top: -0px;
}


.icon-contacto22 {
    border-radius: 100%;
    height: 50px;
    width: 50px;
    font-size: 30px;
     background-color: #06244b;
    border: 2px solid #0756a0;
    color: #e0d9d9c4;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 18px;
     margin-left: 15px;

}





@media (max-width: 768px) {


    /* general */
    header {
        flex-direction: row;
        align-items: center;
        z-index: 1001;
        display: flex;
        justify-content: space-between;
        position: fixed;
        width: 100%;


    }

    .container-menu a h3 {
        font-size: 16px;

    }



    .container-menu {
        position: fixed;
        top: 0;
        right: -100%;
        /* oculto fuera de pantalla */
        width: 60%;
        /* podés probar 50% si querés más pequeño */
        height: 100vh;
        background-color: #111a2e;
        display: flex;
        flex-direction: column;
        padding-top: 80px;
        gap: 20px;

        transition: right 0.3s ease;
        z-index: 1000;
        box-shadow: -5px 0 15px rgba(0, 0, 0, 0.5);

    }

    .container-menu.active {
        right: 0;

    }

    .container-icon-menu {
        display: block;
        color: #fff;
        z-index: 1100;
        position: relative;
        font-size: 24px;
        flex-shrink: 0;
        right: 33px;
    }

    .overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        display: none;
        z-index: 900;
    }

    .overlay.active {
        display: block;
    }


    /* 
* {
    outline: 1px solid red;
} 




/* index */



    .inicio {
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        background-color: #000000;
    }

    .inicio-texto {
        width: 100%;
        margin: 0;
        text-align: center;





    }

    .inicio-texto h1 {
        width: 70%;
        font-size: 48px;
        margin: 0;
        margin-top: 30px;



    }

    .inicio-texto span {
        width: 140px;
        font-size: 40px;
        margin: 0;
        margin: -10px 0px 60px 200px;



    }

    .inicio-texto p {

        font-size: 18px;

        margin: 0;
        margin-top: 295px;


    }

    .inicio-img {
        max-width: 90%;
        margin: 0 auto;
        height: 100vh;
        background-color: #000000;
        background-image: url(fotos/img\ inici\ cel.jpeg);
        background-size: contain;
        background-repeat: no-repeat;

    }

    .btn {
        font-size: 19px;
        padding: 15px;
        margin-top: 20px;
        width: 130px;
        margin: 0;
        text-align: center;

    }

    .btn2 {
        font-size: 19px;
        padding: 15px;
        margin-top: 20px;

        width: 130px;
        text-align: center;


    }

    .inicio-familia {

        display: flex;
        max-width: 1310px;
        height: 540px;

        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .inicio-familia h3 {
        font-size: 28px;
        color: #3b82f6;
        margin: 0;
        margin-top: -60px;

    }

    .inicio-familia h2 {
        font-size: 36px;
        margin-top: 20px;



    }

    .inicio-familia p {
        font-size: 18px;
        color: rgba(226, 221, 221, 0.918);
        margin: 35px 20px;


    }


    .inicio-entrenamiento {
        padding: 20px;
        background-color: #05117c3f;
        text-align: center;
        text-shadow: 2px 2px 5px black;
        flex-direction: column;
        justify-content: center;
        display: flex;
        align-items: center;
        height: 720px;
    }


    .container-entrenamientos {
        flex-direction: row;
        margin: 0;
        max-width: 335px;
        width: 100%;
        height: 500px;
        gap: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;



    }

    .container-entrenamientos hr {
        display: none;

    }

    .entrenamiento {

        width: 152px;
        height: 200px;
    }

    .entrenamiento h3 {
        font-size: 20px;
    }

    .entrenamiento p {
        font-size: 18px;



    }




    .inicio-tops {
        height: auto;



    }

    .container-top-texto {
        flex-direction: column;
        text-align: center;
        width: 100%;
        margin: 0;
        height: auto;
        margin: 20px;

    }

    .container-top-texto h2 {
        font-size: 36px;
        margin: 0;


    }

    .btn4 {
        font-size: 18px;
        margin: 0;
        margin-top: 10px;
    }



    .container-tops {
        flex-direction: row;
        margin: 0;
        width: 95%;
        height: auto;
        gap: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        margin: 20px;


    }

    .top-1:hover {
        transform: scale(1.05);
    }


    .top-1 {
        width: 162px;
        height: 260px;
    }

    .numero-top {
        width: 30px;
        height: 30px;
        font-size: 18px;
        margin-top: -230px;
        margin-left: -132px;

    }

    .top-1 img {
        width: 160px;
        height: 160px;
        margin-top: 15px;

    }

    .top-1 h2 {
        font-size: 36px;
        margin: 0;
        margin-top: 4px;
        color: #1567e2;

    }

    .top-1 p {
        font-size: 18px;
        margin-top: 4px;

    }

    .top-1 span {
        color: #1567e2;
        font-size: 17px;
    }


    .inicio-eventos {
        height: 1300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .inicio-eventos h2 {
        color: #3b82f6;
        font-size: 36px;
        margin-top: 00px;
    }


    .container-eventos {
        flex-direction: row;
        margin: 0;
        max-width: 335px;
        width: 100%;
        height: 400px;
        gap: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        margin-top: 20px;
    }

    .evento {
        width: 350px;
        height: auto;
    }

    .fecha {
        width: 50px;
        height: 50px;
        margin-left: 270px;
        margin-top: 10px;
        font-size: 16px;
    }


    .evento img {
        width: 320px;
        height: 110px;
    }


    .evento-texto h2 {
        font-size: 36px;
        color: white;
        margin-top: 0px;
    }

    .evento-texto p {
        font-size: 18px;
        margin-top: 10px;
        margin: 10px;
    }



    .btn5 {

        margin-top: 640px;

    }



    .inicio-ubicación {
        flex-direction: column;
        text-align: center;
        height: 750px;
    }

    .container-ubicación-texto {
        height: 300px;
        width: 100%;
    }

    .container-ubicación-texto h2 {
        font-size: 36px;
        margin: 0;
        color: #085bd8;
    }

    .container-ubicación-texto h3 {
        font-size: 28px;
        margin-top: 35px;

    }

    .container-ubicación-texto p {
        font-size: 18px;
        color: rgba(226, 221, 221, 0.918);

    }

    #mapa {
        margin-top: 117px;
        width: 250px;
        height: 250px;
    }





    .inicio-final {
        padding: 10px;
        justify-content: center;
        align-items: center;
        text-align: center;
        height: 320px;


    }

    .container-final {
        flex-direction: column;
        display: flex;
        justify-content: center;
        margin-top: 10px;
    }

    .container-final-texto {
        width: 100%;
        max-width: 386px;
        height: 250px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-items: center;


    }

    .container-final-texto h2 {
        font-size: 36px;

    }

    .container-final-texto p {

        margin-top: 0px;
        font-size: 18px;

    }

    .btn6 {
        font-size: 22px;
        padding: 13px;
        text-align: center;
        width: 110px;
        margin: 0;
        margin-top: 10px;

    }

    .container-final-logo {
        display: none;
    }


    .container-final-contactos {

        margin: 0;
        width: 350px;
        align-items: center;
        text-align: center;
    }

    .container-final-contactos h3 {

        display: none;
    }

    .container-final-contactos p {

        display: none;
    }

    .social-icons {
        display: flex;
        gap: 20px;
        margin: 0;
        margin-left: 15px;

    }

    .container-final hr {
        display: none;
    }



    /* Nosotros */

    .nosotros {
        background-color: #020e22ee;
        display: flex;
        max-width: 100%;
        margin-top: 59px;
        width: 100%;
        height: auto;
        flex-direction: column;

    }

    .container-nosotros {
        display: flex;
        flex-direction: column;
        margin: 0 15px;

    }

    .container-nosotros-cuadros {
        display: flex;
        justify-content: center;
        gap: 0px;
        margin-top: 15px;
        flex-direction: row;

    }


    .container-nosotros-texto {
        text-align: left;

    }

    .container-nosotros-texto h1 {
        font-size: 38px;

    }

    .container-nosotros-texto p {
        font-size: 14px;
        color: rgba(226, 221, 221, 0.918);



    }

    .container-nosotros-texto hr {
        background: linear-gradient(45deg, #086ece91, #020e22);
        height: 2px;
        width: 30%;
        display: flex;
        margin-left: 0px;

        border: none;



    }

    .tag {
        color: #085bd8;
    }

    .tag h5 {
        font-size: 22px;
        margin: 0;
        margin-top: 15px;
    }



    .cuadro {

        width: 150px;
        height: 180px;

    }

    .cuadro h3 {
        font-size: 14px;
    }

    .cuadro p {
        font-size: 10px;
        color: rgba(226, 221, 221, 0.918);



    }


    .cuadro i {
        font-size: 30px;
        color: #085bd8;
    }

    .container-nosotros-cuadros hr {
        background: linear-gradient(45deg, #086ece91, #020e22bd);
        width: 2px;
        border: none;
        color: #000000;

    }




    .nosotros-inicio-img {
        max-width: 100%;
    }

    .nosotros-inicio-img img {
        width: 100%;
        height: 302px;
        margin: 15px 0;



    }

    .pilares {
        width: 100%;
        height: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0;
        background-image: url(data:image/jpeg;base64,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);


    }

    .container-nosotros-pilares {
        flex-direction: row;
        margin: 0;
        max-width: 335px;
        width: 100%;
        height: auto;
        gap: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;

    }

    .pilares h2 {
        font-size: 36px;
    }


    .pilar {

        width: 139px;
        height: 200px;
        margin: 10px;

    }

    .pilar h3 {
        font-size: 15px;
    }

    .pilar p {
        font-size: 14px;
        color: rgba(226, 221, 221, 0.918);



    }


    .pilar i {
        font-size: 30px;
        color: #085bd8;
    }

    .container-nosotros-pilares hr {
        display: none;
    }



    .nosotros-final {
        background-color: #09234b;
        display: flex;
        max-width: 100%;
        width: 100%;
        height: auto;
        flex-direction: column;

    }


    .container-nosotros-final-mensaje {
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 90%;

    }


    .container-nosotros-final-texto {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 90%;
        margin: 15px;

    }

    .container-nosotros-final-texto h2 {
        font-size: 36px;
        font-family: "Oswald", sans-serif;
        color: #2c63fc;



    }

    .container-nosotros-final-texto p {
        font-size: 18px;
        color: rgba(226, 221, 221, 0.918);



    }

    .container-nosotros-final-texto img {
        margin: 0;
        width: 200px;
        height: 200px;
    }

    .tag p {
        font-size: 48px;
    }



    .mensaje {

        width: 100%;
        height: 220px;
        text-align: left;


    }

    .mensaje h3 {
        font-size: 28px;
    }

    .mensaje p {
        font-size: 18px;
        color: rgba(226, 221, 221, 0.918);



    }


    .mensaje i {
        font-size: 30px;
        color: #2c63fc;
    }

    .nosotros-final hr {

        background: linear-gradient(45deg, #086ece91, #071d3d);
        width: 90%;
        height: 3px;
        border: none;
        color: #000000;
    }




    .nosotros-final-img {
        max-width: 100%;
    }

    .nosotros-final-img img {
        width: 100%;
        height: 250px;



    }

    /* top */

    .top-inicio {
    background-color: #020e22ee;
        display: flex;
        max-width: 100%;
        margin-top: 59px;
        width: 100%;
        height: auto;
        flex-direction: column;

}

.container-top {
   display: flex;
        flex-direction: column;
        margin: 0 15px;
        width: 90%;
}

.container-texto-top {
    width: 100%;
    text-align: left;
    
}

.container-texto-top h1 {
    font-size: 48px;
    font-family: "Bebas Neue", sans-serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 0.9;

}
.container-texto-top h5 {
    font-size: 19px;


}

.container-texto-top span {
    font-size: 26px;
     font-family: "Oswald", sans-serif;
}


.container-texto-top p {
    font-size: 14px;

    color: rgba(226, 221, 221, 0.918);



}

.btn7 {
    font-size: 18px;
    width: 150px;
}



.top-inicio-img {
    max-width: 100%;
}

.top-inicio-img img {
     width: 100%;
        height: 302px;
        margin: 15px 0;




}




.top-reglas {
    height: auto;
    
}

.container-top-cuadros {
    flex-direction: column;
}

.container-top-cuadros hr {
    height: 2px;
    width: 90%;
}



/* contacto */


.contacto1 {
    width: 90%;
    height: auto;
}

.contacto1 h3 {
    font-size: 24px;
    margin-left: 100px;

}

.btn9 {
    font-size: 17px;
    margin: 20px;
    margin-left:100px;
}
.contacto2 {
    width: 90%;
    height: auto;
}

.contacto2 h3 {
    font-size: 24px;
    margin-left: 100px;

}

.btn10 {
     font-size: 17px;
    margin: 20px;
    margin-left:100px;
}
.contacto3 {
    width: 90%;
    height: auto;
}

.contacto3 h3 {
    font-size: 24px;
    margin-left: 100px;

}

.btn11 {
    font-size: 17px;
    margin: 20px;
    margin-left:100px;
}


.contacto21 {
    width: 90%;
}
.contacto21 .p-2 {
   font-size: 16px;
}

.contacto21 .p-1 {
   font-size: 22px;
}

.contacto22 {
    width: 90%;
}


.contacto22 .p-1 {
   font-size: 22px;
}

.contacto22 .p-2 {
   font-size: 16px;
}

}