@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
@font-face {
    font-family: 'Muli';
    src:url('../fonts/Muli-Regular.ttf') format('truetype');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family: 'dinRegular';
    font-style: normal;
    font-weight: normal;
    src: local('dinRegular'), url('../fonts/DINR____.woff') format('woff');
}

html, body, .ui-widget {
    font-family: 'Muli', 'dinRegular', sans-serif, 'Segoe UI' !important;
    font-weight: normal !important;
    font-size: 12.6px !important;
}

body {
    background-color:#f5f5f5 !important;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 5px;
    padding-right: 5px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    /*max-width: 280px;*/
}

::-webkit-input-placeholder {
    color: #ccc;
}
::-moz-placeholder {
    color:#ccc;
    opacity:1;
}
:-ms-input-placeholder {
    color:#ccc;
}
:-moz-input-placeholder{
    color:#ccc;
}

input[type="radio"] + label,
input[type="checkbox"] + label {
    font-weight:normal;
    padding-left:5px;
}

input[type="checkbox"] + label {
    padding-left:5px;
}   
    
 /* blockUI */
    .blockUI {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background-color: rgba(0,0,0,0);
}

#FxSymbolContainer {
    display: none;
}

#divSuccess {
    position:absolute;
    display:block;
    bottom:5px;
    padding:20px;
    border:1px solid green;
    border-left-width:5px;
    background-color:lightgreen;
    z-index:10;
    transition:.2s ease-in-out;
    width:calc(100% - 100px);
    left:calc((100% - (100% - 100px)) / 2);
}
#divError {
    position:absolute;
    display: block;
    width: calc(100% - 30px);
    left: calc((100% - (100% - 30px)) / 2);
    bottom:5px;
    background-color: #f3e97a;
    border: 1px solid red;
    border-left-width:5px;
    padding: 20px;
    z-index:10;
    transition: .3s ease-in-out;
}
#divError:hover {
    opacity:.2;
}

/* Popup flotante para mostrar mensajes */
.floatingPopup {
    display: block;
    position: fixed;
    padding: 20px;
    border: 1px solid #416b59;
    border-radius: 6px;
    background-color: #416b59;
    box-shadow: #416b59 0 0 20px 4px;
    color: #fff;
    z-index: -1;
    max-width: 40%;
}
.floatingPopup > .closeBtn {
    float: right;
    color: #fff;
    font-size: 20px;
    margin-top: -19px;
    margin-right: -19px;
    padding: 5px 10px;
    cursor: pointer;
}
.floatingPopup > .title {
    font-size: 18px;
}
.floatingPopup > .msg {
    font-size: 16px;
    font-weight:normal;
}
/* fin popup flotante para mostrar mensajes */


/* CUSTOM CSS  */
.logo {
    position:absolute;
    display:flex;
    top:0;
    width:100%;
    height:100vh;
    z-index:-1;
    background-image:url(../images/versailles-logo.svg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:100% 100%;
}
.pageHeader {
    display: block;
    position: fixed;
    width: 100%;
    height: 60px;
    top: 0;
    left: 0;
    right: 0;
    border: 1px solid #31708f;
    color: #fff;
    background-color: #31708f;
    z-index: 20;
    transition: padding-left .4s;
}
.pageLateralContainer {
    left: 0px;
    top: 0px;
    width: 340px;
    height: 100vh;
    padding: 65px 0px 0px 0px;
    position: relative;
    display: block;
    background-color: #31708f;
    z-index: 19;
    transition: width .4s ease-in-out;
    overflow: hidden;
}
.pageCollapse {
    width: 0;
}
.pageContainer {
    width: 100%;
    height: 100vh;
    min-height: 100vh;
    margin: 0;
    padding: 68px 8px 8px 8px;
    background-color: inherit;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    transition: padding-left .4s;
}
.pageFooter {
    clear: both;
    position: fixed;
    color: #fff;
    padding: 0;
    background: #161313;
    display: block;
    height: 40px;
    width: 100%;
    bottom: 0;
    z-index: 20;
}

.btn-menu {
    padding: 10px;
    border-radius: 50%;
    margin: 10px;
    transition: all .4s ease-in-out;
    width: 40px;
}

.btn-menu.pressed {
    background: #12447f;
}

.btn-menu.pressed .btn-menu-bar {
    border-top-color: #fff;
}

.btn-menu:hover {
    cursor: pointer;
}

.btn-menu:hover:not(.pressed) .btn-menu-bar {
    border-top-color: #66afe9;
}

.btn-menu-bar {
    height: 6px;
    border-top: 2px solid #fff;
    width: 20px;
    transition: all .4s ease-in-out;
}

.btn-menu.pressed .bar-top {
    transform: rotate(-43deg) translate(-4px, 6px);
}

.btn-menu.pressed .bar-middle {
    opacity: 0;
}

.btn-menu.pressed .bar-bottom {
    transform: rotate(43deg) translate(-4px,-3px);
}

._panel {
    display:block;
    width:100%;
    height:100%;
    border:1px solid #ddd;
    box-sizing:border-box;
    overflow:hidden;
}
._panel-without-border {
    border-color:transparent;
}
._panel-V-50 {
    height:50%;
}
._panel-H-50 {
    width:50%;
}

._box-shadow {
    box-shadow: #ccc 0 0 20px 2px;
}

._panel-caption {
    display: block;
    width: 100%;
    height: 32px;
    line-height: 32px;
    border-bottom: 1px solid #ddd;
    box-sizing: content-box;
    background-color: #f8f8f8;
    color: #444;
}
._panel-title {
    display:inline-block;
    height:inherit;
    line-height:inherit;
    padding:0 10px;
    background-color:#f0f0f0;
}
._panel-caption > .toolbox {
    display:inline-block;
    height:inherit;
    line-height:inherit;
}
._panel-caption > .toolbox > ul {
    margin:0;
    padding:0;
}
._panel-caption > .toolbox > ul > li {
    display: inline-block;
    height: 22px;
    line-height: 22px;
    padding: 0 10px;
    border: 1px solid #ddd;
    box-sizing: content-box;
    background-color: #f0f0f0;
    border-radius: 6px;
}
._panel-caption > .toolbox > ul > li:hover {
    cursor:pointer;
    color:#fff;
    background-color:#0077BE;
    border-color:#0077BE;
}
._panel-caption > .toolbox > ul > li > i {
    padding-right:6px;
}
._panel-title + .toolbox {
    margin-left:10px;
}



._panel-title-with-separator:after {
    content: '';
    display: inline-block;
    height: 20px;
    margin: 6px 10px;
    border-right: 1px solid #ddd;
    box-sizing: content-box;
    float:right;
}

._panel-body {
    display:block;
    width:100%;
    height:calc(100% - 32px);
    padding:5px;
    background-color:#fff;
}
._panel-body-without-caption {
    height:100%;
}

._panel-content {
    display:block;
    width:100%;
    height:calc(100% - 32px);
    padding:0px;
    background-color:#fff;
}
._panel-content-without-caption {
    height:100%;
}
._panel-container {
    display:block;
    width:100%;
    height:100%;
    padding:10px;
    overflow:hidden;
}
._panel-table-container {
    display:block;
    width:100%;
    height:100%;
    overflow:hidden;
}
._panel-container-with-toolbox {
    height: calc(100% - 31px);
}
._panel-table-thead-container {
    display:block;
    width:100%;
    border-left:1px solid #ddd;
}
._panel-table-thead-container > table {
    margin-bottom:0px;
}
._panel-table-scrollable-container {
    display:block;
    width:100%;
    height:calc(100% - 29px);
    /*border-left:1px solid #333;
    border-bottom:1px solid #333;*/
    overflow-y:auto;
}
._panel-table-scrollable-container::-webkit-scrollbar {
    width:12px;
}
._panel-table-scrollable-container::-webkit-scrollbar-thumb {
    background-color: #cccccc;
    border-right: 1px solid #333;
}
._panel-table-scrollable-container::-webkit-scrollbar-track {
    background-color: #cccccc85;
    border-right: 1px solid #333;
}

.double-thead {
    height:calc(100% - 57px);
}

._panel-table-scrollable-container > table thead {
    /*display:none;*/
}
._panel-table-scrollable-container > table thead tr:not(.expand) th {
    padding:0 !important;
    height: 0 !important;
    line-height: 0 !important;
    border-bottom-color:transparent !important;
    overflow:hidden;
}

.fl {
    float:left;
}
.fr {
    float:right;
}

.toolbox-bar {
    width: 100%;
    height: 31px;
    display: block;
    border-bottom: 1px solid #ccc;
}
.without-borders {
    border-color:transparent;
}

._panel-caption > .toolbox-bar {
    width:auto;
    display:inline-block;
    float:inherit;
    text-transform:none;
}

.toolbox-bar > ul,
.toolbox-bar > .toolbox-container > ul {
    margin:0 !important;
    padding:0 !important;
}
.toolbox-container {
    height:inherit;
}
.toolbox-bar > .toolbox-container > ul > li {
    list-style:none;
    float:left;
    height:30px;
    user-select:none;
}

.toolbox-bar > .toolbox-container > ul > li > a {
    text-decoration:none;
    color:inherit;
    height:inherit;
    line-height:30px;
    padding:0 8px;
    cursor:pointer;
    user-select:none;
}
.toolbox-bar > .toolbox-container > ul > li > a > i {
    margin-right:5px;
}

.toolbox-bar > .toolbox-container > ul > li:hover {
    /*background-color: #12447f;
    color:#fff;*/
}
/*.toolbox-bar > .toolbox-container > ul > li:active {
    background-color: #31708f;
    color: #fff;
}*/

.toolbox-bar > .toolbox-container > ul > li > .box-item {
    height:inherit;
    line-height:30px;
}
.toolbox-bar > .toolbox-container > ul > li > input {
    height:26px;
    border:1px solid #ddd;
    padding:0 10px;
    margin-top:2px;
    margin-right:5px;
}
.toolbox-bar > .toolbox-container > ul > li > .box-item > select {
    height:100%;
    border:none;
}

.toolbox-bar .menu-item-ico {
    height: 16px;
    width: 20px;
}
/*.toolbox-bar .menu-item-ico,
.toolbox-bar .menu-item-text,
.toolbox-bar .menu-item-caret {
    fill: #12447f;
    color: #12447f;
}*/
.toolbox-bar .menu-item-text {
    line-height: normal;
    padding-left: 5px;
}
.toolbox-bar .menu-item-caret {
    padding-left:8px;
}


._table-content {
    display:block;
    width:100%;
    height:100%;
    padding:0 10px;
}
.table-simple {
    width:100%;
    margin-bottom:0px !important;
    /*border-bottom:1px solid #ddd;*/
    border-collapse:separate;
}
.table-simple-fixed {
    table-layout:fixed;
}
.table-simple > thead > tr > th {
    border-bottom-width: 1px !important;
    border-right: 1px solid #ddd;
    padding: 4px !important;
    text-align: center;
    font-weight: normal;
    color: #fff; /*#f57c00; */
    background-image: -moz-linear-gradient(top, #08c 40%, #0044cc);
    background-image: linear-gradient(top, #08c 40%, #0044cc);
    background-image: -webkit-linear-gradient(top, #08c 40%, #0044cc);
}
.table-simple > thead > tr th.theme0 {
    background-image:none;
    color:#12447f;
    border:1px solid #ddd;
}
.table-simple > thead > tr th.metro {
    background-image:none;
    color:#333;
    text-transform:uppercase;
    font-size:smaller;
    font-weight:bold;
}
.table-simple > thead > tr > th > div.text {
    padding:0 5px;
    width:calc(100% - 20px);
    float:left;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
}
.table-simple > thead > tr > th > i.ico {
    width:20px;
}
.table-simple > thead > tr > th:not(.hidden):first-child {
    /*border-top-left-radius: 6px;*/
}
.table-simple > tbody > tr.row-selected {
    background-color: #f27474 !important;
    color: #fff;
}
.table-simple > tbody > tr.odd {
    background-color: #f0f5f8;
}
.table-simple > tbody > tr > td {
    padding:2.5px 4px !important;
    border:1px solid transparent !important;
    user-select:none;
}
.table-simple-nowrap > thead > tr > th,
.table-simple-nowrap > tbody > tr > td {
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
}

.table-simple > tbody > tr:first-child > td > div.loading,
.table-simple > tbody > tr:first-child > td > div.error,
.loading {
    width: 100%;
    display: block;
    padding: 20px;
    text-align: center;
    font-size: large;
    color: #12447f;
}
.table-simple > tbody > tr:first-child > td > div.loading > i + span,
div.loading > i + span {
    padding-left:5px;
}

.table-simple > tbody > tr:first-child > td > div.error {
    color: red;
}

td.lh28 {
    height: 28px !important;
    line-height: 28px !important;
}
td.lh35 {
    height:35px !important;
    line-height:35px !important;
}

tr.totales {
    background-color:#f5f5f5;
}
tr.totales > th {
    text-align:right !important;
    font-weight:bold !important;
}

.table-simple > tbody > tr.selected {
    background-color: #f27474;
    color: #fff;
}
/*.table-simple-hover > tbody > tr:hover:not(.selected) {
    background-color: #e5f8fd;
}*/

.table-simple > tbody > tr.selected,
.table-simple-hover > tbody > tr:hover {
    cursor:pointer;
}

/*.table-simple-hover > tbody > tr:hover > td:first-child:not('.hidden'),*/
.table-simple-hover > tbody > tr:hover > td:first-child + td:not(.hidden) {
    border-left-color: red !important;
}
/*.table-simple-hover > tbody > tr:hover > td,*/
.table-simple-hover > tbody > tr:hover > td:not(.hidden) {
    border-color:red transparent !important;
}
/*.table-simple-hover > tbody > tr:hover > td:last-child,*/
.table-simple-hover > tbody > tr:hover > td:last-child {
    border-right-color:red !important;
}

/* TABLA CON BORDERS */

.table-simple-with-borders {
    width: 100%;
    margin-bottom: 0px !important;
    border-collapse: separate;
    border-spacing:0;
}
.table-simple-with-borders > tbody > tr.odd > td {
    background-color: #f0f5f8;
}
.table-simple-with-borders > tbody > tr > td {
    padding: 2.5px 4px !important;
    border: 1px solid #ddd !important;
    border-color:transparent #ddd #ddd transparent !important;
    user-select: none;
}
.table-simple-with-borders > thead > tr th.metro {
    /*border-bottom-width: 1px !important;
    border-right: 1px solid #ddd;*/
    border:1px solid #ddd !important;
    border-color:#ddd #ddd #ddd transparent !important;
    padding: 4px !important;
    text-align: center;
    color: #333;
    text-transform: uppercase;
    font-size: smaller;
}

.table-simple-striped > tbody > tr:nth-child(odd) td,
.table-simple-striped > tbody > tr:nth-child(even) td {
    padding: 4px !important;
}
.table-simple-striped > tbody > tr:not(.selected):nth-child(odd) td {
    background-color:#f1f5f8;
}


.commandBar-item {
    float: left;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    height: 30px;
    padding: 0 10px;
    cursor: pointer;
    fill: #12447f;
    color: #12447f;
    user-select:none;
}

.commandBar-item.disabled {
    pointer-events:none;
    opacity:.2;
}
.commandBar-item.warning {
    color: #bf2320;
    fill: #bf2320;
}
.commandBar-item.hover-warning {
    outline-color: #bf2320;
}
.commandBar-item:not(.commandBar-item-separator):hover {
    background-color: #12447f;
    color: #fff;
    fill:#fff;
}
.commandBar-item:active {
    background-color: #31708f !important;
    color:#fff;
    fill:#fff;
}


.commandBar-item.hover-warning:hover {
    background-color: red;
    color: #fff;
    fill: #fff;
}
.commandBar-item.warning:hover {
    background-color: #bf2320;
    color: #fff;
    fill: #fff;
}


/*.commandBar-item:not(.commandBar-item-separator):hover .menu-item-ico,
.commandBar-item:not(.commandBar-item-separator):hover .menu-item-text,
.commandBar-item:not(.commandBar-item-separator):hover .menu-item-caret {
    fill: #c4d0df;
    color: #c4d0df;
}*/
.commandBar-item-separator {
    padding:0;
}
.commandBar-item-dropdown {
    padding:10px;
    border:1px solid #ddd;
    background-color:#fff;
    position:absolute;
    box-shadow: #ddd 0 0 20px 1px;
}
.commandBar-item-dropdown:before{
    content:"";
    position:absolute;
    border:7px solid transparent;
    border-bottom-color:#ddd;
    top:-15px;
    left:20px;
}
.commandBar-item-dropdown:after {
    content: "";
    position: absolute;
    border: 7px solid transparent;
    border-bottom-color: #fff;
    top:-14px;
    left:20px;
}

.commandBar-item-dropdown > ul {
    margin:0;
    padding:0;
}
.commandBar-item-dropdown > ul > li {
    list-style-type:none;
    color:#12447f;
    padding:5px;
}
.commandBar-item-dropdown > ul > li:hover {
    background-color:#12447f;
    color:#fff;
}
.commandBar-item-dropdown > ul > li.disabled {
    pointer-events:none;
    opacity:.2;
}

/* dialog confirm */
.ui-dialog-confirm {
    font-size: 15px; 
    position: absolute; 
    border: 2px solid rgba(10,10,10,0.7); 
    border-radius: 5px; 
    background-color: #fff; 
    padding: 0;
    box-shadow: 0 0 0 7px rgba(240, 240, 240, 0.5);
    outline-style: none;
}
.ui-dialog-confirm-title {
    padding: 10px;
    float: left;
    position: relative;
    width: 100%;
    border: 1px solid transparent;
    border-bottom-color: #eee;
}
.ui-dialog-confirm-content {
    padding: 30px;
    float: left; 
    position: relative;
    width: 100%;
}
.ui-dialog-confirm-buttons {
    float:left; 
    position: relative; 
    width: 100%;
    border: 1px solid transparent;
    border-top-color: #eee;
    padding: 10px;
    /*height: 33%;*/ 
}

.font-size-14 {
    font-size: 14px !important;
}



/* JQUERY DIALOG CUSTOM CSS */
.ui-dialog-hidden {
    display: none;
}
.ui-dialog-custom {
    border-radius: 0;
    padding: 0 !important;
}
.ui-dialog-titlebar-custom {
    border-radius: 0;
}
.ui-dialog .ui-dialog-content {
    overflow: visible !important;
}


/*.ui-widget {
    font-family: dinRegular, 'Segoe UI' !important;
    font-size:14px !important;
}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: dinRegular, 'Segoe UI' !important;
}*/

/* BOOTSTRAP */
.nav-tabs > li.active > a {
    border-top-width: 4px !important;
    padding-top: 7px;
}
.nav-tabs > li.active a {
    font-weight: bold;
}
.border-round {
    border-radius: 3px !important;
}
.col-lg-1, .col-lg-2, .col-lg-3 {
    padding-left: 0px;
    padding-right: 2px;
}
.dt-body-center {
    text-align: center;
}
input[data-pad], input[data-readonly] {
    text-align: center;
}
.form-group {
    margin-bottom: 6px !important;
}
.form-control + .form-control {
    margin-top: 2px;
}





.tab-pane-container {
    padding: 5px 10px;
    border: 1px solid #ddd;
    border-top-width: 0;
    height:100%;
}




/* TAB PAGE */
.tab-manager {
    display:block;
    width:100%;
    height:100%;
}
.tab-header {
    display: block;
    width: 100%;
    height: 30px;
}
.tab-header ul {
    padding:0;
    margin:0;
}
.tab-header ul li {
    list-style: none;
    float: left;
    padding: 0 10px;
    height: 30px;
    line-height:27px;
    border-width: 3px 1px 1px 1px;
    border-color: transparent;
    border-style: solid;
    cursor:pointer;
}
.tab-header ul li.active {
    height: 31px;
    border-color: #31708f #31708f #fff #31708f
}
.tab-header ul li a {
    color:#333;
    text-decoration:none;
}
.tab-container {
    display: block;
    height: calc(100% - 30px);
    border: 1px solid #31708f;
}
.tab-container .tab-page {
    display: none;
    width: 100%;
    height: 100%;
    padding: 10px;
}
.tab-container .tab-page.active {
    display:block;
}

/* INPUT DATE  */
._input-date {
    outline:none;
    border:1px solid #ddd;
    height:30px;
    width:145px;
    padding-left:5px;
}
._input-date:focus {
    border-color:#0094ff;
}
._input-date-without-clear-button::-ms-clear,
._input-date-without-clear-button::-webkit-clear-button {
    display:none;
}
._without-clear-button::-webkit-clear-button {
    display:none;
}
._without-spin-button::-webkit-inner-spin-button {
    display:none;
}


/* _BTN */
._btn {
    padding:0px 10px;
    border:1px solid #ddd;
    display:inline-block;
    background-color:#fff;
    color:#333;
    line-height:30px;
    box-sizing:content-box;
    cursor:pointer;
    user-select:none;
    outline:none;
}
._btn-ico {
    display:inline-block;
}
._btn-label {
    display:inline-block;
}
._btn:focus {
    border-color:transparent;
    background-color:#0094ff;
    color:#fff;
}


.bar {
    mix-blend-mode:difference;
}


.flip {
    perspective:600px;
}

.card {
    width:100%;
    height:100%;
    position:relative;
    transition: transform 1s;
    transform-style:preserve-3d;
}
.card.is-flipped {
    transform:rotateY(180deg);
}
.card-face {
    position:absolute;
    width:100%;
    height:100%;
    backface-visibility: hidden;
}
.card-face-back {
    transform:rotateY(180deg);
}

.ui-dialog {
    padding: 0;
    border-radius: 0;
    border-color:#31708f;
    box-shadow: #ccc 0 0 20px 0;
}
.ui-dialog .ui-dialog-titlebar {
    padding: 6px;
    border-radius: 0;
    border-color: #31708f;
    background-color: #31708f;
    color: #fff;
    font-weight: normal;
}
.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
    display:none;
}
.ui-dialog .ui-dialog-content {
    padding:0;
}
.ui-dialog .ui-dialog-buttonpane {
    padding:6px;
    background-color:#f8f8f8;
    margin-top:0;
    border-top-color:transparent;
}
.ui-widget button {
    font-family: 'Muli', 'dinRegular';
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 6px;
    border-style: outset;
}