body{
    background:  #0e1c2c;
    color: white;
}

.ez-center{
    display:flex;
    justify-content:center;
    align-items:center;
}


.ruleta-base{
    background-image: url('../img/ruleta/base_nieve.webp'); 
}


.ruleta-icon{
    background-image: url('../img/ruleta/ruletabonusicon.webp');
}

.encuentrateemo{
    background-image: url('../img/ruleta/encuentrateemo.webp');
}

.ruletavip-icon{
    background-image: url('../img/ruleta/ruletavipicon.webp');
}

.ruleta-ticket{
    background-image: url('../img/ruleta/ticket.webp');
}

.ruleta-ticket2{
    background-image: url('../img/ruleta/ticket_2.webp');
}

.ruleta-ticket-responsive{
    background-image: url('../img/ruleta/ticket_responsive.webp');
}

.ruleta-ticket2-responsive{
    background-image: url('../img/ruleta/ticket2_responsive.webp');
}

.ruleta-responsive{
    background-image: url('../img/ruleta/ruleta_responsive.webp');
}

.regalo{
    background-image: url('../img/ruleta/regalo.webp');
}

.ruleta-fondo{
    background-image: url('../img/ruleta/ruleta_braum.webp');
}

.puntero-ruleta{
    background-image: url('../img/ruleta/puntero_ruleta2.webp');
}

.ruleta-diamante{
    background-image: url('../img/tier/DIAMANTE.webp');
}

.ruleta-nieve{
    background-image: url('../img/ruleta/nieve.webp');
}

.ruleta-maestro{
    background-image: url('../img/tier/MAESTRO.webp');
}

.ruleta-dinero{
    background-image: url('../img/ruleta/bolsa_dinero.webp');
}

.ruleta-unranked{
    background-image: url('../img/tier/UNRANKED_BASICA.webp');
}

.ruleta-vip{
    background-image: url('../img/tier/UNRANKED_VIP.webp');
}

.ruleta-legendaria{
    background-image: url('../img/tier/UNRANKED_LEGENDARIA.webp');
}


/* ---- particles.js container ---- */
#particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: 50% 50%;
    z-index: 1;
}

.fondoAshe{
    background-image: url('../img/leesin_offcanvas.webp');
}


@media (min-width: 1500px){
  #cuentasGeneral {
    max-width: 1450px;
  }
}


@media (min-width: 1400px) and (max-width:1500px) {
  #cuentasGeneral {
    max-width: 1355px;
  }
}

@media (min-width: 1300px) and (max-width:1400px) {
  #cuentasGeneral {
    max-width: 1255px;
  }
}

@media (min-width: 1200px) and (max-width:1300px) {
  #cuentasGeneral {
    max-width: 1122px;
  }
}

@media (min-width: 1100px) and (max-width:1200px) {
  #cuentasGeneral {
    max-width: 1025px;
  }
}


@media (min-width: 1000px) and (max-width:1100px) {
  #cuentasGeneral {
    max-width: 935px;
  }
}


@media (min-width: 900px) and (max-width:1000px) {
  #cuentasGeneral {
    max-width: 820px;
  }
}


@media (min-width: 800px) and (max-width:900px) {
  #cuentasGeneral {
    max-width: 720px;
  }
}

@media (min-width: 700px) and (max-width:800px) {
  #cuentasGeneral {
    max-width: 620px;
  }
}

@media (min-width: 600px) and (max-width:700px) {
  #cuentasGeneral {
    max-width: 520px;
  }
}

@media (min-width: 500px) and (max-width:600px) {
  #cuentasGeneral {
    max-width: 420px;
  }
}

@media (min-width: 400px) and (max-width:500px) {
  #cuentasGeneral {
    max-width: 320px;
  }
}

@media (min-width: 300px) and (max-width:400px) {
  #cuentasGeneral {
    max-width: 337px;
  }
}



/* ---- stats.js ---- */
.count-particles {
    background: #000022;
    position: absolute;
    top: 0px;
    left: 0;
    width: 80px;
    color: #13E8E9;
    font-size: .8em;
    text-align: left;
    text-indent: 4px;
    line-height: 14px;
    padding-bottom: 2px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
}

.js-count-particles {
    font-size: 1.1em;
}

#stats,
.count-particles {
    -webkit-user-select: none;
    margin-top: 5px;
    margin-left: 5px;
}

#stats {
    border-radius: 3px 3px 0 0;
    overflow: hidden;
}

.count-particles {
    border-radius: 0 0 3px 3px;
}

.row{
    --bs-gutter-x: 0px;
}


.navbar-expand-lg .offcanvas{
    flex-grow: 0;
}

.modal-open > *:not(.modal) {
    filter: blur(5px);
  }




.texto-en-imagen{

        position: absolute;
        top: 82%;
        left: 50%;
        transform: translate(-50%, -50%);
    
}

.imagen-diamante{
    background-image: url('../img/tier/DIAMANTE.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.hovertest{
    transition: 0.3s;
}
.bg-BLANCO{
    background-color: white;
    box-shadow: 0 0 1rem 0 #ffffff;
    transition: .3s;

}
.bg-EXTRAS-modal{
    background: linear-gradient(0deg, rgb(42 93 114 / 45%) 0%, rgb(255 255 255 / 22%) 49%, rgb(53 126 145 / 90%) 100%);
}

.bg-WHITE{
    background-color: white;
    box-shadow: 0 0 1rem 0 #ffffff;
    transition: .3s;
}
.bg-WHITE-non{
    background-color: white;
    transition: .3s;
}
.bg-WHITE-non:hover{
-webkit-transform: scale(1.1);
transform: scale(1.1);
transition: .3s;
}
select{
    transition: .3s;
}

.spinner-grow {
    --bs-spinner-animation-speed: 1.5s;
}

.bg-BLANCO:hover{
background-color:rgba(255, 255, 255, 0.308);
box-shadow: 0 0 10rem 0 #ffffff;
transition: .3s;

}

input:focus {
    border: 1 solid rgba(255, 255, 255, 0);
}

.imagen-retador{
    background-image: url('../img/tier/RETADOR.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.imagen-division{
    background-image: url('../img/tier/DIVISION.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.imagen-boosting2{
    background-image: url('../img/boosting.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.imagen-boosting3{
    background-image: url('../img/boosting2.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}



.imagen-liss{
    background-image: url('../img/boosters/EZLiss.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.imagen-fondo_inicio{
    background-image: url('../img/recursos/fondo_inicio.webp');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.imagen-coaching2{
    background-image: url('../img/coaching.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: -2px;
}

.imagen-coaching3{
    background-image: url('../img/coaching2.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: -2px;
}

.imagen-cuentas2{
    background-image: url('../img/cuentas.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.imagen-cuentas3{
    background-image: url('../img/cuentas2.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}


.imagen-placement{
    background-image: url('../img/tier/PLACEMENT.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.imagen-netwin{
    background-image: url('../img/tier/NETWIN.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.imagen-coaching{
    background-image: url('../img/tier/COACHING.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}

.imagen-unranked{
    background-image: url('../img/tier/UNRANKED_BLACK.webp');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 28px;
}



#botonCheckout:hover{
box-shadow: 0 0 10rem 0 rgb(2, 183, 255);
}


.bg-portada-ashe{
    background-image: url(../img/PORTADA.webp);
    background-position: center;
    background-size: cover;
    background-position-y: -298px;
    background-repeat: no-repeat;
    opacity: 30%;
    filter: blur(3px);
}

.bg-portada-ashe-celular{
    background-image: url(../img/PORTADA.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 30%;
    filter: blur(3px);
}


.texto-75{
    color: rgba(255, 255, 255, 0.75);
}
.texto-50{
    color: rgba(255, 255, 255, 0.50);

}


















.offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl{
    --bs-offcanvas-width : 300px;
    transition: 1s ease;
    background-color: transparent;
    --bs-offcanvas-border-width: 0px;
}

.blur0{
    filter: blur(0px);
}
.bg-offcanvas{

    background-position-x: -197px;
    background-size: cover;
    background-image: url('../img/leesin_offcanvas.webp');
}
.bg-copia{
    background: linear-gradient(0deg, rgba(236,131,83,1) 30%, rgba(201,80,78,1) 100%);
}
.bg-servidor{
    background: linear-gradient(0deg, rgb(44 72 100 / 92%) 0%, rgba(161,177,177,0) 100%);
}
.bg-azuloscuro{
    background: rgb(15, 28, 41);
}

.bg-color-boton{
    background:linear-gradient(0deg, rgb(113 213 243) 0%, rgb(73 101 118 / 74%) 100%);
}

.bg-color-boton:hover{
    background:linear-gradient(0deg, rgb(233 250 255) 0%, rgb(73 101 118 / 74%) 100%);
}

.btn-check:active+.btn, .btn-check:checked+.btn, .btn.active, .btn.show, .btn:active{
    background-color: #ffffff4f;
}

.btn-check2{
    position: absolute;
    clip: rect(0,0,0,0);
    pointer-events: none;
}

.btn-check2:active+.btn, .btn-check2:checked+.btn{
    background: white;
    color: #38c1e3;
}




.btn-outline-light{
    --bs-btn-hover-bg: rgba(0, 0, 0, 0);
    --bs-btn-focus-shadow-rgb: rgba(0, 0, 0, 0);
    --bs-btn-hover-color: white;
}



  
  /*SCROLL pequeño*/

/* width */ 
::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(111, 221, 255, 0.247); 
    border-radius: 5px;
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: rgba(0, 162, 255, 0.3); 
    border-radius: 10px;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.7);
  }

  
  
  /*SCROLL GENERAL*/
  
body::-webkit-scrollbar {
    width: 10px;
  }
   
  body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  }
   
  body::-webkit-scrollbar-thumb {
    background-color: rgba(0, 162, 255, 0.3);
    outline: 1px solid slategrey;
  }







.modal{
    --bs-modal-width: 380px;
}

.btn-login {
    background: linear-gradient(90deg, rgba(12,86,157,1) 0%, rgba(0,212,255,1) 100%);

    transition-duration: .3s;
}

.btn-login2 {
    background: linear-gradient(90deg, rgb(12 86 157 / 72%) 0%, rgb(0 212 255 / 72%) 100%);
    transition-duration: .3s;

}

.btn-login3{
    background: linear-gradient(90deg, rgb(0 208 255 / 78%) 0%, rgb(0 149 255 / 48%) 100%);
}

.btn-login-rojo{
    background: linear-gradient(90deg, rgb(100 14 27 / 58%) 0%, rgb(255 0 0 / 65%) 100%);
    transition-duration: .3s;
}


.btn-login-verde{
    background: linear-gradient(90deg, rgb(12 157 75) 0%, rgb(64 114 9 / 52%) 100%);
    transition-duration: .3s;
}





.btn-facebook{
    --bs-btn-color: #000;
    --bs-btn-bg: #ffffffc3;
    --bs-btn-border-color: #0dcaf0;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #ffffff;
    --bs-btn-hover-border-color: #25cff2;
    --bs-btn-focus-shadow-rgb: 11,172,204;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #3dd5f3;
    --bs-btn-active-border-color: #fbfeff;
    --bs-btn-active-shadow: rgb(255 255 255);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #0dcaf0;
    --bs-btn-disabled-border-color: #0dcaf0;
}

.form-control {
        display: block;
        width: 100%;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color: #212529;
        background-color: hsl(195deg 100% 49% / 22%);
        background-clip: padding-box;
        border: 1px solid #09ffdb00;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border-radius: 0.375rem;
        transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
        color: white;
    }


.bg-summonerInfo{
    background: rgb(143,227,207);
    background: linear-gradient(0deg, rgba(143, 227, 207, 0.432) 0%, rgba(43, 72, 101, 0.479) 100%);

}

input:-webkit-autofill,
input:-webkit-autofill:focus {
  transition: background-color 600000s 0s, color 600000s 0s;
}

.bg-color1{

        background: linear-gradient(0deg, rgb(106 150 169 / 68%) 0%, rgb(103 114 122 / 42%) 100%);
}

#name::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#var1::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#var2::placeholder{
    color:rgba(255, 255, 255, 0.8);
}
#var3::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#summonername::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#idCuenta::placeholder{
    color:#0000008f;
}

#claveCuenta::placeholder{
    color:#0000008f;
}

#correoCuenta::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#SNCuenta::placeholder{
    color:#0000008f;
}

#infoCuentaChamps::placeholder{
    color:rgba(255, 255, 255, 0.8);
}
#infoCuentaGeneral::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#infoCuentaSkins::placeholder{
    color:rgba(255, 255, 255, 0.8);
}

#precio::placeholder{
    color:rgba(255, 255, 255, 0.8);
}


#whatsapp::placeholder{
    color:rgba(255, 255, 255, 0.801);
}

#password_confirmation::placeholder{
    color:rgba(255, 255, 255, 0.801);
}

#adicional::placeholder{
    color:rgba(255, 255, 255, 0.801);
}

#filtro::placeholder{
    color:rgba(109, 109, 109, 0.952);
}

#emailLogin::placeholder{
    color:rgba(255, 255, 255, 0.623);
}

#emailRegistro::placeholder{
    color:rgba(255, 255, 255, 0.623);
}

#passwordLogin::placeholder{
    color:rgba(255, 255, 255, 0.623);
}
#passwordRegistro::placeholder{
    color:rgba(255, 255, 255, 0.623);
}



#selectPais select option{
    background: transparent;

}


#modalChamps select option{
    background: rgba(35, 168, 35, 0);
}

#modalChamps select{
    background: rgba(35, 168, 35, 0);
}

#modal_infoCuenta select option{
        background: rgba(35, 168, 35, 0);
}

#modal_infoCuenta select{
        background: rgba(35, 168, 35, 0);
}

#cupon::placeholder{
    color:rgba(255, 255, 255, 0.801);
}

.bg-submenu{
    background: linear-gradient(90deg, rgba(56,193,227,0) 0%, rgba(41, 142, 249, 0.507) 40%, rgba(56, 139, 227, 0.486) 60%, rgba(64,169,255,0) 100%);
}


.bg-card{
    background: linear-gradient(0deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 49%, rgba(255,255,255,0.1) 100%);
}
.bg-bronce{
    position: relative; 
    width: 100%;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
}

.bg-ashe-unica{
    background-image: url('../img/PORTADA.webp');
}

.bg-bronce::before{
    position: absolute;
    background-position: center;
    background-size: cover;
    filter: brightness(0.5);
    content: "";
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background: linear-gradient(0deg, rgba(247, 70, 0, 0.29) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 81, 0, 0.21) 100%);
    opacity:0;
}

.imagen_HIERRO, .imagen_UNRANKED, .imagen_BRONCE, .imagen_PLATA, .imagen_ORO, .imagen_PLATINO, .imagen_DIAMANTE, .imagen_MAESTRO, .imagen_GRANMAESTRO, .imagen_RETADOR, .imagen_ESMERALDA{
    opacity:0;
}

.imagen2_HIERRO, .imagen2_UNRANKED, .imagen2_BRONCE, .imagen2_PLATA, .imagen2_ORO, .imagen2_PLATINO, .imagen2_DIAMANTE, .imagen2_MAESTRO, .imagen2_GRANMAESTRO, .imagen2_RETADOR, .imagen2_ESMERALDA{
    opacity:0;
}

.form-check-input:checked{
    background-color: #38c1e3;
    border-color:#38c1e3;
    
}

.form-check-input{
    transition: 0.8s;
}

.bg-EXTRAS{
    background: linear-gradient(0deg, rgba(0, 183, 255, 0.2) 0%, rgba(255,255,255,0.05) 49%, rgba(2, 204, 255, 0.17) 100%);
 
}

.bg-EXTRAS2{
    background: linear-gradient(0deg, rgb(0 183 255 / 58%) 0%, rgb(2 204 255 / 4%) 60%);
}

.bg-UNRANKED{
    background: linear-gradient(0deg, rgba(250, 228, 201, 0.14) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 231, 210, 0.15) 100%);

}

.bg-HIERRO{
    background: linear-gradient(0deg, rgba(139, 126, 110, 0.14) 0%, rgb(245 124 0 / 7%) 49%, rgba(141, 124, 110, 0.151) 100%);
}
.bg-BRONCE{
    background: linear-gradient(0deg, rgb(247 137 0 / 14%) 0%, rgb(245 124 0 / 7%) 49%, rgb(255 118 0 / 15%) 100%);

}
.bg-PLATA{
    background: linear-gradient(0deg, rgba(250, 228, 201, 0.12) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 231, 210, 0.15) 100%);
}
.bg-ORO{
    background: linear-gradient(0deg, rgb(247 137 0 / 15%) 0%, rgb(245 124 0 / 7%) 49%, rgb(255 118 0 / 15%) 100%);
}
.bg-PLATINO{
    background: linear-gradient(0deg, rgb(0 206 255 / 18%) 0%, rgb(0 245 245 / 7%) 49%, rgb(0 159 255 / 13%) 100%);
}
.bg-DIAMANTE{
    background: linear-gradient(0deg, rgb(110 0 255 / 14%) 0%, rgba(255,255,255,0.05) 49%, rgb(0 162 255 / 17%) 100%);
}
.bg-MAESTRO{
    background: linear-gradient(0deg, rgba(198, 0, 247, 0.14) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 0, 179, 0.15) 100%);
}
.bg-GRANMAESTRO{
    background: linear-gradient(0deg, rgba(255, 0, 34, 0.14) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 0, 64, 0.15) 100%);
}

.bg-RETADOR{
    background: linear-gradient(0deg, rgb(247 119 0 / 15%) 0%, rgba(255,255,255,0.05) 49%, rgb(16 222 255 / 15%) 100%);
}

.bg-UNRANKED{
    background: linear-gradient(0deg, rgba(250, 228, 201, 0.14) 0%, rgb(245 124 0 / 7%) 49%, rgba(255, 231, 210, 0.15) 100%);

}

.bg-ESMERALDA{
    background: linear-gradient(0deg, rgb(0 255 149 / 10%) 0%, rgb(12 90 54 / 13%) 49%, rgb(0 255 170 / 13%) 100%);

}

.flash{
    transition: .3s;
}
.flash:hover{
    box-shadow: 0 0 1rem 0 white;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.agrandar{
    transition: .3s;
}
.agrandar:hover{
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}


.agrandar-disable{
    transition: .3s;
}

.agrandar-disable:hover{
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    background: rgb(0, 162, 255);
}

.agrandarCarta{
    transition: .3s;
}
.agrandarCarta:hover{
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
}


.agrandar2{
    transition: .3s;
}
.agrandar2:hover{
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
    box-shadow: 0 0 10rem 0 rgb(0, 162, 255);
}

.agrandar3{
    transition: .3s;
}
.agrandar3:hover{
    -webkit-transform: scale(1.02);
    transform: scale(1.03);
    box-shadow: 0 0 0.2rem 0 rgb(255, 255, 255, 40);



}


.bg-menu{
    background-color: #ffffff24;
}
.bg-card-small{
    background-color: hsla(0,0%,100%,.1);
}
.bg-card-small2{
    background-color: hsla(0,0%,100%,.2);
}

.bg-boton{
    background: linear-gradient(90deg, rgba(64,169,255,1) 0%, rgba(56,193,227,1) 100%);
}

.form-control:focus {
    box-shadow: 0 0 0 0.25rem rgba(13, 109, 253, 0);}

.btn{
 
    --bs-btn-border-radius: 0.5rem;
    border:rgba(0, 0, 0, 0);
    transition: 0.5s;

}

input:focus{
    outline: none;
    border: 0px;
}

input{
    color:black;
}



/* FONDO CARTAS PEQUEÑAS */
.btn-check:active+.btn, .btn-check:checked+.btn, .btn.active, .btn:active{ 
    background-color: #ffffff;
    color: rgb(17, 17, 17);
    /* background: linear-gradient(130deg, rgba(64,169,255,0.8) 0%, rgba(56,193,227,1) 50%); */
}

.btn.show {
        background-color: #ffffff4f;
}

.btn:hover{
    background-color: rgba(1, 196, 255, 0.952);
}


    .content {
        /* this is needed or the background will be offset by a few pixels at the top */
        overflow: auto;
        position: relative;
      }
      .fondo-modal{
        position: relative; 
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
      }


      .fondo-portada-texto{
        position: relative; 
        width: 100%;
        align-items: center;
        justify-content: center;
      }

      .fondo-portada-texto::before{
        position: absolute;
        background-position: center;
        background-size: cover;
        content: "";
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;
      }

      .fondo-portada{
        position: relative; 
        width: 100%;
        align-items: center;
        justify-content: center;
      }



      /* .fondo-portada::before{
        position: absolute;
        background-position: center;
        background-image: url('../IMG/PORTADA.jpg');
        background-size: cover;
        content: "";
        top: 0px;
        right: 0px;
        bottom: -200px;
        left: 0px;
      } */
      
      /* .content::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        z-index: -1;   
        display: block;
        background-image: url('../IMG/PORTADA.jpg');
        background-size:cover;
        background-position: center;
        width: 100%;
        height: 100%; */
      
        /* -webkit-filter: blur(6px);
        -moz-filter: blur(6px);
        -o-filter: blur(6px);
        -ms-filter: blur(6px);
        filter: blur(6px);
      } */





.btn-primary {
    --bs-btn-bg: #4a5b7a52;
    --bs-btn-border-color: #4a5b7a52;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #466dc3a3;
    --bs-btn-hover-border-color: #466dc3a3;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: rgb(0, 0, 0);
    --bs-btn-active-bg: #466dc3a3;
    --bs-btn-active-border-color: #0a53be;
    --bs-btn-active-shadow: inset 0 3px 5pxrgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #4a5b7a52;
    --bs-btn-disabled-border-color: #4a5b7a52;
}

select option{
    background:rgb(255, 255, 255);
}
#champs select option{
    background: transparent;
}


select:hover{

    background-color: rgb(255, 255, 255);

}

.dropdown-menu {
    --bs-dropdown-min-width: 15rem;
    --bs-dropdown-link-active-bg: #00ccffc7;
}




/* //////////////////////////////////////////////////////////////////////// */

.slidecontainer {
    width: 100%; /* Width of the outside container */
  }
  
  /* The slider itself */
  .slider {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    height: 25px; /* Specified height */
    background: #00000080; /* Grey background */
    outline: none; /* Remove outline */
    opacity: 1; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
    border-radius: 15px;

  }


  
  /* Mouse-over effects */
  .slider:hover {
    opacity: 1; /* Fully shown on mouse-over */
  }
  
  /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
  .slider::-webkit-slider-thumb {
    -webkit-appearance: none; /* Override default look */
    appearance: none;
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    border-radius: 50%;
    background: rgb(0, 162, 255);
    cursor: pointer; /* Cursor on hover */
  }

  .slider::-webkit-slider-thumb:hover{
    background: rgb(0, 162, 255);
  }
  
  /* ///////////////////////////////////////////////// */


#handle2 .rs-range-color  {
    background-color: #8832cd;
}
#handle2 .rs-path-color  {
    background-color: #ddc5f0;
}

/* ////////////////////////////////////////////////// */

#slider .rs-range-color  {
    background: rgb(0, 162, 255);
}

#slider .rs-path-color  {
    background-color: rgba(255, 0, 0, 0.555);
}

#slider .rs-border  { /* BORDE */
    border-color: #ffffff;
}

#slider .rs-handle  {
    background-color: #bebebe;


    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(0px) translateZ(0);
    transform: perspective(0px) translateZ(0);
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}
#slider .rs-handle:after{  /*PEPA DE ADENTRO */
    background-color: rgb(255, 255, 255);
}

#slider .rs-handle:hover  {
    background-color: #ffffff;

    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}



.chat-degradado{
    background:rgb(239 239 239);
    transition-duration: .3s;
}

.chat-gris{
    background:  rgb(159 159 159);
    transition-duration: .3s;
}

.chat-center{
    display:flex;
    justify-content:center;
    align-items:center;
}

.chat-texto1{
    color: gray;
}

.chat-font3{
    font-size:3rem;
}

.chat-font2{
    font-size:2rem;
}

.chat-font4{
    font-size:4rem;
}

.chat-font15{
    font-size:1.5rem;
}

.chat-font08{
    font-size:0.8rem;
}

.chat-font12{
    font-size:1.2rem;
}

.chat-agrandar{
    transition:0.3s;
}

.chat-agrandar:hover{
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.chat-agrandar2{
    transition:0.3s;
}

.chat-agrandar2:hover{
    
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}
.chat-agrandar3{
    transition:0.3s;
}
.chat-agrandar3:hover{
    
    -webkit-transform: scale(1.01);
    transform: scale(1.01);
}


/*audio::-webkit-media-controls {*/
/*  background-color: rgba(0, 162, 255, 0.5);*/
/*  color: #fff;*/
/*}*/

audio::-webkit-media-controls-panel {
     background-color: rgba(0, 162, 255, 0.4);
     color: white;
     }
     
     
     audio::-webkit-media-controls-play-button {
     background-color: white;
     color: white;
     border-radius: 50%;
     margin-left: -4px;
     }