@charset "utf-8";

/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto:300,400');
:root {
    --primary: #1975d1;
    --primary-accent: #1c80dd;
    --color-accent: #ffffff;
    /*Degradado botones HOME*/
    --color-gradient-from: rgba(255, 255, 255, 1);
    --color-gradient-middle: rgba(237, 237, 237, 1);
    --color-gradient-to: rgba(243, 243, 243, 1);
    /*Color mensaje inicio*/
    --color-msg: #F9FD97;
    /*Sombras*/
    --boxShadow: #888888;
    --bgHover: #c5ccd0;
    --control-label: #b3b3b3;
    --border-b: #999999;
    --color-access: #2B2A2A;
    --color-icons: #b7d123;
}

html {
    height: 100%;
}

body {
    background-color: var(--color-accent);
    font-family: 'Roboto', sans-serif;
}

.modal-body {
    display: flex;
}

.modal-noflex {
    flex-direction: column;
}

.modal-title {
    color: var(--primary);
}

.bodyAcceso {
    background-color: var(--primary);
    /*background-image: -webkit-gradient(radial,center center,0,center center,460,from(#626568),to(#000000));
  background-image: -webkit-radial-gradient(circle,#626568,#000000);
  background-image: -moz-radial-gradient(circle,#626568,#000000);
  background-image: -o-radial-gradient(circle,#626568,#000000);
  background-repeat: no-repeat;*/
    height: 100% !important;
    /*font-family: helvetica;*/
    font-family: 'Roboto', sans-serif;
}

.bodyAcceso::after {
    content: "";
    background: url('../img/background.jpeg');
    background-size: content;
    opacity: 0.5;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: fixed !important;
    z-index: -1;
}

.imgLogo {
    /*width: 250px;*/
    height: 115px;
    text-align: center;
    margin: 20px;
    margin-left: -15px;
}

.formAcceso {
    height: 100%;
    border: 0;
    color: var(--color-access);
}

.fieldAcceso {
    border: solid 0;
}

.tbIngreso {
    border-width: 0px;
    border: thin;
    text-align: center;
    /*alignment-adjust:central;*/
    background: #D5D5D5;
    padding: 9px;
    border-radius: 15px;
    box-shadow: 1px 1px 15px #000;
}

.celdaTitulo {
    text-align: center;
}

.celdaTitulo h3 {
    /*padding:15px;
  border-radius:22px;*/
    margin-top: -41px;
    padding: 7px;
    background: #a90329;
    background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a90329), color-stop(44%, #8f0222), color-stop(100%, #6d0019));
    background: -webkit-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%);
    background: -o-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%);
    background: -ms-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%);
    background: linear-gradient(to bottom, #a90329 0%, #8f0222 44%, #6d0019 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019', GradientType=0);
    color: var(--color-accent);
    border-radius: 18px;
}

.celdaLbClave {
    width: 41%;
    height: 0px;
    text-align: center;
    vertical-align: baseline;
    white-space: nowrap;
    font-size: 16pt;
    color: #646363;
    margin-right: 52px;
    float: right;
    margin-top: 70px;
}

.celdaTxClave {
    margin-top: 0px;
}

.inputbox {
    width: 155px;
    float: left;
    margin-left: 11px;
    margin-top: 25px;
    height: 30px;
    font-size: 18pt;
    text-align: center;
}

.celdasNros {
    width: 59%;
}

.btnNro {
    width: 80px;
    height: 80px;
    font-size: 25px;
    border: 0;
    /* border-radius: 10px; */
    font-family: 'Roboto', sans-serif;
    cursor: pointer;
    background: transparent;
    color: var(--color-accent);
}

.btnNro:hover {
    opacity: 0.5;
}

#btn0 {
    float: right;
}

.btnLimpiar {
    /*width:160px; */
    background: url('../img/nodeconnection-clear.png') no-repeat center center;
}

.btnIngreso {
    /* background: #a90329;  
    background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%);  
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019)); 
    background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  
    background: -o-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  
    background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  
    background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%);  
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); */
    color: #eee;
    /* height: 47px !important; */
    /* width: 163px!important; */
    /* font-size: 20px!important; */
    margin-top: 15px;
    /* border-radius: 15px; */
}

#Actual {
    color: var(--color-msg);
    margin-top: 16px;
    font-size: 18pt;
}

.csCargarJson {
    color: var(--color-msg);
    margin-top: 16px;
    font-size: 18pt;
}

.notFilled {
    border: 2px solid #960;
}


/*h3 {
    padding: 7px;
    color: fff;
    background: #a90329;  background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%);  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019));  background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  background: -o-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);  background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%);  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 );
  color: #FFF !important;
  border-radius: 20px;
}*/

.divBody {
    text-align: left;
    font-family: 'Roboto', sans-serif;
}

.btn-success {
    border-style: none;
    cursor: pointer;
    transition: 1s;
    border-radius: 5px !important;
    padding: 5px;
    width: 80px;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0px 0px 5px var(--boxShadow) !important;
}

.margen10 {
    margin: 10px;
}


/*.optSelect{
}

#divIzq {
  width:40%;
  float:left;
}

#divCen {
  width: 17%;
  float:left;
}

#divDer {
  width: 40%;
  float:left;
}*/

.contenidoPrincipal {
    width: 100%;
    padding-right: 22px;
    margin-top: 10px;
    padding: 0px 10px 0px 10px;
}

.contenidoPrincipal table {
    border: 0;
    width: 100%;
    font-size: 12px;
}

.docContenido {
    width: 100%;
    /*float: left;*/
    padding: 0 5px 0 5px;
}

.InfDocActual {
    /*width: 250px;
  float: right;
  margin-right: 30px;*/
    font-size: 13px;
}

.carrito {
    width: 100%;
    font-size: 11px;
    position: relative;
}

.carrito .divFila {
    background-color: #EEE;
    width: 100%;
    height: auto;
    margin-bottom: 7px;
}

.carrito .divFila .divCelda1 {
    width: 50%;
    display: inline-block;
    vertical-align: top;
}

.carrito .divFila .divCelda2 {
    width: 15%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

.carrito .divFila .divCelda3 {
    width: 5%;
    display: inline-block;
    border-radius: 100%;
    background: #FF0000;
    color: var(--color-accent);
    cursor: pointer;
    /*float: right;*/
    text-align: center;
}

.botonimagen {
    background-image: url(../img/csv.jpg);
    background-repeat: no-repeat;
    height: 50px;
    width: 50px;
    background-position: center;
    border: 0;
    padding: 0 0 20px 10px;
}


/*Nuevos*/

h3.registro {
    color: var(--primary);
    font-weight: 300;
    font-size: 4rem;
}

h3.Titulo {
    color: var(--primary);
    text-transform: uppercase !important;
    text-align: center;
}

.login-iz {
    background: var(--color-accent);
    height: 350px;
    padding: 15px 35px;
}

.login-der {
    background: var(--primary-accent);
    padding: 15px;
}

.login-der table {
    margin: 0 auto;
}

.imgUSer {
    margin: 25px 0 25px;
}

.content-query {
    display: grid;
    font-size: 18px;
    font-weight: 300;
}

.content-query div {
    display: inline-block;
    /*margin: 3px;*/
}


/* #divCod,
#divNom,
#divLimCr,
#divNit,
#divTel,
#divCondP,
#divRegional,
#divEmp,
#divCargo,
#divDirecc,
#divCiudad,
#divEmail,
#divCart,
#divEnt,
#divPed,
#divGrpSN,
.subtitle {
    color: var(--primary);
} */

.csColorTexto {
    color: var(--primary);
}

.divCentro {
    font-size: 16px;
}

.subtitle {
    border-bottom: 1px solid;
    display: inline;
}

.home-item {
    background: rgb(255, 255, 255);
    /* Old browsers */
    background: -moz-linear-gradient(top, var(--color-gradient-from) 0%, var(--color-gradient-to) 50%, var(--color-gradient-middle) 51%, var(--color-gradient-from) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, var(--color-gradient-from) 0%, var(--color-gradient-to) 50%, var(--color-gradient-middle) 51%, var(--color-gradient-from) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, var(--color-gradient-from) 0%, var(--color-gradient-to) 50%, var(--color-gradient-middle) 51%, var(--color-gradient-from) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr=var(--color-accent), endColorstr=var(--color-accent), GradientType=0);
    /* IE6-9 */
    text-align: center;
    padding: 50px; /* 70px */
    transition: all .2s ease-in-out;
    cursor: pointer;
    /*border-bottom: 1px dashed;
  border-right: 1px dashed;
  border-left: 1px dashed;*/
}

.home-item::after {
    content: "";
    background: url('../img/background-border.png') center center no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 9;
    background-size: contain;
}

.home-item.active::after,
.home-item:hover::after {
    background: url() center center no-repeat;
}

.home-item:hover,
.home-item.active {
    background: var(--primary);
}

.home-item.active p a,
.home-item:hover p a {
    color: var(--color-accent) !important;
}

.home-item.active img,
.home-item:hover img {
    background: white;
    border-radius: 25px;
    transform: scale(1.1);
}

.home {
    width: 100%;
    height: 100vh;
    position: absolute;
    z-index: 9;
    background: var(--color-accent);
    display: block;
    padding: 0 150px;
}

/*** Colquímicos ***/
/* .home #Capa_1 {
    width: 50px;
} */

.menu-home {
    position: fixed;
    bottom: 160px;
    right: 20px;
    z-index: 99;
    cursor: pointer;
    border-radius: 25px;
    background: var(--color-accent);
    transition: all .5s ease;
}

.menu-home:hover {
    background: var(--bgHover);
    transform: scale(1.1);
}

.menu-mobile {
    position: fixed;
    bottom: 100px;
    right: 20px;
    z-index: 99;
    transition: all .5s ease;
}

.menu-mobile:hover {
    transform: scale(1.1);
}

.menu-mobile img {
    margin-top: 25px;
    cursor: pointer;
}

.title-mobile-brand {
    margin-top: 38px;
    font-size: 24px;
}


/*end Nuevos*/


/*Material forms*/

body::after,
body::before,
input::after,
input::before,
select::after,
select::before,
textarea::after,
textarea::before,
body *::after,
body *::before {
    box-sizing: border-box;
}

h1 {
    font-size: 2rem;
    text-align: center;
    margin: 0 0 2em;
}

.main-container {
    position: relative;
    max-width: 40rem;
    margin: 5rem auto;
    background: var(--color-accent);
    width: 100%;
    padding: 3rem 5rem 0;
    border-radius: 1px;
}

.main-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-transition: -webkit-transform 0.28s ease-in-out;
    transition: -webkit-transform 0.28s ease-in-out;
    transition: transform 0.28s ease-in-out;
    transition: transform 0.28s ease-in-out, -webkit-transform 0.28s ease-in-out;
    z-index: -1;
}

.main-container:hover::before {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.button-main-container {
    text-align: center;
}

fieldset {
    margin: 0;
    padding: 0;
    border: none;
}

.form-radio,
.material-form-group {
    position: relative;
    margin-top: 2.25rem;
    margin-bottom: 2.25rem !important;
}

.form-inline {
    margin-bottom: 25px;
}

.form-inline>.material-form-group,
.form-inline>.btn {
    display: inline-block;
    /*margin-bottom: 0;*/
    width: 24%;
}

.form-help {
    margin-top: 0.125rem;
    margin-left: 0.125rem;
    color: var(--control-label);
    font-size: 0.8rem;
}

.checkbox .form-help,
.form-radio .form-help,
.material-form-group .form-help {
    position: absolute;
    width: 100%;
}

.checkbox .form-help {
    position: relative;
    margin-bottom: 1rem;
}

.form-radio .form-help {
    padding-top: 0.25rem;
    margin-top: -1rem;
}

.material-form-group input {
    height: 3.9rem;
}

.material-form-group textarea {
    resize: none;
}

.material-form-group select {
    width: 100%;
    font-size: 1rem;
    height: 3.9rem;
    padding: 0.125rem 0.125rem 0.0625rem;
    background: none;
    border: none;
    line-height: 1.6;
    box-shadow: none;
}

.material-form-group .control-label {
    position: absolute;
    top: 0.25rem;
    pointer-events: none;
    padding-left: 0.125rem;
    /*z-index: 1;*/
    color: var(--control-label);
    font-size: 1.5rem;
    font-weight: normal;
    -webkit-transition: all 0.28s ease;
    transition: all 0.28s ease;
}

.material-form-group .bar {
    position: relative;
    border-bottom: 0.125rem solid #999;
    display: block;
}

.material-form-group .bar::before {
    content: '';
    height: 0.125rem;
    width: 0;
    left: 50%;
    bottom: -0.0625rem;
    position: absolute;
    background: var(--primary);
    -webkit-transition: left 0.28s ease, width 0.28s ease;
    transition: left 0.28s ease, width 0.28s ease;
    z-index: 2;
}

.material-form-group input,
.material-form-group textarea {
    display: block;
    background: none;
    padding: 0.125rem 0.125rem 0.0625rem;
    font-size: 2rem;
    border-width: 0;
    border-color: transparent;
    line-height: 1.9;
    width: 100%;
    color: transparent;
    -webkit-transition: all 0.28s ease;
    transition: all 0.28s ease;
    box-shadow: none;
}

.material-form-group input[type="file"] {
    line-height: 1;
}

.material-form-group input[type="file"]~.bar {
    display: none;
}

.material-form-group select,
.material-form-group input:focus,
.material-form-group input:valid,
.material-form-group input.form-file,
.material-form-group input.has-value,
.material-form-group textarea:focus,
.material-form-group textarea:valid,
.material-form-group textarea.form-file,
.material-form-group textarea.has-value {
    color: #333;
}

.material-form-group input:disabled {
    color: #999;
}

.material-form-group select~.control-label,
.material-form-group input:focus~.control-label,
.material-form-group input:valid~.control-label,
.material-form-group input:disabled~.control-label,
.material-form-group input.form-file~.control-label,
.material-form-group input.has-value~.control-label,
.material-form-group textarea:focus~.control-label,
.material-form-group textarea:valid~.control-label,
.material-form-group textarea.form-file~.control-label,
.material-form-group textarea.has-value~.control-label {
    font-size: 0.8rem;
    color: gray;
    top: -1rem;
    left: 0;
}

.material-form-group select:focus,
.material-form-group input:focus,
.material-form-group textarea:focus {
    outline: none;
}

.material-form-group select:focus~.control-label,
.material-form-group input:focus~.control-label,
.material-form-group textarea:focus~.control-label{
    color: #337ab7;
}

.material-form-group select:focus~.bar::before,
.material-form-group input:focus~.bar::before,
.material-form-group textarea:focus~.bar::before {
    width: 100%;
    left: 0;
}

.checkbox label,
.form-radio label {
    position: relative;
    cursor: pointer;
    padding-left: 2rem;
    text-align: left;
    color: #333;
    display: block;
}

.checkbox input,
.form-radio input {
    width: auto;
    opacity: 0.00000001;
    position: absolute;
    left: 0;
}

.radio {
    margin-bottom: 1rem;
}

.radio .helper {
    position: absolute;
    top: -0.25rem;
    left: -0.25rem;
    cursor: pointer;
    display: block;
    font-size: 1rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #999;
}

.radio .helper::before,
.radio .helper::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    margin: 0.25rem;
    width: 1rem;
    height: 1rem;
    -webkit-transition: -webkit-transform 0.28s ease;
    transition: -webkit-transform 0.28s ease;
    transition: transform 0.28s ease;
    transition: transform 0.28s ease, -webkit-transform 0.28s ease;
    border-radius: 50%;
    border: 0.125rem solid var(--primary);
}

.radio .helper::after {
    -webkit-transform: scale(0);
    transform: scale(0);
    background-color: #337ab7;
    border-color: #337ab7;
}

.radio label:hover .helper {
    color: #337ab7;
}

.radio input:checked~.helper::after {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
}

.radio input:checked~.helper::before {
    color: #337ab7;
}

.checkbox {
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.checkbox .helper {
    color: #999;
    position: absolute;
    top: 0;
    left: 0;
    width: 1rem;
    height: 1rem;
    z-index: 0;
    border: 0.125rem solid var(--primary);
    border-radius: 0.0625rem;
    -webkit-transition: border-color 0.28s ease;
    transition: border-color 0.28s ease;
}

.checkbox .helper::before,
.checkbox .helper::after {
    position: absolute;
    height: 0;
    width: 0.2rem;
    background-color: #337ab7;
    display: block;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    border-radius: 0.25rem;
    content: '';
    -webkit-transition: opacity 0.28s ease, height 0s linear 0.28s;
    transition: opacity 0.28s ease, height 0s linear 0.28s;
    opacity: 0;
}

.checkbox .helper::before {
    top: 0.65rem;
    left: 0.38rem;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    box-shadow: 0 0 0 0.0625rem var(--color-accent);
}

.checkbox .helper::after {
    top: 0.3rem;
    left: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.checkbox label:hover .helper {
    color: #337ab7;
}

.checkbox input:checked~.helper {
    color: #337ab7;
}

.checkbox input:checked~.helper::after,
.checkbox input:checked~.helper::before {
    opacity: 1;
    -webkit-transition: height 0.28s ease;
    transition: height 0.28s ease;
}

.checkbox input:checked~.helper::after {
    height: 0.5rem;
}

.checkbox input:checked~.helper::before {
    height: 1.2rem;
    -webkit-transition-delay: 0.28s;
    transition-delay: 0.28s;
}

.radio+.radio,
.checkbox+.checkbox {
    margin-top: 1rem;
}

.has-error .legend.legend,
.has-error.material-form-group .control-label.control-label {
    color: #d9534f;
}

.has-error.material-form-group .form-help,
.has-error.material-form-group .helper,
.has-error.checkbox .form-help,
.has-error.checkbox .helper,
.has-error.radio .form-help,
.has-error.radio .helper,
.has-error.form-radio .form-help,
.has-error.form-radio .helper {
    color: #d9534f;
}

.has-error .bar::before {
    background: #d9534f;
    left: 0;
    width: 100%;
}

/*  */
.button {
    position: relative;
    background: var(--primary);
    border: 1px solid var(--primary);
    font-size: 1.5rem;
    color: #fff;
    margin: 2.3rem 0;
    padding: 0.75rem 3rem;
    cursor: pointer;
    -webkit-transition: background-color 0.28s ease, color 0.28s ease, box-shadow 0.28s ease;
    transition: background-color 0.28s ease, color 0.28s ease, box-shadow 0.28s ease;
    overflow: hidden;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.button span {
    color: var(--color-accent);
    position: relative;
    /*z-index: 1;*/
}

.button::before {
    content: '';
    position: absolute;
    background: #071017;
    border: 50vh solid #1d4567;
    width: 30vh;
    height: 30vh;
    border-radius: 50%;
    display: block;
    top: 50%;
    left: 50%;
    z-index: 0;
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(0);
    transform: translate(-50%, -50%) scale(0);
}

.button:hover {
    color: #337ab7;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
}

.button:active::before,
.button:focus::before {
    -webkit-transition: opacity 0.28s ease 0.364s, -webkit-transform 1.12s ease;
    transition: opacity 0.28s ease 0.364s, -webkit-transform 1.12s ease;
    transition: transform 1.12s ease, opacity 0.28s ease 0.364s;
    transition: transform 1.12s ease, opacity 0.28s ease 0.364s, -webkit-transform 1.12s ease;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
}

.button:focus {
    outline: none;
}

.button-close {
    background: transparent url(../img/nodeconnection-logout.png) no-repeat;
    position: fixed;
    bottom: 20px;
    right: 20px;
    border: 0;
    padding-top: 40px;
    color: var(--primary);
    outline: none;
    z-index: 9;
}

.button-close:hover {
    background: transparent url(../img/nodeconnection-logout-hover.png) no-repeat;
}

input[type="date"] {
    height: 40px;
    margin-bottom: 20px;
    padding: 5px;
    background-color: transparent;
    color: var(--primary);
    padding-left: 15px;
    border: 0;
    border-bottom: 1px solid var(--primary);
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 1);
    opacity: 1
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
    background: transparent;
    color: var(--primary);
    cursor: pointer;
}

.select-text {
    position: relative;
    font-family: inherit;
    background-color: transparent;
    width: 100%;
    padding: 10px 10px 10px 0;
    font-size: 18px;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}


/* Remove focus */

.select-text:focus {
    outline: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}


/* Use custom arrow */

select,
.select-text {
    appearance: none;
    -webkit-appearance: none
}

.select:after {
    position: absolute;
    top: 18px;
    right: 10px;
    /* Styling the down arrow */
    width: 0;
    height: 0;
    padding: 0;
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, 0.5);
    pointer-events: none;
}


/******************* POP-UP Permisos Series Usuarios **********************************/

.overlaycss {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}

.overlaycss.active {
    visibility: visible;
}

.popupcss {
    background: #f8f8f8;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    border-radius: 3px;
    text-align: center;
    width: 70%;
    max-height: 90%;
    overflow: scroll;
}

.popupcss .btn-cerrar-popup {
    font-size: 19px;
    line-height: 16px;
    display: block;
    text-align: right;
    color: #bbbbbb;
    margin-right: 10px;
}

.popupcss .btn-cerrar-popup:hover {
    color: #000000;
}


/* LABEL ======================================= */

.select-label {
    color: rgba(0, 0, 0, 0.26);
    font-size: 18px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 0;
    top: 10px;
    transition: 0.2s ease all;
}


/* active state */

.select-text:focus~.select-label,
.select-text:valid~.select-label {
    color: #2F80ED;
    top: -20px;
    transition: 0.2s ease all;
    font-size: 14px;
}


/* BOTTOM BARS ================================= */

.select-bar {
    position: relative;
    display: block;
    width: 100%;
}

.select-bar:before,
.select-bar:after {
    content: '';
    height: 2px;
    width: 0;
    bottom: 1px;
    position: absolute;
    background: #2F80ED;
    transition: 0.2s ease all;
}
.bar:before,
.bar:after {
    content: '';
    height: 2px;
    width: 0;
    bottom: 1px;
    position: absolute;
    background: #2F80ED;
    transition: 0.2s ease all;
}

.select-bar:before {
    left: 50%;
}

.select-bar:after {
    right: 50%;
}


/* active state */

.select-text:focus~.select-bar:before,
.select-text:focus~.select-bar:after {
    width: 50%;
}


/* HIGHLIGHTER ================================== */

.select-highlight {
    position: absolute;
    height: 60%;
    width: 100px;
    top: 25%;
    left: 0;
    pointer-events: none;
    opacity: 0.5;
}

.chkDocs {
    /*pendiente*/
    /* overflow: hidden; */
    margin-top: 35px;
}

.chkDoc {
    float: left;
    width: 100px !important;
    margin-top: 0 !important;
}

.chkParam {
    float: left;
    width: 100% !important;
    margin-top: 0 !important;
}

.chkFil {
    float: left;
    width: 95px !important;
    margin-top: 0 !important;
    padding-right: 10px;
}

.chkFilOrg,
.chkFilInvAlm {
    width: 95px !important;
    margin-top: 0 !important;
    padding-right: 20px;
}

.chkSN {
    margin-top: 30px;
}

.material-form-groupSer {
    position: relative;
}

.material-form-groupSer select {
    width: 100%;
    font-size: 1rem;
    padding: 0.125rem 0.125rem 0.0625rem;
    background: none;
    border: none;
    line-height: 1.6;
    box-shadow: none;
}

.material-form-groupSer select {
    top: 8px;
}

#txtComent {
    border: 1px solid #ddd;
    padding-top: 0 !important;
    font-size: 14px;
}

.reset-spacing-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.reset-spacing-btn {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    color: white;
}

.dtCia {
    padding: 45px 15px 45px 0;
    text-align: right;
    font-weight: bold;
    align-items: center;
    display: grid;
}

.dtCiaInt {
    padding: 25px 35px 25px 0;
    text-align: right;
    font-weight: bold;
    align-items: center;
    display: grid;
}

.spnCia {
    color: #428bca;
}

.spnLic {
    color: #d9534f;
    font-size: 10px;
}

.inactUsua {
    padding-left: 10px;
}

.UsInactivo{
    background-color: red !important;
}

.actUsua {
    padding-left: 10px;
}

.csDatosGV {
    font-size: 1rem;
}

#mapa {
    height: 400px;
    padding: 0;
    margin-bottom: 20px;
}

.csEstCta {
    display: flex;
}

.csBtEstCta {
    padding-left: 30px;
    margin-top: -10px;
}

.titletable {
    border-bottom: 1px solid;
    color: var(--primary);
    font-size: 18px;
    margin-top: 15px;
}

.divLinTras {
    display: inline;
}

.divElim {
    color: red;
    display: inline;
    cursor: pointer;
}

svg .st0 {
    fill: var(--color-icons);
}

svg .st1 {
    fill: var(--color-icons);
}

.imgBanner {
    width: 100%
}

.csUbicLin {
    display: inline-flex;
    width: 100%;
    align-items: center;
}

.mdEditDoc {
    width: 50%;
}

@media screen and (max-width: 768px) {
    .divDatosDep {
        width: 100% !important
    }
    .divTotPg {
        width: 100% !important
    }
    .imgLogo {
        width: 150px;
        height: 51px;
        text-align: center;
        margin: 35px;
    }
    .login-der {
        display: none;
    }
    .form-inline>.material-form-group,
    .form-inline>.btn {
        display: block;
        /*margin-bottom: 0;*/
        width: 100%;
    }
    .img-user {
        margin: 15px 0;
        width: 40px;
    }
    .home {
        padding: 0 0;
    }
    .home-item::after {
        background: url() center center no-repeat;
        border-top: 1px dashed var(--primary)
    }
    .mdEditDoc {
        width: 70%;
    }

    .popLogAlist {
        overflow: scroll;
    }

    .popup_tb_log {
        width: 100% !important;
        max-height: 100% !important;
    }

    .modal-body {
        padding: 0 !important;
    }

    .modal-body {
        overflow: scroll !important;
    }
}


/*Estilos Farez Prieto*/

.filaCarrito {
    margin-bottom: 5%
}


/******************* POP-UP Perfil Opciones **********************************/

.overlay_css {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}

.overlay_css.active {
    visibility: visible;
}

.popup_css {
    background: #f8f8f8;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    border-radius: 3px;
    text-align: center;
    width: 70%;
    max-height: 90%;
    overflow: scroll;
}

.popup_css .btn-cerrar-popup {
    font-size: 19px;
    line-height: 16px;
    display: block;
    text-align: right;
    color: #bbbbbb;
    margin-right: 10px;
}

.popup_css .btn-cerrar-popup:hover {
    color: #000000;
}


/************************* TOOLTIP - PARAMETROS GENERALES ***********************/

.tooltipcss {
    position: relative;
    /* display: inline-block; */
}

.tooltipcss .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    /* left: 50%; */
    margin-left: -111px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltipcss-input .tooltiptext {
    visibility: hidden;
    width: 220px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltipcss .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.tooltipcss:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.colorRojo {
    color: white;
    background-color: red;
}

.table-striped>tbody>tr:nth-child(odd)>td,
.table-striped>tbody>tr:nth-child(odd)>th {
    background-color: white;
}

.table-striped>tbody>tr:nth-child(even)>td,
.table-striped>tbody>tr:nth-child(even)>th {
    background-color: #ececec;
}

.anchoTabla {
    width: 90%;
    margin: auto;
    background-color: cornflowerblue;
}


/* nuevo - carousel */

.style-close {
    position: absolute;
    color: var(--primary) !important;
    left: 75px;
    top: 3px;
}

.centrarDetalle{
    background-color: #E1F8F5;
    display: flex;
    width: 100%;
    min-height: 40px;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 768px) {
}

#divEstadoDoc{
    margin-top: 35px !important;
}
.multiselect{
    font-size: smaller;
}
.multiselect:active, .multiselect.active, .open .dropdown-toggle.multiselect, .multiselect:hover, .multiselect:focus {
    background: none !important;
    box-shadow: none !important;
}
.multiselect, .multiselect:active{
    color: #333;
    background-color: #fff;
    border: none !important;
    width: 166px;
    overflow: hidden;
    background: #fff;
}
.multiselect-container>li>a>label.radio, .multiselect-container>li>a>label.checkbox {
    margin: 0;
    padding: 5px !important;
    border-radius: unset;
    /* background: beige; */
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
    color: azure !important;
    background: #1975d1;
    border: 1px solid #6493d9 !important;
}
.multiselect-container>li {
    padding: 0;
    height: 24px;
}
.multiselect-container {
    font-size: 10.5px;
    border-radius: unset;

}

.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus {
    color: #ffffff;
    background-image: linear-gradient(to bottom,#1975d1 0,#1975d1 100%);
    background-color: #1975d1;
}

.chkCargo{
    width: 100% !important;
}
#divTdoDocs{
    margin-top: 13px;
}
.dropdown-menu{
    min-width: 176px;
}

.csDivInfo{
    display: inline-flex;
    font-size: large;
}

.csDivInfoDesc{
    display: inline-flex;
    font-size: large;
    color: #1975d1;
}
.dataTables_scrollBody{
    height:auto !important;
}

#divTotCantConsol{
    font-size: 19px;
    margin-top: 3%;
    color: #3477af;
}

.btnlistado{
    margin: 0 2px;
    width: 20px !important;
    padding: 20px;
}

.btnError {
    margin: 0 2px;
    width: 20px !important;
    padding: 20px;
    background-color: #FF0000;
    border: 1px solid #FF0000;
}

.btnError:hover {
    color: #000000 !important;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
}

#inModFecPg{
    margin-bottom: 0;
    color: #000000;
    border-bottom: 1px solid #cccccc;
}

#divModFecPg{
    width:30%;
    display:inline-flex;
}

.cswhite{
    fill:#FFFFFF;;
}

.float-right {
    float: right;
}

/* MODAL - REGISTRAR NOVEDAD  */

.overlay_nov {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    z-index: 100;
}

.overlay_nov.active {
    visibility: visible;
}

.popup_nov {
    background: #f8f8f8;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    border-radius: 3px;
    width: 40%;
    max-height: 90%;
}

.popup_nov #btn-cerrar-nov {
    font-size: 19px;
    line-height: 16px;
    display: block;
    text-align: right;
    color: #808080;
    margin-right: 10px;
}

.popup_nov #btn-cerrar-nov:hover {
    color: #000000;
}

.colorRegistro {
    background-color: #AFEEEE !important;
}

.colorRechazado {
    background-color: #d0131f !important;
    color: #fff;
}

.NavTickets{
    list-style-type: none;
    display: inline-block;
    /* border: 1px solid blue; */
    border-radius: 7px;
    background: #1975d1;
    width:100%;
    text-align: center;
    background-color: #d1e8f5 !important;
    color: var(--primary) !important;
}

.NavTickets:hover{
    background-color: #a1c6db !important;
    text-decoration: none !important;
    /* color: var(--primary) !important; */
    color:#f1f5ff !important;
}

.activeticket a {
    background: #1975d1 !important;
    color: #f0f8ff !important;
    box-shadow:0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%);
}

.csDtosGestion{
    color:#1975d1; display:contents; font-size:15px;
}

.colorAbierto{
    background-color: #74b0eb66 !important;
}

/* ---------------------------------------------------

Project : CSS Checkbox Switch
Author : Partha Kar (https://www.facebook.com/partha.creativemind)
Version : 1.0
Release Dtae : 15 November, 2017

---------------------------------------------------- */

/* Switch Style */
.checkbox.checbox-switch {
    padding-left: 0;
}

.checkbox.checbox-switch label,
.checkbox-inline.checbox-switch {
    display: inline-block;
    position: relative;
    padding-left: 0;
}
.checkbox.checbox-switch label input,
.checkbox-inline.checbox-switch input {
    display: none;
}
.checkbox.checbox-switch label span,
.checkbox-inline.checbox-switch span {
    width: 35px;
    border-radius: 20px;
    height: 18px;
    border: 1px solid #dbdbdb;
    background-color: rgb(255, 255, 255);
    border-color: rgb(223, 223, 223);
    box-shadow: rgb(223, 223, 223) 0px 0px 0px 0px inset;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}
.checkbox.checbox-switch label span:before,
.checkbox-inline.checbox-switch span:before {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: rgb(255,255,255);
    content: " ";
    top: 0;
    position: relative;
    left: 0;
    transition: all 0.3s ease;
    box-shadow: 0 1px 4px rgba(0,0,0,0.4);
}
.checkbox.checbox-switch label > input:checked + span:before,
.checkbox-inline.checbox-switch > input:checked + span:before {
    left: 17px;
}

/* Switch Primary */
.checkbox.checbox-switch.switch-primary label > input:checked + span,
.checkbox-inline.checbox-switch.switch-primary > input:checked + span {
    background-color: rgb(0, 105, 217);
    border-color: rgb(0, 105, 217);
    box-shadow: rgb(0, 105, 217) 0px 0px 0px 8px inset;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}
.checkbox.checbox-switch.switch-primary label > input:checked:disabled + span,
.checkbox-inline.checbox-switch.switch-primary > input:checked:disabled + span {
    background-color: rgb(109, 163, 221);
    border-color: rgb(109, 163, 221);
    box-shadow: rgb(109, 163, 221) 0px 0px 0px 8px inset;
    transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
}
.activetickets a {
    background: #ffffff;
    border-bottom: 1px solid #e5e5e5;
    color: #5787cf !important;
}

.NavTicketsGral:hover{
    color: #00518d !important;
}

/* MODAL - LOGISTICA  */

.overlay_tb_log {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    z-index: 100;
}

.overlay_tb_log.active {
    visibility: visible;
}

.popup_tb_log {
    background: #f8f8f8;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.6);
    border-radius: 3px;
    width: 75%;
    max-height: 90%;
}

.popup_tb_log #btn-cerrar-log-ali {
    font-size: 19px;
    line-height: 16px;
    display: block;
    text-align: right;
    color: #808080;
    margin-right: 10px;
}

.popup_tb_log #btn-cerrar-log-ali:hover {
    color: #000000;
}

.btnAnul{
    background: #e50000;
    border: 1px solid #c30000;
}
.btnAnul:hover{
    color: #ffffff;
    background: #c7262d !important;
}

.activeObsq a {
    background: #7c87c1 !important;
    border-bottom: 1px solid #e5e5e5;
    color: #ffffff !important;
    border-radius: unset !important;
}

.NavObseqios:hover{
    color: #9691e2 !important;
    background-color: #eee !important;
    border-radius: unset !important;
}

.titletableObsq {
    border-bottom: 1px solid;
    color: #7c87c1;
    font-size: 18px;
    margin-top: 35px;
}

/* PROGRESSBAR */
#myProgress {
    position: relative;
    width: 50%;
    height: 21px;
    background-color: #ddd;
    border-radius: 4px;
}
  
#myBar {
    position: absolute;
    width: 10%;
    height: 100%;
    background-color: #4CAF50;
    border-radius: 4px;
}
  
#porcentaje {
    text-align: center;
    line-height: 22px;
    color: #ffffff;
}

.form-select:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);
}

.form-select{
    border: 1px solid #d9d9d9;
    width: 100%;
    height: 266px !important;
    overflow-x: scroll;
    border-radius: 5px;
    padding: 5px;
}

.btn-table{
    background: #1975d1;
    color: white;
}

.btn-table:hover{
    background: linear-gradient(0deg, rgba(220,235,247,1) 0%, rgba(140,186,232,1) 100%);
    border: 1px solid #8cbae8;
}

.btn-table:focus{
    background: linear-gradient(0deg, rgba(220,235,247,1) 0%, rgba(140,186,232,1) 100%);
    border: 1px solid #8cbae8;
}

.tabsInter{
    margin-top: 10px;
}

.csTabsInter{
    display: inline-block;
    width: 17%;
    height: 35px;
    text-align: center;
    padding: 0.5%;
    font-size: 18px;
    background: linear-gradient(0deg, rgb(227 228 229) 0%, rgb(209 210 213) 100%);
    border-radius: 5px 5px 0px 0px;
    margin-right: -3px;
}

#hrIncluir, #hrExcluir{
    color: #ffffff !important;
}

#hrIncluir:hover, #hrExcluir:hover{
    text-decoration: none;
    color: #ffffff !important;
}

#hrIncluir:active, #hrExcluir:active{
    /* text-decoration: none; */
    color: #ffffff !important;
}

.tabsInter li.active{
    /* background: linear-gradient(0deg, rgba(140,186,232,1) 0%, rgba(25,117,209,1) 100%); */
    background: rgb(25, 117, 209);
}

.csTabsInter:hover{
    background: linear-gradient(0deg, rgba(220,235,247,1) 0%, rgba(140,186,232,1) 100%) !important;
}

.tabsInter{
    margin-left: 37px;
    border-bottom: 1px solid #e1e1e1;
    padding-left: unset;
    margin-right: 106px;
    box-shadow: 0 4px 2px -2px rgb(0 0 0 / 23%);
}

.csColorHover:hover{
    background: linear-gradient(0deg, rgba(220,235,247,1) 0%, rgba(140,186,232,1) 100%);
    border: 1px solid #8cbae8;
}

.tabsIntern{
    margin-top: 10px;
}

.csTabsIntern{
    display: inline-block;
    width: 17%;
    height: 35px;
    text-align: center;
    padding: 0.5%;
    font-size: 18px;
    background: linear-gradient(0deg, rgb(227 228 229) 0%, rgb(209 210 213) 100%);
    border-radius: 5px 5px 0px 0px;
    margin-right: -3px;
}

#hrIncluirFam, #hrExcluirFam{
    color: #ffffff !important;
}

#hrIncluirFam:hover, #hrExcluirFam:hover{
    text-decoration: none;
    color: #ffffff !important;
}

#hrIncluirFam:active, #hrExcluirFam:active{
    /* text-decoration: none; */
    color: #ffffff !important;
}

.tabsIntern li.active{
    /* background: linear-gradient(0deg, rgba(140,186,232,1) 0%, rgba(25,117,209,1) 100%); */
    background: rgb(25, 117, 209);
}

.csTabsIntern:hover{
    background: linear-gradient(0deg, rgba(220,235,247,1) 0%, rgba(140,186,232,1) 100%) !important;
}

.tabsIntern{
    margin-left: 37px;
    border-bottom: 1px solid #e1e1e1;
    padding-left: unset;
    margin-right: 106px;
    box-shadow: 0 4px 2px -2px rgb(0 0 0 / 23%);
}