/* DEFINICION DE COLORES
#F6F1F1     Gris Claro.
#96BFCE     Azul Claro.

#ACCDE6     Azul (highlight tables)

*/

:root {
    /*--bandera-width:19px;*/
    --bandera-width:13px;
    --bandera-height:13px;
    --escudo-width:13px;
    --escudo-height:13px;
}


/* > Imágenes
------------------------------------------------------------------------*/
.bandera {
    border-style: none;     /* Quita el borde a la celda */
    width: var(--bandera-width);
    height: var(--bandera-height);
    margin-left: 5px;
    margin-right: 5px;
}

.bandera.small {
    width: calc(var(--bandera-width) * 0.75); 
    height: calc(var(--bandera-height) * 0.75);
}

.menu_bloque .bandera {
    padding-left: 5px;
	padding-right: 5px;
}

img.premio {
    width: 16px;
    height: 14px;
    padding-left: 5px;
    padding-right: 2px;
    vertical-align:middle;
}

img.premio.pena {
    width: 32px;
    height: 32px;    
}

img.trofeo {
    height: 89px;
}

.check_box_random {
    display:none;
}

.check_box_random + label{    
    display:inline-block;
    background:url('/images/random.png') no-repeat;    
    height: 16px;
    width: 16px;        
    padding: 0 0 0 0px;
}

.check_box_random:checked + label{
    background:url('/images/manual.png') no-repeat;
}

.highlight_rows tbody tr:hover{
    background-color: #ACCDE6 !important;
}

.striped_rows tbody tr:nth-child(even){
    background-color: #F1F1F1;
}

/* Estilos personales para las Clasificaciones
------------------------------------------------------------------------*/
.clasificacion *{
	font-family: Roboto;
    font-size: 10pt;
}

.clasificacion tr:hover, .clasificacion tr.highLight{
	background-color: #ACCDE6;
}

.clasificacion td {
	border: 1px;
    border-style: solid;
}

.clasificacion td.small {
    font-size: 6pt;
}

.clasificacion.no-borders{
    border: none;
}


.clasificacion A:link, .clasificacion A:visited, .clasificacion A:active {
    font-weight: normal; 
    color: #000080;
}

.clasificacion A:hover {
    font-weight: bold; 
}

/*
.clasificacion:hover {
    font-size: 10pt;
    font-weight: bold;  
}*/

.clasificacion select {
    font-size: 8pt;
    height: 18px;
    padding: 0px;
}

tr.generic_table:hover {
    background-color: #ACCDE6; 
}

td.clasificacionGrupos {
    text-align: center;
    border-style: none;
    width: 25px;
}

th.clasificacionGrupos {
    text-align: center;
    font-weight: bold;
    background-color: #bce1e1;
    border-style: none;
}

/* CSS relacionado con PEÑAS
================================================*/

tr.porra_pena td, tr.porra_pena a {
    font-size: 0.9em !important;
}

tr.pena td, tr.pena a,
tr.pena_unpaid td, tr.pena_unpaid a,
tr.pena_user td, tr.pena_user a {
    font-size: 1.1em !important;
}

tr.pena td.small {
    font-size: 6pt !important;
}

tr.pena_unpaid td{
    background-color: #fd4750;
}

tr.pena_unpaid td.small{
    font-size: 6pt !important;
}

.clasificacion tr.pena {
    background-color: #dadada;
    font-size: 14px !important;    
}

.clasificacion tr.pena_user {
    background-color: #58ABF4;
}

.clasificacion tr.pena:hover, tr.pena_user:hover {
    background-color: #91b7f1 !important;
}

.clasificacion td.porra_pena, td.porra_pena a, 
  td.porra_pena_points_above, td.porra_pena_points_below, td.porra_pena_points_equal {
    font-size: 7pt !important;
}


/* Estilos personales para l@s PARTIDOS/PORRA
------------------------------------------------------------------------*/
.grupo {
	text-align: center;
    font-size: 0.9em;
    font-weight: bold;
    background-color: #B3DEFA;
}

.grupo.left {
    text-align: left;
    padding-left: 5px;
}

.group_name {
    font-size:1.5em;
    padding-left: 3px;
    padding-right: 5px;
}

select.full_cell {
    box-sizing: content-box;
    width: 100%;
    border:none;
}

select.full_cell:focus {
    background-color: #a6cef3;
}

select.full_cell:focus-visible {
    outline: none;
}


.porra {
    font-size:1em;
}

.porra.print {
    font-size:0.9em;
}

.porra .bandera {
    display:table-cell;
}

.porra td.bandera {
    width: 10px;
}

.porra td.resultado {
    width: 1em;
    text-align: center;
}

.porra table {
    border: 2px solid black;
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 2px;
    margin-top: 2px;
}

.porra td.title {
    font-size:1rem;
    font-weight: bold;
    text-align: center;
    background-color: #30a7f7;
}

.porra td.title.sub {
    font-size:0.7rem;
}

.porra.print td.title {
    font-size: 0.9rem;
}

.porra.print td.title.sub {
    font-size: 0.6em;
}

.porraDatos table {
    font-size: 0.8rem;
}

.porraFase, .porraGrupos, .porraEliminatorias {
    font-size: 0.80em;
}

.porraFase .resultado, .porraGrupos .resultado {
    padding-left:3px;
    padding-right:3px;
}

.resultado.icon {
    padding-left:0.5em;
    padding-right:0.5em;
}

.resultado.acierto {
    background-color: #98F998;
}

.resultado.fallo {
    background-color: #F79191;
}

.resultado.falloconpuntos {
    background-color: #FFB868;
}

.resultado.falloconposiblespuntos{
    background-color: #FFFFFF;
}

.porraFase th.pena, .porraFase tr.pena {
    font-weight: bold;
    background-color: #F1F1F1;
}


.porraFase table.partidos tr, 
.porraGrupos table.partidos tr,
.porraEliminatorias table.partidos tr {
    border:1px solid #ada6a6;
}

/*
.porraFase tr.porra_pena {
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 9pt;
}*/

.porraFase td, porraGrupos td {
    border:none;
    vertical-align: middle;    
}

.porraFase td.equipo{
    width: 68px;
}

/*
.porraEliminatorias th {
    background-color: red;
}*/

.porraEliminatorias td.equipo {
    width: 70px;
}

.porraEliminatorias td.fecha, 
.porraEliminatorias td.estadio {
    font-size: 0.7em;
    padding-right: 5px;
    padding-left: 3px;
}

.porraEliminatorias td.fecha {
    font-weight: bold;
}

.porraEliminatorias td.estadio {
    width: 100px;
    font-style: italic;
}



.porraGrupos td.equipo {
    width: 90px;
}

.porraTerceros table {
    border:1px solid #ada6a6;
}

.porraTerceros table.container {
    margin-left: auto;    
    margin-right: auto;        
    margin-top:1em;
    margin-bottom:1em;
}

.porraTerceros td.equipo {
    width: 90px;
}

.porraCuadro table {
    border: 2px solid black;
    border-style: solid;
    padding-left: 0px;
    padding-right: 0px;
}

.porraCuadro td {
	border: 0px solid black;
	height: 9px;
	max-height: 9px;
	font-size: 50%;  /* 8pt */
}

.porraCuadro td.grupo {
    text-align: center;
    /*font-family: Verdana, Arial, Sans-Serif;*/
    font-size: 8pt;
    font-weight: bold;
    background-color: #B3DEFA;
}

.porraCuadro td.equipo{
    width: 95px;
    font-size: 70%;  /* 8pt */
}

.porraCuadro td.equipoIzqda{
    width: 75px;
    font-size: 70%;  /* 8pt */
    border-top-style: none;
    border-bottom-style: none;
}

.porraCuadro td.equipoDrcha{
    width: 75px;
    font-size: 70%;  /* 8pt */    
    border-top-style: none;
    border-bottom-style: none;
}

.porraCuadro td.resultado{
    width: 20px;
    font-size: 80%;  /* 8pt */
    border-left-style: solid;
    text-align: center;
}

.porraCuadro td img.bandera {
	border: none;
    width: var(--bandera-width);
    height: var(--bandera-height);
    margin-left: 1px;
    margin-right: 1px;
}

.porraCuadro td.noBorder {
    border-top-style: none;
    border-bottom-style: none;
}

/*  .---------   */
.porraCuadro TD.border_Full {
    border-style:solid;
    border-width: 1px;
    vertical-align: middle;
}

.porraCuadro TD.border_R {
    border-right: solid;
    border-right-width: 1px;
}

.porraCuadro TD.border_RT {
    border-right: solid;
    border-right-width: 1px;
    border-top: solid;
    border-top-width: 1px;
}

.porraCuadro TD.border_RB {
    border-right: solid;
    border-right-width: 1px;
    border-bottom: solid;
    border-bottom-width: 1px;
}

.porraCuadro TD.border_L {
    border-left: solid;
    border-left-width: 1px;
}

.porraCuadro TD.border_LR {
border-left: solid;
border-left-width: 1px;
border-right: solid;
border-right-width: 1px;
}

.porraCuadro TD.border_LRB {
border-left: solid;
border-left-width: 1px;
border-right: solid;
border-right-width: 1px;
border-bottom: solid;
border-bottom-width: 1px;
}

.porraCuadro TD.border_LT {
    border-left: solid;
    border-left-width: 1px;
    border-top: solid;
    border-top-width: 1px;
}

.porraCuadro TD.border_LTR {
border-left: solid;
border-left-width: 1px;
border-top: solid;
border-top-width: 1px;
border-right: solid;
border-right-width: 1px;
}

.porraCuadro TD.border_LB{
    border-left: solid;
    border-left-width: 1px;
    border-bottom: solid;
    border-bottom-width: 1px;
}

.porraCuadro TD.border_T{
    border-top: solid;
    border-top-width: 1px;
}

.porraCuadro TD.border_B{
    border-bottom: solid;
    border-bottom-width: 1px;
}

.porraCuadro p.campeon {
    font-size: 1.3em;
}

/* Definicion del borde de las Celdas para pintar el Cuadro Final */

.equipoBandera table{
    border: none;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    vertical-align: middle;
}

.equipoBandera td {
	border: none;
	vertical-align: middle;
}

.equipoBandera td.equipo{
    width: 95px;
    font-size: 0.7rem;
}

.equipoBandera td.equipo.drcha{
    text-align: right;
}

.equipoBandera td.equipo.izqda{
    text-align: left;
}



.check_box_3team, .check_box_3team_block {
    display:none;
}

.check_box_3team + label, .check_box_3team_block + label{
    height: 1em;
    width: 1em;
    display:inline-block;    
    padding: 0 0 0 0px;
    vertical-align: text-bottom;
}

.check_box_3team + label{
    background:url('/images/team_question.png') no-repeat;
    background-size: 1em 1em;
}

.check_box_3team:checked + label{
    background:url('/images/team_selected.png') no-repeat;
    background-size: 1em 1em;
}

.check_box_3team_block + label{
    background:url('/images/team_no_selectionable.png') no-repeat;
    background-size: 1em 1em;
}

#tabla_combinaciones span:hover {
    cursor:cell;
    background-color: #98F998;
    text-decoration: underline;
    font-weight: bold;    
}


/*
.equipoBandera td.equipoIzqda{
    width: 75px;
    font-size: 70%;  // 8pt
}

.equipoBandera td.equipoDrcha{
    width: 75px;
    font-size: 70%;  // 8pt
}
*/

/*
.porraFase td.bandera, img.bandera {
	width: 19px;
    height: 13px;
    margin-left: 5px;
    margin-right: 5px;
}


.porraCuadro td.grupo {
    text-align: center;
    font-weight: bold;
    background-color: #B3DEFA;
}*/

.sliders_info{
    display:flex;
    margin-top: 1em;
}

.sliders_info label{
	font-weight: bold;
}

.sliders_info input[type='text']{    
    font-weight: bold;
    color: #63abe4;
    border:0px; 
    background: none;
}

.sliders_info input[type='text']:disabled{
	background-color: inherit !important;
}


#promoSlider{
    position: relative;
    overflow: hidden;
    margin: 2px auto 0 auto;
}

#promoSlider ul {
    position: relative;
    margin: 0;
    padding: 0;
    height: 100px;
    list-style: none;
}

#promoSlider ul li {
    position: relative;
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    width: 150px;
    height: 90px;
}

img[id^='filter']{
    padding:3px;
    margin-right: 2px;
    border: 1px solid;
    border-radius: 5px;
    border-color: #dfe1e2;
}

img[id^='filter']:hover {
    filter: invert(77%) sepia(70%) saturate(600%) hue-rotate(176deg) brightness(108%) contrast(106%);
    border-color: #58ABF4;
}

img[id^='filter'].selected {
    background:#9ee4ff;
}
img[id^='filter_paid'].selected {
    background:#80F9BF;
}
img[id^='filter_unpaid'].selected {
    background:#F9C5CF;
}


/* Estilos personales para ESTADISTICAS
------------------------------------------------------------------------*/
#statistics {
    font-family: 'Roboto';
	border:1px solid black;
	border-style:solid;	
	margin: 5px 2px 0px 2px;
}


#statistics .title {
	border: none;
	text-align: center;
	text-decoration: underline;
	font-size: 11pt;
	font-weight: bold;
}

#statistics .bandera {    
    border: none;
    width: var(--bandera-width);
    height: var(--bandera-height);
}

#statistics .bandera.left {    
    padding: 0px 2px 0px 5px;
}

#statistics .bandera.right {    
    padding: 0px 5px 0px 2px;
}

#statistics .hora {
    font-size: 10pt;
    width: 45px;
    border-style: none;
}

#statistics .equipo, .puesto {
	padding: 0px 2px 0px 2px;
	border: none;
    width: 80px;
    font-size: 10pt;
    border-style: none;
}

#statistics .dato {
    font-size: 10pt;
    width: 80px;
    text-align: center;
    border-style: none;
}

#statistics .resultado {
    font-size: 10pt;
    width: 15px;
    text-align: center;
    border-style: none;
}

#statistics .partido {
    font-size: 10pt;
    width: 85px;
    border-style: none;
}

.radio-button-container {
    display:flex;
    justify-content: flex-end;
    margin-left: 5px;
    font-size:0.7em;
    align-items:flex-end;
}

.radio-image {
    width:100px;
    height:100px;
    margin: 10px;
    cursor:pinter;
    transition: transform 0.3s filter 0.3s;
}

input[type="radio"].radio_goles {
    display: none;
}

input[type="radio"].radio_goles:checked + label {
    filter: invert(55%) sepia(52%) saturate(1476%) hue-rotate(192deg) brightness(96%) contrast(90%);
}