﻿/******************************************************************************************/
/********************************GENÉRICOS APLICACIONES************************************/
/******************************************************************************************/

/*body { font-family: Rajdhani, 'Open Sans', sans-serif; }*/
/*body { font-family: 'Open Sans', sans-serif; }*/
/*body { color: #333333; }*/
/*body, input, textarea, select { font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif; }*/


* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
.under:hover, .under:active { border-bottom: solid 1px !important; }
.underline { border-bottom: solid 1px !important; }
.noUnderline { text-decoration: none !important; }
.noUnderline a:link { text-decoration: none !important; }
.noUnderline a:visited { text-decoration: none !important; }
.noUnderline a:hover { text-decoration: none !important; }
.noUnderline a:active { text-decoration: none !important; }

.pl0 { padding-left: 0px !important; }
.pl5 { padding-left: 5px !important; }
.pl6 { padding-left: 6px !important; }
.pl7 { padding-left: 7px !important; }
.pl8 { padding-left: 8px !important; }
.pl9 { padding-left: 9px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl31 { padding-left: 31px !important; }
.pl32 { padding-left: 32px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }
.pl45 { padding-left: 45px !important; }
.pl50 { padding-left: 50px !important; }

.pr0 { padding-right: 0px !important; }
.pr5 { padding-right: 5px !important; }
.pr10 { padding-right: 10px !important; }
.pr13 { padding-right: 13px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pr45 { padding-right: 45px !important; }
.pr50 { padding-right: 50px !important; }
.pr60 { padding-right: 60px !important; }
.pr70 { padding-right: 70px !important; }

.pt0 { padding-top: 0px !important; }
.pt2 { padding-top: 2px !important; }
.pt4 { padding-top: 4px !important; }
.pt5 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt11 { padding-top: 11px !important; }
.pt15 { padding-top: 15px !important; }
.pt16 { padding-top: 16px !important; }
.pt17 { padding-top: 17px !important; }
.pt18 { padding-top: 18px !important; }
.pt19 { padding-top: 19px !important; }
.pt20 { padding-top: 20px !important; }
.pt21 { padding-top: 21px !important; }
.pt22 { padding-top: 22px !important; }
.pt23 { padding-top: 23px !important; }
.pt24 { padding-top: 24px !important; }
.pt25 { padding-top: 25px !important; }
.pt26 { padding-top: 26px !important; }
.pt27 { padding-top: 27px !important; }
.pt28 { padding-top: 28px !important; }
.pt30 { padding-top: 30px !important; }
.pt32 { padding-top: 32px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pt45 { padding-top: 45px !important; }
.pt50 { padding-top: 50px !important; }
.pt60 { padding-top: 60px !important; }
.pt70 { padding-top: 70px !important; }
.pt80 { padding-top: 80px !important; }

.pb0 { padding-bottom: 0px !important; }
.pb2 { padding-bottom: 2px !important; }
.pb5 { padding-bottom: 5px !important; }
.pb6 { padding-bottom: 6px !important; }
.pb7 { padding-bottom: 7px !important; }
.pb8 { padding-bottom: 8px !important; }
.pb9 { padding-bottom: 9px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb12 { padding-bottom: 12px !important; }
.pb13 { padding-bottom: 13px !important; }
.pb14 { padding-bottom: 14px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb16 { padding-bottom: 16px !important; }
.pb17 { padding-bottom: 17px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb45 { padding-bottom: 45px !important; }
.pb50 { padding-bottom: 50px !important; }

.pb10- { padding-bottom: -10px !important; }

.ml0 { margin-left: 0px !important; }
.ml2 { margin-left: 2px !important; }
.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml11 { margin-left: 11px !important; }
.ml12 { margin-left: 12px !important; }
.ml13 { margin-left: 13px !important; }
.ml14 { margin-left: 14px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml24 { margin-left: 24px !important; }
.ml25 { margin-left: 25px !important; }
.ml26 { margin-left: 26px !important; }
.ml30 { margin-left: 30px !important; }

.ml5porCiento { margin-left: 5% !important; }
.ml6porCiento { margin-left: 6% !important; }
.ml10porCiento { margin-left: 10% !important; }
.ml15porCiento { margin-left: 15% !important; }
.ml20porCiento { margin-left: 20% !important; }

.ml3- { margin-left: -3px !important; }
.ml5- { margin-left: -5px !important; }
.ml7- { margin-left: -7px !important; }
.ml10- { margin-left: -10px !important; }
.ml15- { margin-left: -15px !important; }
.ml20- { margin-left: -20px !important; }
.ml25- { margin-left: -25px !important; }
.ml26- { margin-left: -26px !important; }
.ml40- { margin-left: -40px !important; }

.mt0 { margin-top: 0px !important; }
.mt3 { margin-top: 3px !important; }
.mt4 { margin-top: 4px !important; }
.mt5 { margin-top: 5px !important; }
.mt6 { margin-top: 6px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt26 { margin-top: 26px !important; }
.mt27 { margin-top: 27px !important; }
.mt28 { margin-top: 28px !important; }
.mt29 { margin-top: 29px !important; }
.mt30 { margin-top: 30px !important; }
.mt32 { margin-top: 32px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
.mt55 { margin-top: 55px !important; }
.mt60 { margin-top: 60px !important; }

.mt1- { margin-top: -1px !important; }
.mt2- { margin-top: -2px !important; }
.mt4- { margin-top: -4px !important; }
.mt8- { margin-top: -8px !important; }
.mt10- { margin-top: -10px !important; }
.mt15- { margin-top: -15px !important; }
.mt20- { margin-top: -20px !important; }
.mt25- { margin-top: -25px !important; }
.mt30- { margin-top: -30px !important; }
.mt32- { margin-top: -32px !important; }
.mt100- { margin-top: -100px !important; }

.mb0 { margin-bottom: 0px !important; }
.mb2 { margin-bottom: 2px !important; }
.mb4 { margin-bottom: 4px !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }

.mb1- { margin-bottom: -1px !important; }
.mb2- { margin-bottom: -2px !important; }
.mb3- { margin-bottom: -3px !important; }
.mb4- { margin-bottom: -4px !important; }
.mb5- { margin-bottom: -5px !important; }
.mb6- { margin-bottom: -6px !important; }
.mb8- { margin-bottom: -8px !important; }
.mb10- { margin-bottom: -10px !important; }
.mb15- { margin-bottom: -15px !important; }
.mb20- { margin-bottom: -20px !important; }
.mb30- { margin-bottom: -30px !important; }
.mb40- { margin-bottom: -40px !important; }
.mb50- { margin-bottom: -50px !important; }

.mr0 { margin-right: 0px !important; }
.mr1 { margin-right: 1px !important; }
.mr2 { margin-right: 2px !important; }
.mr3 { margin-right: 3px !important; }
.mr4 { margin-right: 4px !important; }
.mr5 { margin-right: 5px !important; }
.mr6 { margin-right: 6px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr21 { margin-right: 21px !important; }
.mr22 { margin-right: 22px !important; }
.mr23 { margin-right: 23px !important; }
.mr24 { margin-right: 24px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }

.mr5- { margin-right: -5px !important; }
.mr7- { margin-right: -7px !important; }
.mr10- { margin-right: -10px !important; }
.mr15- { margin-right: -15px !important; }
.mr20- { margin-right: -20px !important; }
.mr24- { margin-right: -24px !important; }
.mr24_5- { margin-right: -24.5px !important; }
.mr25- { margin-right: -25px !important; }
.mr40- { margin-right: -40px !important; }

.top0 { top: 0 }
.top4 { top: 4px !important }
.left0 { left: 0 }

.fontSize075rem { font-size: 0.75rem; }
.fontSize1 { font-size: 1px !important; }
.fontSize8 { font-size: 8px !important; }
.fontSize9 { font-size: 9px !important; }
.fontSize10 { font-size: 10px !important; }
.fontSize11 { font-size: 11px !important; }
.fontSize12 { font-size: 12px !important; }
.fontSize13 { font-size: 13px !important; }
.fontSize14 { font-size: 14px !important; }
.fontSize15 { font-size: 15px !important; }
.fontSize16 { font-size: 16px !important; }
.fontSize17 { font-size: 17px !important; }
.fontSize18 { font-size: 18px !important; }
.fontSize19 { font-size: 19px !important; }
.fontSize20 { font-size: 20px !important; }
.fontSize21 { font-size: 21px !important; }
.fontSize22 { font-size: 22px !important; }
.fontSize23 { font-size: 23px !important; }
.fontSize24 { font-size: 24px !important; }
.fontSize25 { font-size: 25px !important; }
.fontSize26 { font-size: 26px !important; }
.fontSize27 { font-size: 27px !important; }
.fontSize28 { font-size: 28px !important; }
.fontSize29 { font-size: 29px !important; }
.fontSize30 { font-size: 30px !important; }
.fontSize31 { font-size: 31px !important; }
.fontSize32 { font-size: 32px !important; }
.fontSize33 { font-size: 33px !important; }
.fontSize34 { font-size: 34px !important; }
.fontSize35 { font-size: 35px !important; }
.fontSize40 { font-size: 40px !important; }
.fontSize45 { font-size: 45px !important; }
.fontSize50 { font-size: 50px !important; }
.fontSize55 { font-size: 55px !important; }
.fontSize100 { font-size: 100px !important; }

.w50 { width: 50px; }
.w55 { width: 55px; }
.w100 { width: 100px; }
.w120 { width: 120px; }
.w130 { width: 130px; }
.w150 { width: 150px; }
.w160 { width: 160px; }
.w170 { width: 170px; }
.w180 { width: 180px; }
.w190 { width: 190px; }
.w200 { width: 200px; }
.w300 { width: 300px; }
.w400 { width: 400px; }
.w450 { width: 450px; }
.w460 { width: 460px; }
.w470 { width: 470px; }

.mw400 { max-width: 400px; }

.h30 { height: 30px; }
.h40 { height: 40px; }
.h42 { height: 42px; }
.h43 { height: 43px; }
.h44 { height: 44px; }
.h45 { height: 45px; }
.h50 { height: 50px; }
.h100 { height: 100px; }
.h150 { height: 150px; }
.h400 { height: 400px; }

.fontWeight300 { font-weight: 300; }
.fontWeight700 { font-weight: 700; }
.fontWeightBold { font-weight: bold; }

.w30porCiento { width: 30% !important; }
.w45porCiento { width: 45% !important; }
.w47porCiento { width: 47% !important; }
.w49porCiento { width: 49% !important; }
.w50porCiento { width: 50% !important; }
.w99porCiento { width: 99% !important; }
.w100porCiento { width: 100% !important; }

.alignCenter { text-align: center; }
.alignLeft { text-align: left; }
.alignRight { text-align: right; }
.left { float: left; }
.right { float: right; }
.flex { display: flex !important; }
.absolute { position: absolute !important; }
.relative { position: relative !important; }
.inlineFlex { display: inline-flex !important; }
.grid { display: grid !important; }
.inlineGrid { display: inline-grid !important; }
.contents { display: contents !important; }
.webKitInlineBox { display: -webkit-inline-box !important; }
.tableCaption { display: table-caption !important; }
.tableCell { display: table-cell !important; }
.inlineBlock { display: inline-block !important; }
.block { display: block !important; }
.noDisplay { display: none !important; }
.verticalAlignMiddle { vertical-align: middle; }
.verticalAlignTextTop { vertical-align: text-top; }
.verticalAlignSub { vertical-align: sub; }
.verticalAlignTextBottom { vertical-align: text-bottom; }
.noBorder { border: 0px; }

.lh0 { line-height: 0px; }
.lh12 { line-height: 1.2; }

.verticalAlign5- {
    vertical-align: -5px;
}

.cursorMano { cursor: pointer !important; }
.cursorFlecha { cursor: default !important; }

.paddingCabecera {
    padding: initial;
    padding-top: 10px;
    padding-left: 10px;
}

.paddingBotonEliminar {
    --bs-btn-padding-x: 0px;
}

.fondo-transparente { background-color: transparent; }
.fondo-eliminar { mix-blend-mode: lighten; } /*Elimina el fondo de una imágen*/
.fondo-Negro { background-color: #000 !important; }
.fondo-GrisClaro { background-color: rgba(0,0,0,.03); }
.fondo-Gris3 { background-color: #333 !important; }
.fondo-Gris5 { background-color: #555 !important; }
.fondo-Gris6 { background-color: #666 !important; }
.fondo-Gris8 { background-color: #888 !important; }
.fondo-Gris9 { background-color: #999 !important; }
.fondo-GrisA { background-color: #aaa !important; }
.fondo-GrisB { background-color: #bbb !important; }
.fondo-GrisC { background-color: #ccc !important; }
.fondo-GrisD { background-color: #ddd !important; }

.icon-flipped {
    -o-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}


.texto-Blanco { color: white !important; }
.texto-Rojo { color: #dc3545 !important; }
.texto-Negro { color: black !important; }
.texto-Azul { color: #007bff !important; }

.z10000 { z-index: 10000; }




/******************************************************************************************/
/*****************************************CHECKBOX*****************************************/
/******************************************************************************************/
.desactivaCheckbox {
    pointer-events: none; /*Desactiva los checkbox y permite que se hagan los binding al form sin necesidar de crear campos hidden*/
}






/******************************************************************************************/
/*************************************TABLAS GENÉRICO**************************************/
/******************************************************************************************/
.webgrid-table {    
    font-size: 13px;
    width: 100%;
    display: table;
    background-color: white;
}

.webgrid-table td, .webgrid-table th {
    padding: 1px 5px 1px 5px;
    position: relative;
}

.webgrid-header {
    color: #FFFFFF;
    padding-bottom: 4px;
    padding-top: 5px;
    text-align: left;
    font-size: 13px;
}

.webgrid-header a {
    color: #FFFFFF !important;
    text-decoration: none;
}

.webgrid-footer > td {
    padding-top: 10px;
    padding-bottom: 10px;
}

.webgrid-footer > td > a {
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px 7px;
    color: black;
    text-decoration: none;
    background-color: #f5f5f5;
}

.webgrid-footer > td > a:hover {
    background-color: #f0f0f0;
    color: #81bc00;
}

.webgrid-row-style {
    padding: 3px 7px 2px;
}

.webgrid-row-style:hover td, .webgrid-alternating-row:hover td {
    cursor: pointer;
}

.webgrid-row-style:hover td, .webgrid-alternating-row:hover td {
    background-color: #f8ff3c;
}

.NoSelected:hover td {
    background-color: transparent;
    cursor: initial;
}

.webgrid-alternating-row {
    padding: 3px 7px 2px;
}

.webgrid-cell-backgroundColor {
    background-color: #f8ff3c;
    padding: 1px 5px 1px;
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}




/*****************************************************************************************/
/************************************TABLA NEGRA******************************************/
/*****************************************************************************************/
.TablaNegra {
    border: 0px; /*Borde de alrededor de la tabla*/
    color: #777777; /*Color del texto dentro de las celdas*/
}

.TablaNegra th:last-child { text-align: center; /*Centra la cabecera de la última columna*/ }
.TablaNegra td:last-child {  border-right: 1px solid #777777; /*Centra la cabecera de la última columna*/ }
.TablaNegra td, .TablaGris th { border: 1px solid #dee2e6;  /*Borde de alrededor de todas las celdas (incluidas las de la cabecera)*/ }
.TablaNegraCabecera { background-color: black; /*Color de la cabecera*/ }
.TablaNegraPie > td > a { color: black;  /*Color del númerito de página*/ }
.TablaNegraPie > td > a:hover { color: black; background-color: #d4bc53; border-color: #d4bc53; font-weight: bold; /*Color cuando se pone el ratón encima del siguiente número de página*/ }
.AlternatingRowNegra { background-color: #f2f2f2; }




/*****************************************************************************************/
/************************************TABLA ROJA*******************************************/
/*****************************************************************************************/
.TablaRojaCabecera { background-color: #bc2a18; /*Color de la cabecera*/ }



/*****************************************************************************************/
/************************************TABLA NARANJA****************************************/
/*****************************************************************************************/
.TablaNaranjaCabecera { background-color: #f9b233; /*Color de la cabecera*/ }



/******************************************************************************************/
/**********************************TABLAS RESPONSIVE***************************************/
/******************************************************************************************/

/* Max width before this PARTICULAR table gets nasty This query will take effect for any screen smaller than 760px and also iPads specifically. */
@media only screen and (max-width: 992px), (min-device-width: 1000px) and (max-device-width: 1024px) {

    .TablaResponsive {
        width: 100%;
    }

    /* Force table to not be like tables anymore */
    .TablaResponsive table, .TablaResponsive thead, .TablaResponsive tbody, .TablaResponsive th, .TablaResponsive td, .TablaResponsive tr {
        display: block !important;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .TablaResponsive thead tr, .TablaResponsive .TablaFilaCabecera th {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .TablaResponsive tr {
        border: 1px solid #ccc;
        margin: 0 0 1rem 0;
    }

    /*Hijos pares (even) o impares (odd)*/
    .TablaResponsive tr:nth-child(even) {
        background: #EAEAEA;
    }

    /*Fila de cada hijo*/
    .TablaResponsive td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        font-size: 12px;
        padding: 3px !important;
        padding-left: 50% !important;
        vertical-align: middle;
        line-height: 25px;
        text-align: right;
        color: #666;
    }

    /*Eliminamos el borde derecho y de abajo de la última columna y colocamos los botones de acciones a la derecha*/
    .TablaResponsive td:last-child {  
        border-right: 0px solid #777777; /*Centra la cabecera de la última columna*/ 
        border-bottom: 0px solid #777777; /*Centra la cabecera de la última columna*/ 
        width: 100% !important;
        text-align: right !important;
    }

    .TablaResponsive td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        left: 6px;
        width: 45%;
        white-space: nowrap;
        text-align: left;
    }

    /*Pie de página (Paginación)*/
    .TablaResponsive tfoot td:before {
        display:none;
    }

    .TablaResponsive tfoot td {
        border: none;
    }

    /*Pie de página (Paginación)*/
    .tablaResponsive tfoot tr {
        border: none;
    }
}






/******************************************************************************************/
/**********************************COLORES MENSAJE TOAST***********************************/
/******************************************************************************************/
.toast-message {
    white-space: pre-line;
}

.toast-error {
    background-color: #bd2918 !important;
}

.toast-success {
    background-color: #26AF12 !important;
}

.toast-warning {
    background-color: lightslategrey !important;
}






/******************************************************************************************/
/**********************************COLORES SELECT2*****************************************/
/******************************************************************************************/

/* Input field */
.select2-selection__rendered {

}

/* Around the search field */
.select2-search {
    
}

/* Search field */
.select2-search input {
    color: #495057 !important;
}

/* Each result */
.select2-results {
    color: #495057 !important;
}

/* Higlighted (hover) result */
.select2-results__option--highlighted {
    background-color: #d4bc53 !important;
}

/* Selected option */
.select2-results__option[aria-selected=true] {
    background-color: #d4bc53 !important;
}

/* Elimina el borde de la parte de arriba del dropdown */
.select2-selection--single {
    border: 1px solid #dbdbdb !important;
}


/* Elimina el borde del resto del dropdown */
.select2-dropdown {
    border: 1px solid #dbdbdb !important;
}



/******************************************************************************************/
/*******************************MENSAJE VALIDACIÓN ERROR***********************************/
/******************************************************************************************/
.field-validation-error {
    font-size: 11px;
}





/******************************************************************************************/
/************************CAMPO REQUERIDO ASTERISCO ARRIBA**********************************/
/******************************************************************************************/
.control-label-required:after {
    color: #bd2918;
    content: " *";
    font-size: 14px;
    position: relative;
    top: -3px;
}


/******************************************************************************************/
/************************ELIMINA FLECHAS UP/DOWN TEXTBOX NÚMEROS***************************/
/******************************************************************************************/
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Chrome, Safari, Edge, Opera */
input[type=number] { -moz-appearance: textfield; } /* Firefox */





/******************************************************************************************/
/**********************ELIMINA VALOR dd/mm/aaaa --:-- EN INPUT DATETIME********************/
/******************************************************************************************/
::-webkit-datetime-edit-year-field:not([aria-valuenow]),
::-webkit-datetime-edit-month-field:not([aria-valuenow]),
::-webkit-datetime-edit-day-field:not([aria-valuenow]) {
    color: transparent;
}





/******************************************************************************************/
/***************************************AUTOCOMPLETE***************************************/
/******************************************************************************************/
.autocomplete-suggestions { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-no-suggestion { padding: 2px 5px;}
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: bold; color: #000; }
.autocomplete-group { padding: 2px 5px; font-weight: bold; font-size: 16px; color: #000; display: block; border-bottom: 1px solid #000; }



/******************************************************************************************/
/***************************AUTOCOMPLETE INPUTS/TEXTAREA/SELECT****************************/
/******************************************************************************************/
.autocompleteNavegador:-webkit-autofill,
.autocompleteNavegador:-webkit-autofill:hover,
.autocompleteNavegador:-webkit-autofill:focus
{
    -webkit-text-fill-color: white;
    transition: background-color 5000s ease-in-out 0s;
}


/******************************************************************************************/
/***************************OVERFLOW DEL TEXTO*********************************************/
/******************************************************************************************/

.width-caja{
    max-width: 300px;
}
@media (max-width: 768px) {
    .width-caja {
        max-width: 100%;
    }
}