*{

}

    .datatable th
        {
	        background-image: linear-gradient(#B60A44 0%, #190072 100%);
	        /*background-image: linear-gradient(#05041E 0%, #05041E 100%);*/
        }


    .botonPago {
            cursor: pointer;
            background-color: white; 
            color: #B60A44;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            border-radius: 12px;
            border: 2px solid #B60A44;
            -webkit-transition-duration: 0.4s; 
            transition-duration: 0.4s;
            font-family: 'Roboto Slab', serif;
        }

        .botonPago:hover {
            background-color: #B60A44; 
            color: white;
        }


    .botonPopup {
            cursor: pointer;
            background-color: white; 
            color: #B60A44;
            padding: 6px 12px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 12px;
            border-radius: 12px;
            border: 2px solid #B60A44;
            -webkit-transition-duration: 0.4s; 
            transition-duration: 0.4s;
        }

        .botonPopup:hover {
            background-color: #B60A44; 
            color: white;
        }


    /* Contenedor */
    .tabla-saldos {
        margin-top: 10px;
        border: 1px solid #ddd;
        border-radius: 6px;
        overflow: hidden;
        background-color: #fff;
    }

    /* Encabezado */
    .tabla-saldos .tabla-header {
        background-color: #337ab7;
        color: #fff;
        font-size: 13px;
        font-weight: 600;
        height: 42px;
        vertical-align: middle;
    }

    /* Filas */
    .tabla-saldos .tabla-row {
        background-color: #fff;
        color: #333;
        font-size: 14px;
        height: 45px;
        vertical-align: middle;
    }

    /* Hover */
    .tabla-saldos tbody tr:hover {
        background-color: #FAFAE6;
    }

    /* Seleccionar */
    .tabla-saldos .col-seleccionar {
        width: 80px;
        text-align: center;
        vertical-align: middle;
        padding: 0px 15px !important;
        font-family: 'Roboto Slab', serif;
    }

    /* Concepto */
    .tabla-saldos .col-concepto {
        width: 400px;
        text-align: left;
        vertical-align: middle;
        padding: 0px 15px !important;
        font-family: 'Roboto Slab', serif;
    }
     
    /* Costo */
    .tabla-saldos .col-costo {
        width: 120px;
        text-align: right;
        padding-right: 20px;
        vertical-align: middle;
        padding: 0px 15px !important;
        font-family: 'Roboto Slab', serif;
    }

    /* Checkbox */
    .tabla-saldos input[type="checkbox"] {
        transform: scale(1.15);
        cursor: pointer;
    }

    /* Mensaje cuando no hay registros */
    .tabla-vacia {
        padding: 20px;
        text-align: center;
        color: #777;
        font-size: 14px;
    }

    /* Encabezado normal */
    .tabla-saldos .tabla-header,
    .tabla-saldos .tabla-header th {
        background: linear-gradient(
        to bottom,
        #D42A67 0%,
        #4A2A9A 50%,
        #5C91FF 100%
    ) !important;

    color: white !important;
        font-size: 13px;
        font-weight: 600;
        height: 42px;
        vertical-align: middle;
    }

    /* Evitar cambio de color al pasar el mouse */
    .tabla-saldos .tabla-header:hover,
    .tabla-saldos .tabla-header:hover th {
        background-color: #337ab7 !important;
        color: #fff !important;
    }


    .textbox-egresado {
        width: 300px;
        padding: 8px 12px;
        border: 1px solid #ced4da;
        border-radius: 5px;
        background-color: #f5f5f5;
        color: #555;
        font-size: 14px;
        box-sizing: border-box;
    }

    .panel-total {
        width: 747px;
        margin: 0 auto;
        text-align: center;
    }


    .panel-datos {
        width: 571px;
        margin: 0 auto;
        font-family: 'Roboto Slab', serif;
    }

    .panel-datos-titulo {
        text-align: center;
        margin-bottom: 25px;
    }

    .campo-datos {
        display: flex;
        align-items: center;
        margin-bottom: 3px;
    }

    .campo-datos-label {
        width: 200px;
        text-align: left;
        padding-right: 15px;
        font-family: 'Roboto Slab', serif;
    }

    .campo-datos-control {
        width: 300px;
        text-align: left;
    }

    .panel-datos-boton {
        text-align: center;
        margin-top: 25px;
    }


    .panel-importante {
        margin: 15px auto;
        max-width: 747px;
        border: 1px solid #d6d8d9;
        border-radius: 6px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.08);
        overflow: hidden;
        font-family: 'Roboto Slab', serif;
    }

    .panel-importante .panel-heading {
        background-color: #D6D8D9;
        color: #FF9933;
        font-size: 16px;
        padding: 10px 15px;
        border-bottom: 1px solid #c7c9ca;
        font-family: 'Roboto Slab', serif;
    }

    .panel-importante .panel-heading .glyphicon {
        margin-right: 7px;
    }

    .panel-importante .panel-body {
        background-color: #f7f7f7;
        padding: 5px 20px 10px 20px;
    }

    .aviso-item {
        padding: 12px 5px;
        border-bottom: 1px solid #e1e1e1;
        color: #555;
        font-size: 14px;
        line-height: 1.6;
        text-align: justify;
    }

    .aviso-facturacion {
        color: #444;
    }

    .aviso-contacto {
        padding: 14px 5px 8px 5px;
        color: #444;
        font-size: 14px;
        line-height: 1.6;
    }

    .aviso-contacto span:last-child {
        color: #6666FF;
    }


    /*Grid Saldos*/

    /* CONTENEDOR */
    .grid-saldo-container {
        width: 100%;
        max-width: 1100px;
        margin: 20px auto;
        overflow-x: auto;
        box-sizing: border-box;
    }


    /* GRID PRINCIPAL */
    .grid-saldo {
        width: 1100px;
        border-collapse: separate !important;
        border-spacing: 0;
        border: 1px solid #D6D8D9 !important;
        border-radius: 6px;
        overflow: hidden;
        background-color: #FFFFFF;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;

        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }


    /* ENCABEZADO */
    .grid-saldo th {
        padding: 5px 8px;

        color: #FFFFFF !important;
        font-family: 'Roboto Slab', serif;
        font-size: 14px;
        font-weight: bold;

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

        /* DEGRADADO */
        background: linear-gradient(
            to bottom,
            #D42A67 0%,
            #4A2A9A 50%,
            #5C91FF 100%
        ) !important;

        border: none !important;
        border-bottom: 2px solid #6666FF !important;
    }


    /* CELDAS */
    .grid-saldo td {
        padding: 10px 8px;

        color: #444444;
        font-family: 'Roboto Slab', serif;
        font-size: 14px;

        vertical-align: middle;

        border: none !important;
        border-bottom: 1px solid #E5E5E5 !important;

        background-color: #FFFFFF;
    }


    /* FILAS ALTERNADAS */
    .grid-saldo tr:nth-child(even) td {
        background-color: #F8F8F8;
    }


    /* EFECTO AL PASAR EL MOUSE */
    .grid-saldo tr:hover td {
        background-color: #F1F2FF;
    }


    /* ÚLTIMA FILA */
    .grid-saldo tr:last-child td {
        border-bottom: none !important;
    }


    /* ANCHOS */
    .grid-saldo .col-clave {
        width: 100px;
        text-align: center;
    }

    .grid-saldo .col-concepto {
        width: 400px;
        text-align: left;
    }

    .grid-saldo .col-ciclo {
        width: 100px;
        text-align: center;
    }

    .grid-saldo .col-importe {
        width: 100px;
        text-align: right;
        white-space: nowrap;
    }

    .grid-saldo .col-prorroga {
        width: 80px;
        text-align: center;
    }

    .grid-saldo .col-detalles {
        width: 120px;
        text-align: center;
    }


    /* BOTÓN DETALLES */
    .grid-saldo-detalles {
        color: #6666FF !important;
        font-family: 'Roboto Slab', serif;
        font-size: 14px;
        font-weight: bold;

        text-decoration: none;
        white-space: nowrap;

        transition: all 0.2s ease;
    }


    .grid-saldo-detalles:hover {
        color: #4444DD !important;
        text-decoration: underline;
    }


    /* SIN REGISTROS */
    .grid-saldo-vacio {
        padding: 20px;

        text-align: center;

        color: #666666;
        font-family: 'Roboto Slab', serif;
        font-size: 14px;
    }


    .grid-saldo-vacio .glyphicon {
        margin-right: 7px;
        color: #6666FF;
    }


    /*Grid Saldos Detalle*/


    /* CONTENEDOR */
    .grid-saldo-detalle-container {
        width: 100%;
        max-width: 930px;
        margin: 20px auto;
        overflow-x: auto;
        box-sizing: border-box;
    }


    /* GRID */
    .grid-saldo-detalle {
        width: 930px;

        border-collapse: separate !important;
        border-spacing: 0;

        border: 1px solid #D6D8D9 !important;
        border-radius: 6px;

        overflow: hidden;

        background-color: #FFFFFF;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;

        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }


    /* ENCABEZADO */
    .grid-saldo-detalle th {
        padding: 8px 8px;

        color: #FFFFFF !important;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;
        font-weight: bold;

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

        /* MISMO DEGRADADO DEL GRID ANTERIOR */
        background: linear-gradient(
            to bottom,
            #D42A67 0%,
            #4A2A9A 50%,
            #5C91FF 100%
        ) !important;

        border: none !important;
        border-bottom: 2px solid #6666FF !important;
    }


    /* CELDAS */
    .grid-saldo-detalle td {
        padding: 10px 8px;

        color: #444444;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;

        vertical-align: middle;

        border: none !important;
        border-bottom: 1px solid #E5E5E5 !important;

        background-color: #FFFFFF;
    }


    /* FILAS ALTERNADAS */
    .grid-saldo-detalle tr:nth-child(even) td {
        background-color: #F8F8F8;
    }


    /* EFECTO HOVER */
    .grid-saldo-detalle tr:hover td {
        background-color: #F1F2FF;
    }


    /* ÚLTIMA FILA */
    .grid-saldo-detalle tr:last-child td {
        border-bottom: none !important;
    }


    /* COLUMNAS NUMÉRICAS */
    .grid-saldo-detalle td:nth-child(5),
    .grid-saldo-detalle td:nth-child(6),
    .grid-saldo-detalle td:nth-child(7) {
        text-align: right;
        white-space: nowrap;
    }


    /* MENSAJE SIN REGISTROS */
    .grid-saldo-detalle-vacio {
        padding: 20px;

        text-align: center;

        color: #666666;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;
    }


    .grid-saldo-detalle-vacio .glyphicon {
        margin-right: 7px;
        color: #6666FF;
    }


    /*Grid Consulta Recibos*/

    /* CONTENEDOR */
    .grid-facturacion-container {
        width: 100%;
        max-width: 1200px;
        margin: 20px auto;
        overflow-x: auto;
        box-sizing: border-box;
    }


    /* GRID */
    .grid-facturacion {
        width: 1130px;

        border-collapse: separate !important;
        border-spacing: 0;

        border: 1px solid #D6D8D9 !important;
        border-radius: 6px;

        overflow: hidden;

        background-color: #FFFFFF;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;

        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }


    /* ENCABEZADO */
    .grid-facturacion th {
        padding: 11px 7px;

        color: #FFFFFF !important;

        font-family: 'Roboto Slab', serif;
        font-size: 13px;
        font-weight: bold;

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

        background: linear-gradient(
            to bottom,
            #D42A67 0%,
            #4A2A9A 50%,
            #5C91FF 100%
        ) !important;

        border: none !important;
        border-bottom: 2px solid #6666FF !important;
    }


    /* CELDAS */
    .grid-facturacion td {
        padding: 9px 7px;

        color: #444444;

        font-family: 'Roboto Slab', serif;
        font-size: 13px;

        vertical-align: middle;

        border: none !important;
        border-bottom: 1px solid #E5E5E5 !important;

        background-color: #FFFFFF;
    }


    /* FILAS ALTERNADAS */
    .grid-facturacion tr:nth-child(even) td {
        background-color: #F8F8F8;
    }


    /* EFECTO HOVER */
    .grid-facturacion tr:hover td {
        background-color: #F1F2FF;
    }


    /* ÚLTIMA FILA */
    .grid-facturacion tr:last-child td {
        border-bottom: none !important;
    }


    /* IMPORTES */
    .grid-facturacion td:nth-child(5),
    .grid-facturacion td:nth-child(6),
    .grid-facturacion td:nth-child(7) {
        text-align: right;
        white-space: nowrap;
    }


    /* BOTONES PDF / XML */
    .grid-facturacion-boton {
        color: #6666FF !important;

        font-family: 'Roboto Slab', serif;
        font-size: 13px;

        font-weight: bold;

        text-decoration: none;
        white-space: nowrap;

        transition: all 0.2s ease;
    }


    /* HOVER PDF / XML */
    .grid-facturacion-boton:hover {
        color: #4444DD !important;
        text-decoration: underline;
    }


    /* MENSAJE SIN REGISTROS */
    .grid-facturacion-vacio {
        padding: 20px;

        text-align: center;

        color: #666666;

        font-family: 'Roboto Slab', serif;
        font-size: 14px;
    }


    .grid-facturacion-vacio .glyphicon {
        margin-right: 7px;
        color: #6666FF;
    }