a {

    color: white;

    text-decoration: none;

}



form not([type="submit"]){

  margin: 50px auto;

  width: 65%;

  max-width: 700px;

}



form {

    margin: 50px auto;

}



legend{

  font-size: 30px;

}



#contenedor{

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    min-width: 400px;

    height: 100%;

    background-color: #ffffff;

    border: 0px solid #333333;

    border-top: 0px solid #333333;

}



#form_center, #form_center2, #form_center3, #form_center4{

    max-width: 800px;

    margin: auto;

    text-align: center;

}



#form_center, #form_center2, #form_center3{

    width: calc(100% - 80px);

}



#form_center2 .campos, #form_center4 .campos{

  display: flex;

  flex-direction: column;

  justify-content: center;

}



#form_center4{

    margin: auto;

    width: 250px;

}



.price{

    width: 140px;

    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;

    font-size: 12px;

}



.vigencia{

    width: 200px;

    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;

    font-size: 12px;

}



#cabecera{

    background-color: #3f97ea;

    width: 100%;

    height: 55px;

    border-bottom: 5px solid #aa00cf;

    top: 0px;

}



#user_data{

    position: absolute;

    top: 0px;

    right: 0px;

    width: calc(100% - 20px);

    padding: 0px 20px 0px 0px;

    text-align: right;

    z-index: 0;

}



#menu_data{

    position: absolute;

    top: 0px;

    left: 0px;

    width: 80px;

    text-align: left;

    z-index: 1;

}



#OcultMENU{

    background-color: #ffffff;

    border: 0px solid #cccccc;

    position: absolute;

    margin: 0px;

    padding: 10px;

    top: 0px;

    left: 0px;

    width: calc(100% - 20px);

    height: calc(100% - 20px);

    text-align: left;

    z-index: 2;

    display: none;

    opacity: 0.30;

}



#menu{

    background-color: #333333;

    border-right: 1px solid #cccccc;

    position: fixed;

    margin: 0px;

    padding: 10px;

    top: 0px;

    left: 0px;

    width: 270px;

    height: calc(100% - 20px);

    text-align: left;

    z-index: 2;

    display: none;

    overflow-y: none;

}



#menu1{

    background-color: #333333;

    border-bottom: 1px solid #dddddd;

    margin: 0px;

    padding: 0px;

    width: 260px;

    height: 60px;

}



#menuBTN{

    cursor: pointer;

    margin: 16px 15px;

}



#logo{

    margin: 5px 15px;

}



.inpt_radio{

    border-radius: 12px;

    margin: 7px 5px;

    width: 250px;

    height: 30px;

    padding: 3px 5px;

}



#recibos{

    background-color: #333333;

    border-right: 1px solid #cccccc;

    position: fixed;

    margin: 0px;

    padding: 10px 15px;

    top: 0px;

    right: 0px;

    width: 335px;

    height: calc(100% - 20px);

    text-align: left;

    z-index: 2;

    display: none;

    overflow-y: scroll;

}





#menu2{

    background-color: #333333;

    border-bottom: 1px solid #dddddd;

    margin: 0px;

    padding: 0px;

    width: 310px;

    height: 30px;

}

/*********************************** Tickets pendientes *****************************/



.ReciboPENDIENTE{

    background-color: #111111;

    border: 1px solid #555555;

    color: #dddddd;

    margin: 5px 0px;

    padding: 5px 10px;

    width: 290px;

    cursor: pointer;

}



.ticket-pen{

  display: flex;

  justify-content: space-between;

}



.btn-eliminar{

  border: 1px solid #555;

  display: flex;

  align-items: center;

  background-color: #AF0900;

  margin: 5px 0 5px 2px;

  padding: 3px 2px;

}



.btn-eliminar:hover{

  cursor: pointer;

}



.btn-eliminar p{

  color: white;

  font-weight: bold;

}



button[id="PAY_car"]{

    border-radius: 10px;

    border: 1px solid #333333;

    background: #ffffff;

    background-image: url('/image/Pay_car.png');

    background-size: 100% 100%;

    width: 200px;

    height: 65px;

    margin: 7px 20px;

    cursor: pointer;

}



button[id="PAY_finish"]{

    border-radius: 10px;

    border: 1px solid #333333;

    background: #ffffff;

    background-image: url('/image/Pay_car.png');

    background-size: 100% 100%;

    width: 200px;

    height: 65px;

    margin: 7px 20px;

    cursor: pointer;

}



button[id="Save"]{

    border-radius: 10px;

    border: 0px solid #333333;

    background: transparent;

    background-image: url('/image/save.png');

    background-size: 100% 100%;

    width: 60px;

    height: 60px;

    margin: 10px 10px;

    cursor: pointer;

}



button[id="Cancel"]{

    border-radius: 10px;

    border: 0px solid #333333;

    background: transparent;

    background-image: url('/image/cancel.png');

    background-size: 100% 100%;

    width: 60px;

    height: 60px;

    margin: 10px 10px;

    cursor: pointer;

}

button[id="ELIMINA"]{

    border-radius: 10px;

    border: 0px solid #333333;

    background: transparent;

    background-image: url('/image/del.png');

    background-size: 100% 100%;

    width: 60px;

    height: 60px;

    margin: 0px 10px;

    cursor: pointer;

}



fieldset{

  padding: 15px;

  margin: 20px 0;

  border-radius: 5px;

  border: 3px solid #e1e1e1;

  background: #ffffff;

}



fieldset label{

  text-transform: uppercase;

  font-family: monospace;

  font-weight: bold;

}



.form-origen{

  max-width: 100%;

}



.form-origen p{

  display: flex;

  justify-content: space-between;

  max-width: 100%;

}



label{

    Display: inline-block;

    margin: 3px 5px;

    padding: 0px;

    width: 90px;

    Border: 0px solid #EEEEEE;

    background-color: transparent;

    text-align: left;

    font-size: 11pt;

}



.form-cargo{

  padding: 0 20px;

  display: flex;

  justify-content: space-around;

}



.Productos{

    border-radius: 10px;

    top: 0px;

    left: 0px;

    width: 170px;

    height: 180px;

    background-color: #ffffff;

    border: 0px solid #333333;

    cursor: pointer;

    opacity: 100%;

}



.Productos_hidde{

    border-radius: 10px;

    top: 0px;

    left: 0px;

    width: 170px;

    height: 180px;

    background-color: #ffffff;

    border: 0px solid #333333;

    cursor: default;

    opacity: 40%;

}



.Productos_name{

    border-radius: 5px;

    background-color: #333333;

    margin: 0px;

    padding: 5px 0px;

    color: #ffffff;

    bottom: 0px;

    left: 0px;

    width: 170px;

    height: 20px;

    border: 1px solid #333333;

}



.Productos_img{

    border-radius: 5px;

    background-color: #ffffff;

    margin: 0px;

    padding: 10px 0px;

    color: #ffffff;

    bottom: 0px;

    left: 0px;

    width: 170px;

    height: 130px;

    border: 0px solid #333333;

}



.filtros_more{

    width: calc(100% - 40px);

    padding: 2px 20px;

    margin: auto;

    background-color: #23485a;

    color: white;

    text-align: center;

    font-size: 8pt;

    cursor: pointer;

}



.filtros_reportes, .compras_filtros, .subtotales{

    width: calc(100% - 40px);

    max-width: 1000px;

    display: flex;

    padding: 20px;

    margin: auto;

    justify-content: space-around;

    align-items: center;

}



.compras_filtros{

    display: block;

}



.subtotales{

    width: calc(100% - 80px);

    max-width: 1200px;

    display: block;

    text-align: right;

}



.subtotales input[type="text"]{

    width: 100px;

    border: 0px;

    border-bottom: 2px solid #333333;

    margin: 0px 0px;

    text-align: center;

    font-size: 11pt;

    height: 25px;

}

#moreFiltro {

    background-color: #333333;

    max-width: none;

    display: none;

    justify-content: center;

}



.filtros_reportes select, .filtros_reportes input[type="text"], #moreFiltro input{

      margin: 0px 15px;

      width: 100%;

      min-width: 200px;

      border-radius: 0px;

      background-color: white;

      border: none;

      height: 30px;

}



.compras_filtros input[id="ProovedorNAME"]{

    border: none;

    height: 30px;

    border-bottom: 2px solid #333333;

    background: transparent;

    width: calc(100% - 100px);

    margin: 0px 0px 5px 5px;

}



.compras_filtros select[id="Metodo"]{

    width: 130px;

    border-radius: 0px;

    border-bottom: 2px solid #333333;

    margin: 10px 5px 0px 5px;

    background: transparent;

}



#moreFiltro select, #moreFiltro input{

    max-width: 300px;

}



#moreFiltro input{

    border-radius: 10px;

}



.filtros_reportes select option{

  background-color: white;

  color: black;

}



.contenedor-filtros{

  display: block;

  width: 100%;

  background-color: #EEEEEE;

}



#VT{

    padding: 10px 5px;

    display: block;

    align-items: center;

    margin: 0;

    color: white;

    font-weight: bold;

    background-color: #23485a;

    text-align: center;

}





.f1{

  background-color: #EDEDEB;

}



.f2{

  background-color: #C5C5C5;

}



.centrarT{

  text-align: center;

}



.switch-button {

    position: absolute;

    right: 10px;

    float: right;

}

.switch-button .switch-button__checkbox {

    display: none;

}

.switch-button .switch-button__label {

    background-color: #8f8f8f;

    width: 50px;

    height: 30px;

    border-radius: 3rem;

    display: inline-block;

    position: relative;

}

.switch-button .switch-button__label:before {

    transition: .2s;

    display: block;

    position: absolute;

    width: 30px;

    height: 30px;

    background-color: #fdffff;

    content: '';

    border-radius: 50%;

    box-shadow: inset 0px 0px 0px 1px #000;

}

.switch-button .switch-button__checkbox:checked + .switch-button__label {

    background-color: #8f8f8f;

}

.switch-button .switch-button__checkbox:checked + .switch-button__label:before {

    transform: translateX(20px);

}



.cont-btn{

    display: flex;

    flex-direction: row;

    justify-content: space-between;

    align-items: center;

    text-align: center;

    width: calc(100% - 40px);

    max-width: 600px;

    margin: 10px auto 20px auto;

}



.fecha_rango{

  font-size: 20px;

  height: 28px;

  min-width: 250px;

  border: 1px solid black;

  background-color: #23485a;

  border-radius: 10px;

  color: white;

  overflow: hidden;

  margin: 0px 15px;

}



.fecha_rango input{

  height: 30px;



        width: calc(50% - 10px);

  margin: 0;

  outline: none;

  border:none;

}



.cont-btn a{

  text-align: center;

  background-color: #0095eb;

  padding: 2px 5px;

  width: 25%;

  max-width: 150px;

  border-radius: 5px;

  margin: auto 3px;

}



.cont-btn a:hover{

  background-color: #047EC5;

}



.LBL30{

    width: 30px;

}





.tabla_reportes{

  display: flex;

  justify-content: center;

  margin-bottom: 30px;

}



.tabla_reportes table{

  width: 90%;

  border: 2px solid #ADADAD;

  padding: 2px;

  border-radius: 8px;

  border-collapse: separate;

  border-spacing:  3px;

  -webkit-box-shadow: 11px 10px 30px -2px rgba(0,0,0,0.51);

  -moz-box-shadow: 11px 10px 30px -2px rgba(0,0,0,0.51);

  box-shadow: 11px 10px 30px -2px rgba(0,0,0,0.51);

}



.table-encabezado{

  background-color: #123145;

  color: white;

  font-weight: bold;

}



.table-encabezado td{

  padding: 10px 0;

  font-size: 18px;

  text-align: center;

}



#tabla_reportes td{

  padding: 10px 10px;

}

.LBL50{

    width: 50px;

}



.LBL80{

    width: 80px;

}



.LBL90{

    width: 90px;

}



.LBL100{

    width: 100px;

}



.LBL120{

    width: 120px;

}



.LBL150{

    width: 150px;

}



.LBL200{

    width: 200px;

}



.LBL250{

    width: 250px;

}



.LBL250a{

    width: 250px;

}



.LBL300{

    width: 300px;

}



.LBL300{

    width: 300px;

}



.campo300{

    width: 300px;

}



label[clr="bk"], label[clr="btn_k"] {

    color: #ffffff;

}



label[clr="btn_k"]:hover {

    text-decoration: underline;

    cursor: pointer;

}



label[clr="bk1"]{

    color: #dddddd;

}



label[add="long"]{

    height: 30px;

    padding: 0px 0px 15px 10px;

}



#notificacion{

    position: absolute;

    right: 17px;

    top: 2px;

    display: block;

    background-color: crimson;

    color: white;

    width: 18px;

    float: right;

    border-radius: 50%;

    height: 18px;

    text-align: center;

}



#form_center2 input:not([type="submit"]):not([type=checkbox]):not([type=radio]):not([type="reset"]), select, #form_center4 input:not([type="submit"]):not([type=checkbox]):not([type=radio]):not([type="reset"]){

  height: 30px;

  background-color: #e1e1e1;

  margin-bottom: 20px;

  border: none;

  border-radius: 10px;

}



.dias_promo{

    display: inline-block;

    width: 250px;

    float: left;

}



.horas_promo{

    display: inline-block;

    width: calc(100% - 260px);

    float: left;

    padding: 40px 0px;

}



.vigenciaDATE{

    display: inline-block;

    width: calc(50% - 30px);

        overflow: hidden;

    white-space: nowrap;

    flex-grow: 2;

}



.check{

  height: 10px;

  background-color: #e1e1e1;

  margin: 5px;

  border: none;

  border-radius: 0px;

}



#form_center2 textarea{

  background-color: #e1e1e1;

  margin-bottom: 20px;

  border: none;

  border-radius: 10px;



}



.form-cargo label, .form-cargo select{

  width: auto;

}



.input-origen{

  display: inline-block;

  width: calc(100% - 120px);

}

select[class = "input-origen"]{

    display: inline-block;

    width: calc(100% - 120px);

}



#form_center2 input[type="submit"], #form_center2 input[type="reset"], .pagesX, .pagesY, .pagesZ, .AgregarProd, #form_center4 input[type="submit"], #form_center4 input[type="reset"]{

  background-color: #3f97ea;

  height: 40px;

  padding: 7px 10px;

  color: white;

  font-weight: bold;

  border-style: none;

  border-radius: 5px;

  cursor: pointer;

  color: #ffffff;

}

#form_center2 input:focus, #form_center2 input:focus, #form_center4 input:focus, #form_center4 input:focus{
  outline: none;
}

.pagesY{

    background-color: #cccccc;

    cursor: default;

}



.pagesZ{

    background-color: #eeeeee;

    color: #333333;

    margin: auto;

}



.AgregarProd{

    background-color: #ffffff;

    color: #333333;

    margin: auto;

    border: 1px solid #333333;

    float: right;

}



#form_center2 input[type="reset"], #form_center4 input[type="reset"]{

  background-color: #b90019;

}



#form_center2 input[type="submit"]:hover, #form_center4 input[type="submit"]:hover, .pagesX:hover{

    background-color: #046193;

    color: #ffffff;

}

.ocultarCredenciales {

    position: fixed;

    top: 0px;

    left: 0px;

    width: 100%;

    min-width: 300px;

    height: 100%;

    background: rgba(0, 0, 0, 0.8);

    z-index: 100;

    text-align: center;

    display: none;

}



#segundomenu, #segundomenu_2  {

    background-color: rgba(0, 0, 0, 0.1);

    width: calc(100% - 100px);

    max-width: 1200px;

    display: flex;

    align-items: center;

    margin: 0px auto;

    border: 2px solid rgba(0, 0, 0, 0.1);

    border-radius: 3px;

    height: 170px;

    margin-top: 20px;

    padding: 10px;

}



#segundomenu_2  {

    max-width: 780px;

}



.caja, .caja_2 {

    width: 15%;

    min-width: 90px;

    max-width: 160px;

    /*height: 115px;*/

    align-items: center;

    border-radius: 5px;

    text-align: center;

    float: left;

    margin: auto;

    background: rgba(0, 0, 0, 0.1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    cursor: pointer;

    overflow: hidden;
}



.caja_2{

    width: 30%;

    min-width: 130px;

    max-width: 200px;

}



    .caja label, .caja_2 label,.caja input, .caja_2 input {

        border: 0px solid rgba(0, 0, 0, 0.1);

        border-top: 1px solid rgba(0, 0, 0, 0.1);

        background-color: rgba(0, 0, 0, 0.2);

        color: white;

        width: 100%;

        height: 31px;

        min-height: 31px;

        border-radius: 0px 0px 5px 5px;

        margin: 0px;

        display: flex;

        align-items: center;

        justify-content: center;

        cursor: pointer;

        overflow: hidden;

        padding: 0;

    }

    .caja input, .caja_2 input {
      padding-left: 10px;
    }


        .caja:hover label, .caja_2:hover label {

            text-decoration: underline;

        }



    .caja img, .caja_2 img {

        width: 50px;

        height: 50px;

        border-radius: 3px;

        margin: 15px auto;

        padding: 3px;

        cursor: pointer;

    }



        .caja:hover img, .caja_2:hover img {

            -webkit-transform: scale(1.15);

            -moz-transform: scale(1.15);

            -ms-transform: scale(1.15);

            -o-transform: scale(1.15);

            transform: scale(1.15);

        }



.opt_menu {

    height: 20px;

    margin: 8px 0px;

    cursor: pointer;

}

    .opt_menu label {

        width: 200px;

        color: #ffffff;

        height: 30px;

        padding: 0px 0px 15px 10px;

        cursor: pointer;

    }

        .opt_menu:hover label {

            text-decoration: underline;

        }



.opt_menuO {

    height: 20px;

    margin: 8px 0px;

    cursor: no-drop;

}

    .opt_menuO label {

        width: 200px;

        color: #ffffff;

        height: 30px;

        padding: 0px 0px 15px 10px;

        cursor: no-drop;

    }

        .opt_menuO:hover label {

            text-decoration: none;

        }



#clientes_TBL

{

    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;

    font-size: 12px;

    width: calc(100% - 80px);

    max-width: 800px;

    text-align: left;

    border-collapse: collapse;

    margin: 0 auto;



}

#clientes_TBL th

{

    font-size: 13px;

    font-weight: normal;

    padding: 8px;

    background: #b9c9fe;

    border-top: 4px solid #aabcfe;

    border-bottom: 1px solid #fff;

    color: #039;

}



#clientes_TBL td

{

    padding: 8px;

    background: #e8edff;

    border-bottom: 1px solid #fff;

    color: #669;

    border-top: 1px solid transparent;

}



#clientes_TBL td[class="TBLcab"]

{

    background: #333333;

    color: #eee;

}



#clientes_TBL tr:hover td

{

    background: #d0dafd;

    color: #339;

}



#clientes_TBL button

{



    padding: 7px 15px 7px 15px;

    border: 0;

    color:  white;

    border-radius: 3px;

    margin: 0 auto;

    text-align: center;

    background-color: #046193;

}



#clientes_TBL button:hover

{

    background-color: #0095eb;

    cursor: pointer;

}



#clientes_TBL button:active

{

   outline: none;

}



/*********************************** Estilo para las alertas *****************************/

.alert-panel{

  position: absolute;

  top: 0px;

  width: 100%;

  height: 100vh;

  background-color: rgba(0, 0, 0, 0.4);

  z-index: 5;

}



.alert{

  overflow: hidden;

  height: 215px;

  text-align: center;

  background-color: white;

  margin:auto;

  border-radius: 10px;

  position: relative;

  top: calc(50% - 107px);

  z-index: 6;

  padding: 30px;

  width: 350px;

}



.alert h2{

  margin: 5px 0 30px 0;

  font-size: 28px;

}



.confirm{

  display: flex;

  justify-content: center;

}



.confirm input[id="alert_cancel"], .confirm input[id="alert_confirm"]{

    background-color: #046193;

    height: 40px;

    padding: 7px 20px;

    margin: 5px 10px;

    color: white;

    font-weight: bold;

    border-style: none;

    border-radius: 5px;

    cursor: pointer;

    color: #ffffff;

}



.confirm input[id="alert_cancel"]{

  background-color: #b90019;

}



.confirm input[id="alert_confirm"]:hover{

  background-color: #3f97ea;

}



.pay_alert{

  display: flex;

  flex-direction: column;

  align-items: center;

}



.pay_alert p:not(.paymsg):not(.alertmsg){

  margin: 20px 0px 10px 0px;

  text-align: right;

  font-size: 25px;

  line-height: 1.6;

}



.adelanto p{

  font-size: 20px;

  line-height: 1.5;

}



.pay_alert p b{

  margin-right: 10px;

}



.pay_alert p input{

  font-size: 20px;

  border-radius: 6px;

  border: 1px solid #1e1e1e;

}



.saldos {

    Display: inline-block;

    margin: 0px 5px;

    padding: 0px;

    width: 120px;

    Border: 0px solid #EEEEEE;

    background-color: transparent;

    text-align: center;

    font-size: 12pt;

}



.paymsg{

    font-size: 16px;

    text-align: justify;

    margin: 20px 0 10px 0;

    line-height: 1.5;

}



.alertmsg{

    font-weight: bold;

    font-size: 20px;

    text-align: justify;

    margin: 15px 0px 20px 0px;

    line-height: 1.5;

}



.encabezado_alerta{

  position: absolute;

  top: 0;

  height: 40px;

  width: 100%;

  background-color: #3f97ea;

  padding: 7px 0 0 0;

}



.encabezado_alerta b{

  color: white;

  font-size: 25px;

  margin-top: 30px;

}



#preview{

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    opacity: 30%;

    background-color: #999999;

    z-index: 1;

    display: none;

}



#printCONTEN{

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    opacity: 100%;

    background-color: transparent;

    z-index: 1;

    display: none;

}


/* ////////////////////// 04-11-2020, ESTILOS CREADOS PARA LA TABLA DE UNIDADES */

#tablaUnidadesMED

{

    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;

    font-size: 12px;

    width: calc(100% - 80px);

    max-width: 800px;

    text-align: left;

    border-collapse: collapse;

    margin: 0 auto;

    margin-top: 20px;

    margin-bottom: 20px;



}

#tablaUnidadesMED th

{

    font-size: 13px;

    font-weight: normal;

    padding: 8px;

    background: #b9c9fe;

    border-top: 4px solid #aabcfe;

    border-bottom: 1px solid #fff;

    color: #039;

}



#tablaUnidadesMED td

{

    padding: 8px;

    background: #e8edff;

    border-bottom: 1px solid #fff;

    color: #669;

    border-top: 1px solid transparent;

}



#tablaUnidadesMED td[class="TBLcab"]

{

    background: #333333;

    color: #eee;

}



#tablaUnidadesMED tr:hover td

{

    background: #d0dafd;

    color: #339;

}



#tablaUnidadesMED button

{



    padding: 7px 15px 7px 15px;

    border: 0;

    color:  white;

    border-radius: 3px;

    margin: 0 auto;

    text-align: center;

    background-color: #046193;

}



#tablaUnidadesMED button:hover

{

    background-color: #0095eb;

    cursor: pointer;

}



#tablaUnidadesMED button:active

{

   outline: none;

}

/* ////////////////////// 04-11-2020, FIN ESTILOS CREADOS PARA LA TABLA DE UNIDADES */



/*********************************** Estilo para las facturas *****************************/



.forms-alert{

    background: #ffffff;

    border: 3px solid #000000;

    border-radius: 8px;

    width: 270px;

    height: 300px;

    padding: 20px;

    margin: auto;

    text-transform: uppercase;

    font-family: monospace;

    font-weight: bold;

}

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

    #segundomenu {

        flex-wrap: wrap;

        border-radius: 3px;

        height: 440px;

    }



    #form_center, #form_center2, #form_center3{

        width: calc(100% - 80px);

        max-width: 800px;

        margin: auto;

        text-align: center;

    }



    form[class="mini"]{

        margin: auto;

        width: 250px;

    }



    .caja {

        width: 30%;

        min-width: 100px;

        max-width: 300px;

        height: 115px;

        align-items: center;

        border-radius: 5px;

        text-align: center;

        float: left;

        margin: auto;

        background: rgba(0, 0, 0, 0.1);

        border: 1px solid rgba(0, 0, 0, 0.1);

        cursor: pointer;

    }

    .caja[name="cambio"] {

        clear: left;

    }



    form not([class="mini"]){

      width: 80%;

    }



    form[class="mini"]{

        margin: auto;

        width: 250px;

    }



    #moreFiltro select, #moreFiltro input{

        display: inline;

        width: calc(50% - 20px);

        min-width: 150px;

        margin: 10px 9px;

    }



    #moreFiltro {

        width: calc(100% - 20px);

        flex-wrap: wrap;

    }

    #moreFiltro input{

        border: none;

        height: 30px;

    }



}


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



    .filtros_reportes{

        display: block;

        width: calc(100% - 40px);

        padding: 10px;

        text-align: center;

    }



    .filtros_reportes select, #moreFiltro input{

        display: inline;

        width: calc(50% - 20px);

        min-width: 150px;

        margin: 10px 8px;

    }



    .fecha_rango{

        display: block;

        width: calc(100% - 20px);

        margin: 10px 9px;

        min-width: 150px;

        overflow: hidden;

    }



    .fecha_rango input{

        width: calc(50% - 10px);

    }



    #moreFiltro {

        width: calc(100% - 20px);

        flex-wrap: wrap;

    }

    #moreFiltro input{

        border: none;

        height: 30px;

    }



}



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

    .dias_promo{

        width: 200px;

    }



    .horas_promo{

        width: calc(100% - 210px);

    }



    #form_center, #form_center2, #form_center3{

        width: calc(100% - 80px);

        max-width: 800px;

        margin: auto;

        text-align: center;

    }



    .mini {

      width: 90%;

    }

}



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



    #segundomenu_2[add="ampliar"] {

        flex-wrap: wrap;

        border-radius: 3px;

        height: 300px;

    }



    .caja_2{

        width: 45%;

        min-width: 130px;

        max-width: 250px;

    }



    .caja_2[add="ampliar"]{

        width: 93%;

        min-width: 250px;

        max-width: 750px;

    }



}



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



    form not([class="mini"]) {

      width: 90%;

    }



    .price{

        width: 100%;

    }



    .vigencia{

        width: 150px;

    }



    .caja_2[add="ampliar"]{

        width: 95%;

    }



}

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



}



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

    .dias_promo{

        width: 100%;

    }



    .horas_promo{

        width: 100%;

        padding: 0px;

    }



    .filtros_reportes{

        display: block;

        width: calc(100% - 20px);

        padding: 10px;

        text-align: center;

    }



    .fecha_rango{

        display: block;

        width: calc(100% - 20px);

        margin: 10px 9px;

        min-width: 150px;

        overflow: hidden;

    }



    .fecha_rango input{

        width: calc(50% - 11px);

    }

}



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

    .caja {

        width: 40%;

    }



    #segundomenu_2[add="ampliar"] {

        flex-wrap: wrap;

        border-radius: 3px;

        height: 300px;

    }



    #form_center, #form_center2, #form_center3{

        width: calc(100% - 40px);

        max-width: 800px;

        margin: auto;

        text-align: center;

    }



    .mini{

        margin: auto;

        width: 250px;

    }



    .AgregarProd{

        padding: 5px;

    }



    .compras_filtros select[id="Metodo"]{

        width: 110px;

        margin: 10px 0px 0px 5px;

    }



    .alert{

      width: 300px;

    }

}


@media screen and (max-height: 625px) {

  #menu{

      overflow-y: scroll;

  }
}