/*Leyenda*/
.leyenda {
    display: inline-block;
    width: 100%;
    color: #fff;
    font-size: 1.1em;
    text-align: right;
    text-transform: uppercase;
}

    .leyenda > * {
        display: inline-block;
        vertical-align: middle;
        margin-right: 15px;
    }
    /*Albaranes*/
    .leyenda .leyenda-EnCurso {
        margin-right: 10px;
    }

        .leyenda .leyenda-EnCurso::before, .leyenda .leyenda-Validado::before, .leyenda .leyenda-FacturaVencida::before, .leyenda-Abono::before,
        .leyenda-Fondeado::before, .leyenda-PracticoABordo::before, .leyenda-LlamadoFondeo::before, .leyenda-AsignadoPOB::before,
        .leyenda-APZona2::before, .leyenda-APZona1::before, .leyenda-AvisadoPractico::before, .leyenda .leyenda-FacturaCobrada::before,
        .leyenda .leyenda-HoraEfectiva::before, .leyenda-FacturaAnulada::before, .leyenda-Adelantado::before, .leyenda-DebeManiobra::before,
        .leyenda-PracticoABordoBarranquilla::before, .leyenda .leyenda-AlbaranServicioEspecial::before, .leyenda .leyenda-Facturado::before,
        .leyenda .leyenda-Exempts::before, .leyenda .leyenda-Deriva::before, .leyenda-BuqueRetenido::before, .leyenda .leyenda-GruaOperativa::before,
        .leyenda .leyenda-GruaNoOperativa::before, .leyenda .leyenda-GruaAveriada::before, .leyenda .leyenda-GruaAveriada2::before,
        .leyenda .leyenda-EditadoConsignatario::before {
            content: "";
            width: 10px;
            padding-right: 20px;
            margin-right: 10px;
        }

    .leyenda .leyenda-AlbaranServicioEspecial::before {
        background-color: var(--servicio-especial-row);
    }

    .leyenda .leyenda-EnCurso::before {
        background-color: var(--servicio-en-curso-row);
    }

    .leyenda .leyenda-Validado::before {
        background-color: var(--albaran-validado);
    }

    .leyenda .leyenda-AlbaranRevisarImporte::before {
        background-color: var(--albaran-revisar-importe-row);
    }
    /*Factura*/
    .leyenda .leyenda-FacturaVencida::before {
        background-color: var(--factura-vencida-row);
    }

    .leyenda .leyenda-FacturaCobrada::before {
        background-color: var(--factura-cobrada-row);
    }

    .leyenda .leyenda-Abono::before {
        background-color: var(--factura-abono-row);
    }

    .leyenda .leyenda-FacturaAnulada::before {
        background-color: var(--factura-anulada-row);
    }
    /***/
    /*Movimientos*/
    .leyenda .leyenda-Facturado::before {
        background-color: var(--movimiento-facturado-row);
    }

    .leyenda .leyenda-Exempts::before {
        background-color: var(--movimiento-exento-row);
    }
    /***/
    /*Previsiones*/
    .leyenda .leyenda-Fondeado::before {
        background-color: var(--fondeado-row);
    }

    .leyenda .leyenda-PracticoABordo::before {
        background-color: var(--pilotonboard-row);
    }

    .leyenda .leyenda-AsignadoPOB::before {
        background-color: var(--asignadopob-row);
    }

    .leyenda .leyenda-Adelantado::before {
        background-color: var(--adelantado-row);
    }

    .leyenda .leyenda-DebeManiobra::before {
        background-color: var(--debe-maniobra-row);
    }

    .leyenda .leyenda-APZona2::before {
        background-color: var(--aguasportuarias2-row);
    }

    .leyenda .leyenda-HoraEfectiva::before {
        background-color: var(--hora-efectiva-row);
    }

    .leyenda .leyenda-Deriva::before {
        background-color: var(--deriva-row);
    }

    .leyenda .leyenda-APZona1::before {
        background-color: var(--aguasportuarias1-row);
    }

    .leyenda .leyenda-AvisadoPractico::before {
        background-color: var(--llamada-practico-row);
    }

    .leyenda .leyenda-EditadoConsignatario::before {
        background-color: var(--editado-consignatario-row);
    }

    .leyenda .leyenda-LlamadoFondeo::before {
        background-color: var(--llamada-fondeo-row);
    }

    .leyenda .leyenda-BuqueRetenido::before {
        background-color: var(--buque-retenido-row);
    }

    /***/

/*
        La leyenda de prácticos a bordo en previsiones es mas grande 
        porque el ui-widget tiene la fuente mas grande por defecto
    */
.ui-widget .leyenda {
    font-size: 0.99em;
}