/* =========================================================
   CONTENEDOR GENERAL
   ========================================================= */

#seccion_copas {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 15px 30px;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    color: rgba(79, 122, 181, 1.00);
}


/* =========================================================
   TITULO DE CATEGORIA
   ========================================================= */

#seccion_copas h4 {
    margin: 5px 0 15px;
    padding: 0;

    text-align: center;
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;
    text-transform: uppercase;

    color: rgba(79, 122, 181, 1.00);

}


/* =========================================================
   TABLA DE POSICIONES
   ========================================================= */

.tab-posiciones {
    width: 100%;
    max-width: 1075px;
    margin: 0 auto;

    border-collapse: collapse;
    border-spacing: 0;

    table-layout: fixed;

    font-size: 12px;
}


/* Celdas generales */

.tab-posiciones td {
    height: 30px;
    padding: 5px 8px;

    border: 1px solid #8da8c2;

    text-align: center;
    vertical-align: middle;

    box-sizing: border-box;
}


/* =========================================================
   ANCHOS DE COLUMNAS
   ========================================================= */

.tab-posiciones td:first-child {
    width: 49%;
}

.tab-posiciones td:nth-child(2) {
    width: 13%;
}

.tab-posiciones td:nth-child(n+3) {
    width: 9.5%;
}


/* =========================================================
   CABECERA POSICIONES
   ========================================================= */

.tab-posi-1-fila td {
    height: 31px;

    background: #cbdbe8;

    /*color: #427ee8;*/
    color: rgba(79, 122, 181, 1.00);
    font-size: 14px;
    font-weight: bold;
}


/* =========================================================
   EQUIPO
   ========================================================= */

.tab-posi-td-equipo {
    font-weight: bold;
    color: rgba(79, 122, 181, 1.00);

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* =========================================================
   TOTAL
   ========================================================= */

.tab-posi-td-total {
    background: #e5eef4;

    color: red;

    font-weight: bold;
}

.tab-posi-td-total p {
    margin: 0;
    padding: 0;

    color: red;
    font-weight: bold;
}


/* =========================================================
   RESTO DE CELDAS
   ========================================================= */

.tab-posi-tr td {
    background: #ffffff;

    color: rgba(79, 122, 181, 1.00);
    
    font-weight: normal;
}


/* =========================================================
   TABLAS DE RESULTADOS
   ========================================================= */

/*
   El HTML utiliza una tabla exterior que contiene las
   diferentes fechas.
*/

#seccion_copas > table:last-of-type {
    width: 100% !important;
    margin-top: 35px;

    border-collapse: separate;
    border-spacing: 20px 0;
}


/* Cada columna de la tabla exterior */

#seccion_copas > table:last-of-type > tbody > tr > td {
    width: 50%;
    padding: 0;

    vertical-align: top;
}


/* =========================================================
   TABLA DE CADA FECHA
   ========================================================= */

#res-fecha-1,
#res-fecha-2,
#res-fecha-3,
#res-fecha-4,
#res-fecha-5 {
    width: 100%;
    margin-bottom: 25px;
}


/* Tabla interna */

#res-fecha-1 table,
#res-fecha-2 table,
#res-fecha-3 table,
#res-fecha-4 table,
#res-fecha-5 table {
    width: 100% !important;

    border-collapse: collapse;
    border-spacing: 0;

    table-layout: fixed;

    font-size: 12px;
}


/* =========================================================
   TITULO "FECHA 01"
   ========================================================= */

.tab-resul-1-fila td {
    height: 31px;

    padding: 5px;

    border: 1px solid #8da8c2;

    background: #cbdbe8;

    color: rgba(79, 122, 181, 1.00);

    text-align: center;

    font-weight: bold;
}


/* =========================================================
   CABECERA RESULTADOS
   ========================================================= */

.tab-resul-td-equipo {
    height: 30px;

    padding: 5px 6px;

    border: 1px solid #8da8c2;

    background: #eeeeee;

    color: rgba(79, 122, 181, 1.00);

    text-align: center;

    font-weight: bold;

    box-sizing: border-box;
}


/* =========================================================
   CELDAS RESULTADOS
   ========================================================= */

.tab-resul-td {
    height: 31px;

    padding: 5px 6px;

    border: 1px solid #8da8c2;

    background: #ffffff;

    color: rgba(79, 122, 181, 1.00);

    text-align: center;
    vertical-align: middle;

    box-sizing: border-box;

    font-weight: normal;
}


/* =========================================================
   ANCHOS RESULTADOS
   ========================================================= */

.tab-resul-td-equipo:first-child,
.tab-resul-td:first-child {
    width: 36%;
}

.tab-resul-td-equipo:nth-child(2),
.tab-resul-td:nth-child(2) {
    width: 24%;
}

.tab-resul-td-equipo:nth-child(3),
.tab-resul-td:nth-child(3) {
    width: 40%;
}


/* =========================================================
   RESULTADO CENTRAL
   ========================================================= */

/*
   También sobrescribe el style inline:
   color:rgba(66,126,232,1.00)
   font-weight:bold;
*/

.tab-resul-td:nth-child(2) {
    color: #427ee8 !important;
    font-weight: bold !important;
}


/* =========================================================
   LIBRE
   ========================================================= */

.tab-posi-td-equipo {
    text-align: center;
}


/* =========================================================
   RESPONSIVE - TABLET
   ========================================================= */

@media (max-width: 768px) {

    #seccion_copas {
        padding-left: 10px;
        padding-right: 10px;
    }

    #seccion_copas h4 {
        font-size: 13px;
    }

    .tab-posiciones {
        font-size: 11px;
    }

    .tab-posiciones td {
        padding: 5px 4px;
    }

    .tab-posi-td-equipo {
        white-space: normal;
        line-height: 14px;
    }

    /*
       Las fechas pasan a una sola columna
    */

    #seccion_copas > table:last-of-type {
        display: block;

        width: 100% !important;

        margin-top: 25px;

        border-spacing: 0;
    }

    #seccion_copas > table:last-of-type > tbody {
        display: block;
        width: 100%;
    }

    #seccion_copas > table:last-of-type > tbody > tr {
        display: block;
        width: 100%;
    }

    #seccion_copas > table:last-of-type > tbody > tr > td {
        display: block;

        width: 100%;

        padding: 0;
        margin-bottom: 20px;
    }

    #res-fecha-1,
    #res-fecha-2,
    #res-fecha-3,
    #res-fecha-4,
    #res-fecha-5 {
        width: 100%;
        margin-bottom: 20px;
    }

    #res-fecha-1 table,
    #res-fecha-2 table,
    #res-fecha-3 table,
    #res-fecha-4 table,
    #res-fecha-5 table {
        font-size: 11px;
    }

    .tab-resul-td,
    .tab-resul-td-equipo {
        padding: 5px 3px;
    }
}


/* =========================================================
   RESPONSIVE - CELULARES
   ========================================================= */

@media (max-width: 480px) {

    #seccion_copas {
        padding: 0 5px 20px;
    }

    #seccion_copas h4 {
        margin-bottom: 12px;
        font-size: 13px;
    }

    /*
       Tabla posiciones con scroll horizontal.
       Evita que los nombres y columnas se deformen.
    */

    .tab-posiciones {
        display: block;

        width: 100%;
        overflow-x: auto;

        white-space: nowrap;

        font-size: 10px;
    }

    .tab-posiciones tbody {
        width: 100%;
    }

    .tab-posiciones td {
        height: 28px;
        padding: 4px 5px;
    }

    /*
       Damos un ancho mínimo para que siga siendo legible
    */

    .tab-posiciones {
        min-width: 480px;
    }


    /* Resultados */

    .tab-resul-td,
    .tab-resul-td-equipo {
        height: 29px;

        padding: 4px 2px;

        font-size: 10px;
    }

    .tab-resul-1-fila td {
        height: 29px;

        font-size: 11px;
    }

    #res-fecha-1,
    #res-fecha-2,
    #res-fecha-3,
    #res-fecha-4,
    #res-fecha-5 {
        margin-bottom: 15px;
    }
}