.pac-container {
    
    z-index: 99999999999!important;
    
}

/* Normalize
==================================== */

*, *:after, *:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
span.invisible {
    position: absolute;
}
.icon_report img {
    max-width: 75px;
    margin-bottom: 10px;
}
.middle {
    align-items: center;
}
*:focus {
    outline: inherit !important;
}
span.badge {
    padding: 5px 9px;
    font-size: 80%;
    font-weight: 400;
}
::-webkit-scrollbar {
    width: 7px;
}
.form-group.file-area label {
    position: relative;
    z-index: 2;
}
::-webkit-scrollbar-track {
    background: #777;
}

::-webkit-scrollbar-thumb {
    width: 7px;
    background: var(--main);     
}


::selection { 
}

::-moz-selection {
  background: var(--main2);
  color: var(--main);  
  text-shadow: none;

}

a {
    text-decoration: none;
}

.total_sum {
    display: inline-flex;
    gap: 10px;
    font-size: 30px;
    background: #f0eeff;
    padding: 10px 40px;
}

.col_pro {
    display: flex;
    padding: 7px 15px;
    border-bottom: 1px solid #e1e1e1;
}

.proveedor_mis-productos {
    height: 340px;
    overflow-y: auto;
    width: 100%;
}

.col_pro span {
    margin-right: 30px;
}
span#proveedor-name {
    width: 100%;
    display: block;
    font-weight: 600;
}

h5#modal-standard-title {
    width: 100%;
}
.action_bt {
    position: absolute;
    bottom: 20px;
    background: #0027bb;
    color: white;
    padding: 10px 10px;
    border-radius: 5px;
}

a.bt.bt_backs i {
    margin-right: 12px;
}
/*////////////
BOTONES DATATABLE EXCEL Y PRINT
/////////////////*/

div.dataTables_wrapper div.dataTables_filter {
    text-align: right;
    display: inline-block;
    float: right;
}

button.dt-button.buttons-excel.buttons-html5:hover {
    background: #3d9970;
}
button.dt-button.buttons-excel.buttons-html5 {
    background: linear-gradient(45deg, #009643, #009635);
    color: white;
    padding: 10px 30px;
    border-radius: 15px;
    border: 0;
}
button.dt-button.buttons-print:hover {
    background: blue;
    border: 0;
}
/* Typography
==================================== */

h1, h2, h3, h4, h5, h6 {
    padding: 0;
    margin: 0;
}

ul {
    padding: 0;
    margin: 0;
}

ul li {
    list-style-type: none;
}

button, button:focus{
    outline: none;
}


/*///////////////////
CUSTOM COL ID
////////////////////*/
.cl-10 {
    width: 10%;
}
.cl-15 {
    width: 15%;
}
.cl-20 {
    width: 20%;
}
.cl-25 {
    width: 25%;
}
.cl-30 {
    width: 30%;
}
.cl-35 {
    width: 35%;
}
.cl-40 {
    width: 40%;
}
.cl-45 {
    width: 45%;
}
.cl-50 {
    width: 50%;
}
.cl-55 {
    width: 55%;
}
.cl-60 {
    width: 60%;
}
.cl-65 {
    width: 65%;
}
.cl-70 {
    width: 70%;
}
.cl-75 {
    width: 75%;
}
.cl-80 {
    width: 80%;
}
.cl-85 {
    width: 85%;
}
.cl-90 {
    width: 90%;
}
.cl-95 {
    width: 95%;
}
.cl-100 {
    width: 100%;
}



/*===================/
CUSTOM ROWS ID
/*==================/
=======================*/

.row-cl {
    display: flex;
    flex-wrap: wrap;
}
.row-sb {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.row-sa {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
.row-se {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}
.row-jc {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

/*===========================================
=            GENERAL SYSTEM V1.0            =
===========================================*/

:root {
    --main: #002BCE;
    --grey1:#b1b1b1;
    --grey2:#656565;
    --dark-grey: #363636;
   
   
    --green1: #B8FFE0;
    --green2: #25D98B;
    --yellow1: #F9E8CA;
    --yellow2: #FFAB0D;
    --blue1: #DAD5F2;
    --blue2: #002060;
    --red1: #FFD1D1;
    --red2: #EF605A;
   }
   
 .form-layout-footer {position: absolute;right: 70px;top: 50%;}


   a{
    color: inherit;
   }
   body {
       background-color: #F6F6F6;
       margin: 0;
       font-size: 14px;
       font-weight: 400;
       line-height: 1.5;
       color: #000;
       font-family: poppins;
   }
   
   .row_custom {
    padding: 0 0 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid white;
}
   .content-page {
       margin-left: 200px;
       width: calc( 100% - 220px);
       padding-top: 20px;
       padding-bottom: 50px;
   }
   
   /*=====  End of GENERAL SYSTEM V1.0  ======*/

   button.bg-1.bt {
    background: #20c997;
    }
   
   /*===============================
   =            Buttons            =
   ===============================*/
   .col-input input[readonly=readonly] {
    background: #e1e1e1;
    color: #6e6e6e;
    cursor: no-drop;
}
    .bt {border: 0;padding: 6px 10px;border-radius: 5px;}

    .bt.bt_editar {
        background: #0036ff;
        color: white;
    }

    button.bt.borrar {background: #dc3545;color: white;}


   .btn-datepicker {
       background: white;
       border: 0;
       padding: 10px 20px;
       box-shadow: 0px 0px 4px #00000026;
       font-size: 13px;
       border-radius: 25px;
   }

    .col-input label.error {
        color: #fd2539;
    }

   .bt_main {
    border: 0px solid var(--main);
    border-radius: 20px;
    padding: 10px 35px;
    color: white;
    font-weight: 400;
    background: #0036ff;
    }

   .bt_main:hover {    
    color: white;    
    background: var(--main);
    }

    img.avatar {width: 40px;border-radius: 50%;}

    .bt_2 {
    border: 2px solid #29bb4a;
    border-radius: 20px;
    padding: 10px 35px;
    color: #29bb4a;
    font-weight: 400;
    background: transparent;
    }

    .bt_2:hover {
    color: white; 
    background: #29bb4a;
    }
   
   /*===============================
   =            Colors            =
   ===============================*/
   .yellow{
       background: var(--yellow1);
       color: var(--yellow2);
   }
   
   .blue{
       background: var(--blue1);
       color: var(--blue2);
   }
   
   .red{
       background: var(--red1);
       color: var(--red2);
   }
   
   .green{
       background: var(--green1);
       color: var(--green2);
   }
   
   /*=====  End of Buttons  ======*/
   
   
.img-thumb {
    padding: 0.25rem;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 8%);
    max-width: 100%;
    display: block;
    height: auto;
    margin: auto;
}
.popup_body form {
    width: 100%;
    display: block;
}
button.p_close {
    background: #f44336;
    color: white;
    border-radius: 50%;
    border: 0;
    width: 40px;
    height: 40px;
    display: grid;
    place-content: center;
    line-height: 1;
    font-size: 21px;
}


div.dt-buttons {
    float: left;
    display: flex;
}

/*///////////////////
VALIDACION JQUERY
///////////////////*/


.form-group.error input {
  border-color: #ee4141;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(238, 65, 65, 0.4);
}
.form-group.error label.error {
  margin-top: 5px;
  color: #ee4141;
}

.pod {
  padding: 25px;
  background: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
}
.pod h3 {
  text-align: center;
  margin: 10px 0 30px;
  font-family: "Lobster", cursive;
}

div#password-info.show, div#password-info2.show {
    opacity: 1;
}
#password-info, #password-info2 {
    margin: 20px 0;
    overflow: hidden;
    text-shadow: 0 1px 0 #fff;
    position: absolute;
    background: white;
    padding: 0px 0;
    opacity: 0;
    top: 0;
    left: -210px;
}
#password-info ul, #password-info2 ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#password-info ul li, #password-info2 ul li {
  padding: 10px 10px 10px 50px;
  margin-bottom: 1px;
  background: #f4f4f4;
  font-size: 12px;
  transition: 250ms ease;
  position: relative;
}
#password-info ul li .icon-container, #password-info2 ul li .icon-container {
    display: block;
    width: 40px;
    background: #92bce0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    text-align: center;
}
#password-info ul li .icon-container .fa , #password-info2 ul li .icon-container .fa {
  color: white;
  padding-top: 10px;
  position: relative;
  top: 2px;
}
#password-info ul li .tip, #password-info2 ul li .tip {
  color: #5ca6d5;
  text-decoration: underline;
}
#password-info ul li.valid, #password-info2 ul li.valid {
  color: #129652;
}
#password-info ul li.valid .icon-container, #password-info2 ul li.valid .icon-container {
  background-color: #18c36b;
}
#password-info ul li span.invalid, #password-info2 ul li span.invalid {
  color: #ff642e;
}

/*//////////////////////////
   LOGIN BOX - MODULO
///////////////////////////////*/

section.bl_login {
display: flex;
    align-items: center;
    background: linear-gradient(45deg, #001669, #0031e9);
    min-height: 100vh;
    justify-content: center;
    background-size: cover;
    background-position: center;
}

.part_login-1 {
width: 40%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px 0 0 50px;
}

.logo_login img {
    width: 160px;
    margin-bottom: 25px;
}

.content_log {
    color: white;
    text-align: center;
}

.content_log h2 {
    font-size: 65px;
}

.part_login-2 {
    width: 100%;
}

form.box-login input::placeholder {
    color: #b9b9b9;
    font-weight: 400;
    letter-spacing: 1px;
}

button.btn.btn-login:hover {
    background: #0023aa;
}


/*//////
PRINT
///////*/
button.dt-button.buttons-print {
    display: block;
    border: 0;
    padding: 5px 15px;
    background: #0028be;
    color: white;
    position: relative;
    border-radius: 15px;
}

button.dt-button.buttons-print span {
    display: block;
}

button.dt-button.buttons-print span:before {
    content: '';
    content: "\f02f";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 6px;
}
button#rango-reportes i {
    margin-right: 10px;
}


.form_search {
    padding: 30px 0px;
    background: #c1c1c1;
}

.report {
    align-items: flex-end;
}

.report > * {
    margin: 0 20px;
}



/*//////
EMPLEADOS
/////////*/
span#empleado_show {
    display: block;
    width: 100%;
    border: 1px solid #00000047;
    border-radius: 5px;
    padding: 7px 10px;
    font-size: 14px;

}

/*///////////////////
HEADER - PART
////////////////////*/

.info-user {
    text-align: center;
    font-size: 11px;
    padding: 0 20px;
}

.menu-vertical img {
    max-width: 17px;
    width: 17px;
    margin-right: 10px;
}

.avatar-user img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
}

/*//////////////////////
PAGE HEAD - PART
///////////////////////*/

section.content-header {
    text-transform: capitalize;}

.breadcrumbs {display: flex;
    justify-content: flex-end;}

ul.breadcrumbs li {
    padding: 0 10px;
    position: relative;}

ul.breadcrumbs li:after {
    content: '/';
    margin-left: 20px;
    color: #5e5e5e;
}

ul.breadcrumbs li:last-child:after {
    display: none;
}
button.getID.bt.p_open {
    background: #20c997;
}
/*/////////////
BUTTON PART
/////////////*/

.button-area {
    display: flex;
    padding: 10px 20px;
    justify-content: space-between;
    border-bottom: 1px solid #e1e1e1;
}

.button-area > div > * {
    margin-left: 10px;
}

/*//////////////
CUSTOM READ ONLY
///////////////*/
.read-body .row_tab button[type=submit] {
    display: none;
}
button.bt.bt_editar.bt_read.p_open {
    background: #fd7e14;
}
.read-body .col-input input, .read-body .col-input select, .read-body .col-input textarea {
    color: black;
    border: 0;
    background: #e8f1ff;
    opacity: 1;
    -webkit-appearance: none;
    appearance: none;
}


.read-body .col-input label span {
    font-weight: 300;
    color: #808c9f;
    text-transform: capitalize;
    font-size: 10px;
}
/*//////////////////
POPUP AGREGAR - INPUT - SELECT 
////////////////////*/


.form-row label {font-size: 11px;font-weight: 500;margin-bottom: 8px;}

.row_form {display: flex;flex-wrap: wrap;}

.row_form label {font-size: 11px;}

.col-input label {display: block;width: 100%;padding: 0 10px;}

.upload-zone {padding: 15px 10px;text-align: center;}

.bt_send {border: 0;
    border-radius: 20px;
    padding: 10px 35px;
    color: white;
    font-weight: 400;
    background: var(--main);}

button.bt_send:hover {background: #1befb3;}
.form-control {

    font-size: 13px;
 
}


/*////////////////////
POPUP CUSTOM - AGREGAR NUEVO ITEM
/////////////////*/

.popup_modal {
    position: fixed;
    top: 5%;
    margin: auto;
    background: white;
    width: 70%;
    right: 15%;
    z-index: 9999;
    border-radius: 15px;
    opacity: 0;
    visibility: hidden;
}

.popup_modal.active {
    opacity: 1;
    visibility: visible;
    transition: .4s;
    transform: translateY(10px);
}
.open_popup .overlay {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #0000009e;
    z-index: 9999;
}

.content_popup {height: 100%;display: flex;}

.menu_tab {
    width: 20%;
    background: var(--main);
    color: white;
    display: flex;
    align-items: center;
}

.row_tab {
    width: 80%;
    padding: 10px 20px 100px;
    height: 500px;
    overflow-y: auto;
    position: relative;
}

.row_tab button[type=submit] {
    position: absolute;
    bottom: 40px;
    right: 40px;
}
.popup_body {display: flex;height: 100%;}

ul.custom_tabs li {width: 100%;padding: 9px 0;font-size: 16px;cursor: pointer;}

ul.custom_tabs {width: 100%;padding: 0 30px;}

ul.custom_tabs li.active {color: #01fff3;}

ul.custom_tabs li:hover {color: #01fff3;}

.col-input label {display: flex;flex-direction: column;}

.col-input label span {font-weight: 500;text-transform: capitalize;}

.row_tab .row_form {
    display: none;
    height: 400px;
    overflow-y: auto;
    border-bottom: 1px solid #afafaf;
}
table.dataTable td a {
    margin-right: 7px;
}
.row_tab .row_form.active {display: flex;width: 100%;align-content: baseline;}

.three-column .col-input {width: 30%;}

.col-input input, .col-input select, .col-input textarea {
    width: 100%;border: 1px solid #00000047;border-radius: 5px;padding: 7px 10px;font-size: 14px;}

div#titulo_tab {
    width: 100%;
    border-bottom: 1px solid #002bce52;
    margin-bottom: 20px;
    padding-bottom: 10px;
    font-weight: 500;
}
.select2-container .select2-selection--single {
    height: 38px;
    font-size: 13px;
}

.bt_main.next {
    padding: 10px 20px;
    border-radius: 5px;
    margin-top: 20px;
    margin-right: 10px;
}
/*/////////
SE MUESTRA SOLO CON JS
////////////*/
.create {
    padding: 0 10px;
    width: 100%;
}

.create h6 {
    font-size: 11px;
}

.create span, .create input, .pr span, .pr input {
    border: 1px solid #00000047;
    display: block;
    width: 100%;
    padding: 5px 15px;
    border-radius: 5px;
    margin-bottom: 10px;
}

/*////////////
STYLE 2 - TABS
//////////////*/

.style_2 .content_popup, .style_step .content_popup {
    display: block;
    width: 100%;
}

.style_2 ul.custom_tabs li, .style_step ul.custom_tabs li{
    width: auto;
    margin-right: 20px;
    font-size: 12px;
    color: var(--main);
    border: 1px solid var(--main);
    padding: 10px 10px;
    border-radius: 5px;
    background: white;
}

.style_2 ul.custom_tabs, .style_step ul.custom_tabs{
    display: flex;
    margin-top: -17px;
}

.style_2 .menu_tab, .style_step .menu_tab {
    background: transparent;
    width: inherit;
}

.modal-header {
    justify-content: flex-end;
    right: 0;
}
.col-input.cl-100 {
    width: 100%;
}
.style_step .col-input {
    width: 100%;
}
.style_step .col-input.half {
    width: 50%;
}
.popup_modal.style_2 {
    width: 50%;
    left: 20%;
}
.popup_modal.style_step {
    width: 450px;
    left: 20%;
}

.style_2 ul.custom_tabs li.active, .style_step ul.custom_tabs li.active {
    background: var(--main);
    color: white;
}

.style_2 .row_tab{
    width: 100%;
    padding: 30px;
    max-height: 400px;
    height: inherit;
}
.style_step .row_tab {
    width: 100%;
    padding: 30px;
    max-height: inherit;
    height: inherit;
    overflow: inherit;
}
.style_2 .three-column .col-input {
    margin: 0 1.5%;
}

.style_2 button.p_close {
    margin-bottom: -30px;
}
.result_canal {
    width: 100%;
}

/*////////////////
UPLOAD EXCEL STYLE
////////////////////*/
.file-area {
  width: 100%;
  position: relative;
  color: white;
}
.file-area input[type=file] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  outline: none;
  cursor: pointer;
  border: 0;
}
.file-area .file-dummy {
  width: 100%;
  padding: 30px;
  background: rgba(255, 255, 255, 0.2);
  border: 2px dashed rgba(255, 255, 255, 0.2);
  text-align: center;
  transition: background 0.3s ease-in-out;
}
.file-area .file-dummy .success {
  display: none;
}
.file-area:hover .file-dummy {
  background: rgba(255, 255, 255, 0.1);
}
.file-area input[type=file]:focus + .file-dummy {
  outline: 2px solid rgba(255, 255, 255, 0.5);
  outline: -webkit-focus-ring-color auto 5px;
}
.file-area input[type=file]:valid + .file-dummy {
  border-color: rgba(0, 255, 0, 0.4);
  background-color: rgba(0, 255, 0, 0.3);
}
.file-area input[type=file]:valid + .file-dummy .success {
  display: inline-block;
}
.file-area input[type=file]:valid + .file-dummy .default {
  display: none;
}button.bt_3.bg-excel {
    background:linear-gradient(45deg, #009643, #009635);
}

.bt-up{
    background: #fea142;
    border: 0;
    outline: none;
    cursor: pointer;
    border-radius: 25px;
    padding: 15px 30px;
    color: white;
    font-weight: 600;
    display: block;
    margin: 15px auto 0;
}

.file-area input[type=file]:focus {
    outline: none;
    border: 0;
}
.bg-excel{
    background: linear-gradient(
45deg, #009643, #009635);
}


.small90{
    font-size: 90%;
}

span.asignar {
    font-size: 11px;
    background: #fdfdfd;
    border-radius: 3px;
    color: #8f8f8f;
}
.bt.bt_rescate.p_open {
    background: #ffc800;
    margin-right: 10px;
}

.table_rescates {
    display: flex;
    justify-content: space-between;
    padding: 0 19px;
}

.table_rescates > span {
    display: block;
    padding: 10px 0;
}

div#listado_operaciones, #listado_operaciones2 {
    width: 100%;
}

.table_rescates:nth-child(odd) {
    background: #e5f2ff;
}

.table_rescates h5 {
    font-weight: 600;
    padding: 10px 0;
    font-size: 16px;
}

/*/////
OPERACIONES
/////////////*/

.bt_tg {
    display: block;
    width: 100%;
    padding: 10px 0;
    border: 0;
    text-align: left;
    background: transparent;
    border-bottom: 1px solid #e1e1e1;
}

.dropdown-menu-right {
    padding: 0px 10px;
}

.bt_tg:last-child {
    margin: 0;
}

/*/////////////////////
MAESTROS
///////////////////*/

.master-item {
    display: flex;
    justify-content: space-between;
    background: #f3f3f3;
    padding: 5px 30px;
    margin-bottom: 6px;
    align-items: center;
}

.maestros-row {
    padding: 0 20px;
}
.master-daster {
    display: flex;
}

.resultados_cat {margin-bottom: 20px;padding: 0 10px;display: none;}

.master-daster:hover {
    background: #ededed;
}

.single_master {width: 100%;padding:5px 40px;}

.master_botones {
    width: 130px;
}

.master-item:hover {
    cursor: pointer;
    background: #d7d7d7;
}


/*///////////
SUPPORT
///////////////*/

.bt_badge {
    padding: 5px 10px;
    border-radius: 5px;
    display: inline-block;
    cursor: pointer;
}

.bt_badge.pendiente {
    background: #f44336;
    color: white;
}

.support.table td, .support.table th {
    padding: 3px 10px;   
}


.widget_support {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 50px;
    height: 50px;
    font-size: 30px;
    display: grid;
    place-content: center;
    background: var(--main);
    color: white;
    cursor: pointer;
    border-radius: 5px;
    z-index: 9999;
    display: none;
}

/*//////////
AÑADIENDO FILAS DINAMICAS
//////////////////*/

.bt_add {
    border: 1px solid;
    padding: 5px 15px;
    margin: 30px auto 0;
    border-radius: 5px;
    color: #333;
    background: white;
}

.bt_add span {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    border: 1px solid;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
    line-height: 0;
}

.bt_add:hover {
    background: var(--main);
    color: white;
}

.dinamic-data {
    display: flex;
}




   /*===================================
   =            TABLE STYLE            =
   ===================================*/
   table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting {  
        padding: 10px 8px;
    }

    table.table-bordered.dataTable tbody th, table.table-bordered.dataTable tbody td {       
        padding: 0 8px;
    }


   div.dataTables_wrapper div.dataTables_filter input::placeholder {
   
       color: #999;
   
   }
   .paginate_button a {
       padding: 15px 20px;
   }
   .page-item.active .page-link {
       z-index: 3;
       color: var(--blue2);
       background-color: var(--blue1);
       border-color: transparent;
   }
   
   .page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    font-size: 12px;
    font-weight: 500;
    color: #0025b6;
    background-color: #fff;
    border: 1px solid #dee2e6;
   }
   div.dataTables_wrapper div.dataTables_filter input {
       margin-left: 0.5em;
       display: inline-block;
       width: auto;
       border-radius: 40px;
       padding: 22px 20px;
       border: 1px solid #e1e1e1;
       box-shadow: 0px 0px 9px #0000000d;
       margin-bottom: 10px;
       width: 270px;
   }
   div.dataTables_wrapper div.dataTables_filter label i {
       position: absolute;
       right: 30px;
       top: 15px;
       color: #b1b1b1;
   }
   .table-style {
       background: white;
       padding: 10px;
       border-radius: 15px;
       box-shadow: 0px 1px 11px #00000014;
   }
   table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
       display: none;
   }
   
   table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
       display: none;
   }
   
   
   a.links {
       color: var(--grey2);
   }
   
   .table td, .table th {
       padding: 3px;
       vertical-align: top;
       border-top: 1px solid #dee2e6;
       font-size: 12px;
   }
   .table td, .table th {
       vertical-align: middle;
   }
   
   table.table-bordered.dataTable th, table.table-bordered.dataTable td {
       border-left-width: 0;
   }
   

   table.tabla-fill {
    border-collapse: separate;
    border-spacing: 0 8px;   
    }


    table.tabla-fill tr{
    background:#f4f4f4;  
    }
table.tabla-fill tr:hover {
    background: #ecefff;
}

    .tabla-fill thead tr {
    background: #F0EEFF;
    }
    .paginate_button a {
       padding: 15px 20px;
   }
   .page-item.active .page-link {
    z-index: 3;
    color: white;
    background-color: var(--main);
    border-color: transparent;
   }
   
.page-item .page-link {
    position: relative;
    display: block;
    min-width: 30px;
    text-align: center;
    padding: 5px 10px;
    margin: 0 4px;
    outline: none;
    line-height: 1.25;
    color: #505050;
    background-color: #fff;
    border: 1px solid #dee2e6;
    box-shadow: none!important;
    border-radius: 5px;
}

.page-item:first-child .page-link, .page-item:last-child .page-link  {
    border: 0;

}

   .card {
       border: 0;   
   }
   
   .table-striped tbody tr:nth-of-type(odd) {
       background-color: inherit;
   }
   .table-bordered td, .table-bordered th {
       border: 0;
   }
   .table-bordered {
       border: 0;
       border-bottom: 1px solid #dee2e6;
   }
   .table thead th {

   }
   
   /*/ Table  Prospectos/*/
   
   
   
   img.av_p {
       width: 25px;
       border-radius: 50%;
   }
   small.medio-contact {
       color: var(--grey1);
       font-size: 9px;
       margin-top: 6px;
   }
   .f-hora {
       display: block;
       font-size: 10px;
   }
   .stars.favorite {
       color: #ffd540;
   }
   .stars.favorite:hover {
       color: silver;
   }
   i.fa.fa-ellipsis-v {
       color: #818181;
       font-size: 15px;
   }
   .stars {
       color: #c0c0c0;
   }
   
   .stars:hover {
       color: #ffc107;
   }
   
   
   span.addFavorite i {
       font-size: 18px;
       cursor: pointer;
       width: 40px;
       text-align: center;
   }
   .btn-dot {
       width: 16px;
       height: 16px;
       display: block;
       color: transparent;
       background: #a6a6a6;
       border-radius: 50%;
       margin: auto;
   }
   
   .btn-dot.red{
       background: var(--red2);
   }
   .btn-dot.green{
       background: var(--green2);
   }
   .btn-dot.yellow{
       background: var(--yellow2);
   }
   
   .dropdown-menu .btn-dot:hover {
       transform: translateY(-2px);
       opacity: 0.7;
       transition: 0.2s;
   }
   a.allReq {
       display: block;
       color: var(--grey2);
       background: whitesmoke;
       border-radius: 5px;
       padding: 2px 10px;
       font-size: 12px;
       line-height: 1.3;
   
   }
   /*=====  End of TABLE STYLE  ======*/
   
   .head-page {
    padding: 0 0 30px;
    border-bottom: 1px solid #d0d0d0;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
   }
   
   
   
   
   
   
   canvas#bg-canvas {
       position: absolute;
       z-index: 0;
   }
   /*/Bulding animation/*/
   
   #caption {
     padding-left: 50px;
     position: relative;
     margin: auto;
     height: 0px;
   }
   #building {
     display: flex;
     width: 350px;
     height: 100vh;
     margin: auto;
   }
   
   button.btn-estado.btn-estado1 {
       background: #ffbab4;
       color: #dd1b2d;
   }
   button:focus{
    outline: none;
   }
   .btn-estado {
       border: 0;
       outline: none;
       padding: 5px 10px;
       border-radius: 4px;
       font-size: 11px;
       font-weight: 400;
       color: #3a8fa2;
       background-color: #a3eeff;
       outline: none;
   }
   .btn-estado2 {
       background: var(--green2);
       color: #09c56e;
   }
   
   span.adserv {
       display: inline-block;
       font-size: 9px;
       background: var(--green2);
       color: white;
       border-radius: 4px;
       padding: 1px 4px;
   }
   #blocks {
     margin: auto;
   }
   
   .b {
       background: #d8d5ff;
       border: 3px solid #524390;
       width: 45px;
       height: 45px;
       border-radius: 5px;
       margin: 10px;
       position: relative;
       animation-duration: 1.8s;
       animation-iteration-count: infinite;
       animation-timing-function: linear;
   }
   #b1 {
     animation-name: b1;
   }
   #b2 {
     margin-left: 72.5px;
     animation-name: b2;
   }
   #b3 {
     margin-top: -60px;
     animation-name: b3;
   }
   #b4 {
     margin-left: 72.5px;
     animation-name: b4;
   }
   
   @keyframes b1 {
     0% {
       left: 0px;
       transform: rotate(0deg);
     }
     50% {
       left: 62.5px;
       bottom: 0px;
       transform: rotate(90deg);
     }
     100% {
       left: 62.5px;
       bottom: -61.25px;
       transform: rotate(90deg);
     }
   }
   @keyframes b2 {
     50% {
       bottom: 0px;
     }
     100% {
       bottom: -61.25px;
     }
   }
   @keyframes b3 {
     50% {
       top: 0px;
     }
     100% {
       top: -61.25px;
     }
   }
   @keyframes b4 {
     0% {
       left: 0px;
       transform: rotate(0deg);
     }
     50% {
       left: -62.5px;
       top: 0px;
       transform: rotate(90deg);
     }
     100% {
       left: -62.5px;
       top: -61.25px;
       transform: rotate(90deg);
     }
   }
   
   @media (max-width: 400px) {
     #building {
       width: 100%;
     }
     #caption {
       display: none;
     }
   }
   a.links > small {
       width: 140px;
       overflow: hidden;
       text-overflow: ellipsis;
       display: block;
       white-space: nowrap;
   }
   /*/Opciones /*/
   
   .row-flex {
       display: flex;
       width: 100%;
       justify-content: space-between;
   }
   
   .item-col {
       width: 29%;
   }
   
   .titulo-popup{
       width: 100%;
       text-align: center;
       display: block;
       font-size: 14px;
       text-transform: uppercase;
       letter-spacing: 2px;
       color: #404040;
       font-weight: 600;
   }
   img.nueva-icon {
       width: 110px;
   }
   
   .popup-header .close {
       position: absolute;
       right: 30px;
   }
   .popup-header{
       display: -ms-flexbox;
       display: flex;
       -ms-flex-align: start;
       align-items: flex-start;
       -ms-flex-pack: justify;
       justify-content: space-between;
       padding: 1rem;
       border-bottom: 1px solid #e9ecef;
       border-top-left-radius: calc(.3rem - 1px);
       border-top-right-radius: calc(.3rem - 1px);
       flex-wrap: wrap;
       justify-content: center;
   }
   
   /*/ Header usuario - notificaciones/*/
   
   .menu-usuario > a {
       display: flex;
       width: 290px;
   
       align-items: center;
       color: #000000;
       padding: 0 0 0 15px;
       border-left: 1px solid #e5e5e5;
   }
   
   ul.box-menu-2 {
       display: flex;
       justify-content: flex-end;
       list-style: none;
       margin: 0;
       padding: 15px 0;
   }
   
   .box-menu-name span {
       display: block;
   }
   
   span.nombre {
       font-weight: 600;
   }
   
   span.cargo {
       font-size: 12px;
   }
   
   .notification i {
       font-size: 25px;
       color: #858585;
   }
   
   
   /*/ Header Oficial /*/
   
   body:not(.sidebar-mini-md) .content-wrapper, body:not(.sidebar-mini-md) .main-footer, body:not(.sidebar-mini-md) .main-header {
       transition: margin-left .3s ease-in-out;
       margin-left: 0;
   }
   .content-wrapper {
       background: #f2f2f3;
   }
   .menu-container {
       display: flex;
       height: 100%;
       justify-content: space-between;
       flex-direction: column;
       flex-wrap: wrap;
       align-items: center;
       padding: 20px 0;
   }
   
   header.menu_system {
       position: fixed;
       height: calc(100%);
       width: 180px;
       top: 0;
       z-index: 999;
       background: linear-gradient(179deg, #001669, #002BCE);
       overflow: hidden;
       color: white;
   }
   
   ul.menu-vertical {
       list-style: none;
       margin: 0px;
       padding: 0;
       width: 100%;
       padding-left: 15px;
   }
   
   ul.menu-vertical > li > a {
    color: #ffffffcf;
    padding: 5px 0px;
    display: block;
    margin-bottom: 0px;
   }
   ul.sub-menu-level {
    display: none;
    padding-left: 20px;
}

ul.sub-menu-level a {
    padding: 10px 0;
}

ul.sub-menu-level li {padding: 3px 0;}
   ul.menu-vertical > li:first-child a {
   }
   
   .box-icon {
       width: 30px;
       margin: auto;
       height: 50px;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 10px;
   }
   
   
   
   ul.menu-vertical > li > a span {
       margin-top: 6px;
       color: white;
   }
   
   ul.menu-vertical a:hover .box-icon {
       transition: all 0.4s ease;
       transform: scale(1.2);
   }
   

   .menu-logo svg {
       width: 50px;
       fill: rgb(255 255 255);
       padding: 10px;
       border-radius: 6px;
   }
   
   .menu-logo {
       text-align: center;
       width: 100%;
       padding: 20px 0;
   }
   
   .menu-navigation {
       height: 60%;
       width: 100%;
   }
   ul.sub-menu-level.active {
    display: block;
}
   ul.menu-vertical > li > a svg.fill {
       width: 27px;
       height: auto;
       stroke-width: 2px;
       stroke: #333;
       fill: #333;
   }
   .menu-top {height: 25%;}

.avatar-user {
    background: #78afff4a;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    margin: 0 auto 15px;
}

ul.menu-vertical > li > a svg {
    max-width: 19px;
    max-height: 25px;
    margin-right: 10px;
}

.menu-vertical li.active {
    position: relative;
}

.menu-vertical li.active:after {content: '';width: 30px;height: 30px;background: #f2f2f2;border-radius: 50%;position: absolute;right: -16px;top: 0;}

ul.menu-vertical > li.active > a span {
    color: #ffffff;
}

.menu-bottom svg {
    width: 30px;
    margin-right: 2px;
}

.menu-bottom span {
    text-transform: uppercase;
}
   /* Tablas */
   .table td, .table th {
       outline: none;
   }
   .f-hide {
       position: absolute;
       visibility: hidden;
   }
   .dropdown-toggle {
       white-space: nowrap;
       display: block;
   }
   
   
   .progress-box {
       display: flex;
       justify-content: space-between;
   }
   
   
   textarea#editarRequerimiento {
       height: 130px;
   }
   
   
   .btn-black:focus {
       color: inherit;
       background:inherit;
   }
   
   /*/buttons/*/
   .btn-contactado {
       background: #ff8d57;
       color: #a73a28;
   }
   .btn-success {
    color: #ffffff;
    background-color: #20c997;
    border-color: #a7ffbb;
    box-shadow: none;
    padding: 6px 10px;
    border-radius: 5px;
   }
   .btn-noco {
       background: #ffbfc6;
       color: #f52424;
   }
   
   .btn-blue {
       background: #ffdd63;
       color: #ca7000;
   }
   
   .btn-danger {
       background: #ff5252;
       color: #fffafa;
   }
   .btn-info {
       color: #00bcd4;
       background-color: #a8f5ff;
       border-color: transparent;
   }
   
   
   
   .bg-estado1 {
       background: #09c56e;
       color: white;
   }
   
   .bg-estado2 {
       background: #f43636;
       color: white;
   }
   
   .dataTables_filter {
    position: relative;
}
   /*===================/*
   FORMULARIOS PERSONALIZADOS 1             
   =====================*/
   
   .form_box {
       margin-bottom: 10px;
   }
   
   .form_box input, .form_box select {
       width: 70%;
       display: block;
       margin: auto;
   }
   

   /*////
   TABLA PARA REPORTES
   ////////*/
   .tabla-reportes{
    font-size: 13px;
   }
   /*===================/*
   VENTAS             
   =====================*/
   .box_short {
       display: block;
       width: 120px;
       font-size: 12px;
   }
   
   
   
   
   /*/Background DEG /*/
   
   .bg-blue-d{
      background: linear-gradient(45deg, #00bcd4, #005497); 
   }
   
   .bg-green-h {
       background-color: #09c56e;
   }
   
   .bg-red-deg {
       background: linear-gradient(45deg, #f44336, #e91e63);
   }
   /*/Box/*/
   .bg-white-blue {
       background: white;
       color: #121212;
   }
   .progress-box.style-2 {
       font-size: 10px;
       color: #b1b1b1;
       padding: 0px 5px 5px;
   }
   p.subtitulo {
       font-size: 14px;
       font-weight: 600;
       margin: 0;
   }
   .small-box.bg-white-blue .icon i {
       color: #2953e8;
       font-size: 60px;
   }
   /*  */
   
   
   .fix-pos{
       position: fixed;
       bottom: 0;
       right: 0;
       z-index: 9999;
   }
   small.monto {
       font-size: 13px;
   }
   
   
   .dropdown-menu {
   
       min-width: 12rem;
   
   }
   
   
   .footer-studioh {
       position: absolute;
       bottom: 0;
       left: 0;
       color: white;
       font-size: 11px;
       text-align: center;
       width: 100%;
   }
   
   .footer-studioh span {
       display: block;
       width: 100%;
       text-align: center;
   }
   .menu-avatar{
      width: 30px;
       height: 30px;
       margin-right: 20px;
   }
   .btn-black {
       display: inline-block;
       font-weight: 400;
       color: #212529;
       text-align: center;
       vertical-align: middle;
       cursor: pointer;
       -webkit-user-select: none;
       -moz-user-select: none;
       -ms-user-select: none;
       user-select: none;
       background-color: transparent;
       border: 1px solid transparent;
       padding: 0px 5px;
       width: 25px;
       font-size: 15px;
       line-height: 1;}
   
       .input-title {
       display: block;
       width: auto;
       position: absolute;
       font-weight: 700;
       font-size: 12px;
       padding: 0 10px;
       background: white;
       top: -7px;
       z-index: 9;
       left: 40px;
   }
   .modal-dialog.edit-sh {
       min-width: 60%;
   }
   
   .edit-sh .modal-content {
       background-color: #eeeeee;    
   }
   
   /*/MENU.PHP/*/
   .logo svg {
       fill: white;
       width: 35px;
   }
   
   .image.logo {
       padding-left: 25px;
   }
   
   [class*=sidebar-dark-] {
       background-color: #293bf0;
   }
   .nav-sidebar .nav-link > p {padding: 9px 0;}
   
   .nav-sidebar .nav-treeview > li > a > p {
       padding: 7px 20px;
       padding-left: 15px;
       border-left: 1px dotted rgba(147, 159, 173, 0.24);
   }
   
   .nav-sidebar .nav-item>.nav-link {
       padding: 0px 20px;
   }
   
   .nav-sidebar>.nav-item .nav-icon.fas {
       color: #fff;
   }
   
   .nav-sidebar .nav-item>.nav-link {
       margin-bottom: 0;
   }
   
   /*/LOGIN PAGE/*/
   
   .error-login {
       position: absolute;
       top: 20px;
       left: 20px;
       transition: 0.4s;
   }
   .bg-login-sh {
       height: 100vh;
       background: #efefef;
       overflow: hidden;
       display: flex;
       align-items: center;
       justify-content: center;
       flex-wrap: wrap;
       /* background: conic-gradient(    #2E1638,    #50253F,    #463257,    #5A6497,    #6A6EA5,    #3E1D31,    #2F1638); */
   }
   .bg-auto {
       background: linear-gradient(185deg, #2E1638, #50253F, #5A6497, #50253F,   #3E1D31,    #2F1638);
       background-size: 400% 400%;
       animation: gradient 15s ease infinite;
       min-height: 100vh;
   }
   
   @keyframes gradient {
       0% {
           background-position: 0% 50%;
       }
       50% {
           background-position: 100% 50%;
       }
       100% {
           background-position: 0% 50%;
       }
   }
   .box-login {
    position: relative;
    width: 400px;
    margin: auto;
    background: #ffffff36;
    padding: 30px 30px;
    border-radius: 15px;
    backdrop-filter: blur(3px);
   }
   .login-p1 svg {
       fill: #020202;
       width: 60px;
       display: inline-block;
   }
   
   .login-p1 {
       text-align: center;
   }
   
   .login-p1 p {
       color: #999898;
       font-size: 17px;
       margin: 20px 0 0px;
   }
   .log_inp {display: flex;position: relative;margin: 20px 0;border-radius: 15px;overflow: hidden;}

.log_inp i {
    position: absolute;left: 0;top: 0;z-index: 9;height: 100%;width: 40px;background: transparent;display: flex;align-items: center;justify-content: center;color: white;
}



   form.box-login input {
    display: block;
    background: transparent;
    border: 0;
    border-bottom: 1px solid white;
    outline: none;
    font-size: 15px;
    padding: 15px 10px;
    position: relative;
    margin: 0px auto 0;
    z-index: 2;
    color: white;
    width: 100%;
    padding-left: 50px;
   }
   form.box-login h1 {
    color: white;
       font-size: 20px;
   }
   
   .input-row {
       position: relative;
       padding: 15px 0px 0px;
       width: 100%;
       margin: auto;
   }
   
   .input-row label {
       position: absolute;
       bottom: 0;
       left: 5px;
       font-size: 17px;
       z-index: 0;
       color: white;
       font-weight: 300!important;
       transition: 0.4s ease;
   }
   
   .input-row:before {content: '';width: 100%;position: absolute;bottom: 0;background: #ffffff;height: 1px;transition: 0.4s cubic-bezier(0.97, 0.3, 0.58, 1);}
   
   .input-row.has-value:after {content: '';width: 100%;transition: 0.4s cubic-bezier(0.97, 0.3, 0.58, 1);}
   
   .input-row:after {content: '';width: 0;position: absolute;background: #ffffff;height: 2px;bottom: 0;transition: 0.4s cubic-bezier(0.97, 0.3, 0.58, 1);}
   
   
   td.elli {
    width: 90%;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
   button.btn.btn-login {
       border: 0;
       padding: 15px 40px;
       color: #FFFFFE;
       background: #00deb3;
       width: 100%;
       margin: 20px auto 0;
       display: block;
       border-radius: 15px;
       text-transform: uppercase;
       font-size: 14px;
       letter-spacing: 1px;
   }
   button.btn.btn-login:hover {
       
   }
   .has-value.input-row label {
       bottom: 15px;
       font-size: 13px;
       color: #ffffff;
   }
   /*/MODAL/*/
   
   .modal.fade.show {
       background: #00000094;
   }
   
   .input-group-addon {
       padding: 5px 7px;
       border: 1px solid #dbe5ee;
       background: #dbe5ee;
   }
   
   .modal-open .mdk-header-layout > .mdk-header{
       z-index: 0;
   }
   
   
   
   /*/Botones/*/
   td .dropdown-toggle::after {
       display:none;
   }
   
   .btn-option {
       display: block;
       font-weight: 300;
       text-align: center;
       vertical-align: middle;
       cursor: pointer;
       -webkit-user-select: none;
       -moz-user-select: none;
       width: 100%;
       -ms-user-select: none;
       user-select: none;
       border: 1px solid transparent;
       line-height: 1.5;
       border-radius: .25rem;
       transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
       padding: 4px 10px;
       font-size: .75rem;
       line-height: 1.5;
       border-radius: .15rem;
   }
   
   
   .btn-verde3 {
       color: #fff;
       background-color: #34e481;
       border-color: #28a745;
       box-shadow: none;
   }
   
   .btn-option:focus {
       outline: none;
   }
   
   
   /*/Niveles/*/
   
   .niveles img {
       width: 40px;
   }
   
   .nivel-svg {
       width: 30px;
   }
   .niveles img:hover {
       transition: .4s;
       transform: scale(1.1);
   }
   .nivel button {border: 0;}
   
   .niveles button {
       border: 0;
       outline: none;
       background: transparent;
   }
   
   .dropdown-menu.dropdown-menu-right.niveles {
   padding: 10px;
       width: 120px;
       min-width: inherit;
   }
   
   
   
   /* Formulario Modal */
   .dropdown-menu-lg .dropdown-item {
       padding: 13px 10px;
       display: block;
       width: 100%;
       text-align: left;
   }
   
   .modal-dialog.lg {
       max-width: 650px;
       margin: 1.75rem auto;
   }
   
   .form-container {
       width: 100%;
       background: white;
   }
   .form-flex {
       display: flex;
       flex-wrap: wrap;
   }
   
   .form-block {
       width: 100%;
       padding: 5px 0px;
       position: relative;
       display: flex;
       margin-bottom: 10px;
           flex-wrap: wrap;
   }
   .item-form .input-group-append {
       position: absolute;
       left: 1px;
       top: 0;
       height: 100%;
   }
   
   input.btn-enviar {
       background: #2626bc;
       color: white;
       border: 0;
       outline: none;
       padding: 3px 20px;
       border-radius: 5px;
   }
   .item-form i {
       position: absolute;
       left: 0;
       width: 30px;
       top: 0;
       display: flex;
       color: #fff;
       justify-content: center;
       align-items: center;
       height: 100%;
       background-color: #333;
      
   }
   .form-block.in2 {
       width: 50%;
   }
   
   .form-block input {
       width: 100%;
       padding: 18px 10px 4px;
       border: 0;
       outline: none;
       background: transparent;
       position: relative;
       z-index: 2;
   }
   
   .form-block label {
       position: absolute;
       z-index: 0;
       color: #585858;
       opacity: 0.9;
       font-weight: 400!important;
       padding: 0 10px;
       transform: translateY(12px);
       transition: 0.4s;
       z-index: 1;
   }
   
   .form-block .has-value label {
       transform: translateY(4px);
       transition: 0.4s;
       opacity: 1;
       font-size: 10px;
       opacity: 0.5;
   }
   
   .modal-content.lg {
       padding: 0px 30px 20px;
   }
   .item-form {
       margin-right: 10px;
       background: #ffffff;
       width: 100%;
       padding: 1px 0;
       border-radius: 3px;
       padding-left: 30px;
       position: relative;
       margin-bottom: 6px;
       border: 1px solid #d9d9d9;
   }
   
   

   /*======================================
        INDICATOR - DASHBOARD - HOME
   /*===================================/*/
   

   .row-sb {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    }

    .box-indicators {
        width: 23%;
        background: white;
        padding: 20px 30px;
        border-radius: 5px;
        height: 170px;
            margin-bottom: 2.5%;
    }

    .box-indicators h6 {
        font-size: 12px;
        margin: 0;
    }

    .box-indicators > .content {
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: space-around;
    }

    span.big {
        font-size: 25px;
        font-weight: 800;
    }

    .box-indicators small {
        font-size: 15px;
        font-weight: 300;
    }





   /*=============================================
   ESCRITORIO GRANDE (LG revisamos en 1366px en adelante)
   =============================================*/
   
   @media (min-width:1200px){
   
   .modal-dialog {
       max-width: 610px;
       margin: 1.75rem auto;
   }
   
   }
   
   /*=============================================
   ESCRITORIO MEDIANO O TABLET HORIZONTAL (MD revisamos en 1024px)
   =============================================*/
   
   @media (max-width:1199px) and (min-width:992px){
   
   
   
   }
   
   /*=============================================
   ESCRITORIO PEQUEÑO O TABLET VERTICAL (SM revisamos en 768px)
   =============================================*/
   
   @media (max-width:991px) and (min-width:768px){
   
   
   
   }
   
   /*=============================================
   MOVIL (XS revisamos en 320px)
   =============================================*/
   
   @media (max-width:767px){
   
   li.nav-item.menu-fix {
       position: fixed;
       bottom: 20px;
       right: 20px;
       background: #111;
       text-align: center;
       border-radius: 50%;
       height: 50px;
       width: 50px;
       color: white;
   }
   
   li.nav-item.menu-fix i {
       color: white;
   }
   
   .navbar-expand .menu-fix .nav-link {
       padding: 0;
       display: flex;
       align-items: center;
       text-align: center;
       justify-content: center;
       height: 50px;
   }
   }
   
   
   /*=============================================
   MOVIL (XS revisamos en 320px)
   =============================================*/
   
   @media (max-width:565px){
       .box-login {
       width: 90%;
       padding: 80px 80px;
       border: 1px solid;
       background: white;
   }
   button.btn-option b {
       display: none;
   }
   
   button.btn-option {
       width: 20px;
       height: 20px;
       border-radius: 50%;
   }
   .dropdown-menu.show {
       display: block;
       min-width: 100px;
   }
   .box-login {
       width: 90%;
       padding: 50px 30px;
    
   }
   .input-row {
       width: 90%;
   
   } 
   button.btn.btn-login {
   
       width: 90%;
   
   } 
   
   }