sup {
    left: 1px;
}
/*CHANGE PILLS CLOR  TEXT COLOR*/

.nav-pills .nav-link.active:hover, .nav-pills .nav-link.active {
    color: #ffffff;
    background-color: #22406e !important;
}
.text-justify {
    text-align: justify;
}
a.nav-link {
    color: #e62329;
}
.reportHeader {
    color: #22406e !important;
}
.fa-calendar {
    display: flex !important;
}

body {
    color: #555555;
    font-family: Open Sans, Helvetica, Arial;
    font-size: 1rem;
}


.jumbotron {
    padding: 1rem 1rem !important;
    margin-bottom: 0.5rem;
}


input.currency {
    text-align: right;
    padding-right: 15px;
    border-left: none;
}

div.progress {
    height: 2rem;
}

.mainColor {
    COLOR: #2c5a7e !important;
}

#tableSession tr:nth-child(odd) {
    background: #E6E6E6;
}

#tableReg {
    color: #555555 !important;
}

.mainBackColor {
    BACKGROUND-COLOR: #22406e;
    color: white !important;
}

.mainBackColorLight {
    BACKGROUND-COLOR: #8EA9DB;
    color: white;
}

.secondColor {
    COLOR: #e62329;
}

.secondBackColor {
    BACKGROUND-COLOR: #22406e;
    color: white!important;
}

.secondBackColorLight {
    BACKGROUND-COLOR: #92D050;
    color: white;
}

.ui-datepicker-title {
    color: black;
}

.ui-widget-header {
    border: 1px solid #00B050;
    color: #357CB4;
    font-weight: bold;
    background: #22406e;
}

.reportHeader {
    BACKGROUND-COLOR: transparent;
    COLOR: #22406e;
    font-weight: bold;
}

.reportLabel {
    COLOR: #404040;
    BACKGROUND-COLOR: transparent;
}

.rowTot {
    color: #22406e;
    font-weight: bold;
}

/* card */

.card {
    background: rgba(255,255,255,0.95) !important;
    /*margin-bottom: 5px !important;*/
    border: none !important;
}


.card-header {
    background-color: #22406e !important;
    /*background-image: -webkit-linear-gradient(top,#22406e 0,#22406e 100%) !important;
    background-image: -o-linear-gradient(top,#22406e 0,#22406e 100%) !important;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#22406e),to(#22406e)) !important;
    background-image: linear-gradient(to bottom,#22406e 0,#22406e 100%) !important;*/
    COLOR: white !important;
}

/*  field */

.divField {
    min-height: 40px !important;
}

/* help field*/

.helpLink {
    Z-INDEX: 0;
}

.helpBox {
    BACKGROUND-COLOR: #F2F3F9;
    BORDER: 1px solid #CCCCCC;
    COLOR: #3E3E3E;
    DISPLAY: none;
    PADDING: 1rem;
    POSITION: absolute;
    /*  WIDTH: 320px;
    Z-INDEX: 0;*/
}

/*  ERROR */

.fontawesome-eye-open {
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
}
/*
.errorLabel {
    color: red;
    display: block;
    float: left;
}*/
/*.error {
    border: 1px solid #dc3545 !important;
}*/

    .error + label {
        color: #dc3545 !important;
    }

.progress-bar {
    background-color: #22406e;
    background-image: linear-gradient(to bottom,#22406e 0,#22406e 100%);
}

.progress {
    background-image: -webkit-linear-gradient(top,#ffffff 0,#ffffff 100%);
    background-image: -o-linear-gradient(top,#ebebeb 0,#ffffff 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#ffffff));
    background-image: linear-gradient(to bottom,#ffffff 0,#ffffff 100%);
    /*filter: progid:DXImageTransform.Microsoft.gradient();*/
    background-repeat: repeat-x;
    border: 1px solid #ccc;
}

.btn-success, .btn-success:focus, .btn-success:hover {
    background-image: none !important;
    border-color: #22406e !important;
    background-color: #22406e !important;
}

.btn {
    text-shadow: none !important;
}

.btn-danger, .btn-danger:hover, .btn-danger:focus {
    background-image: none !important;
    background-repeat: repeat-x !important;
    border-color: #767b83 !important;
    background-color: #767b83 !important;
}

.panel {
    border: none !important;
}

/*btn color TEST*/
.btn-outline-primary, .btn-primary:hover {
    color: #22406e !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #22406e !important;
}


    .btn-outline-primary:hover, .btn-primary {
        color: white !important;
        background-color: #22406e !important;
        background-image: none !important;
        border-color: #22406e !important;
    }
 

.form-control[readonly] {
    background-color: #e9ecef;
}