:root {
    --fuenteHeading: 'Advent Pro', sans-serif;
    --fuenteParrafos: 'Urbanist', sans-serif;

    --primario: #27903C;
    --secundario: #36B64F;
    --celeste1: #45ADFF;
    --celeste2: #008FFF;
    --blanco: #FFFFFF;
    --negro: #000000;
    --amarillo: #F2CE06;
}
html {
    box-sizing: border-box;
    font-size: 62.5%; /* 1rem = 10px */
}
*, *:before, *:after {
  box-sizing: inherit;
}
body {
    font-family: var(--fuenteParrafos);
    font-size: 1.6rem;
    line-height: 2;
}
/** Globales **/

a {
    text-decoration: none;
}

h1, h2, h3, h4 {
    font-family: var(--fuenteHeading);
    line-height: 1.2;
}

h1 {
    font-size: 4.8rem;
}

h2 {
    font-size: 4rem;
}

h3 {
    font-size: 3.2rem;
}

h4 {
    font-size: 2rem;
}

.banner {
    max-width: 100%;
}

/** Utilidades **/
.no-margin {
    margin: 0;
}

.margin {
    margin-top: 30px;
}
.no-espaciado {
    line-height: 40px;
}

.no-padding {
    padding: 0;
}

.centrar-texto {
    text-align: center;
}

.header {
    display: flex;
    flex-direction:column;
    align-items: center;
    line-height: 1.5;
}

@media (min-width: 768px) {
    .header {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        column-gap: 2rem;
        max-width: 180rem;
        margin-left: 2rem;
        margin-right: 2rem;
     } 
}

.header__logo{
    max-width: 50%;
}

@media (min-width: 768px) {
     .header__logo {
    max-width: 60%;
     
     }
}

@media (max-width: 384px) {
    .header__logo {
   max-width: 80%;
    
    }
}

.header-grid {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
}

@media (min-width: 768px) {
    .header-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
}

.banner {
    background-color: var(--amarillo);
}


.barra-superior {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background-color: var(--blanco);
    color: var(--negro);
    min-height: 60px;
    padding: .3rem 5rem .3rem 6rem;
    margin-top: 0;
}

.mini-widgets {
    display: none;
}

@media (min-width: 650px) {
    .mini-widgets {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        align-items: center;
        grid-column: 1 / 3;
    }  
}


.widgets-izq {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}

.mini-widgets__email {
    margin-left: 0;
    margin-right: 2rem;
    color: var(--negro);
    grid-column: 1 / 2;
}
.mini-widgets__tel {
    margin-right: 0;
    margin-left: 2rem;
    color: var(--negro);
    grid-column: 2 / 3;
}

.widgets-der {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    grid-column: 1 / 5;
}

@media (min-width: 650px) {
    .widgets-der {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        align-items: center;
        grid-column: 4 / 5;
    } 
}


.widgets-der__icons {
    display: flex;
    align-items: center;
    justify-content:space-evenly;
}

.mini-widgets__whats {
    grid-column: 1 / 2;
    margin-left: 1rem;
    margin-right: 1rem;
}
.mini-widgets__fac {
    grid-column: 2 / 3;
    margin-left: 1rem;
    margin-right: 1rem;
}
.mini-widgets__ins {
    grid-column: 3 / 4;
    margin-left: 1rem;
    margin-right: 1rem;
}

.widgets {
    list-style: none;
    text-align: center;
    margin: 0;
    grid-row: 2 / 3;
} 

@media (min-width: 768px) {
    .widgets {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        list-style: none;
        text-align: center;
        margin: 0;
        grid-column: 2 / 4;
        grid-row: 1 / 3;
        padding: .7rem 2rem 0.7rem 0.7rem;
        column-gap: 0.5rem;
    } 
}

.widgets__logo {
    text-align: center;
    padding: 1rem 1rem 1rem 2rem;
}


@media (min-width: 768px) {
    .widgets__logo {
        text-align: center;
        padding: 1rem;
        grid-column: 1 / 2;
        grid-row: 1 / 3;
    }
}


@media (min-width: 768px) {
    .widgets__borde {
        display: flex;
        justify-content: center;
        flex-direction: row;
        align-items: center;
        border-right: solid #FFFFFF;
        border-width: 1.5px;
        height: 25px;
        position: relative;
    } 
}

.widget-principal__info:hover {
    color: var(--negro);

}

.widget-principal__info {
    font-family: var(--fuenteHeading);
    font-size: 2.5rem;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--blanco);
}


.widget-principal__info {
    font-size: 2.2rem;
     
}

@media (min-width: 1024px) {
    .widget-principal__info {
        font-size: 3rem;
    }
     
}
@media (max-width: 384px) {
    .widget-principal__info {
        font-size: 2rem;
    }
     
}


.blog-texto__ubicacion {
  display: grid;    
  grid-template-rows: repeat(2, 1fr);
  align-items: center;
  grid-column: 1 / 5;
  grid-row: 1 / 3;
  text-align: center;
}

.contenedor-3 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    height: 40rem;
    
}

@media (min-width: 769px) {
    .contenedor-3 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(2, 1fr);
        height: 50rem;
    }
}

@media (max-width: 450px) {
    .contenedor-3 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        height: 50rem;
    }
}

.blog-grid {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    grid-column: 1 / 5;
    grid-row: 1 / 3;
    background-color: rgb(4 4 4 / 30%);
}

.imagen-blog__voley, .imagen-blog__futbol, .imagen-blog__ftennis, .imagen-blog__servicios {
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.imagen-blog__voley {
    background-image: url(../img/voley.webp);
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    
}

@media (max-width: 450px) {
    .imagen-blog__voley {
        background-image: url(../img/voley.webp);
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        
    }
}

.imagen-blog__futbol {
    background-image: url(../img/futbol.webp);
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    
}
@media (max-width: 450px) {
    .imagen-blog__futbol {
        background-image: url(../img/futbol.webp);
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        
    }
}

.imagen-blog__ftennis {
    background-image: url(../img/tenis.webp);
    grid-column: 3 / 4;
    grid-row: 1 / 3; 
}

@media (max-width: 450px) {
    .imagen-blog__ftennis {
        background-image: url(../img/tenis.webp);
        grid-column: 1 / 2;
        grid-row: 2 / 3; 
    }
}

.imagen-blog__servicios {
    background-image: url(../img/servicios.webp);
    grid-column: 4 / 5;
    grid-row: 1 / 3;
    
}

@media (max-width: 450px) {
    .imagen-blog__servicios {
        background-image: url(../img/servicios.webp);
        grid-column: 2 / 3;
        grid-row: 2 / 3; 
    }
}

.imagen-blog {
    display: flex;
    justify-content: center;
    align-items: center;
}

.imagen-grid {
    background-color: antiquewhite; 
    padding: .3rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    grid-column: 1 / 5;
    grid-row: 1 / 3;
}  

@media (max-width: 450px) {
    .imagen-grid {
        background-color: antiquewhite; 
        padding: .3rem;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
        grid-column: 1 / 3;
        grid-row: 1 / 3;
    }  
}

.texto-grid {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-row: 1 / 2;
    flex-direction: column;
    line-height: 1;
    margin-top: 4rem;
}

.texto-grid__titulo {
    font-family: var(--fuenteParrafos);
    font-size: 4rem;
    font-weight: bold;
    color: var(--blanco);
}

@media (min-width: 769px) {
    .texto-grid__titulo {
        font-family: var(--fuenteParrafos);
        font-size: 7rem;
        font-weight: bold;
        color: var(--blanco);
    }    
}

.texto-grid__stitulo {
    font-family: var(--fuenteParrafos);
        font-size: 1.5rem;
        font-weight: 400;
        color: var(--blanco);

} 

@media (min-width: 769px) {
    .texto-grid__stitulo {
        font-family: var(--fuenteParrafos);
        font-size: 2.5rem;
        font-weight: 400;
        color: var(--blanco);
    } 
}

.elementor {
    margin-left: 5rem;
    margin-right: 5rem
}
@media (max-width: 450px) {
    .elementor {
        display: grid;
        grid-template-rows: repeat(4, 1fr);
        align-items: center;
        margin-left: 2rem;
        margin-right: 2rem;
    }
}


@media (min-width: 768px) {
    .elementor {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        align-items: center;
        height: 20rem;
        margin-top: -10rem;
        margin-left: 7rem;
        margin-right: 7rem;
    }
}

.elementor-bg {
    background-color: var(--celeste1);
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    align-items: center;
    height: 20rem;
    grid-column: 1 / 1;
}

@media (max-width: 450px) {
    .elementor-bg {
        background-color: var(--celeste1);
        display: grid;
        grid-template-rows: repeat(1, 1fr);
        align-items: center;
        height: 20rem;
        grid-column: 1 / 5;
    }
     
}

.texto-elementor {
    font-family: var(--fuenteHeading);
    font-size: 5rem;
    color: var(--blanco);
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20rem;
    margin: 0;
    line-height: 6rem;
    text-align: center;        
}

.elementor-widgets {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    height: 20rem;
    grid-column: 2 / 5;
}

@media (max-width: 450px) {
    .elementor-widgets {
        display: grid;
        grid-template-rows: repeat(3, 1fr);
        grid-template-columns: repeat(1, 1fr);
        align-items: center;
        height: 20rem;
        grid-column: 1 / 5;
    }
}

.elementor-widgets__desing {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    height: 20rem;
    grid-column: 1 / 4;
    margin: 0;
    padding: 0;
    line-height: 2rem;
}

@media (max-width: 450px) {
    .elementor-widgets__desing {
        display: grid;
        grid-template-rows: repeat(3, 1fr);
        grid-template-columns: repeat(1, 1fr);
        align-items: center;
        height: 20rem;
        grid-row: 1 / 4;
        grid-column: 1 / 4;
        margin: 0;
        padding: 0;
        line-height: 2rem;
    } 
}

.elementor-widgets__sorteo, .elementor-widgets__deporte, .elementor-widgets__servicio {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 20rem;
}

.elementor-widgets__sorteo {
    background-color: var(--blanco);
    grid-column: 1 / 2;
}

@media (max-width: 450px) {
    .elementor-widgets__sorteo {
        background-color: var(--blanco);
        grid-row: 1 / 2;
        grid-column: 1 / 4;
    }  
}

.elementor-widgets__deporte {
    background-color: var(--celeste1);
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}

@media (max-width: 450px) {
    .elementor-widgets__deporte {
        background-color: var(--celeste1);
        grid-row: 3 / 4;
        grid-column: 1 / 4;
    }  
}

.elementor-widgets__servicio {
    background-color: #FF9900;
    grid-column: 3 / 4;

}

@media (max-width: 450px) {
    .elementor-widgets__servicio {
        background-color: #FF9900;
        grid-row: 4 / 5;
        grid-column: 1 / 5;
    }  
}

.elementor-widgets__texto {
    font-family: var(--fuenteParrafos);
    font-size: 2rem;
    font-weight: bold;
    text-transform: uppercase;
}

.elementor-widgets__texto2 {
    font-family: var(--fuenteParrafos);
    font-size: 2rem;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--blanco);
}

.elementor-buton__style {
    font-family: var(--fuenteParrafos);
    font-size: 1.2rem;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--blanco);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 4rem;
    width: 12rem;
    
}

@media (min-width: 768px) {
    .elementor-buton__style {
        font-family: var(--fuenteParrafos);
        font-size: 1.5rem;
        font-weight: bold;
        text-transform: uppercase;
        color: var(--blanco);
        display: flex;
        justify-content: center;
        align-items: center;
        height: 5rem;
        width: 15rem;
        
    }
}


.elementor-buton {
    background-color: #FF9900;
}

.elementor-buton2 {
    background-color: var(--celeste1);
}

.footer {
    background-color: var(--celeste1);
    margin-top: 2rem;
    padding: 2rem 3rem;
}

.barra-inferior {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    color: var(--blanco);
    min-height: 60px;
    padding: .3rem 5rem .3rem 6rem;
}

/* APP SORTEO*/

.sorteo {
    background-image: url(../img/sorteo.webp);
    height: 60rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    align-items: center;
}

.sorteo__texto {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    color: var(--blanco);
    background-color: rgb(4 4 4 / 60%);
    width: 100%;
    height: 100%;
}

.sorteo__texto-desing {
    font-size: 2rem;
}

/* SORTEO DE JUGADORES */
@media (min-width: 450px) {
    .contenedor-sorteo{
        margin-left: 2rem;
        margin-right: 2rem;
    }  
}
.style__p {
    margin-top: 0;
}
.style__p, .style__p2 {
    font-size: 1.4rem;
    line-height: 1;
    text-align: justify;
}
.participantes {
    margin-top: 2rem;
}
@media (max-width: 450px) {
    .participantes {
        padding-top: 2rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

.participantes-style {
    padding: .5rem;
    white-space: normal;
    background-color: var(--secundario);
    border: solid var(--celeste2);
    border-radius: .8rem;
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.5;
}
@media (max-width: 450px) {
    .jugadores-FT, .jugadores-FT2, .jugadores-FT3, .jugadores-FT4, .jugadores-FT5, .jugadores-FT6 {
        font-size: 2.5rem;
        line-height: .5;
        outline-offset: 0;
    }
}

/* input[type="search"]::-webkit-search-decoration, */
input[type="search"]::-webkit-search-cancel-button
/* input[type="search"]::-webkit-search-results-button, */
/* input[type="search"]::-webkit-search-results-decoration*/ { display: none; }


.span-style, .span-style2, .span-style3, .span-style4, .span-style5, .span-style6 {
    line-height: 1;
}
.span-svg, .span-svg2, .span-svg3, .span-svg4, .span-svg5, .span-svg6 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(194, 193, 193);
    border-radius: .4rem;
    
}

.icon, .icon-tabler, .icon-tabler-circle-x {
    color: rgb(194, 193, 193)!important;
}
.icon, .icon-tabler, .icon-tabler-circle-x :hover{
    color: rgb(246, 66, 66); 
    cursor: pointer;
    
}
@media (max-width: 450px) {
    .participantes__datos, .segundo__nivel, .tercer__nivel, .cuarto__nivel, .quinto__nivel, .arqueros2 {
        display: flex;
        align-items: center;
        column-gap: 1rem;
    }
    
}
.participantes__datos, .segundo__nivel, .tercer__nivel, .cuarto__nivel, .quinto__nivel, .arqueros2 {
    display: grid;
    align-items: center;
    column-gap: 1rem;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: .3rem;
}

@media (max-width: 450px) {
    .imput, .imputDos, .imputTres, .imputCuatro, .imputQuinto, .imputSeis {
        grid-column: 1 / 5;
        text-align: center;
    }
}

.boton__style {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.5rem;
    
}
#boton {
    font-size: 100%;
    border-radius: 1rem;
    background-color: var(--amarillo);
    font-weight: bold;
}
@media (min-width: 450px) {
    .equipos_participantes {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
        background-color: #ebebeb;
        padding: 1rem;
    }
}
.equipos_participantes {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
    background-color: #ebebeb;
}

.equipoSorteado {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* grid-template-rows: repeat(4, 1fr); */
    align-items: center;
    text-align: left;
    column-gap: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

#equipoSorteado__ubicacion {
    background-color:var(--secundario);
    border-radius: 1rem;
    margin-bottom: 0;
}
ul#equipoSorteado__ubicacion {
    font-weight: bold;
    
}

ul#equipoSorteado__ubicacion li{
    font-weight:400;
    background-color: var(--celeste1);
    text-align: left;
    border-left: 1rem;
    
    
}