@font-face {
    font-family: 'TravelLight';
    src: url('font/tttravelslight-webfont.woff2') format('woff2'),
        url('font/tttravelslight-webfont.woff') format('woff');
}

@font-face {
    font-family: 'TravelRegular';
    src: url('font/tttravelsregular-webfont.woff2') format('woff2'),
        url('font/tttravelsregular-webfont.woff') format('woff');
}

@font-face {
    font-family: 'TravelMedium';
    src: url('font/tttravelsmedium-webfont.woff2') format('woff2'),
        url('font/tttravelsmedium-webfont.woff') format('woff');
}

@font-face {
    font-family: 'TravelDemiBold';
    src: url('font/tttravelsdemibold-webfont.woff2') format('woff2'), 
        url('font/tttravelsdemibold-webfont.woff') format('woff');
}

@font-face {
    font-family: 'TravelBold';
    src: url('font/tttravelsbold-webfont.woff2') format('woff2'),
        url('font/tttravelsbold-webfont.woff') format('woff');
}

/*@font-face {
    font-family: Sansa Pro Light;
    src: url('font/SansaPro-Light.otf');
    }*/

/* Inicio Peticiones AJAX*/

.ModalBackground {
    background: #000;
    opacity: .60;
    filter: Alpha(Opacity=60);
}

#onetrust-banner-sdk {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

#onetrust-policy-text {
    font-family: TravelRegular !important;
    text-align:justify;
}

.onetrust-banner-options {
    font-family: TravelRegular !important;
}
#onetrust-accept-btn-handler {
    font-family: TravelRegular !important;
}

.ajax__tab_xp .ajax__tab_tab {
    height: 21px !important;
}

/* Fin Peticiones AJAX*/

body {
    margin: 5px 0 10px 0;
    font-family: 'TravelRegular';
    /*background: url(Images/bg_page.jpg) repeat-x #E9E9E9;*/
    height: 100%;
}

.bodyPopup {
    /*margin: 10px !important;*/
}

input {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    color: #000000;
    font-family: 'TravelDemiBold';
    padding: 2px;
    margin-left: 0px;
    text-align: left;
}

.not-active {
    pointer-events: none;
}

.cssBgTop {
    background: url(Images/TM.jpg) repeat-x top;
}

.cssBgUser {
    background: url(Images/bgUser.jpg) repeat-x top;
}

table.cssHeader td {
    margin: 0;
    padding: 0;
}

.cssHeader img {
    vertical-align: bottom;
}

.cssUser img {
    vertical-align: bottom;
}

table.cssUser td {
    vertical-align: top;
}

img {
    border: 0;
}

.pse {
    width: 70%;
}

.cssMenuTop {
    background: url(Images/mnu_m.jpg) repeat-x top;
    width: 100%;
}

    .cssMenuTop td {
        vertical-align: top;
    }

.imgMenu {
    vertical-align: bottom !important;
}

    .imgMenu img {
        vertical-align: bottom !important;
    }

.cssMenuTop input {
    padding: 1px !important;
    vertical-align: bottom;
}

.cssMenuItem {
    color: #000000;
    font-family: 'TravelRegular';
    font-size: 11px;
    margin: 0;
    padding: 0 !important;
    width: 100%;
}

    .cssMenuItem a:link,
    .cssMenuItem a:visited {
        color: #000000;
        cursor: pointer !important;
        display: block;
        font-family: 'TravelRegular';
        font-size: 11px !important;
        font-weight: bold;
        padding: 5px 5px 5px 9px !important;
        text-decoration: none;
    }

.cssBgMenu {
    background-color: none;
}

.cssMenuItem a:hover {
    /*background-color: #712E73;*/
    background-color: #f3f3f3;
    font-family: 'TravelRegular';
    font-size: 11px;
    /*color: #fff;*/
    color: #000000;
    text-decoration: none;
    font-weight: bolder;
    /*background: #983899;*/
    background-color: #f3f3f3;
}

div.ctl00_Menu1_Menu1_0 {
    /*background: url(Images/bottomMenu.gif) repeat-x bottom left;*/
    padding: 0 0 4px 0;
}

div.ctl00_Menu1_Menu1_0 {
    z-index: 100;
    margin: 0;
}

    div.ctl00_Menu1_Menu1_0 td {
        background: none !important;
    }

    div.ctl00_Menu1_Menu1_0 .cssMenuItem {
        /*width: 156px;*/
        /*background: url(Images/bgItemMenu.jpg) repeat-x bottom;*/
    }

        div.ctl00_Menu1_Menu1_0 .cssMenuItem a:link,
        div.Menu1_Menu1_0 .cssMenuItem a:visited {
            font-family: 'TravelRegular';
            font-size: 11px !important;
            /*color: #fff;*/
            color: #000000;
            text-decoration: none;
            font-weight: normal;
            display: block;
            cursor: pointer !important;
            padding: 5px 10px !important;
            background: url(Images/lineMenu.jpg) no-repeat bottom;
        }

        div.ctl00_Menu1_Menu1_0 .cssMenuItem a:hover {
            /*background-color: #6F2E70;*/
            background-color: #f3f3f3;
        }

.cssBgContent {
    background: url(Images/fondo-contenidos.jpg) no-repeat top;
    padding: 5px;
}

.cssBgContent2 {
    background: url(Images/bkg_content.jpg) repeat-y;
}

.cssBgFoot {
    background: url(Images/foot_m.jpg) repeat-x;
}

.cssInfoStyle {
    font: 11px 'TravelRegular';
    color: #9FECFF;
}

    .cssInfoStyle td {
        padding: 0px 3px 5px 3px;
    }

/*WorkAround, es necesario poner en un control asp*/
.cssInfoStyleTD {
    padding: 4px 4px 1px;
    font: 11px 'TravelRegular';
    /*color: #9FECFF;*/
    color: #000000;
}

.cssInfoStyle span {
    font: bold 12px 'TravelRegular';
    color: #FFFFFF;
}

.cssInfoStyleSpan {
    font: bold 12px 'TravelRegular';
    color: #000000;
}

.cssLoginImgBg {
    background: url(Images/img-login-bg.jpg) repeat-y -1px 147px;
}

.cssLoginTopBg {
    background: url(Images/bt-m.jpg) repeat-x;
    height: 42px;
}

.cssLoginBg {
    background: url(Images/bgmor2.jpg) repeat-x;
    font: bold 12px 'TravelRegular';
    color: #FFFFFF;
    padding: 0px;
}

    .cssLoginBg td {
        padding: 5px;
    }

.cssLoginBL {
    background: url(Images/bgmor2.jpg) repeat-x;
    background-color: #6F2E70;
}

.cssLoginBB {
    background: url(Images/bb-m.jpg) repeat-x;
}

.cssLoginMessage {
    position: absolute;
    display: block;
}

.cssBgLinePopup {
    background: url(Images/mnu_m.jpg) repeat-x;
    padding: 5px;
}

.cssCreditos {
    background-position: url(Images/foot_m.jpg) repeat-x;
    padding: 0px 3px 12px 3px;
    background: url(Images/foot_m.jpg) repeat-x;
    font: 10px 'TravelRegular';
    color: #FFF;
    text-align: center;
}

.cssRequired {
    padding: 3px;
    color: rgba(255, 0, 0, 1) !important;
    font-weight: bold !important;
    font-size: 9pt !important;
    vertical-align: middle;
}

.cssBarraUser {
    font: 11px 'TravelRegular';
    padding: 0px 9px 4px 3px;
    color: #CC0000;
}

.csstexcontenido {
    padding: 5px 5px 5px 0;
    margin: 5px;
    font-family: 'TravelRegular';
    font-size: 13px;
    font-weight: bold;
    color: #000000;
    vertical-align: middle;
    text-align: left;
}

.csstitbienvenidos {
    padding: 0px;
    margin: 0 0 7px 0;
    font-family: 'TravelRegular';
    font-size: 16px;
    font-weight: bold;
    color: #2a295c;
    vertical-align: middle;
    text-align: left;
}

.cssLabelTablas {
    padding: 5px;
    margin: 5px;
    font-family: 'TravelRegular';
    font-size: 11px;
    font-weight: bold;
    color: #000000;
    vertical-align: middle;
    text-align: left;
    table-layout: fixed;
}

    .cssLabelTablas span {
        font: bold 12px 'TravelRegular';
        color: #000000;
        white-space: nowrap;
        padding: 0 5px 0 15px;
    }

.borderless td, .borderless th {
    border: none;
}

.cssDiv {
    padding: 0 5px 0 15px;
    white-space: nowrap;
    margin: 5px;
    font-family: 'TravelRegular';
    font-size: 12px;
    font-weight: bold;
    color: #532154;
    vertical-align: middle;
    text-align: left;
}


.cssLabelMensajeError {
    padding-bottom: 5px;
    margin-bottom: 5px;
    font-family: 'TravelRegular';
    font-size: 14px;
    font-weight: bold;
    color: #FF0000;
    vertical-align: middle;
    text-align: left;
}

.MensajeNota {
    font-family: 'TravelRegular';
    font-size: 14px;
    font-weight: bold;
    color: black;
    font-style: italic;
    text-align: left;
}


.divMessageEmailsCargueBenef {
    width: 300px;
    overflow: hidden;
    word-wrap: break-word;
    text-align: center;
}

.cssLabelMensajeEmailsCargueBenef {
    padding: 5px;
    margin: 5px;
    font-family: 'TravelRegular';
    font-size: 14px;
    font-weight: bold;
    color: rgba(42, 41, 92, 1);
    vertical-align: middle;
    text-align: center;
}

/* Estilos para el label de la alerta del modal de confirmación de anulación */
.cssLabelAlertaAnulacion {
    color: rgba(42, 41, 92, 1);
    font-size: 18px;
    text-align: center;
    font-weight: bold;
}

.modalCenter {
    top: 40% !important;
    left: 40% !important;
}

.cssLabelMensaje {
    padding-bottom: 5px;
    margin-bottom: 5px;
    font-family: 'TravelRegular';
    font-size: 14px;
    font-weight: bold;
    color: rgba(42, 41, 92, 1);
    vertical-align: middle;
    text-align: center;
    overflow-wrap: break-word;
}

.cssLabelMensajeAdvertencia {
    background-color: #fff3cd;
    border-color: #ffeeba;
    position: relative;
    padding: 5px;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.mensajePopupExportar {
    font-size: 18px;
}

.cssLabelGridSmall {
    padding: 3px;
    margin: 3px;
    font-family: 'TravelRegular';
    font-size: 9px !important;
    font-weight: bold;
    color: #0099CC;
    vertical-align: middle;
    text-align: left;
}

.cssTablas {
    padding: 5px;
    margin: 8px;
    font-family: 'TravelRegular';
    font-size: 11px;
    font-weight: bold;
    color: #000000;
    background-color: #666666;
}

.cssTextBox {
    margin: 3px 3px 3px 0px;
    padding: 4px 3px;
    color: #000000;
    font-weight: normal;
    font-family: 'TravelRegular';
    /*background: url(Images/bgInput.jpg) repeat-x top;*/
}

.cssTextBoxDisabled {
    font-family: 'TravelRegular';
    margin: 3px 3px 3px 0px;
    padding: 4px 3px;
    border: 1px solid #983899;
    font-size: 11px;
    color: #3C153C;
    font-weight: normal;
    background-color: Gray;
}

.cssFile {
    font-family: 'TravelRegular';
    margin: 3px 3px 3px 0px;
    padding: 4px 3px;
    border: 1px solid #983899;
    font-size: 11px;
    color: #3C153C;
    font-weight: normal;
    height: 24px;
    background: url(Images/bgInput.jpg) repeat-x top;
    width: 300px;
}

.cssTextBoxLogin {
    font-family: 'TravelRegular';
    border: 1px solid #C0C0C0;
    color: #000000;
    font-weight: normal;
    background-color: #f5f5f5;
}

/* grilla */
.cssAlternatingItemStyle {
    border-width: 1px;
    border-color: #E2E2E2;
    font-weight: normal;
    font-size: 11px;
    color: #000;
    font-family: 'TravelRegular';
    background-color: rgba(0, 0, 0, .05);
    text-align: left;
    /*background-image: url(Images/bg_grilla.jpg);*/
    background-repeat: repeat;
    background-position: top;
    border-top-style: solid;
    border-bottom-style: solid;
}

    .cssAlternatingItemStyle td {
        padding: 3px 9px;
    }

    .cssAlternatingItemStyle A {
        font-weight: bold;
        font-size: 11px;
        color: #3FB7D4;
        font-family: 'TravelRegular';
        text-decoration: none;
    }

        .cssAlternatingItemStyle a:hover {
            font-weight: bold;
            font-size: 11px;
            color: #EA0388;
            font-family: 'TravelRegular';
            text-decoration: underline;
        }

.cssItemStyle {
    font-weight: normal;
    font-size: 11px;
    color: #000;
    font-family: 'TravelRegular';
    height: 19px;
    background-color: #ffffff !important;
    border-collapse: collapse;
    text-align: left;
}

    .cssItemStyle td {
        padding: 3px 9px;
    }

    .cssItemStyle A {
        font-weight: bold;
        font-size: 11px;
        color: #3FB7D4;
        font-family: 'TravelRegular';
        text-decoration: none;
    }

        .cssItemStyle a:hover {
            font-weight: bold;
            font-size: 11px;
            color: #EA0388;
            font-family: 'TravelRegular';
            text-decoration: underline;
        }

.cssHeaderStyle {
    font-weight: bold;
    font-size: 13px;
    color: #FFF;
    font-family: 'TravelRegular';
    background-color: #2a295c !important;
    border-bottom: 0px solid #000;
    text-align: center;
}

    .cssHeaderStyle th {
        background-color: #333675;
        color: #FFF;
        padding: 5px 9px;
        text-align: center !important;
    }

/* Asegura colapso y borde externo */
.cssGrid {
    border-left: 1px solid #dee2e6 !important;
    border-collapse: collapse !important;
    width: 100% !important;
    border: 1px solid #CCCCCC; /* borde externo */
    font-family: 'TravelRegular';
}
    /* Filas horizontales más suaves */
    .cssGrid tr {
        border-bottom: 1px solid #E6E6E6; /* más claro */
    }
        /* Bordes horizontales más oscuros (divisor entre filas) */
        .cssGrid tr td {
            border-bottom: 1px solid #BFBFBF; /* más oscuro */
        }

    /* BORDES INTERNOS: fuerza 1px en th y td */
    .cssGrid th,
    .cssGrid td {
        padding: 4px 6px;
        line-height: 1.2;
        vertical-align: middle;
        background-clip: padding-box;
        border-right: 1px solid #E6E6E6; /* más claro en vertical */
    }

    /* header oscuro igual a tu diseño */
    .cssGrid thead th,
    .cssGrid .cssHeaderStyle {
        background-color: #2d2a63 !important;
        color: #fff !important;
        font-weight: 600;
        text-align: left;
        border: 1px solid #2d2a63; /* borde fuerte para header */
    }

    /* Filas alternas */
    .cssGrid.table-striped tbody tr:nth-of-type(odd) td {
        background-color: #f9f9f9 !important;
    }

    /* Asegurar último borde */
    .cssGrid tr:last-child td {
        border-bottom: 1px solid #CCCCCC !important;
    }

    .cssGrid th:last-child,
    .cssGrid td:last-child {
        border-right: 1px solid #CCCCCC !important;
    }

/* si hay reglas que quitan bordes en .table (bootstrap), anularlas explícitamente */
.table > :not(caption) > * > * {
    border-top-width: 1px !important;
}


.cssPager {
    font-weight: bold;
    font-size: 12px;
    color: #000000;
    font-family: 'TravelRegular';
    text-decoration: none;
    background-color: #DFDFDF;
    height: 25px;
}

cssPager A {
    font-weight: normal;
    font-size: 12px;
    color: #000;
    font-family: 'TravelRegular';
    text-decoration: none;
}

.LinkBlanco:link,
.LinkAzul:visited {
    /*color: #FFFFDD;*/
    color: #ff6464;
    text-decoration: none;
    text-decoration: underline;
}

.LinkBlanco:hover {
    text-decoration: underline;
    /*color: #FFFF00;*/
}
/*
.cssButton {
    background-color: #2a295c;
    border-radius: 0;
    color: #FFF !important;
    font-family: 'TravelRegular';
    margin: 10px 0;
    cursor: pointer;
    text-align: center;
}

    .cssButton:hover {
        background-color: #ff6464;
        color: #FFF;
    }

    .cssButton[disabled] {
        background-image: none;
        background-color: #ccc;
        color: #000000;
        cursor: not-allowed;
    }*/

.cssPanding {
    padding: 5px;
    margin: 8px;
}

.modalBackground {
    background-color: rgba(42, 41, 92, 1);
    opacity: .70;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
}

/*DropDownList*/
.cssDDL {
    margin: 3px 3px 3px 0px;
    padding: 1px 3px;
    font-family: 'TravelRegular';
    font-weight: normal;
    color: #000000;
    min-width: 50px;
    min-height: 16px;
    /*background: url(Images/bgInput.jpg) repeat-x top;*/
}


.cssCheckBoxList {
    border: 1px dotted #808080;
    font-family: 'TravelRegular';
    font-size: 9px;
    font-weight: normal;
    color: #000000;
    min-width: 50px;
    height: 16px;
    margin-left: 0px;
    margin-top: 3px;
    margin-bottom: 3px;
}

.cssTable {
    margin: 3px;
    background: #fff;
    padding: 3px;
}

.cssStyleDblBox {
    border: 1px inset #CCCCCC;
    background-image: url(Images/bg_grilla.jpg);
    font-size: 11px;
    font-family: 'TravelRegular';
    font-variant: normal;
    color: #000000;
    font-weight: bold;
    width: 150px;
}

.labelDoubleList {
    margin-top: 5px;
    font-weight: bold;
    font-size: 8.5pt;
    margin-left: 10px;
    color: #000000;
}

.cssSkinAlert {
    padding: 5px;
    margin: 5px 5px 5px 0;
    font-family: 'TravelRegular';
    font-size: 11.5px;
    font-weight: bold;
    color: #000000;
    vertical-align: middle;
    text-align: center;
}

.cssPanelAlert {
    width: 200px;
    background-color: White;
    border-width: 2px;
    border-color: Black;
    border-style: solid;
    padding: 20px;
    display: none;
}

.lightWindowButton {
    position: relative;
    width: 85px;
    height: 20px;
    border-style: none;
}

    .lightWindowButton span {
        width: 84px;
        height: 19px;
        position: absolute;
        left: 0;
        font-weight: bold;
        font-size: 11px;
        color: #fff;
        font-family: 'TravelRegular';
    }

/* Paginación*/
tr.numerpag table {
    border: 1px solid #fff;
    background: url(Images/bgNumber.jpg);
    margin: 4px;
    float: right;
    display: block;
}

.numerpag a {
    background: #f3f3f3;
    color: #000000;
    display: block;
    font-family: 'TravelRegular';
    font-size: 11px;
    font-weight: bold;
    padding: 1px 5px;
    text-decoration: none;
}

/*.numerpag a:hover
    {
    background: #333;
    }*/

.numerpag span {
    background: #ff6464;
    border: 1px solid #CCCCCC;
    color: #FFFFFF;
    display: block;
    font-family: 'TravelRegular';
    font-size: 11px;
    font-weight: bold;
    padding: 1px 5px;
    text-decoration: none;
}


/*h1 {
    font: bold 22px 'TravelRegular';*/
    /*color: #047093;*/
    /*color: #2a295c;
    display: block;
    padding: 2px 3px 3px 30px;*/
    /*border-bottom: 1px solid #722D73;*/
    /*border-bottom: 1px solid rgba(101, 103, 106, 1);
    background: url(Images/bulletTitle.jpg) no-repeat 0 5px;
    text-align: left;
    margin: 18px 15px 6px;
}*/

/*h2 {
    font: bold 18px 'TravelRegular';*/
    /*color: #047093;*/
    /*color: #000000;
    display: block;
    text-align: left;
    margin: 0 20px 6px;
}*/

h3 {
    font-family: "TravelDemiBold";
}

/* Data
    ---------------------------------------------*/

#data {
    bottom: 0;
    clear: both;
    height: 60px;
    /*position: fixed;*/
    bottom: 1px;
    width: 100%;
    z-index: 100;
    /*background: #712E73;*/
    background: #2a295c;
}

#contentData {
    margin: 0 auto;
    width: 951px;
    font: normal 11px/11px 'TravelRegular';
    color: #FFF;
    height: 60px;
    padding: 9px 10px 0 10px;
    text-align: left;
}

    #contentData div {
        display: block;
        float: left;
        margin: 0 90px 0 0;
        width: 138px;
        color: #000000;
    }

    #contentData span {
        display: block;
        float: left;
        margin: 0 10px 0 0;
        padding: 0 0 0 11px;
        width: 156px;
        color: #000000;
        background: url(Images/lineFooter.jpg) no-repeat 0 5px;
    }

.contentDataInfo {
    display: block;
    float: left;
    margin: 0 10px 0 0;
    padding: 0 0 0 11px;
    width: 156px;
    color: #FFF;
    font-weight: bold;
    font-size: smaller;
}

.gridCheckBox span {
    padding: 0;
}

/* Pre-Invoice
    ------------------------------------------------*/

.cssPreInvoice {
    border-width: 2px;
    border-spacing: 0px;
    border-style: solid;
    border-color: gray;
    border-collapse: collapse;
    background-color: white;
    margin-top: 10px;
    margin-bottom: 10px;   
}

.cssPreOrder {
    border-width: 2px;
    border-spacing: 0px;
    border-style: solid;
    border-color: gray;
    border-collapse: collapse;
    background-color: white;
    margin-top: 10px;
    margin-bottom: 10px;
}

.cssPreOrderRows {
    border-collapse: collapse; /* une los bordes */
    width: 100%;
    border: 1px solid black; /* borde EXTERNO */
}

    .cssPreOrderRows th,
    .cssPreOrderRows td {
        border: 1px solid gray; /* bordes internos */
        padding: 5px;
        text-align: left;
    }

    .cssPreOrderRows th {
        font-weight: bold;
        text-align: center;
    }


    .preInvoiceTitle {
        color: #000000;
        font-weight: bold;
    }

.table-header-detalle {
    background: #2a295c;
    color: white;
    vertical-align: middle;
    border-color: #2a295c;
    border-width: 10px;
    border-style: solid; /* 👈 para que el border se vea */
    padding: 8px; /* 👈 espacio interno */
    text-align: left; /* 👈 como tienes "text-left" */
}

.gvDetalleFac{
    border-color:red;
}

.grid-bordered {
    border-collapse: collapse; /* une los bordes */
    width: 100%;
    border: 2px solid black; /* borde EXTERNO */
}

    .grid-bordered th,
    .grid-bordered td {
        border: 1px solid black; /* bordes internos */
        padding: 5px;
        text-align: right;
    }

    .grid-bordered th {
        font-weight: bold;
        text-align: center;
    }



/* Accordion */
.accordionHeader {
    border: 1px solid #2F4F4F;
    color: white;
    /*background-color: #047093;*/
    background-color: #2a295c;
    font-family: 'TravelRegular';
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
}


.accordionHeaderSelected {
    /*border: 1px solid #2F4F4F;*/
    border: 1px solid #2a295c;
    /*background-color: #712E73;*/
    background-color: #2a295c;
    color: white;
    font-family: 'TravelRegular';
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
}

.accordionContent {
    background-color: #FFFFFF;
    border: 1px solid #2F4F4F;
    border-top: none;
    padding: 5px;
    padding-top: 10px;
    overflow: hidden !important;
}

.highlightedImage {
    border: 1px solid #712E73;
}


.progressIndicatorStyle {
    background-color: Gray;
    /* opacity: .70; */
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: solid 2px black;
    z-index: 99999;
    display: block;
}

/* JRM */
.cssTextBoxMemo {
    font-family: 'TravelRegular';
    margin: 3px 3px 3px 0px;
    padding: 4px 3px;
    /*border: 1px solid #983899;*/
    border: 1px solid rgba(101, 103, 106, 1);
    font-size: 11px;
    color: #3C153C;
    font-weight: normal;
    background: url(Images/bgInput.jpg) repeat-x top;
}

/*JRM*/
.cssHeaderStyle a {
    color: #fff !important;
    background-color: #333675;
    text-decoration: none !important;
}

    /*JRM*/
    .cssHeaderStyle a:hover {
        text-decoration: underline !important;
    }

/*JRM*/
.cssPnCollapsibleHead {
    display: block !important;
    background-color: #009DD7;
    background-image: url(Images/boton.png);
    background-repeat: repeat-x;
    border-style: none;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    font-family: 'TravelRegular';
    padding: 0 11px;
    height: 23px !important;
    width: 95%;
    vertical-align: middle;
    text-align: left;
}

.cssLabelTablas2 {
    padding: 5px;
    margin: 5px;
    font-size: 11px;
    font-weight: bold;
    color: #000000;
    vertical-align: middle;
    text-align: left;
}

.lblTablas {
    font-family: 'TravelRegular';
    color: #532154;
    white-space: nowrap;
    padding: 0 5px 0 15px;
}

.modalBackground {
    background-color: rgba(42, 41, 92, 1);
    /* opacity: .50; */
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
}

.progressBar {
    background-color: white;
    position: absolute;
    /* opacity: .90; */
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    vertical-align: middle;
}

.contenidoLogin {
    margin-top: 50px;
    width: 459px;
    padding-top: 80px;
}

.divBorder {
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    /*border: 3px solid #691769;*/
    border: 3px solid #f3f3f3;
    width: 390px;
    /*color: White;*/
    color: #000000;
    padding: 5px;
    font: bold 12px 'TravelRegular';
}

.bgColorDiv {
    /* background: rgba(148,58,148,1);*/
    /* background: #ffffff;
    background: -moz-linear-gradient(left, rgba(148,58,148,1) 0%, rgba(118,46,120,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(148,58,148,1)), color-stop(100%, rgba(118,46,120,1)));
    background: -webkit-linear-gradient(left, rgba(148,58,148,1) 0%, rgba(118,46,120,1) 100%);
    background: -o-linear-gradient(left, rgba(148,58,148,1) 0%, rgba(118,46,120,1) 100%);
    background: -ms-linear-gradient(left, rgba(148,58,148,1) 0%, rgba(118,46,120,1) 100%);
    background: linear-gradient(to right, rgba(148,58,148,1) 0%, rgba(118,46,120,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#943a94', endColorstr='#762e78', GradientType=1 );    */
}

.imgDiv {
    left: 700px;
    margin-top: -88px;
    width: 155px;
}

    .imgDiv img {
        position: absolute;
        margin-top: -47px;
        margin-left: 75px;
    }

/* CSS NUEVO */

/* 
    * HEADER
    * Estilos aplicados a elementos del header del aplicativo
    */

header {
    padding-top: 15px;
}

@media (max-width: 767px) {
    header .logo {
        padding-bottom: 1rem;
    }
}

.img-user {
    float: left;
    margin-right: 10px;
}

.imgSize {
    width: 10rem;
    height: auto;
}

.btn-user {
    background-color: #ff6464;
    color: #ffffff;
    border-radius: 0;
    border-color: #ff6464;
    width: 100px;
    cursor: pointer;
    padding: .25rem .5rem;
}

    .btn-user:hover {
        background-color: #ff6464;
        border-color: #ff6464;
    }

    .btn-user[disabled] {
        background-image: none;
        background-color: #ccc;
        color: #000000;
        cursor: not-allowed;
    }

.btn-custom {
    position: relative;
    padding-top: 15px;
    color: #221C46;
    background-color: #FFF;
    text-align: center;
    font-family: 'TravelDemiBold';
    border-radius: 0%;
    border: #FFF;
    display: inline-block;
    width: 200px;
    height: 45px;
    cursor: pointer;
    background-image: linear-gradient(143deg, transparent 0%, #221C46 0% 93%, transparent 85%);
    z-index: 1;
}

    .btn-custom:before {
        color: #221C46;
        content: "";
        position: absolute;
        left: 3px;
        right: 3px;
        top: 3px;
        bottom: 3px;
        background-image: linear-gradient(143deg, transparent 0%, #00EB5E 0% 93%, transparent 85%);
        z-index: -1;
    }

    .btn-custom:hover {
        color: #221C46;
        background: #CCCCCC;
        background-color: #CCCCCC;
        background-image: linear-gradient(143deg, transparent 0%, #221C46 0% 93%, transparent 85%);
        box-shadow: 7px 5px 1px rgba(0, 0, 0, 0.2);
        z-index: 1;
    }

        

    .btn-custom[disabled] {
        color: #CCCCCC !important;
        background: #CCCCCC;
        background-color: #FFF;
        cursor: not-allowed;
        background-image: linear-gradient(143deg, transparent 0%, #6F6B87 0% 93%, transparent 85%);
    }

.btn-custom-sec {
    position: relative;
    background: #FFF;
    color: #221C46;
    text-align: center;
    font-family: 'TravelDemiBold';
    border-radius: 0%;
    /*border-color: #221C46;*/
    border: 3px solid #221C46;
    padding-left: 0px !important;
    padding-top: 5px !important;
    padding-bottom: 6px !important;
    line-height: 16px;
    display: inline-block;
    width: 200px;
    height:45px;
    cursor: pointer;
    padding: .25rem .5rem;
    /*background-image: linear-gradient(142deg, transparent 0%, #00EB5E 0% 91%, transparent 85%);*/
    z-index: 0;
}

    .btn-custom-sec:before {
        /*content: "";*/
        position: absolute;
        padding-top: 3px !important;
        padding-bottom: 3px !important;
        padding-left: 3px !important;
        right: 3px;
        /*background-image: linear-gradient(142deg, transparent 0%, #221C46 0% 91%, transparent 85%);*/
        z-index: -1;
    }

    .btn-custom-sec:hover {
        color: #FFFFFF !important;
        background: #221C46;
        border-color: #221C46;
        box-shadow: 7px 5px 1px rgba(0, 0, 0, 0.2);
        /*background-image: linear-gradient(142deg, transparent 0%, #00EB5E 0% 91%, transparent 85%);*/
    }

    .btn-custom-sec[disabled] {
        background-image: none;
        background-color: #ccc;
        color: #000000;
        cursor: not-allowed;
    }

.titulosFooter {
    font-size: 15px;
    font-family: TravelDemiBold;
}

.parrafoFooter {
    font-size: 12px;
    font-family: TravelRegular;
}

.footer-bottom {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
}

.ico-user {
    margin-right: 10px;
}

.icon-product {
    width: 7rem;
}

.material-icons.md-48 {
    font-size: 48px;
    color: #221C46 !important;
    /*color: grey;*/
    top: 0px;
}

.material-icons.md-home {
    color: grey;
}

.material-icons.md-inactivar {
    font-size: 20px;
    top: 0px;
    color: #ff6464;
}

.material-icons.md-activar {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-editar {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-content-copy {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-checkbox {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-description {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-shopping-bag {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-search {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-receipt {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-remove-circle {
    font-size: 20px;
    top: 0px;
    color: grey;
}

/* Material icon en color rojo*/
.material-icons.md-remove-circle-red {
    font-size: 20px;
    top: 0px;
    color: red;
}

.material-icons.md-print {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-list {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-storage {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-credit-card {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-attach {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.material-icons.md-warning {
    font-size: 25px;
    top: 0px;
    color: #FF7375;
}

.material-icons.md-event {
    font-size: 20px;
    top: 0px;
    color: grey;
}

.info-user {
    margin-bottom: 10px;
    width: 450px !important;
}

.x-space {
    width:450px;
}

.y-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.container-fluid {
    padding-left: 50px;
    padding-right: 50px;
}

.btn-round {
    border-radius: 10px;
}

/* 
    * Footer
    * Estilos aplicados a elementos del footer del aplicativo
    */

footer {
    margin-top: 60px;
}

    footer article {
        background-color: #221C46;
        color: #FFF;
        padding-top: 30px;
        padding-bottom: 20px;
    }

    footer h4 {
        font-size: 14px;
    }

    footer hr {
        border-top: 2px solid #FFF;
        margin-top: 0;
    }

    footer p {
        color: rgba(42, 41, 92, 1);
        text-align: center;
    }

    footer a {
        color: #FFF !important;
        display: block;
        font-size: 12px;
    }

.redes {
    float: left;
    margin: 10px;
}

.imgRedes {
    width: 2rem;
    height: auto;
}

/* 
    * Login
    * Estilos aplicados a elementos del login del aplicativo
    */
.verticalAlign {
    position: absolute;
    top: -150px;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 30%;
    margin: auto;
}

.login-letras-link-form {
    color: #221C46 !important;
    font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -0.069px;
    text-decoration-line: underline;
    word-wrap: break-word;
}

.login-letras-form {
    color: #221C46 !important;
    font-size: 10px !important;
    font-weight: 400;
    word-wrap: break-word;
    line-height: 1.8;
    display: inline-block;
}

.login-ck-politicas {
    font-size: 10px !important;
    font-weight: bold;
    color: #666666;
    vertical-align: middle;
}

.login-center-text {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.login-carousel-item {
    height: 550px;
    overflow: hidden;
    width: 100%;
}

    .login-carousel-item img {
        width: 100%;
        height: 100%; /* se ajusta al contenedor */
        object-fit: cover;
    }

#imageCarousel .carousel-item {
    height: 550px; /* o el alto que necesites */
}

    #imageCarousel .carousel-item img {
        height: 100%;
        width: 100%;
        object-fit: cover; /* recorta para que no se deforme */
    }


.content-login {
    background-color: #FFF;
}

/* 
    * Recordar Password
    * Estilos aplicados a publicmasterpage del aplicativo
    */
.rememberpass .content-login .row {
    padding-top: 15px;
}

/* 
    * Menu Principal 
    * Estilos aplicados a elementos del menu principal del aplicativo
    */

.nav > li {
    display: block !important;
}

.dropdown-toggle::after {
    display: none !important;
}

nav {
    background-color: #f3f3f3;
}

    nav a {
        color: #000000;
    }

        nav a:hover {
            color: #000000;
        }


.navbar {
    padding: 0;
    background-color: #00eb5e !important;
}
    .navbar .dropdown-menu {
        background-color: #221c46;
    }
        .navbar .dropdown-menu .dropdown-item {
            background-color: #221c46;
            color: #fff;
        }
            .navbar .dropdown-menu .dropdown-item:hover {
                background-color: #221c46;
                color: #00eb5e;
            }

#ctl00_Menu1_Menu1 .nav-link {
    color: #221c46 !important;
    text-decoration: none !important;
    font-size: 12px;
}

    #ctl00_Menu1_Menu1 .nav-link:hover {
        background-color: #221c46 !important;
        color: #00eb5e !important;
    }

/*
    * Contenido General
    * Estilos manejados en el elementos de funcionalidades
    * generales del aplicativo
    */

html,
body {
    overflow-x: hidden;
    font-family: 'TravelRegular';
    color: #000000;
    font-size: 14px;
}

.cssRadioButtonReportes {
    font-family: 'TravelRegular';
    font-size: 11px;
    color: #000000;
    vertical-align: bottom;
    text-align: left;
}

.cssCheckBoxReportes {
    font-family: 'TravelRegular';
    font-size: 11px;
    color: #000000;
    vertical-align: bottom;
    text-align: left;
}

/* Off Canvas del sidebar de los botones de acciones de las funcionalidades que se ocultan a la derecha
    al momento de visualizarse en moviles
    */
@media screen and (max-width: 767px) {
    .row-offcanvas {
        position: relative;
        -webkit-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

    .row-offcanvas-right {
        right: 0;
    }

        .row-offcanvas-right .sidebar-offcanvas {
            right: -100%;
        }

        .row-offcanvas-right.active .sidebar-offcanvas {
            right: -50%;
        }

        .row-offcanvas-right.active {
            right: 70%;
        }

            .row-offcanvas-right.active .sidebar-offcanvas-content {
                opacity: 0;
            }

    .sidebar-offcanvas {
        position: absolute;
        top: 0;
        width: 50%;
    }
}

/* Off Canvas del sidebar de los links de los menus secundarios de las funcionalidades ("homes") que se ocultan a la izquierda
    al momento de visualizarse en moviles
    */
@media (max-width: 767px) {
    .menu-lef .flex-column {
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: normal !important;
        -webkit-flex-direction: row !important;
        -ms-flex-direction: row !important;
        flex-direction: row !important;
    }

        .menu-lef .flex-column a {
            color: #000000;
            margin-right: 15px;
        }

        .menu-lef .flex-column > .active {
            color: #2a295c;
            font-size: 14px;
            text-decoration: underline;
            -webkit-text-decoration-color: #ff6464;
            text-decoration-color: #ff6464;
        }

    .loadCenter {
        text-align: center;
    }
}

.flex-column a {
    color: #000000;
    padding: .5rem .1rem;
    font-size: 12px;
}

.flex-column .active {
    color: rgba(42, 41, 92, 1);
    font-size: 18px;
}

.material-1 {
    color: #ff5f5f;
}

.material-icons {
    font-size: 20px;
    top: 5px;
    position: relative;
}

/* Miga de Pan */
.breadcrumb {
    background-color: #FFF !important;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size: 12px;
}

.breadcrumb-box {
    margin-bottom: 30px;
}

    .breadcrumb-box .breadcrumb {
        padding-left: 0;
        border-radius: 0;
    }

/* Generales */

.limpiar_filtro i {
    color: black;
}

.tradicional {
    border-top: 1px solid rgba(0, 0, 0, .1);
    position: relative;
    top: 0;
    margin-top: 5px;
    margin-bottom: 5px;
}

.panel-opciones {
    padding-top: 15px;
}

.button-opciones {
    padding-top: 15px;
}

.label-elemento-left {
    float: left;
    font-family: 'TravelRegular';
    font-size: 11px;
}

.label-elemento-left-margin {
    float: left;
    font-family: 'TravelRegular';
    font-size: 11px;
    margin-left: 20px;
    text-align: left;
}

.checkbox-alineado {
    position: absolute;
    top: 30%;
}

.label-elemento-right {
    float: right;
    font-family: 'TravelRegular';
    font-size: 11px;
    margin-right: 15px;
}

/*
    * Contenido Pop up
    * Estilos manejados en el elementos del pop up
    */
.modal-header {
    border-bottom: 0;
    padding-top: 15px;
}

.modal-content {
    border-radius: 0;
    border: 0;
}

.modal-body {
    font-size: 14px;
}

.modal-header h5 span {
    color: rgba(42, 41, 92, 1);
    font-weight: 100;
    font-family: 'TravelRegular';
    margin-left: 20px;
}



.label-elemento-center {
    text-align: center;
    font-family: 'TravelRegular';
    font-size: 11px;
}

/* JLGO 06062018 Se agrega acción al radiobutton por logica de reembolsos en linea 
    Si el radio button no esta ckecked no se muestra y si es cheched porque el origen es reembolso en lines se muestra. */
.cssrbLineaVisible > input[type=radio],
.cssrbLineaVisible > label {
    display: none;
}

    .cssrbLineaVisible > input[type=radio]:checked {
        display: inline-block !important;
    }

        .cssrbLineaVisible > input[type=radio]:checked + label {
            display: inline-block !important;
        }


input[type='radio']:after {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: #d1d3d1;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid #cfcfcf;
    background-color: #fff;
    box-sizing: border-box;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
}

input[type='radio']:checked:after {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: -2px;
    left: -1px;
    position: relative;
    content: '';
    display: inline-block;
    visibility: visible;
    background-color: #FBDDDA;
    border: 5px solid rgb(255, 255, 255);
    box-sizing: border-box;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
}

input[type='radio'] + label {
    margin: 0;
    padding: 8px 5px 5px 10px;
    font-size: 11px;
}




.fondo_gris {
    background-color: #eeeeee;
    padding: 20px;
    text-align: center;
    margin: 20px;
}

/*
    * Home empresa
    * Estilos manejados home empresa
    */
.banner-empresa {
    height: 182px;
    background: url(Images/banner-empresa.jpg);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

/*
    * Home Principal
    */
.banner {
    width: 100%;
    max-height: 310px;
    position: relative;
    text-align: center;
}

/*Titulos dentro section banner*/
.title-banner {
    position: absolute;
    margin-left: 40px;
    color: #221C46;
    top: 110px;
    text-shadow: 2px 1px 5px rgba(150, 150, 150, 0.85);
}

    .title-banner::before {
        content: "";
        position: absolute;
        height: 2px;
        width: 300px;
        /*background-color: rgb(60, 56, 151);*/
        bottom: -8px;
    }

.banner-home {
    background: url(Images/banner-home.jpg);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    padding-top: 16%;
}

    .banner-home .container {
        background-color: #FFF;
        box-shadow: 1px 5px 10px rgba(204, 204, 204, 1);
    }

    .banner-home h3 {
        border: 1px solid rgba(204, 204, 204, 1);
        text-align: center;
        padding: 15px 5px;
        margin: 15px 2px;
        font-weight: 700;
        font-family: 'Arial';
        color: #000000;
        font-size: 37px;
        height: 105px;
    }

        .banner-home h3 .spana {
            font-weight: 700;
            font-family: 'Arial';
            font-size: 37px !important;
        }

        .banner-home h3.activas .spana {
            color: #FFFFFF;
        }

        .banner-home h3 span {
            font-family: 'TravelRegular';
            font-size: 13px;
            font-weight: 100;
        }

.activas {
    background-color: #ff6464;
    border: 1px solid #ff6464 !important;
    color: #FFF !important;
}

.activas_alertas {
    background-color: white;
    border: 1px solid rgba(204, 204, 204, 1);
    color: #000000;
}

    .activas_alertas:hover {
        background-color: #221C46;
        border: 1px solid #221C46 !important;
        color: #17CCF9 !important;
    }

section {
    display: block;
    position: relative;
}

    section .titulo {
        min-height: 15px;
    }

    section h2 {
        font-size: 12px;
        width: 85%;
    }

    section hr {
        top: 20px;
    }

.section-home h2 {
    background-color: #FFF;
    padding: 15px;
    text-align: center;
    z-index: 2;
    width: 45%;
    position: absolute;
    margin: auto;
    display: block;
    left: 0;
    right: 0;
    font-size: 24px;
}

.section-home hr {
    border-top: 2px solid #00EB5E;
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
    z-index: 1;
}

section .titulo {
    position: relative;
    display: block;
    min-height: 50px;
}

.section-home article {
    background-color: #f3f3f3;
    margin-top: 30px;
    padding-top: 60px;
    padding-bottom: 30px;
}

.productos {
    margin-top: 60px;
}

/* Aseguramos que los indicadores sean punticos */
.carousel-indicators {
    bottom: -35px;
    margin: 0;
    justify-content: center; /* centra los punticos */
}

    .carousel-indicators [data-bs-target] {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background-color: transparent;
        border: 1px solid #ccc;
    }

    .carousel-indicators .active {
        background-color: #f21616;
    }


.dashboard {
    margin-top: 350%;
}
.table-responsive {
    width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    -webkit-overflow-scrolling: touch;
}


.table-bordered-custom {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #CCCCCC;
}

    .table-bordered-custom th,
    .table-bordered-custom td {
        border: 1px solid #CCCCCC !important;
        padding: 8px;
    }

    .table-bordered-custom thead th {
        background-color: #2c2c63; /* azul oscuro de tu header */
        color: #fff;
        text-align: left;
    }

    .table-bordered-custom tr:nth-child(even) {
        background-color: #f9f9f9; /* filas alternadas */
    }



.radioButton tr td {
    width: 10%;
}

@media (min-width: 401px) {
    .dashboard {
        margin-top: 245%;
    }

    .table-responsive {
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        -webkit-overflow-scrolling: touch;
    }
}

@media (min-width: 576px) {
    .dashboard {
        margin-top: 70%;
    }

    .table-responsive {
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        -webkit-overflow-scrolling: touch;
    }
}

@media (min-width: 768px) {
    .dashboard {
        margin-top: 55%;
    }

    .table-responsive {
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        -webkit-overflow-scrolling: touch;
    }
}

@media (min-width: 992px) {
    .dashboard {
        margin-top: 16%;
    }

    .table-responsive {
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        -webkit-overflow-scrolling: touch;
    }
}

.fw1 {
    font-size: 16px;
    font-weight: bold;
}

.contenido {
    padding-top: 60px;
}

.caja {
    border: 1px solid #e9ecef;
    padding: 30px 10px;
}

.caja-bene {
    padding: 10px;
}

.banner-empleado {
    background: url(Images/banner-empleado.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center -0px;
    height: 182px;
}

.banner-factura-pagos {
    background: url(Images/banner-factura.jpg);
    background-size: 100%;
    background-position: center;
    background-position-y: -0px;
    background-repeat: no-repeat;
    height: 182px;
}

.banner-resumen-pedido {
    background: url(Images/banner-pedidos.jpg);
    background-size: 100%;
    background-position: center;
    background-position-y: -0px;
    background-repeat: no-repeat;
    height: 182px;
}

.banner-reportes {
    background: url(Images/banner-reports.jpg);
    background-size: 100%;
    background-position: center;
    background-position-y: 0px;
    background-repeat: no-repeat;
    height: 182px;
}


.caja-verde {
    background-color: #00EB5E;
    color: #FFF;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
    padding: 5px;
}

.caja-azul {
    background-color: #2a295c;
    color: #FFF;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
    padding: 5px;
}

.caja-rosa {
    background-color: #ff5f5f;
    color: #FFF;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
    padding: 5px;
}

    .caja-rosa h1,
    .caja-verde h1,
    .caja-azul h1 {
        background: none;
        border-bottom: 0;
        text-align: center;
        padding-top: 10px;
        padding-bottom: 10px;
        color: #ffffff;
        font-size: 36px;
    }

        .caja-rosa h1 .span,
        .caja-verde h1 .span,
        .caja-azul h1 .span {
            font-size: 36px !important;
        }


.caja h1 span {
    font-size: 14px;
    letter-spacing: 2px;
}

.caja hr,
.tradicional {
    border-top: 1px solid rgba(0, 0, 0, .1);
    position: relative;
    top: 0;
    margin-top: 20px;
    margin-bottom: 20px;
}

.caja .icon {
    float: left;
    margin-right: 10px;
    margin-top: 0;
    width: 5%;
}

.caja h5 {
    margin-top: 3px;
}

.caja p {
    margin-bottom: 5px;
}

.caja .row {
    text-align: center;
    margin: auto;
}

.caja img {
    margin-top: 20px;
    margin-bottom: 20px;
}

.btn-pasos {
    background-color: #2a295c;
    border-radius: 0;
    color: #FFF;
    font-family: 'TravelRegular';
    margin: 10px 0;
    cursor: pointer;
}

    .btn-pasos:hover {
        background-color: #ff6464;
        color: #FFF;
    }

.btn-form {
    width: 170px;
}

/* 
    * CSS MOVIL 
    * Estilos aplicados a elementos de la pagina para
    * adaptarlos a moviles y tablets
    */
@media screen and (max-width: 768px) {
    .login {
        min-height: 667px;
        height: auto;
    }

    .rememberpass .content-login .row {
        padding: 0;
    }

    .header-login {
        padding: 5px;
    }

    .login h3 {
        font-size: 16px;
    }

    .login .btn-user {
        margin: 0;
        cursor: pointer;
        width: 60%;
    }

    header {
        border-bottom: 1px solid #e5e5e5;
        padding-top: 10px;
    }

    .menu i {
        color: #ff6464;
    }

    .menu span {
        text-align: center;
        font-size: 10px;
        margin: auto;
        display: block;
        margin-top: 0px;
        color: #000000;
        text-decoration: none;
    }

    .menuOcultoIn {
        left: 0;
    }

    .menuOcultoOut {
        left: -100%;
    }

    .menuOculto {
        overflow-y: auto;
        width: 85%;
        height: 100%;
        margin: 0;
        position: fixed;
        top: 0;
        z-index: 9;
        -webkit-box-shadow: 1px 3px 6px #777;
        box-shadow: 1px 3px 6px #777;
        background: #fff;
    }

        .menuOculto .headerOculto {
            padding: 10px 0;
            background: #dedddd;
        }

        .menuOculto p {
            font-size: 9px;
            margin-bottom: 0;
        }

        .menuOculto .btn-user {
            width: 100%;
            margin: 0;
            cursor: pointer;
        }

        .menuOculto nav {
            background: #FFF;
            display: block;
        }

            .menuOculto nav a {
                border-bottom: 1px solid #e1dbdb;
            }

                .menuOculto nav a i {
                    float: right;
                }

    .banner-home {
        background-position: top center;
        padding-top: 80px;
        min-height: 380px;
    }

        .banner-home .row {
            margin-right: 0;
            margin-left: 0;
        }

            .banner-home .row .col-11 {
                background-color: #FFF;
                -webkit-box-shadow: 1px 5px 10px #cccccc;
                box-shadow: 1px 5px 10px #cccccc;
                padding-top: 20px;
                margin-bottom: 20px;
            }

        .banner-home h3 {
            font-size: 18px;
            margin: 5px;
            width: auto;
        }

            .banner-home h3 span {
                font-size: 10px;
            }



    section .titulo {
        min-height: 15px;
    }

    section h2 {
        font-size: 12px;
        width: 85%;
    }

    section hr {
        top: 20px;
    }

    .contenido {
        padding-top: 20px;
    }

    .caja {
        padding: 10px;
    }

        .caja h5 {
            font-size: 14px;
            margin-top: 6px;
        }

    .op h6 {
        font-size: 12px;
        height: 40px;
        text-align: center;
    }

    .caja p {
        font-size: 12px;
    }

    .op {
        padding-top: 20px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        width: 100%;
    }

        .op .btn {
            font-size: 12px;
            text-align: center;
            padding: 10px;
            white-space: normal;
        }

    .img-fluid {
        display: block !important;
        margin: auto;
        text-align: center;
    }

    .tab-content {
        margin-top: 20px;
    }

    .d-flex .nav-link {
        text-align: center;
        font-size: 12px;
    }

    .nav-link:hover {
        background-color: transparent !important;
    }

    .table td,
    .table th {
        vertical-align: middle;
    }

    .table label {
        text-align: left;
        width: 100%;
    }


    .other-table td {
        width: 27%;
    }

    h6 {
        margin-top: 15px;
    }

    .nav-link.col-6 {
        padding: 0 5px;
        text-align: left;
    }

        .nav-link.col-6 span {
            font-size: 10px !important;
        }

    #accordion {
        margin-top: 0;
    }

    .card-header h5 {
        text-align: left;
        font-size: 14px;
    }

    .card {
        margin-top: 0;
    }

    .card-body.izquierda {
        padding: 10px;
    }

    .accordion-flecha {
        float: right;
    }
}

/* FIN CSS MOVIL */

/* CSS WIZARD PEDIDO Y FAQ*/

.acordion a {
    font-weight: bold;
    color: #000000 !important;
}

.numero {
    padding: 10px 17px;
    background-color: #00eb5e;
    color: #FFF;
    border-radius: 50%;
    border-style: solid;
    border-width: 4px;
    border-color: lightgray;
}

.numero-azul {
    padding: 10px 17px;
    background-color: #2a295c;
    color: #FFF;
    border-radius: 50%;
    border-style: solid;
    border-width: 4px;
    border-color: lightgray;
}

.row-wizard {
    margin-top: 25px;
    margin-bottom: 25px;
}

    .row-wizard a {
        text-decoration: none;
        color: #000000;
        font-size: 14px;
    }

.paso-wizard {
    margin-top: 20px;
}

.linea-wizard {
    text-align: center;
    position: relative;
}

.links {
    display: flex;
}

.linea-wizard:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 5%;
    border-top: 1px solid rgba(0, 0, 0, .1);
    width: 93%;
}

.center-gridview {
    margin-left: 1000px;
}

.Hide {
    display: none;
}

.banner-home .container .btn-info {
    background-color: rgb(60, 220, 200);
}

    .banner-home .container .btn-info:hover {
        background-color: rgb(247, 100, 100);
        /*transition: all .5s ease;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        -ms-transition: all .5s ease;
        -o-transition: all .5s ease;*/
    }


/*--------------------Seccion que define los estilos para el Formulario del cliente CLientForm----------------------*/
/* Fonts */
/*@font-face {
    font-family: "opensansregular";
    src: url("//cdn2.hubspot.net/hubfs/524691/font/open-sans.regular.ttf?t=1482955358024") format("truetype"),url("//cdn2.hubspot.net/hubfs/524691/font/open-sans.regular.woff?t=1482955358024") format("woff"),url("//cdn2.hubspot.net/hubfs/524691/font/open-sans.regular.eot?t=1482955358024") format("eot");
    }

    @font-face {
    font-family: "sansa_pro";
    font-style: normal;
    font-weight: normal;
    src: url("https://cdn2.hubspot.net/hubfs/524691/font/SansaPro-Normal.ttf") format("truetype"), url("https://cdn2.hubspot.net/hubfs/524691/font/SansaPro-Normal.woff") format("woff"), url("https://cdn2.hubspot.net/hubfs/524691/font/SansaPro-Normal.eot") format("eot");
    }

    @font-face {
    font-family: "sansa_pro_semiboldregular";
    font-style: normal;
    font-weight: normal;
    src: url("//cdn2.hubspot.net/hubfs/524691/font/sansapro-semibold-webfont.eot?t=1482955358024") format("embedded-opentype"),url("//cdn2.hubspot.net/hubfs/524691/font/sansapro-semibold-webfont.woff?t=1482955358024") format("woff"),url("//cdn2.hubspot.net/hubfs/524691/font/sansapro-semibold-webfont.ttf?t=1482955358024") format("truetype");
    }

    * {
    font-family: "sansa_pro";
    }
    h1, h2, h3, h4, h5, h6 {
    font-family: 'sansa_pro_semiboldregular';
    color: #4D4D4F;
    }
    #main-content {
    padding: 3rem 0;
    }
    .sodexo-title::after {
    content: "";
    display: block;
    width: 115px;
    height: 4px;
    margin: 20px auto;    
    background-color: #ED424A;
    }
    .background-dark-sdx {
    background-color: #283897;
    padding: .5rem 0;
    }
    .invalid-tooltip {
    top: auto !important;
    }
    .input-group .invalid-tooltip {
    top: 38px !important;
    }
    .input-group > .form-control:not(:first-child) {
    border: dotted 1px red;
    width: 60%;
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
    }
    .table .thead-dark-sdx th {
    color: #fff;
    background-color: #2a295c;
    border-color: #2a295c; 
    }
    footer.page-footer {
    background-color: #2a295c;
    color: #FFF;
    padding: 3rem 0 2rem !important;
    }
    footer.page-footer ul li a, footer.page-footer a {
    color: #FFF;
    }
    footer.page-footer ul li {
    padding-bottom: .5rem;
    }
    .foot-social-links a i  {
    color: #2a295c;
    padding: 8px;
    font-size: 20px;
    background: #fff;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    text-align: center;
    }
    .foot-social-links a:hover{
    text-decoration: none;
    }*/

/*--------------------Seccion que define los estilos para el Formulario del cliente CLientForm----------------------*/



/* FIN CSS WIZARD PEDIDO*/

/* FIN CSS NUEVO */