html, body, form {
    min-height: 100%;
    height: 100%;
    padding: 0px !important;
}

main {
    background-color: #f6f6f6 !important;
}
/*COLORES-FONDO-TEXTO*/
.cardinal {
    /*background-color: rgb(3, 124, 33) !important;*/
    background-color: darkslateblue !important;
}

.cardinal-text {
    /*color: rgb(53, 128, 23) !important;*/
    color: darkslateblue !important;
}

.cardinal.lighten-1 {
    /*background-color: darkslateblue !important;*/
    background-color: darkslateblue !important;
    /*background-image: url('../../Graficos/Logos/hero-bg.jpg') !important;*/
}

.cardinal-text.text-lighten-1 {
    color: rgb(3, 124, 33) !important;
}

.gris {
    background-color: #BEBFC5 !important;
}

.gris-text {
    color: #BEBFC5 !important;
}

.gris.lighten-1 {
    background-color: #F4F4F4 !important;
}

.gris-text.text-lighten-1 {
    color: #F4F4F4 !important;
}

/*BOTON-REDONDO*/
.boton-circle {
    border-radius: 60% !important;
    width: 35px;
    padding: 6px;
    box-shadow: 0 2px 3px #A4A4A4;
}
/*BOTON-INFORMACION-USUARIO*/
a.boton-circle-width {
    border-radius: 15px !important;
    /*width: 150px;*/
    height: 30px;
    padding: 0px;
    color: #808080 !important;
    text-align: left;
    background-color: #DDD;
    border: none;
    margin: 4px;
    text-decoration: none;
}

    a.boton-circle-width:hover {
        background-color: #e4e4e4;
        text-decoration: none;
    }
/*BOTON-INFORMACION-USUARIO-IMAGEN*/
.img-circle {
    width: 30px;
    margin: 0px !important;
}
/*MENU-APLICACION-MODULOS*/
#divMenu {
    margin-top: 4px;
    margin-bottom: 4px;
}

.menuprincipal h3 {
    margin: 0px !important;
    border-radius: 0 !important;
    border: none;
}
/*MENU-APLICACION-OBJETOS*/
.menu-objetos {
    padding: 4px !important;
}

    .menu-objetos a {
        padding: 6px 6px 6px 15px !important;
        border: none;
        border-radius: 0px !important;
    }

.botones-menu {
    text-align: center !important;
}
/*CABECERA*/
.cabezera {
    min-height: 50px;
}
/*TAB-CONTENIDO*/
.tab-content {
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
    padding: 10px;
}
/*CONTENIDO*/
#divCuerpo {
    background-color: #fff;
    margin-bottom: 50px !important;
}

.cuerpo {
    margin: 5px !important;
}
/*PIE*/
.pie {
    height: 30px !important;
    min-height: 30px;
    padding-top: 5px !important;
    color: #A4A4A4 !important;
    text-align: center;
}
/*GRILLA-CABECERA*/
table thead a {
    font-weight: normal !important;
}
/*MENU-APLICACION-MUESTRA-OCULTA*/
a.menu_toggle {
    /*margin: 0px;*/
    /*width:25px;*/
    background-color: transparent !important;
    display: inline-block;
    color: #BEBFC5 !important;
    text-align: center !important;
    vertical-align: middle !important;
    font-weight: bold;
    font-size: 25px;
    border: none;
}

    a.menu_toggle:hover {
        color: #FFF !important;
    }

.menu_toggle span {
    margin-right: 5px;
}
/*TITULO-PATINA-INDICADOR-REGISTRO*/
.titulopagina {
    font-size: 26px;
    /*font-weight:bold;*/
}

    .titulopagina small {
        font-size: 18px;
        font-weight: normal;
    }


/*BOTON*/
button.btn-cardinal, #btnLogin {
   /*background-color: rgb(53, 128, 23) !important;
   color: #fff !important;*/
   background-color: darkslateblue !important;
   
   color: #fff !important;
}

   button.btn-cardinal:hover, #btnLogin:hover {
      /*background-color: rgb(3, 124, 33) !important;
      color: #fff !important;*/
      background-color: darkslateblue !important;
      color: #fff !important;
   }

button.btn-cardinal-ligth1 {
   /*background-color: rgb(3, 124, 33) !important;
   color: #fff !important;*/
   background-color: darkslateblue !important;
   color: #fff !important;
}

   button.btn-cardinal-ligth1:hover {
      /*background-color: rgb(53, 128, 23) !important;
      color: #fff !important;*/
      background-color: darkslateblue !important;
      color: #fff !important;
   }

button.btn-cardinal-ligth2 {
    background-color: #fbfbfb !important;
    color: rgb(3, 124, 33) !important;
}

    button.btn-cardinal-ligth2:hover {
        background-color: #fbfbfb !important;
        color: rgb(53, 128, 23) !important;
    }

/*ENLACE-BOTON*/
a.btn-cardinal:link, a.btn-cardinal:visited {
    background-color: rgb(53, 128, 23) !important;
    color: #fff !important;
}

a.btn-cardinal:hover {
    background-color: rgb(3, 124, 33) !important;
    color: #fff !important;
}

a.btn-cardinal-ligth1:link, a.btn-cardinal-ligth1:visited {
   /*background-color: rgb(3, 124, 33) !important;
   color: #fff !important;*/
   background-color: darkslateblue !important;
   color: #fff !important;
}

a.btn-cardinal-ligth1:hover {
   /*background-color: rgb(53, 128, 23) !important;
   color: #fff !important;*/
   background-color: darkslateblue !important;
   color: #fff !important;
}
/*BOTON-ROJO*/
button.btn-red {
    background-color: rgb(3, 87, 21) !important;
    color: #fff !important;
}

    button.btn-red:hover {
        background-color: rgb(3, 73, 18) !important;
        color: #fff !important;
    }
/*ENLACE-BOTON-*/
a.btn-red:link, a.btn-red:visited {
    background-color: rgb(3, 87, 21) !important;
    color: #fff !important;
}

a.btn-red:hover {
    background-color: rgb(3, 73, 18) !important;
    color: #fff !important;
}
/*ENLACE-ROJO*/
a.lnk-red:link, a.lnk-red:visited {
    color: rgb(3, 87, 21) !important;
}
/*ENLACE*/
a.lnk-cardinal:link, a.lnk-cardinal:visited {
    color: rgb(53, 128, 23) !important;
}

a.lnk-cardinal:hover {
   color: rgb(105, 107, 105) !important;
}

a.lnk-cardinal-ligth1:link, a.lnk-cardinal-ligth1:visited {
   /*color: rgb(3, 124, 33) !important;*/
   color: darkslateblue !important;
}

a.lnk-cardinal-ligth1:hover {
   color: rgb(105, 107, 105) !important;
}
/*TEXTO-BLANCO*/
.white-text {
    color: #fff !important;
}

/*MENU-MODULO-ACTIVO*/
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
   /*background-color: rgb(53, 128, 23) !important;*/
   background-color: darkslateblue !important;
}

/*MENU-OBJETO-ACTIVO*/
.list-group-item active {
    background-color: rgb(3, 124, 33) !important;
}

.active.list-group-item, .active.list-group-item:focus, .active.list-group-item:hover {
   /*background-color: rgb(3, 124, 33) !important;
   border-color: rgb(3, 124, 33) !important;*/
   background-color: darkslateblue !important;
   border-color: darkslateblue !important;
}
/*MENU-OBJETO-ACTIVO*/
a.list-group-item:focus, a.list-group-item:hover, button.list-group-item:focus, button.list-group-item:hover {
    color: #2B2B2B;
    text-decoration: none;
    background-color: #EDEDED;
}
/*PAGINADO-ACTIVO*/
/*NUMERO DE PAGINAS A MOSTRAR-ACTIVO*/
.dx-pager .dx-pages .dx-selection, .dx-pager .dx-page-sizes .dx-selection {
   background-color: rgb(197, 201, 198) !important;
   color: #fff !important;
}
/*APLICACION-ENTORNO*/
.nombreaplicacion-header {
    height: 100%;
    margin-top: 15px;
    color: #fff;
    text-align: center;
}

.botonusuario-header {
    height: 100%;
    margin-top: 6px;
}

.fecha-control {
    width: 100%;
    border: none !important;
}
/*NAVEGADOR DE REGISTROS*/
.navegador-registros {
    margin-top: 20px !important;
    margin-bottom: 5px !important;
}
/*HEADER DATA GRID*/
.dx-datagrid-headers {
   color: rgb(82, 84, 82) !important;
   font-weight: 500 !important;
   /*background: rgb(190, 194, 191) !important;*/
}
/*COLOR MODAL CONFIRMAR*/
.modalconfirmar {
    /*background-color: #F5F6CE !important;*/
}
/*BORDE CONTROL DEVEX*/
.dx-state-active {
    border-color: rgb(3, 124, 33) !important;
}
/*HOVER CONTROL DEVEX*/
.dx-texteditor.dx-state-focused,
.dx-texteditor.dx-state-active,
.dx-state-hover {
   border: 1px solid #7c807c !important;
}
.dx-texteditor-input:read-only {
  background-color: #DDDDDD !important;
}
.dx-texteditor-input:disabled {
  background-color: #DDDDDD !important;
}
/*TAB*/
.nav-tabs > li > a {
    color: rgb(3, 124, 33) !important;
}
/*TAB ACTIVO*/
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: #555 !important;
}
/*RADIO BUTTON DEVEX*/
.dx-item.dx-radiobutton.dx-state-hover {
    border: none !important;
}

.dx-radiobutton-checked .dx-radiobutton-icon-dot {
    background-color: rgb(3, 124, 33) !important;
}

.dx-radiobutton-icon::before {
    border: 1px solid #008040 !important;
}
/*CALENDAR*/
/*flechas-selector-mes*/
.dx-icon {
    color: rgb(3, 124, 33) !important;
}
/*fecha-seleccionada*/
.dx-calendar-contoured-date.dx-calendar-selected-date.dx-calendar-cell, .dx-calendar-contoured-date.dx-calendar-today.dx-calendar-selected-date.dx-calendar-cell {
    box-shadow: inset 0px 0px 0px 1px #bebebe, inset 0px 0px 0px 1000px rgb(3, 124, 33) !important;
}
/*CHECKBOX*/
.dx-checkbox-checked .dx-checkbox-icon {
    color: rgb(3, 124, 33) !important;
}
/*COMBO*/
:not(.dx-list-select-decorator-enabled).dx-list .dx-list-item-selected.dx-state-focused.dx-list-item {
    background-color: rgb(3, 124, 33) !important;
}

:not(.dx-list-select-decorator-enabled).dx-list .dx-state-focused.dx-list-item {
    background-color: rgb(3, 124, 33) !important;
}
/*ICON CLEAR INPUT*/
.dx-icon, dx-icon-clear {
    color: #DDD !important;
}

/*BTN VINCULOS EXTERNOS HEADER*/
#btnVinculosExternos {
    margin-top: 4px;
    margin-right: 15px;
    box-shadow: none;
}

    #btnVinculosExternos.boton-circle {
        height: 30px;
        width: 30px;
        border-radius: 40%;
    }

#divVinculosExternosHeader.dropdown {
    position: relative;
    display: inline-block;
}

#divVinculosExternosHeader.dropdown-menu {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    #divVinculosExternosHeader.dropdown-menu li a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

    #divVinculosExternosHeader.dropdown-menu a:hover {
        background-color: #f1f1f1;
    }

#divVinculosExternosHeader.dropdown:hover .dropdown-menu {
    display: block;
}
/*MODAL PARA CONTENIDOS CON IFRAME*/
.modal-lg {
    width: 95%;
    height: 100%;
}

.modal-body iframe {
    width: 100%;
    height: 100%;
    min-height: 440px;
    border: none;
}
/*FASES - EN OPORTUNIDAD*/
.steps {
    margin: 10px;
    padding: 0;
    overflow: hidden;
}

    .steps a {
        color: white;
        text-decoration: none;
    }

    .steps {
        display: block;
        font-size: 1.1em;
        font-weight: normal;
    }

    .steps li {
        float: left;
        margin-top: 2px;
        margin-bottom: 2px;
        margin-left: 0;
        width: auto; /* 100 / number of steps */
        min-width: 200px;
        text-align:center;
        height: 32px; /* total height */
        list-style-type: none;
        padding: 5px 5px 5px 30px; /* padding around text, last should include arrow width */
        border-right: 5px solid white; /* width: gap between arrows, color: background of document */
        position: relative;
    }
        /* remove extra padding on the first object since it doesn't have an arrow to the left */
        .steps li:first-child {
            padding-left: 5px;
        }
        /* white arrow to the left to "erase" background (starting from the 2nd object) */
        .steps li:nth-child(n+2)::before {
            position: absolute;
            top: 0;
            left: 0;
            display: block;
            border-left: 25px solid white; /* width: arrow width, color: background of document */
            border-top: 16px solid transparent; /* width: half height */
            border-bottom: 16px solid transparent; /* width: half height */
            width: 0;
            height: 0;
            content: " ";
        }
        /* colored arrow to the right */
        .steps li::after {
            z-index: 1; /* need to bring this above the next item */
            position: absolute;
            top: 0;
            right: -25px; /* arrow width (negated) */
            display: block;
            border-left: 25px solid #F4F4F4; /* width: arrow width */
            border-top: 16px solid transparent; /* width: half height */
            border-bottom: 16px solid transparent; /* width: half height */
            width: 0;
            height: 0;
            content: " ";
        }

    /* Setup colors (both the background and the arrow) */

    /* Completed */
    .steps li {
        background-color: #bebfc5;
    }

        .steps li::after {
            border-left-color: #bebfc5;
        }

        /* Current */
        .steps li.current {
            background-color: rgb(3, 124, 33);
        }

            .steps li.current::after {
                border-left-color: rgb(3, 124, 33);
            }

            /* Following */
            .steps li.current ~ li {
                background-color: #e4e4e4;
            }

                .steps li.current ~ li::after {
                    border-left-color: #e4e4e4;
                }

        /* Hover for completed and current */
        /*.steps li:hover {
            background-color: #696;
        }

            .steps li:hover::after {
                border-left-color: #696;
            }*/
        .steps li a:hover {
            cursor:default;
        }
/*PARA CONTROLES FECHA*/
.dx-datebox {
    width: 100% !important;
}
/*PADDING GRID MASTER/DETAIL*/
.dx-datagrid-rowsview .dx-row > .dx-master-detail-cell {
    padding: 5px !important;
}
/*MARGEN PARA CALENDARIO*/
.dx-datebox-wrapper-calendar .dx-calendar {
    margin: 5px !important;
}
/*FUENTE PARA CALENDARIO*/
.dx-calendar-cell {
    font-size: 12px !important;
}
/*ALTO CALENDRIO*/
.dx-calendar {
    height: 255.6px !important;
    min-height: 255.6px !important;
}
.dx-calendar-body {
    top: 40px !important;
}

.form-control:focus {
    border-color: #00ff80;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 233, 152, 0.6);
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 233, 152, 0.6);
  }