/*
    LOGIN
*/
.main {
    background-image: url(../img/login/login-background.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.login-container {
    background-color: rgb(230, 232, 234) !important;
    border-radius: 10px 10px;
    min-width: 365px;
    min-height: 340px;
}

.login-container h5 {
        color: rgb(58, 65, 88) !important;
    }

.login-shadow {
    border-radius: 10px;
    filter: drop-shadow(5px 5px 5px grey);
}

.login-container-shadow {
    border-radius: 10px;
    filter: drop-shadow(5px 5px 5px rgb(20, 17, 17));
}
/*
    FIN LOGIN
*/
body {
    background-image: url(../img/FONDO_PANOL-2.svg);
    background-repeat: repeat;
    background-size: cover;
}

header {
    height: 70px;
    background: linear-gradient(to right, rgba(30,87,153,1) 12%,rgba(41,137,216,1) 41%,rgba(32,124,202,1) 72%,rgba(50,151,229,1) 98%);
}

footer {
    height: 100px;
    background: linear-gradient(to right, rgba(30,87,153,1) 12%,rgba(41,137,216,1) 41%,rgba(32,124,202,1) 72%,rgba(50,151,229,1) 98%);
}

.main-content {
    height: calc(100vh - 170px) !important;
    overflow: auto;
}

.controls {
    background-image: url(../img/FONDO_PANOL-2.svg);
    background-repeat: repeat;
    background-size: cover;
    position: sticky !important;
    top: 0;
}
.offcanvas {
    background-image: url(../img/login_background.svg);
    background-repeat: repeat;
    background-size: cover;
}

.btnControl {
    height: 48px;
}

.form-control {
    border: 1px solid #05B9E8 !important;
    background-color: #434242 !important;
    color: white !important;
}

.form-control-sm {
    border: 1px solid #05B9E8 !important;
    background-color: #434242 !important;
    color: white !important;
    width: 230px !important;
}

.mGridVerde {
    overflow: scroll;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridVerde tr {
    width: 99%;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridVerde tr.AlternatingRowStyle {
    width: 99%;
    overflow: scroll;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #605f5f;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridVerde td {
    position: relative;
    line-height: 20px;
    padding: 1px 12px 1px 12px;
    font-size: 13px;
    border-left: 0;
    border-right: 0;
    text-align: center;
}

.mGridVerde th {
    z-index: 1;
    height: 18px;
    line-height: 24px;
    padding: 3px 10px;
    font-size: 14px;
    font-weight: bold;
    color: #eee;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
    background: #17A44F;
    border-bottom: 1px solid #222;
    border-radius: 2px 2px 0 0;
}

.mGridVerde td:hover {
    background-image: -webkit-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #7e7e7e);
    background-image: -moz-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: -o-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: linear-gradient(to bottom, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    cursor: pointer;
}

.gridpager, .gridpager td {
    text-align: center !important;
    color: cornsilk;
    font-weight: bold;
    text-decoration: none;
}

.gridpager a {
    color: white;
    font-weight: normal;
}

.mGridRojo {
    height: 200px !important;
    color: white !important;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F !important;
    border: 1px solid #202020 !important;
    border-radius: 3px;
}

.mGridRojo tr {
    width: 99%;
    color: white !important;
    text-align: center;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F !important;
    border: 1px solid #202020 !important;
    border-radius: 3px;
}

.mGridRojo tr.AlternatingRowStyle {
    width: 99%;
    overflow: scroll !important;
    color: white !important;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #605f5f !important;
    border: 1px solid #434242 !important;
    border-radius: 3px;
}

.mGridRojo td {
    position: relative;
    line-height: 20px;
    padding: 1px 12px 1px 12px;
    font-size: 13px;
    border-left: 0;
    border-right: 0;
    background: #403F3F !important;
    border: 1px solid #202020 !important;
    text-align: center;
    color: white !important;
}

.mGridRojo th {
    z-index: 1;
    height: 18px;
    line-height: 24px;
    padding: 3px 10px;
    font-size: 14px;
    font-weight: bold;
    color: white !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
    background: #E42522 !important;
    border-bottom: 1px solid #222;
    border-radius: 2px 2px 0 0;
}

.mGridRojo td:hover {
    background-image: -webkit-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #7e7e7e) !important;
    background-image: -moz-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6) !important;
    background-image: -o-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6) !important;
    background-image: linear-gradient(to bottom, #A6A6A6, #A6A6A6 80%, #A6A6A6) !important;
    cursor: pointer;
}

.mGridCeleste {
    width: 99%;
    overflow: scroll;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridCeleste tr {
    width: 99%;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridCeleste tr.AlternatingRowStyle {
    width: 99%;
    overflow: scroll;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #605f5f;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridCeleste td {
    position: relative;
    line-height: 20px;
    padding: 1px 12px 1px 12px;
    font-size: 13px;
    border-left: 0;
    border-right: 0;
    text-align: center;
}

.mGridCeleste th {
    z-index: 1;
    height: 18px;
    line-height: 24px;
    padding: 3px 10px;
    font-size: 14px;
    font-weight: bold;
    color: #eee;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
    background: #259CD3;
    border-bottom: 1px solid #222;
    border-radius: 2px 2px 0 0;
}

.mGridCeleste td:hover {
    background-image: -webkit-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #7e7e7e);
    background-image: -moz-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: -o-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: linear-gradient(to bottom, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    cursor: pointer;
}

.mGridNaranjo {
    width: 100%;
    overflow: scroll !important;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridNaranjo tr {
    width: 100%;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #403F3F;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridNaranjo tr.AlternatingRowStyle {
    width: 100%;
    color: white;
    text-shadow: 0 1px rgba(0, 0, 0, 0.6);
    background: #605f5f;
    border: 1px solid #202020;
    border-radius: 3px;
}

.mGridNaranjo td {
    padding: 1px 12px 1px 12px;
    font-size: 13px;
    border-left: 0;
    border-right: 0;
    text-align: center;
}

.mGridNaranjo th {
    position: sticky !important;
    top: 0;
    height: 36px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    background: #EB6B0A;
    border-bottom: 1px solid #fff;
}

.mGridNaranjo td:hover {
    background-image: -webkit-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #7e7e7e);
    background-image: -moz-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: -o-linear-gradient(top, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    background-image: linear-gradient(to bottom, #A6A6A6, #A6A6A6 80%, #A6A6A6);
    cursor: pointer;
}