:root{

--wbitas: 'Heavitas';

--gotham_l: 'Gotham L';

--gotham_b: 'Gotham M';

--gotham_offic: 'Gotham B';



--celeste_m: #A3D7E3;

--sombra_ingresa: #629EA4;

--sombra_login:#888888;

--gris_m:#4A4A49;



/* color brindado */

--verde_m: #008824; 



/* --verde_m: #018825;  */

--verde_o: #09661D;



--tamano_57:57pt;

--tamano_26: 26pt;

--tamano_23:23pt;

--tamano_11: 11pt;

--tamano_10: 10pt;

--tamano_19: 19pt;

--tamano_6: 6pt;

}



@font-face {

    font-family: 'Heavitas';

    font-style: normal;

    src: local('Heavitas'), url('assets/Heavitas.ttf') format('woff');

}





@font-face {

    font-family: 'Gotham L';

    font-style: normal;

    src: local('GothamLight'), url('assets/GothamLight.ttf') format('woff');

}



@font-face {

    font-family: 'Gotham M';

    font-style: normal;

    src: local('GothamMedium'), url('assets/GothamBlack.otf') format('woff');

}

@font-face {

    font-family: 'Gotham B';

    font-style: normal;

    src: local('GothamMedium'), url('assets/GothamOffice-Bold.otf') format('woff');

}



html{

    scroll-behavior: smooth;

}

body{

    /* font-family: 'Heavitas', sans-serif;

    height:100vh;

    min-height:550px;

    background-image: url(http://www.planwallpaper.com/static/images/Free-Wallpaper-Nature-Scenes.jpg);

    background-repeat: no-repeat;

    background-size:cover;

    background-position:center;

    position:relative;

    overflow-y: hidden; */

    

}

a{

    text-decoration:none;

    color:white;

    font-size: 23px;



}

.login-reg-panel{

    position: relative;

    transform: translateY(-50%);

    text-align:center;

    /* width:70%; */

    right:5%;

    margin:auto;

    height: 150%;

    border-bottom-right-radius: 115px;

    background-color: rgb(28, 7, 4);

    z-index: -3;

    margin-top: -90px;

}

.content_panel{

    display: flex;

    justify-content: right;

    padding-block-start: 20rem;

    /* height: 100vh; */

    width: 100vw;

    /* border: 1px solid black; */

    align-items: center;

    padding-inline: 2rem 8rem;

    transition: width ease-in-out .3s;

    /* border: 50px solid red; */ 



}

.white-panel{



    /* background-color: rgba(255,255, 255, 1);

    height: 70%;

    position: fixed;

    border-radius: 20px;

    top: 20%;

        width: 50%; 

    padding: 40px;

    right: calc(50% - 450px); */



    width: 410px;

    top: 73px;

    /* position: relative; */

    /* right: 10rem; */

    z-index: 0;

    box-shadow: -2px 7px 21px -6px var(--gris_m);

    float: right;

    border-radius: 20px;

    z-index: 99;

    background: white;

}

.login-reg-panel input[type="radio"]{

    position:relative;

    display:none;

}

.login-reg-panel{

    color:#B8B8B8;

}

.login-reg-panel #label-login, 

.login-reg-panel #label-register{

    border:1px solid #9E9E9E;

    padding:5px 5px;

    width:150px;

    display:block;

    text-align:center;

    border-radius:10px;

    cursor:pointer;

    font-weight: 600;

    font-size: 18px;

}

.login-info-box{

    width:30%;

    padding:0 50px;

    top:20%;

    left:0;

    position:absolute;

    text-align:left;

}

.register-info-box{

    width:30%;

    padding:0 50px;

    top:20%;

    right:0;

    position:absolute;

    text-align:left;

    

}

.right-log{right:50px !important;}



.login-show, 

.register-show{

    z-index: 1;

    /* display:none; */

    /* opacity:0; */

    transition:0.3s ease-in-out;

    color:#242424;

    text-align:left;

    padding:15px;

}

.show-log-panel{

    display:block;

    opacity:0.9;

}

.login-show input[type="text"], .login-show input[type="password"]{

    width: 100%;

    display: block;

    margin:20px 0;

    padding: 15px;

    border: 1px solid #b5b5b5;

    outline: none;

}

.login-show input[type="button"] {

    max-width: 150px;

    width: 100%;

    background: #444444;

    color: #f9f9f9;

    border: none;

    padding: 10px;

    text-transform: uppercase;

    border-radius: 2px;

    float:right;

    cursor:pointer;

}

.login-show a{

    display:inline-block;

    padding:10px 0;

}



.register-show input[type="text"], .register-show input[type="password"]{

    width: 100%;

    display: block;

    margin:20px 0;

    padding: 15px;

    border: 1px solid #b5b5b5;

    outline: none;

}

.register-show input[type="button"] {

    max-width: 150px;

    width: 100%;

    background: #444444;

    color: #f9f9f9;

    border: none;

    padding: 10px;

    text-transform: uppercase;

    border-radius: 2px;

    float:right;

    cursor:pointer;

}

.credit {

    position:absolute;

    bottom:10px;

    left:10px;

    color: #3B3B25;

    margin: 0;

    padding: 0;

    font-family: Arial,sans-serif;

    text-transform: uppercase;

    font-size: 12px;

    font-weight: bold;

    letter-spacing: 1px;

    z-index: 99;

}



.login_btn {

    /* position: fixed; */

    text-align: center;

    background: var(--celeste_m);

    /* width: 100%; */

    color:var(--gris_m);



    /* max-width: 150px; */

    box-shadow: -2px 2px 0px 0px var(--sombra_login);

    font-family: var(--gotham_offic);

    font-weight: bold;

    border: 1px solid var(--celeste_m) !important;

    /* margin-top: 5%; */

    &:hover{

        background-color: white !important;

        color: #000;

        border: 1px solid #4A4A49 !important;

    }

    &:focus{

        color:  var(--gris_m) !important;

    }

    

}





.btn-primary:hover{

    color:  #000 !important;

}



.href_cookies{

    font-size: 15px;

    color: var(--celeste_m);

    /* color: var(--verde_m); */

}



.href_cookies:hover {

    color: var(--celeste_m);

}

/* .btn-primary.focus, .btn-primary:focus{

    color:  #000 !important;

} */



.titulo_login_panel{

    font-family: var(--wbitas);

    font-size: 40px;

    line-height: 0.9;

    color: #008830;

    margin-top: 2rem;

    margin-bottom: 2.5rem;

}

.titulo_reg_panel{

    font-family: var(--wbitas);

    font-size: var(--tamano_26);

    /* line-height: 0.9; */

    color: #008830;

    margin-top: 1rem;

    margin-bottom: 1.5rem;

}

.input_dni{

    text-transform: lowercase;

}



.btn-primary{

    background-color: var(--celeste_m) !important;

    /* border: none!important; */

}



.wave_{

    position: relative;

    top: 0;

    right: 0;

    left: 0;

    z-index: 99;

}



.banner_home{

    position: fixed;

    top: 0;

    width: 100%;

    padding-inline: 7rem;

    padding-block-start: 3.5rem;

}



.footer_login_panel{

    bottom: 20px;

    left: 25px;

    flex-direction: column;

    display: flex;

    padding: 1.25rem;

    /* gap: 10px; */

}



._contra{

    text-decoration: underline;

    color:#008824;

    font-size: var(--tamano_11);

    font-family: var(--gotham_l);

    font-weight: bold;

    border: none;

    outline: none;

    background: transparent;

    padding: 0;

}

._reg{

    text-decoration: underline;

    color:rgb(72, 48, 48);

    position: fixed;

    padding: 20px 10px 20px 30px;

}



.slider_{

    /* background-color: red; */

    position: fixed;

    top: 0;

    right: 25px;

    left: 0;

    z-index: -9;

    height: 75vh;

    border-radius: 0 0 131px 0;

    overflow: hidden;



}



.text_card{

    font-size: 13px;

}

.text_card_reg{

    font-size: var(--tamano_10);

    color: red;

}

.text_title_reg{

    font-size: var(--tamano_11);

}



.select_docs, 

.select_docs:focus{

    outline: none;

    border-radius: 0 !important;

    border: none;

    border-bottom: 1px solid #000;

    box-shadow: none;

    scroll-behavior: smooth;

    font-size: var(--tamano_11);

}



.input_dni_reg{

    border-radius: 0 !important;

    border: none;

    border-bottom: 1px solid #000;

    width: 10%;

    font-size: var(--tamano_11);

    color: var(--gris_m);

    /* margin-left: 10% !important; */

}



._contra:hover {

    color: #000;

    text-decoration: underline;

}



.home_{

    position: relative;

}

.home_:hover {

    color: white;

    text-decoration: underline;

}



.atencion_alert{

    font-family: var(--wbitas);

    color: white;

    font-size: var(--tamano_26);

}

.text_alert{

    color: white;

    font-family: var(--gotham_l);

    font-size: var(--tamano_10);

}



.text_cookies{

    color: var(--gris_m);

    font-size: 17px;

    font-weight: 700;

}





.modal_1{

    border-radius: 20px;

    background: var(--verde_m) !important;

}



.modal_cookies{

    background: var(--celeste_m);

    padding: 0.75rem 5rem;

    /* width: 1070px; */

    border-top-right-radius:15px;

}

.modal-content{

    background-color: transparent !important;

    border: inherit !important;

}



.carousel-indicators{

    justify-content: start !important;

}



.carousel-indicators li{

    height: 10px !important;

    width: 10px !important;

    border-radius: 50%;

}



.btn_cerrar{

    background: white!important;

    color: var(--verde_o) !important;

    box-shadow: -2px 2px 0px 0px var(--gris_m);

    padding: 5px 10px;

    font-family: var(--gotham_b);

    font-size: 1rem;

}



.btn_cerrar:hover{

    background-color: var(--celeste_m) !important;

    color: var(--gris_m) !important;

}





.btn_aceptar_cook_1{

    background: white!important;

    color: var(--verde_m) !important;

    /* box-shadow: -2px 2px 0px 0px var(--gris_m); */

    padding: 5px 10px;

    font-family: var(--gotham_b);

    font-size: 13px;

}



.btn_aceptar_cook_1:hover{

    background-color: var(--celeste_m) !important;

    color: var(--gris_m) !important;

}



.btn_cookies_acept{

    background: var(--verde_m) !important;

    color: white !important;

    /* padding: 2px !important; */

    font-family: var(--gotham_l);

    font-size: 12px;

    padding-right: 35px;

    padding-left: 35px;

    height: 30px;

    text-align: center;

}



.btn_cookies_decline{

    background: white !important;

    color: var(--verde_m) !important;

    /* padding: 2px !important; */

    border: 1px solid var(--verde_m);

    font-family: var(--gotham_l);

    font-size: 12px;

    margin-left: 10px;

    padding-right: 35px;

    padding-left: 35px;

    height: 30px;

    text-align: center;



}

.container_buttons_e{

    display: flex;

    align-items: center;

}

.text_alert_icon{

    color: var(--verde_m);

    width: 30px;

    height: 30px;

    background: white;

    display: flex;

    border-radius: 50%;

    /* margin-left: 15px; */

    align-items: center;

    justify-content: center;

}



.alert_header{

    display: flex;

    gap: 10px;

    /* justify-content: flex-start !important;

    padding-left: 5%; */

}



.alert_i{

    font-size: 30px;

    color: white;

}



.cookies_{

    bottom: 0;

    

    position: absolute;

    width: 100% !important;

}



/*pop up cookies*/



.cookie-popup {

    display: none;

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: #333;

    color: #fff;

    padding: 10px;

    text-align: center;

}



.accept-cookie {

    background-color: #4CAF50;

    color: #fff;

    border: none;

    padding: 10px 20px;

    cursor: pointer;

}

    

/*pop up cookies*/

.form-control:focus,

.btn-primary.focus, .btn-primary:focus{

    box-shadow: none !important;

}



.header__logo{

    width: 270px;

}



.chk_muya{

    accent-color: var(--verde_m);

}

.mensaje_mail{

    text-align: center;

}

.saludo_mail{

    font-family: var(--wbitas);

    /* font-size: var(--tamano_57); */

    color: var(--gris_m);

}



.text_mail{

    font-family: var(--gotham_l);

    font-size: var(--tamano_23);

    font-weight: bold;

    color: var(--gris_m);

}



.codigo_verificacion{

    font-family: var(--gotham_b);

    color: var(--verde_m);

}



.boton_link{

    text-decoration: none !important;

    background-color: transparent;

    color: #000;

    padding: 15px 35px;

    border: 1px solid #000;

}



.footer_mail{

    background-color: var(--celeste_m);

    text-align: center;

    position: fixed;

    bottom: 0;

}



.titulo_foter_mail{

    color: var(--gris_m);

    font-family: var(--gotham_offic);

    font-weight: bold;

}



.section{

    /* background-color: #008824; */

    height: 100vh;

}



.container_cookies_border{

    gap: 10%;

}



.info_cookies_{

    text-align: left;

    font-size: 18px;

    font-family: var(--gotham_l);

    font-weight: bold;

    margin-left: 6%;

}



.wave_icon{

    position: fixed; 

    width: 100%;

    height: 22rem;

}



 /* igual o mayor a este tamaño */





.input-group-text {

    border: none !important;

    background-color: transparent !important;

}







.fading-element {

    width: 20%;

    position: relative;

    top: 45%;

    bottom: 0;

    right: 0;

    left: 40%;

    animation: fade 1s infinite;

  }

  

  

  @keyframes fade {

    0%,

    100% {

      opacity: 0;

    }

  

    50% {

      opacity: 1;

    }

  }



  @keyframes rotateAntiClockwise {

        from {

            transform: rotate(0deg); /* Angulo de inicio (0 grados) */

        }

        to {

            transform: rotate(-180deg); /* Angulo final (-180 grados, sentido antihorario) */

        }

    }



  

.overlay_muya{

    display: none;

    position: fixed; 

    top: 0; 

    left: 0; 

    width: 100%; 

    height: 100%; 

    background-color: rgba(0, 0, 0, 0.5); 

    z-index: 999;

}



.text_alert_cookies{

    color: white;

    font-family: var(--gotham_l);

}



.buttons_cookies{



}

.modal-dialog_c{

    max-width: 100% !important;

}





/* pa fonito */

/* de 0 hasta 640 */



@media (min-width: 420px) and (max-width: 768px){



    .modal_cookies {

        /* width: 498px;

        height: 218px; */

    }

    .modal-dialog {

        max-width:96% !important;

        left: -75px;

    }



    .info_cookies_{

        font-size: 10px

    }





}



@media (width: 280px) and (height: 653px) {



    .modal_cookies {

        width: 383px;

        height: 206px;

        left: -41px;

    }

    .modal-dialog {

        max-width:96% !important;

        left: -20px;

    }



    .info_cookies_{

        font-size: 10px

    }



    .container_cookies_border{

        display: inline-block !important;

    }

    

}



/* pa tabletcitas */

/* de 641 hasta 1024 */

@media (max-width: 980px){

    .white-panel{

        width: 400px;

        height: 500px;

        position: initial;

    }

    .wave_icon{

        height: 10rem;

    }

    .content_panel{

        padding-block-start: 10rem;

        padding-inline: 2rem;

        justify-content: center;

    }



    .banner_home{

        padding-block-start: 1rem;

        padding-inline: 3rem;

    }



    .header__logo{

        width: 130px;

    }



    .modal_cookies {

        height: 221px;

        padding: 15px;

    }



    .modal-dialog {

        max-width:96% !important;

    }

    .info_cookies_{

        font-size: 12px

    }



    .home_{

        font-size: 11px;

    }



    .container_cookies_border{

        display: inline-block !important;

    }



    .logo{

        padding-right: 2rem;

    }



}





/* pa pantallas gaymers */

@media (min-width: 1280px){

    .home_{

        font-size: 20px;

     }

}