@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Abel&display=swap');
@media screen and (min-width:320px) and  (max-width:459px){

*{
   margin: 0;
        padding: 0;
        font-family: Abel;
        --vino: #000;
        --rojo: #ef4550;
        --amarillo: #F0CB34;
        --verde: #26B380;
        --gris: #3e3e3e;
        --fondo: #fff;
        --dorado: #3D9C54;
        --naranja: #f97423;
        background: var(--fondo);
        --green: #26B380;
        --azul: #3099BA;

}
    a:hover,
    button:hover {
        transform: scale(.9, .9);
        transition: .2s;
    }

    a,
    button {
        transition: .2s;
        cursor: pointer;
        border-radius: 3px;
        display: inline-block;
    }

    input {
        border-radius: 3px;
        border: 1px solid silver;
    }
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {
-webkit-text-size-adjust:none;
}
    .loader5 {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/logo1.png') 50% 45% no-repeat rgba(255,255,255,.5);
   background-size: 40%;

}
    body::-webkit-scrollbar{
        width: 6px;

    }

    body::-webkit-scrollbar-thumb{
        background: var(--blue);
        border-radius: 50px;
    }
    body::-webkit-scrollbar-thumb-thumb:active{
     width: 20px;
    }
    body::-webkit-scrollbar-track {
    background: var(--fondo);
    border-radius: 20px;
}
    .foo{
        width: 100%;
        position: fixed;
        right: 0;
        bottom: 0;
        box-shadow: 0px 0px 5px var(--gris);
        border-radius: 10px 10px 0px 0px;
        display: none;
        }

    .foo img{
        width: 15%;
        float: left;

    }
    .foo p{
      display: inline-block;
        font-family: dancing script;
        font-weight: bolder;
        text-align: center;
        width: 40%;
        font-size: 15px;
        color: var(--gris);
        border-radius: 10px;
        float: left;

    }
    .foo h4{
        font-size: 12px;
        width: 30%;
        text-align: center;
        color: var(--gris);
        background: var(--fondo);
        border-radius: 5px;
        float: right;
    }
      #espacio{
        height: 60px;
        background: 0;
        margin-bottom: 5px;
    }
    .header{
        width: 100%;
        height: 55px;
        text-align: center;
        background: var(--vino);
        margin-bottom: 5px;
        position: fixed;
        z-index: 10000;
        top: 0;
    }
    .header .logo{

        background: var(--vino);
   background-image: url(../img/logo1.png);
    width: 20%;
    height: 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
        margin-top: 0px;
        margin-left: 40%;
    }

    input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}


       .login {
        width: 100%;
        height: 100%;
        background: grey;
        background: var(--vino);
    }

    .login .panel_izq {
        width: 100%;
        float: left;
        height: 40%;
        background: var(--vino);
        text-align: center;
    }
    .login .panel_izq img {
        height: auto;
        background: 0;
        height: 80%;
        margin-top: 10%;
        -webkit-box-shadow: 0px 0px 15px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 15px -1px rgba(0,0,0,0.75);
box-shadow: 0px 0px 15px -1px rgba(0,0,0,0.75);
        border-radius: 20px;
    }

    .login .panel_der {
        text-align: center;
        width: 100%;
        float: left;
        height: 60%;
        background: var(--vino);
        text-align: center;
        position: relative;
    }

    .login .panel_der form {
        width: 100%;
        text-align: center;
        margin: auto;
        background: 0;
        }

    .login .panel_der form h2 {
        color: white;
        font-size: 30px;
        background: 0;
        margin-bottom: 20px;
    }

    .login .panel_der form input {
        width: 90%;
        padding: 5px;
        text-align: center;
        font-size: 25px;
        margin-bottom: 10px;
        height: 60px;
        background: 0;
        border: 2px solid white;
        color: white;
        letter-spacing: 10px;
    }
    .login .panel_der form input::placeholder{
        color: silver;
    }
    .login .panel_der form input[type="radio"]:checked + label {
        background: var(--dorado);
        transition: .2s;
    }

    .login .panel_der form input[type="radio"] {
        display: none;
    }

    .login .panel_der form label {
        width: 42.5%;
        float: left;
        margin-left: 5%;
        background: silver;
        border-radius: 3px;
        padding: 3px;
        box-sizing: border-box;
        display: inline-block;
        margin-bottom: 5px;
        cursor: pointer;
        color: white;
        transition: .2s;
        max-width: 250px;
        font-size: 20px;
        padding-top: 18px;
        height: 60px;
    }

    .login .panel_der form .btningresar {
        background: var(--dorado);
        color: white;
        border: 0;
        width: 90%;
        height: 70px;
        padding: 10px;
        margin-top: 10px;
        position: absolute;
        left: 5%;
        z-index: 1;
    }
    .login .panel_der form .btningresar img{
        height: 100%;
        background: 0;
    }
    .login .derechos_autor_index{
        width: 100%;
        position: fixed;
        background: 0;
        height: 70px;
        bottom: 0;
        text-align: center;
        z-index: 0;
    }
    .login .derechos_autor_index img{
        height: 70%;
        background: 0;

    }
    .login .derechos_autor_index p{
        background: 0;
        font-size: 15px;
        color: white;
        height: 20px;
        position: fixed;
        bottom: 0;
        width: 100%;
    }

    #salir{
        display: inline-block;
        position: fixed;
        right: 5;
        top: 17px;
        font-size: 12px;
        transition: .2s;
        width: 23px;
        z-index: 99999;
        background: 0;
    }
    #salir:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #nomdep{
      display: inline-block;
        position: fixed;
        right: 5;
        top: 40px;
        font-size: 10px;
        transition: .2s;
        width: 50px;
        z-index: 99999;
        background: 0;
        color: white;
        text-align: right;
    }
    #confped, #confped1{
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 100000;
    background: rgba(0,0,0,.9);
    text-align: center;
    margin-left: -100%;
    }
    #confirped:checked ~ #confped{
        margin-left: 0%;
        transition: .1s;
    }
     #nconf{
        display: inline-block;
        width: 40%;
        height: 30px;
        background: var(--rojo);
        font-size: 23px;
        color: white;
        border-radius: 5px;
        cursor: pointer;
    }
    #confirped1:checked ~ #confped1{
        margin-left: 0%;
        transition: .1s;
    }
    #confped p, #confped1 p{
        color: white;
        background: 0;
        margin-top: 40%;
        margin-bottom: 10px;
        font-size: 30px;
        font-weight: normal;

    }
    #confped button, #confped1 button{
        width: 130px;
        height: 40px;
        border-radius: 3px;
        box-shadow: 0px 0px 5px black;
        background: var(--rojo);
        border: 0;
        color: white;
        font-size: 20px;
        transition: .2s;
        cursor: pointer;
        display: inline-block;
    }
    #confped a, #confped1 a{
        width: 90%;
        height: 60px;
        border-radius: 3px;
        box-shadow: 0px 0px 5px black;
        background: var(--verde);
        border: 0;
        color: white;
        font-size: 40px;
        display: inline-block;
        text-decoration: none;
        transition: .2s;
        box-sizing: border-box;
        padding: 5px;

        margin-bottom: 20px;
    }
    #confped a:hover, #confped button:hover, #confped1 a:hover, #confped1 button:hover{
        transform: scale(.8,.8);
        transition: .2s;
    }
     #cped #tped #td1 img{
        width: 20px;
    }
    #cped{
        width: 100%;
        text-align: center;
        margin: auto;
        box-shadow: 0px 0px 2px black;
        background: rgba(0,0,0,.9);
        display: none;
        position: fixed;
        z-index:100000;
        top: 0px;
        height: 100%;
        overflow: scroll;
    }
    #cped #ccped{
        float: right;
        width: 50px;
        background: var(--rojo);
        color: white;
        border: 0;
        height: 40px;
        margin-top: -40px;
        font-size: 30px;
    }
    #cped p{
        font-size: 30px;
        color:  var(--gris);
        background: var(--dorado);
        height: 40px;
    }
    #cped #tped{
        width: 100%;
        background: var(--dorado);
        border-collapse: collapse;
        text-align: center;
        font-size: 13px;
        margin: auto;

    }
    #cped #tped #nota{
        font-size: 12px;
    }
    #cped #tped td{

        background: white;
    }
    #cped #tped th{
        background: white;
        color: var(--vino);
        border-bottom: 1px solid var(--dorado);
    }
    #cped #tped #td1{
        border-bottom: 1px solid var(--dorado);
    }
    #cped #tped td a{
        display: inline-block;
        background: var(--rojo);
        color: white;
        width: 25px;
        height: 25px;
        font-size: 18px;
        text-decoration:none;
        margin-bottom: 5px;
    }
    #cped #tped #tot{
       font-size: 30px;
        color: var(--gris);
        background: var(--dorado);
    }

    #cconf #conf{
        bottom: 10px;
        width: 97%;
        padding: 3px;
        box-sizing: border-box;
        border: 0;
        border-radius: 3px;
        z-index: 9;
        background: var(--green);
        font-size: 28px;
        color: white;
        text-align: center;
        position: fixed;
        margin-left: 0px;
        height: 40px;
    }
    #cconf #ccped1{
        width: 20%;
        float: left;
        border: 0;
        color: white;
        background: var(--rojo);
        height: 70px;
        font-size: 30px;
    }
    #vverpedi{
      width: 100%;
        position: fixed;
        bottom: 0;
        background: white;
        height: 70px;
        text-align: center;
        box-shadow: 0px 0px 2px black;
    }
    #vverpedi #verpedi{
        width: 100%;
        margin-top: 0px;
        height: 70px;
        border-radius: 0px;
        background: var(--dorado);
        color: white;
        font-size: 30px;
        border: 0;

    }
    #tprod{
       width: 49%;
        margin: auto;
        text-align: center;
        font-size: 12px;
        border-collapse: collapse;
        margin-bottom: 5px;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        box-shadow: 0px 0px 5px grey;

    }
    #tprod th{
       background: var(--vino);
        color: white;
        font-weight: 100;
        height: 40px;
        padding: 2px;
    }
    #tprod td{
        width: 100%;
    }
    #tprod #des{
        font-size: 10px;

    }
    #tprod #nota{
        font-size: 12px;
    }
    #tprod #onota input{
        width: 100%;
        border: 0;
        font-size: 12px;
        height: 30px;
        text-align: center;

    }

    #tprod #can input{
        width: 100%;
        border: 1px solid var(--verde);
        font-size: 20px;
        height: 20px;
        text-align: center;
        background: white;
        height: 30px;
    }
    #tprod #ven input{
        width: 100%;
        border: 1px solid var(--verde);
        font-size: 20px;
        height: 20px;
        text-align: center;
        background: var(--verde);
        height: 30px;
        color: white;
    }
    #tprod #ven,  #tprod #can{
        width: 50%;

    }
    #tprod #nota input[type=checkbox]:checked + label{
       background: var(--rojo);
        color: white;
        transition: .2;
        border: 0;
        transition: .2s;
        transform: scale(.9,.9);
        display: inline-block;
        border-radius: 2px;

    }
    #tprod #nota input[type=checkbox]{
        display: none;
    }
    #tprod #nota{
        border-top: 1px solid var(--vino);
        font-size: 13px;
        height: 25px;
    }
    #tprod #nota label{
        border: 0;
        transition: .2s;
        background: var(--dorado);
        font-size: 12px;
    }
    #cpro{
        text-align: center;
         margin-bottom: 80px;
        height: auto;
        overflow: hidden;
    }
    #oper{
        position: fixed;
        width: 100%;
        top: 60px;
        height: 32px;
        background: var(--vino);
    }
    #cpro #bres, #cpro #bbar{
        width: 24%;
        margin-bottom: 5px;
        height: 30px;
        background: var(--dorado);
        color: white;
        border: 0;
        font-size: 10px;
        border-radius: 5px;
        float: left;
        margin-left: .5%;
        margin-right: .5%;

    }
    #cpro #bres:hover, #cpro #bbar:hover{
        background: var(--vino);
        color: white;
    }
    #cres p, #cbar p{
        font-size: 18px;
        color: var(--gris);
    }
    #buscar{
        width: 80%;
        position: fixed;
        top: 95px;
        right: 3px;
        border: 1px solid silver;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        display: none;
    }

    #volver{
        display: inline-block;
        width: 25px;
        position: fixed;
        top: 15px;
        left: 5px;
        transition: .2;
        z-index: 10000;
        background: 0;
        transition: .2s;
    }
    #volver img{
        width: 100%;
        background: 0;
    }
    #volver:hover{
        transform: scale(.9,.9);
        transition: .2;
    }
    #despedida{
        width: 100%;
        text-align: center;
        background: var(--vino);
        height: 100%;
    }
    #despedida #img{
        position: absolute;
        top: 30%;
        width: 90%;
        margin-left: 5%;
        left: 0;
        background: 0
    }
    #despedida #img1{
        width: 50%;
        background: 0;
    }
    #despedida p{
        font-family: dancing script;
        font-size: 30px;
        color: var(--dorado);
        background: 0;
        margin-bottom: 5px;
    }
    #despedida h2{
        font-size: 18px;
        color: white;
        background: 0;
        font-weight: 100;
    }
    .despcaja{
        position: absolute;
        left: 0;
        width: 100%;
        background: 0;
        bottom: 5px;
    }
    #tcom{
        width: 95%;
        text-align: center;
        border: 1px solid var(--dorado);
        margin: auto;
        border-collapse: collapse;
        margin-bottom: 10px;
    }
    #tcom td{
        border-top: 1px solid var(--dorado);
    }
    #tcom #comnot{
        border: 0;
    }
    #tcom a{
        display: inline-block;
        width: 48%;
        background: var(--amarillo);
        color: white;
        height: 35px;
        margin-top: 5px;
        margin-top: 5px;
        text-decoration: none;
        font-size: 25px;
        border-radius: 50px;
        transition: .2s;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
    }
    #tcom a:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

    #transfer{
       border-bottom: 1px solid silver;
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    #transfer select{
        width: 49%;
        text-align: center;
        text-align-last: center;
        font-size: 15px;
        background: white;
        border-radius: 3px;
        margin-top: 5px;
        margin-bottom: 5px;
        height: 35px;
        float: left;
        margin-left: .5%;
        border: 2px solid silver;
    }
    #transfer #btnlimall{
        width: 49%;
        text-align: center;
        text-align-last: center;
        font-size: 15px;
        background: white;
        border-radius: 3px;
        margin-top: 5px;
        margin-bottom: 5px;
        height: 35px;
        float: left;
        margin-left: .5%;
        border: 0;
        background: var(--rojo);
        color: white;
        padding: 8px;
        box-sizing: border-box;
        text-decoration: none;
    }
    .tabmenu h2{
        text-align: center;
        color: var(--vino);
    }
    .menu{
        width: 95%;
        margin: auto;
        text-align: center;
    }
    .menu a, .menu button{
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        float: left;
        background: var(--green);
        color: white;
        border-radius: 3px;
        font-size: 30px;
        margin-bottom: 10px;
        text-decoration: none;
        transition: .2s;
        height: 70px;
        border: 0;
        cursor: pointer;
        text-align: center;
        box-sizing: border-box;
        padding: 5px;

    }
    .tablero{
        display: none;
    }
    .menu a:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .menu a img, .menu button img{
        background: 0;
        width: 50px;
        margin-top: 0px;
        height: 55px;
        background: 0;
        float: left;
    }
    .menu p{
        font-size: 20px;
        color: var(--vino);
    }
    #status{
        width: 100%;
        margin: auto;
        text-align: center;
        height: 50px;
        overflow: hidden;
    }
    #status p{
        float: left;
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        background: var(--naranja);
        color: white;
        text-align: center;
        border-radius: 3px;
        font-size: 15px;
        margin-bottom: 5px;

    }
    .balance{
        width: 95%;
        text-align: center;
        margin: auto;
        height: auto;
        overflow: hidden;
    }
    .balance #bbot{
        height: auto;
        overflow: hidden;
    }
    .balance a{
        width: 32%;
        display: inline-block;
        float: left;
        background: var(--verde);
        color: white;
        text-decoration: none;
        margin-left: .5%;
        margin-right: .5%;
        font-size: 12px;
        margin-bottom: 5px;
        border-radius: 50px;
    }
    .balance a:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .balance #bal{
        width: 100%;
        overflow: hidden;
        height: auto;
    }
    .balance #bal #dato{
        background: white;
        width: 95%;
        margin: auto;
        color: var(--vino);
        border-radius: 50px;
        font-size: 13px;
        box-sizing: border-box;
        height: 20px;
        padding-top: 2px;
    }
    .balance #bal p{
        background: 0;
        font-size: 14px;
    }
    .balance #bal div{
        background: var(--vino);
        width: 48%;
        float: left;
        color: white;
        margin-left: 1%;
        margin-right: 1%;
        margin-bottom: 5px;
        border-radius: 5px;
        height: 40px;
    }
    .balance #bal #utilidad{
        width: 48%;
        background: var(--dorado);
    }
     .balance #bal #utilidad1{
        width: 99%;
        font-size: 25px;
        height: 80px;
         margin-top: 10px;
         background: var(--dorado);
         border: 0;
         margin-bottom: 10px;
    }
    .balance #bal #tit1{
        color: white;
        font-size: 25px;
        width: 100%;
        float: inherit;
        overflow: hidden;
        color: var(--vino);;
    }
    #cinv .tpro a, #cinv .tpro1 a{
        display: inline-block;
        width: 50px;
        height: 20px;
        margin-top: 2px;
        margin-bottom: 2px;
        border-radius: 50px;
        text-decoration: none;
        text-align: center;
        color: white;
        transition: .2s;
        font-size: 12px;
        float: right;
        margin-left: 5px;
        margin-right: 5px;
        font-weight: 100;
    }
    #cinv .tpro a:hover, #cinv .tpro1 a:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #cinv .tpro #imp{
        background: var(--verde);

    }
    #cinv .tpro #det, #cinv .tpro1 #det{
        background: var(--naranja);
        height: 18px;
    }
    #cinv .tpro #det1{
        background: var(--naranja);
        height: 18px;
        width: 20px;
    }
    #cinv .tpro #anu{
        background: var(--rojo);
        height: 16px;

    }

    #cinv .tpro #td2{
        background: white;
        color: var(--vino);
    }
    #fbven #ingfac, #fbven #inggasto{
        width: 95%;
        margin: auto;
        height: auto;
        border: 1px solid var(--vino);
        margin-bottom: 10px;
        display: none;
        overflow: hidden;
    }
    #fbven #ingfac input, #fbven #ingfac select, #fbven #inggasto input, #fbven #inggasto select{
        margin-top: 10px;
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        font-size: 12px;
    }
    #fbven #ingfac input[type=submit], #fbven #inggasto input[type=submit]{
        width: 50%;
        color: white;
        background: var(--vino);
        transition: .2s;
        font-size: 15px;
    }
    #fbven #ingfac input[type=submit]:hover, #fbven #bingb:hover, #fbven #inggasto input[type=submit]:hover, #fbven #bingg:hover, .balance #cbot1 input[type=submit]:hover{
        transform: scale(.9,.9);
        cursor: pointer;
        transition: .2s;
    }
    #fbven #bingb, #fbven #bingg{
        width: 70%;
        height: 30px;
        font-size: 20px;
        background: var(--verde);
        color: white;
        border-radius: 50px;
        margin-bottom: 5px;
        border: 0;
        transition: .2s;
    }
    .balance #cbot1{
        width: 100%;
        text-align: center;
        border-bottom: 1px solid grey;
        margin-bottom: 10px;
    }
    .balance #cbot1 input{
        width: 90%;
        height: 30px;
        border: 1px solid grey;
        text-align: center;
        text-align-last: center;
        cursor: pointer;
        margin-bottom: 5px;
    }
    .balance #cbot1 input[type=submit]{
        width: 30%;
        color: white;
        background: var(--verde);
        transition: .2s;
        border-radius: 50px;
        border: 0;
    }

    #fbven{
        width: 100%;
        text-align: center;
        height: auto;
        border-bottom: 1px solid grey;
       margin-bottom: 5px;
    }
    #fbven input, #fbven select{
        width: 49%;
        font-size: 15px;
        height: 30px;
        border: 1px solid grey;
        text-align: center;
        text-align-last: center;
        cursor: pointer;
        margin-bottom: 5px;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
    }
    #fbven input[type=submit]{
        width: 50%;
        background: var(--verde);
        height: 30px;
        border: 0;
        border-radius: 50px;
        float: inherit;
        transition: .2s;
    }
    #fbven input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #fbven p{
        font-size: 20px;
        color: var(--vino);
    }
    #fbven input[type=date]{
        width: 75%;
        float: inherit;
        text-align: center;
        text-align-last: center;
    }
    #fbven label{
        width: 24%;
        display: inline-block;
    }

    #cinv{
        width: 98%;
        text-align: center;
        margin: auto;
    }
    #cinv .tpro{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        border: 2px solid var(--vino);
        margin: auto;
        background: 0;
        font-size: 12px;
        margin-bottom: 10px;
    }
    #cinv .tpro th{
        background: var(--vino);
        color: white;
        font-size: 12px;
        font-weight: 100;
        text-align: center;
        box-sizing: border-box;

    }
    #cinv .tpro td{
        background: 0;

    }
    #cinv .tpro tr{
        border: 1px solid grey;
    }
    #cinv .tpro tr:hover{
        background-color: var(--dorado);
    }
    #cinv .tpro button{
        background: var(--amarillo);
        width: 100%;
        height: 25px;
        color: white;
        font-size: 10px;
        border: 0;
        border-radius: 5px;
        margin-top: 3px;
        margin-bottom: 3px;
        transition: .2s;
        cursor: pointer;
    }
    #cinv .tpro button:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #cinv .tpro #td11{
        font-size: 9px;
    }
    .balance #ccierr{
        width: 95%;
        margin: auto;
        margin-bottom: 10px;
    }
    .balance #ccierr label, .balance #base label{
        font-size: 20px;
        color: var(--vino);
    }
    .balance #ccierr input[type=date]{
        width: 95%;
        height: 40px;
        font-size: 20px;
        border: 1px solid var(--vino);
        margin-bottom: 10px;
    }
    .balance #ccierr input[type=submit]{
        width: 60%;
        height: 40px;
        font-size: 20px;
        background: var(--verde);
        color: white;
        border-radius: 50px;
        border: 0;
        transition: .2s;
        cursor: pointer;
    }
    .balance #ccierr input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

    .tpro #th2 form{
        background: 0;
    }
    .tpro #th2 form input[type=text]{
        height: 25px;
        width: 100%;
        float: left;
        border-radius: 5px;
        border: 0;
        padding-left: 5px;
        box-sizing: border-box;
        font-size: 12PX;
    }
    .tpro #th2 form input[type=submit]{
        border: 0;
        border-radius: 5px;
        color: white;
        float: left;
        width: 100%;
        font-size: 12px;
        transition: .2s;
        cursor: pointer;
    }
    .tpro #th2 form input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

       #ccat{
        width: 100%;
        height: auto;
        overflow: hidden;
        border-bottom: 1px solid grey;
    }
    #ccat p{
        font-size: 25px;
        color: var(--vino);
    }

    #fbven #vxp{
        display: inline-block;
        text-decoration: none;
        background: var(--verde);
        color: white;
        width: 50%;
        font-size: 18px;
        margin-bottom: 5px;
        border-radius: 50px;
        height: 25px;
        transition: .2s;
    }
    #fbven #vxp:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

    #cpro #nm{
    color: var(--vino);
    font-size: 20px;

    }
    #cconf #p{
        background: 0;
        color: 15px;
        color: var(--vino);
    }

    #fbven #cbotp #pbot{
        display: inline-block;
        width: 48%;
        background: var(--verde);
        margin-bottom: 5px;
        font-size: 20px;
        text-decoration: inherit;
        text-align: center;
        text-align-last: center;
        color: white;
        height: 30px;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        border: 0;
        border-radius: 50px;
        transition: .2s;
        cursor: pointer;
    }
    #fbven #cbotp #pbot option, #fbven #cbotp #pbot optgroup{
        background: white;
        color: var(--verde);
    }
    #fbven #cbotp #pbot:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #fbven #cbotp{
        width: 95%;
        text-align: center;
        height: auto;
        overflow: hidden;
        margin: auto;
    }
    .tpro td input, .tpro td select{
        width: 95%;
        text-align: center;
        height: 30px;
        border: 1px solid grey;
        margin: 2px;
        text-align-last: center;
        font-size: 12px;
    }
    .tpro td input[type=submit]{
        border-radius: 50px;
        color: white;
        background: var(--verde);
        border: 0;
        font-size: 20px;
        transition: .2s;
        cursor: pointer;
    }
    .tpro td input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

    #tcomanda{
       width: 98%;
        float: left;
        background: var(--vino);
        border-collapse: collapse;
        margin-left: .5%;
        margin-right: .5%;
        text-align: center;
        border: 2px solid var(--vino);
        margin-bottom: 5px;

    }
    #tcomanda th{
        background: var(--vino);
        color: white;
        font-weight: 100;
    }
    #tcomanda #td1{
        background: white;
        color: var(--vino);
        width: 10%;
    }
    #tcomanda td{
        border-bottom: 1px solid grey;
    }
    #tcomanda #td2{
    font-size: 13px;
    }
    #tcomanda td a{
        display: inline-block;
        text-decoration: none;
        background: var(--verde);
        width: 98%;
        height: 35px;
        color: white;
        font-size: 25px;
        transition: .2s;
        margin-top: 2px;
    }
    #tcomanda td a:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #tcomanda td a img{
        width: 25px;
        background: 0;
        margin-top: 5px;
    }
   #pregunta{
        width: 95%;
        background: white;
        margin: auto;
        margin-top: 5px;
        border-radius: 10px;
        box-shadow: 0px 5px 5px black;
    }
    #pregunta b{
        color: var(--verde);
        font-weight: 100;
        font-size: 22px;
        background: 0;
    }
    #pregunta input[type=number]{
        width: 25%;
        float: left;
        margin-left: 25%;
        height: 30px;
        font-size: 20px;
        text-align: center;
        border: 2px solid var(--verde);
        border-radius: 50px 0px 0px 50px;
        margin-top: 5px;
    }
    #pregunta input[type=submit]{
        width: 25%;
        float: left;
        height: 30px;
        font-size: 20px;
        text-align: center;
        border: 1px solid var(--verde);
        border-radius: 0px 50px 50px 0px;
        background: var(--verde);
        color: white;
        margin-bottom: 10px;
        margin-top: 5px;
    }
    #pregunta #cagrp{
        width: 30%;
        height: 25px;
        background: var(--rojo);
        color: white;
        border-radius: 50px;
        margin-bottom: 5px;
        border: 0;
    }
    #cinv .tpro1{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        border: 2px solid var(--vino);
        margin: auto;
        background: 0;
        font-size: 8px;
        margin-bottom: 10px;
    }
    #cinv .tpro1 th{
        background: var(--vino);
        color: white;
        font-size: 12px;
        font-weight: 100;
        text-align: center;
        box-sizing: border-box;

    }
    #cinv .tpro1 td{
        background: 0;

    }
    #cinv .tpro1 tr{
        border: 1px solid grey;
    }
    #cinv .tpro1 tr:hover{
        background-color: var(--dorado);
    }
    #cinv .tpro1 button{
        background: var(--amarillo);
        width: 100%;
        height: 25px;
        color: white;
        font-size: 10px;
        border: 0;
        border-radius: 5px;
        margin-top: 3px;
        margin-bottom: 3px;
        transition: .2s;
        cursor: pointer;
    }
    #cinv .tpro1 button:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #cinv .tpro1 #td11{
        font-size: 9px;
    }


    #pregunta{
        width: 95%;
        background: white;
        margin: auto;
        margin-top: 5px;
        border-radius: 10px;
        box-shadow: 0px 5px 5px black;
    }
    #pregunta b{
        color: var(--verde);
        font-weight: 100;
        font-size: 22px;
    }
    #pregunta input[type=number]{
        width: 25%;
        float: left;
        margin-left: 25%;
        height: 30px;
        font-size: 20px;
        text-align: center;
        border: 2px solid var(--verde);
        border-radius: 50px 0px 0px 50px;
        margin-top: 5px;
    }
    #pregunta input[type=submit]{
        width: 25%;
        float: left;
        height: 30px;
        font-size: 20px;
        text-align: center;
        border: 1px solid var(--verde);
        border-radius: 0px 50px 50px 0px;
        background: var(--verde);
        color: white;
        margin-bottom: 10px;
        margin-top: 5px;
    }
    #pregunta #cagrp{
        width: 30%;
        height: 25px;
        background: var(--rojo);
        color: white;
        border-radius: 50px;
        margin-bottom: 5px;
        border: 0;
    }
    .balance #base{
        height: 40px;
        width: 100%;
        float: left;
        
    }
    .balance #base input{
        height: 35px;
        width: 30%;
        text-align: center;
        font-size: 20px;
        border: 1px solid grey;
    }
    .balance #base input[type=submit]{
        background: var(--verde);
        color: white;
        border: 0;
        border-radius: 50px;
        cursor: pointer;
        transition: .2s;
    }
    .balance #base input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .balance #base a{
        width: 100%;
        float: right;
        height: 35px;
        box-sizing: border-box;
        padding-top: 4px;
        font-size: 6vw; 
    }
    .balance #tcuadre{
        width: 90%;
        margin: auto;
        text-align: center;
        border: 1px solid var(--vino);
        border-collapse: collapse;
    }
    .balance #tcuadre th{
        background: var(--vino);
        color: white;
        font-weight: 100;
    }
    .balance #tcuadre td{
        height: 100px;
        border: 1px solid var(--vino);
        font-size: 20px;
        width: 10.8%;
    }
    .balance #tcuadre td input{
        height: 35px;
        width: 90%;
        text-align: center;
        font-size: 20px;
        border: 1px solid grey;
    }
    .balance #billetes{
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    .balance #billetes #billcaja{
        width: 90%;
        margin: auto;
        text-align: center;
        border: 1px solid var(--dorado);
        border-collapse: collapse;
    }
    .balance #billetes #billcaja th{
        background: var(--dorado);
        font-weight: 100;
    }
    .balance #billetes #billcaja td{
        height: 50px;
        border: 1px solid var(--dorado);
    }
    .balance #billetes #billcaja td input{
        height: 30px;
        text-align: center;
        font-size: 15px;
        border: 1px solid grey;
        margin-top: 3px;
    }
    .balance #billetes #billcaja td textarea{
        resize: none;
        overflow: hidden;
        text-align: center;
        height: 20px;
        font-size: 15px;
        width: 70%;
        border: 0;
        margin-bottom: 0;
    }
    .balance #tcuadre textarea{
        width: 90%;
        text-align: center;
        resize: none;
        height: 50px;

    }
    .balance #tcuadre input[type=submit]{
        width: 20%;
        background: var(--verde);
        color: white;
        border-radius: 50px;
        font-size: 35px;
        border: 0;
        height: 50px;
        transition: .2s;
        cursor: pointer;
    }
    .balance #tcuadre input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .balance #tcuadre #spTotal{
        font-size: 20px;
        height: 30px;
        border: 0;
        margin-top: 5px;
        margin-bottom: -10px;

    }
     #volver2{
        display: inline-block;
        width: 20px;
        position: fixed;
        top: 15px;
        left: 45px;
        transition: .2;
        z-index: 10000;
        background: 0;
        transition: .2s;
    }
    #volver2 img{
        width: 20px;
        height: 28px;
        background: 0;
    }
    #volver2:hover{
        transform: scale(.9,.9);
        transition: .2;
    }
    .menu #cfac{
        width: 100%;
        border: 1px solid var(--verde);
        position: fixed;
        left: 0;
        top: 20%;
        display: none;
    }
    .menu #cfac input, .menu #cfac select{
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        border: 1px solid grey;
        height: 30px;
        margin-bottom: 2px;
        text-align: center;
        text-align-last: center;
    }
    .menu #cfac input[type=submit]{
        background: var(--verde);
        color: white;
        font-size: 20px;
        border: 0;
        transition: .2s;
        cursor: pointer;
    }
    .menu #cfac input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }

    .menu #cgas{
        width: 100%;
        border: 1px solid var(--verde);
        position: fixed;
        left: 0;
        top: 20%;
        display: none;
    }
    .menu #cgas input, .menu #cgas select{
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        border: 1px solid grey;
        height: 30px;
        margin-bottom: 2px;
        text-align: center;
        text-align-last: center;
    }
    .menu #cgas input[type=submit]{
        background: var(--verde);
        color: white;
        font-size: 20px;
        border: 0;
        transition: .2s;
        cursor: pointer;
    }
    .menu #cgas input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .balance #tcuadre1{
        width: 99%;
        margin: auto;
        text-align: center;
        border: 1px solid var(--vino);
        border-collapse: collapse;
        font-size: 15px;
    }
    .balance #tcuadre1 th{
        background: var(--vino);
        color: white;
        font-weight: 100;
    }
    .balance #tcuadre1 td{
        border: 1px solid var(--vino);
        font-size: 16px;
        background: 0;
    }
    .balance #tcuadre1 td input{
        height: 35px;
        width: 90%;
        text-align: center;
        font-size: 20px;
        border: 1px solid grey;
    }
    .balance #tcuadre1 tr:hover{
        background: var(--dorado);

    }
    .balance #tcuadre1 a{
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        margin-top: 5px;
    }
    .balance #tcuadre1 #eli{
        width: 50%;
        font-size: 20px;
        box-sizing: border-box;
        margin-left: 25%;
    }
    .balance #tcuadre1 #obser{
        font-size: 12px;
        width: 15%;
    }
    #verdom{
        display: inline-block;
        background: var(--verde);
        color: white;
        border-radius: 50px;
        width: 70%;
        text-decoration: none;
        font-size: 20px;
        margin-bottom: 10px;
    }
        #confped form{
        background: 0;

    }
    #confped form input, #confped form select{
        width: 95%;
        height: 50px;
        text-align: center;
        margin-bottom: 3px;
        border-radius: 3px;
        border: 1px solid black;
        background: white;
        text-align-last: center;
        font-size: 30px;
        padding: 5px;
        box-sizing: border-box;
    }
    #confped form input[type=submit]{
        background: var(--verde);
        font-size: 30px;
        color: white;
        border: 0;
        transition: .2s;
        cursor: pointer;
        height: 50px;
        margin-bottom: 10px;
    }
    #confped form input[type=submit]:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #eli{
        width: 80%;
        background: var(--rojo);
        color: white;
        font-size: 15px;
        border-radius: 50px;
        border: 0;
        cursor: pointer;
        transition: .2s;
        margin-bottom: 5px;
    }
    #eli:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
       #cconf #efepago{
        position: fixed;
        bottom: 70px;
        width: 48%;
        left: 1%;
        height: 40px;
        padding: 5px;
        box-sizing: border-box;
        background: 0;
        border: 0;
        border-radius: 3px;
        z-index: 9;
        background: var(--green);
        font-size: 23px;
        color: white;
        display: inline-block;
        text-decoration: none;
        text-align: center;
    }
    #cconf #efepago b{
        background: 0;
        width: 70%;
        display: inline-block;
        float: left;

    }
    #cconf #efepago img{
        width: 25%;
        background: 0;
        box-sizing: border-box;
        height: 100%;
    }
    #cconf #efepago:hover{
       transform: scale(.9,.9);
        transition: .2s;
    }
    #nom_m{
        text-align: center;
        font-size: 20px;
        color: var(--vino);
    }
    .configuracion{
        width: 100%;
        text-align: center;
    }
    .configuracion p{
        text-align: center;
        font-size: 20px;
        color: var(--vino);
    }
    .configuracion table{
        text-align: center;
        width: 100%;
        border-collapse: collapse;
        border: 1px solid var(--vino);
        margin: auto;
        margin-bottom: 30px;
    }
    .configuracion input, .configuracion select{
        width: 15%;
        text-align: center;
        height: 25px;
        margin-bottom: 2px;
        border: 1px solid grey;
        margin-bottom: 10px;
        text-align-last: center;
    }
    .configuracion table input, .configuracion table select{
        width: 90%;
        text-align: center;
        height: 25px;
        margin-bottom: 2px;
        border: 1px solid grey;
        text-align-last: center;
    }
    .configuracion input[type=submit]{
        background: var(--verde);
        color: white;
        border-radius: 50px;
        border: 0;
        transition: .2s;
        cursor: pointer;
    }
    .configuracion input[type=submit]:hover, .configuracion button:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .configuracion button{
        width: 12%;
        background: var(--dorado);
        color: var(--gris);
        border: 0;
        height: 30px;
        font-size: 18px;
        border-radius: 50px;
        margin-bottom: 5px;
        cursor: pointer;
        transition: .2s;
    }
    .configuracion #cusu, .configuracion #ingnusu, .configuracion #ingnmes, .configuracion #cmes, .configuracion #cped1, .configuracion #cpro1, .configuracion #ingnpro, .configuracion #ccat, .configuracion #ingncat{
        display: none;
    }
    .configuracion #prov{
        width: 40%;
    }
     .menu #cpro2{
       width: 100%;
        border: 1px solid var(--verde);
        position: fixed;
        left: 0;
        top: 20%;
        display: none;
    }
    .menu #cpro2 input, .menu #cpro2 select{
        width: 48%;
        float: left;
        border: 1px solid grey;
        height: 25px;
        text-align: center;
        text-align-last: center;
        margin-bottom: 2px;
        margin-left: .5%;
        margin-right: .5%;
        margin-top: 2px;
    }
    .menu #cpro2 input[type=submit]{
        background: var(--verde);
        color: white;
        border: 0;
        border-radius: 50px;
        font-size: 20px;
    }
    #footer{
        display: none;
    }
    #cpro .confcom{
       width: 100%;
        border: 1px solid var(--verde);
        font-size: 20px;
        height: 20px;
        text-align: center;
        background: var(--verde);
        height: 30px;
        color: white;
    }
    #cpro .confcom img{
        background: 0;
        width:30px;
    }

#cinv #liq{
   display:inline-block;
    width: 100px;
    background: var(--naranja);
    height: 100px;
    text-align: center;
    position: fixed;
    right: 10px;
    box-shadow: 0px 0px 3px black;
    bottom: 40px;
}
#cinv #liq img{
    background: 0;
    width: 60px;
    margin-top: 20px;
}
#cinv #gua{
    display:inline-block;
    width: 100px;
    background: var(--verde);
    height: 100px;
    text-align: center;
    position: fixed;
    left: 10px;
    box-shadow: 0px 0px 3px black;
    bottom: 40px;
    background-image:url(../img/icon10.svg);
    background-size: 90% 100%;
    background-repeat: no-repeat;
    border: 15px solid var(--verde);
}

#selmod{
    height: 30px;
    text-align: center;
    text-align-last: center;
    border: 1px solid var(--gris);
    width: 80%;
    float: right;
}

#gua1{
    width: 40px;
    height: 40px;
    border-radius: 50px;
    background: var(--verde);
    border: 5px solid var(--verde);
    background-image: url(../img/icon10.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    transition: .2s;
    float: left;
}
#gua1:hover{
    transform: scale(.9,.9);
    transition: .2s;
    cursor: pointer;
}
#devped{
    display: inline-block;
    height: 30px;
    margin-top: 10px;
    color: var(--grey);
    transition: .2s;
}
#devped:hover{
    transform: scale(.9,.9);
    transition: .2s;
    color: var(--naranja);
}
    #pregunta1{
        width: 48%;
        background: white;
        margin: auto;
        border-radius: 5px;
        box-shadow: 0px 0px 5px silver;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        margin-bottom: 5px;
        height: 80px;
        margin-top: 5px;
    }
    #pregunta1 p{
        color: black;
        font-weight: 100;
        font-size: 90%;
        background: 0;
        height: 50%;
    }
    #pregunta1 input[type=number]{
        width: 30%;
        float: left;
        height: 40px;
        font-size: 20px;
        text-align: center;
        border: 2px solid var(--verde);
        bottom: 0;
        border-radius: 0px 0px 0px 5px;

    }
    #pregunta1 .confcom{
        width: 70%;
        float: left;
        height: 50%;
        font-size: 20px;
        text-align: center;
        border: 1px solid var(--verde);
        background: var(--verde);
        color: white;
        cursor: pointer;
        border-radius: 0px 0px 5px 0px;
        transition: .3s;
    }
#pregunta1 .confcom:hover{
    background: var(--naranja);
    border: 1px solid var(--naranja);
    transition: .3s;
}
    #pregunta1 #cagrp{
        width: 30%;
        height: 25px;
        background: var(--rojo);
        color: white;
        border-radius: 50px;
        margin-bottom: 5px;
        border: 0;
    }
#pregunta1 .confcom img{
    width: 20%;
    background: 0;
}

#cajapreg{
    width: 100%;
    height: auto;
    overflow: hidden;
    background: 0;
    margin-bottom: 70px;
}
 #cped::-webkit-scrollbar{
        width: 5px;

    }

    #cped::-webkit-scrollbar-thumb{
        background: var(--gris);
        border-radius: 20px;
    }
    #cped::-webkit-scrollbar-thumb-thumb:active{
     width: 20px;
    }
    #cped::-webkit-scrollbar-track {
    background: #e8e7e7;
    border-radius: 10px;
}
  #preotros{
    border: 1px solid var(--gris);
    height: 30px;
    text-align: center;
}
   .login input[type=radio]:checked + label{

        transition: .2s;
        background: var(--dorado);

    }
.login label{
 width: 45%;
    display: inline-block;
    height: 40px;
    margin-bottom: 10px;
    font-size: 22px;
    border-radius: 5px;
    background: white;
    cursor: pointer;
    transition: .2s;
    box-sizing: border-box;
    padding-top: 5px;
}
.login label:hover{
    transition: .2s;

}
.login .depen2{
   display: none;
}

.menu #eve{
    background: 0;
        width: 30px;
        height: 30px;
        background: var(--rojo);
        display: inline-block;
        border-radius: 3px;
        margin-left: 20px;
}
    #cabtienda{
    width: 100%;
    height: 60px;
    background: var(--vino);
}
#cabtienda #img{
    background: var(--vino);
   background-image: url(../img/logo.svg);
    width: 100%;
    height: 60px;
    background-size: 100% 100%;
    background-repeat: no-repeat;

}
#espp{
    height: 150px;
}
#catt{
    width: 100%;
    background: var(--vino);
   position: fixed;
   top: 90px;


}
#catt a{
    display: inline-block;
    background: var(--amarillo);
    color: black;
    text-decoration: none;
    width: 33%;
    float: left;;
    transition: .2s;
    font-size: 12px;
    height: 18px;
    margin: 0;
    border-radius: 0;
    margin-left: .15%;
    margin-right: .15%;
    margin-top: 2px;
    margin-bottom: 1px;
}
#catt a:hover{
    transform: scale(.9,.9);
    transition: .2s;
    background: var(--dorado);
}
      .pedirperm{
        display: none;
    }
   .pedirperm h2{
        font-size: 15px;
        font-weight: 100;
    }
    .pedirperm input{
        width: 45%;
        height: 30px;
        padding: 5px;
        border: 1px solid grey;
        text-align: center;
        margin-bottom: 3px;
    }
    .pedirperm input[type=submit]{
        background: var(--rojo);
        color: white;
        border: 0;
    }

    .prod{
       width: 100%;
        text-align: center;
    }
    .prod .cajacatt{
        width: 100%;
        margin-bottom: 10px;

    }
    .prod .esp{
        height: 150px;
    }
    .prod1 .esp{
        height: 150px;
    }
    .catt{
        width: 100%;
    }
    .catt #cattsel1{
        width: 46%;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        position: fixed;
        top: 60px;
        left: 2%;
        border: 1px solid silver;
        background: silver;
        color: white;
    }
    .catt #cattsel2{
        width: 46%;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        position: fixed;
        top: 60px;
        right: 2%;
        border: 1px solid silver;
        background: silver;
        color: white;
    }
    .catt #cattsel3{
        width: 46%;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        position: fixed;
        top: 105px;
        left: 2%;
        border: 1px solid silver;
        background: silver;
        color: white;
    }

    .catt #cattsel4{
        width: 46%;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        position: fixed;
        top: 105px;
        right: 2%;
        border: 1px solid silver;
        background: silver;
        color: white;
    }
    .cajacatt h1{
        font-size: 25px;
        color: var(--vino);
    }
    .formprod{
        width: 98%;
        text-align: center;
        border: 2px solid var(--vino);
        margin: auto;
        margin-bottom: 5px;
        padding: 3px;
        box-sizing: border-box;
        border-radius: 3px;
    }
    .formprod h2{
        font-size: 15px;
        color: var(--vino);
    }
    .formprod input[type=radio]{
        display: none;
    }

    .formprod input[type=radio]:checked + label{
        background: var(--dorado);
        color: white;
        box-sizing: border-box;
        transition: .2s;
    }
    .formprod label{
        float: left;
        width: 49%;
        margin-left: .5%;
        margin-right: .5%;
        padding: 2px;
        box-sizing: border-box;
        transition: .2s;
    }
    .formprod .inputnot3{
        width: 99%;
        border: 1px solid silver;
        padding: 5px;
        margin-top: 2px;
        margin-bottom: 5px;
        border-radius: 2px;
    }
    .formprod .notass{
        border-top: 1px dashed silver;
    }
        .formprod .notass .selectnot{
        width: 100%;
        border-radius: 3px;
        height: 35px;
        margin-top: 2px;
        margin-bottom: 3px;
    }
    .formprod .notass .not3{
        width: 100%;
        margin top: 5px;
        margin-bottom: 3px;
        height: 35px;
        padding-left: 5px;
        box-sizing: border-box;
        border: 1px solid silver;
    }
    .formprod button{
        background: var(--verde);
        border: 0;
        border-radius: 3px;
        box-sizing: border-box;
        padding: 8px;
        height: 40px;
        float: left;
    }
        .formprod .notass .labelnot{
        display: inline-block;
        width: 48%;
        background: var(--amarillo);
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        border-radius: 3px;
        height: 25px;
        margin-bottom: 3px;
    }
    .formprod button:active{
        background: var(--naranja);
    }
    .formprod button img{
        width: 100%;
        background: 0;
    }
    .formprod .btnvender{
        width: 49.5%;
        float: right;
       background: var(--verde);
        margin-right: .5%;
    }
    .formprod .btnvender img{
        width: 40px;

    }
    .btnscant .btnmm{
       width: 14%;
        margin-left: .5%;
        background: var(--azul);
    }
    .formprod .inputcant{
        width: 18.5%;
        border: 1px solid silver;
        height: 40px;
        float: left;
        margin-left: 1%;
        margin-right: .5%;
        text-align: center;
        font-size: 20px;
        border-radius: 3px;
    }
    .btnscant .btnmm img{
       height: 90%;
        width: 90%;
    }
    .btnscant{
        overflow: hidden;

    }
    .btnverp{
        position: fixed;
        bottom: 10px;
        width: 95%;
        left: 2.5%;
        height: 40px;
        padding: 3px;
        box-sizing: border-box;
        background: var(--dorado);
        border: 0;
        font-size: 28px;
        border-radius: 3px;
        color: white;
        text-align: center;
    }

    .dettped{
        position: fixed;
        top: 65px;
        width: 98%;
        left: 1%;
        border: 1px solid silver;
        border-radius: 3px;
        box-shadow: 0px 0px 5px grey;
        height: 80%;
        padding: 2px;
        box-sizing: border-box;
        overflow-y: auto;
        margin-left: -100%;
         z-index: 99;
        transition: .1s;
    }
    .dettped .tblped{
        width: 100%;
        text-align: left;
        font-size: 13px;
        border-collapse: collapse;
    }
    .dettped .tblped .comped{
        color: grey;
        border-bottom: 1px solid grey;
    }
    .dettped .tblped #tcen{
    text-align: center;
    }
    .dettped .tblped #tder{
    text-align: right;
    }
    .titped th{
        text-align: center;
        background: var(--vino);
        color: white;
        border-radius: 5px;
        height: 30px;
    }
    .titped th button{
        width: 100%;
        border: 0;
        background: var(--rojo);
        color: white;
        border-radius: 5px;
        height: 30px;
    }
    .dettped .tblped #tdimg{
        text-align: right;
    }
    .dettped .tblped img{
        width: 25px;
        background: 0;
        margin-bottom: 1px;
    }
    .dettped .tblped #tdimg button{
        background: 0;
        border: 0;
    }
      #salir img{
       width: 100%;
        background: 0;
    }
    #nomusu{
        position: fixed;
        top: 1px;
        z-index: 99999;
        background: 0;
        color: white;
        right: 5px;
        font-size: 12px;
    }
    #recordatorio{
        width: 95%;
        height: 80%;
        position: fixed;
        top: 60px;
        background: var(--rojo);
        margin-left: 100%;
        border-radius: 5px;
        box-shadow: 0px 0px 5px 0px ;
        padding: 10px;
        box-sizing: border-box;
        z-index: 9999999;
    }
    #recordatorio img{
        background: 0;
        width: 40%;
        margin-left: 30%;
        margin-bottom: 20px;
        margin-top: 20px;
    }
      #recordatorio p{
        background: 0;
        color: white;
        font-size: 47px;
        text-align: center;
    }
     #recordatorio2{
        width: 90%;
        height: 40%;
        position: absolute;
        background: var(--verde);
        z-index: 99;
        border-radius: 5px;
        box-shadow: 0px 0px 5px 0px;
        left: 5%;
        top: 30%;
    }
    #recordatorio2 h3{
       background: 0;
        color: white;
        text-align: center;
        font-weight: 100;
        font-size: 25px;
    }
    #recordatorio2 img{
        width: 40%;
        background: 0;
        margin-top: 45px;
    }
     #mostrarped, #confirped, #confirped1{
       display: none;
    }

    #mostrarped:checked ~ .dettped{
        position: fixed;
        top: 65px;
        width: 98%;
        left: 1%;
        border: 1px solid silver;
        border-radius: 3px;
        box-shadow: 0px 0px 5px grey;
        height: 80%;
        padding: 2px;
        box-sizing: border-box;
        overflow-y: auto;
        margin-left: 0%;
         z-index: 99;
        transition: .1s;
    }
    #labelconf{
    width: 100%;
    position: absolute;
    bottom: 0px;
    z-index: 0;
    height: 40px;
    background: 0;
    left: 0%;
    z-index: 9;

    }
    #cconf #conf:hover, #cconf #conf1:hover{
        cursor: pointer;
    }
    .dettped #cerrpedd{
        color: white;
        background: var(--rojo);
        width: 100%;
        display: inline-block;
        height: 100%;
        border-radius: 5px;
        box-sizing: border-box;
        padding-top: 6px;
        cursor: pointer;
    }
     .dettped1{
        position: fixed;
        top: 65px;
        width: 30%;
        left: 2px;
        border: 1px solid silver;
        border-radius: 3px;
        box-shadow: 0px 0px 5px grey;
        height: 70%;
        padding: 2px;
        box-sizing: border-box;
        overflow-y: auto;
        z-index: 99;
        margin-left: -100%;
        transition: .2s;
    }
    #mostrarped:checked ~ .dettped1{
        position: fixed;
        top: 65px;
        width: 98%;
        left: 2px;
        border: 1px solid silver;
        border-radius: 3px;
        box-shadow: 0px 0px 5px grey;
        height: 70%;
        padding: 2px;
        box-sizing: border-box;
        overflow-y: auto;
        z-index: 99;
        margin-left: 0%;
        transition: .2s;
    }
    .dettped1::-webkit-scrollbar{
        width: 6px;

    }
    .dettped1::-webkit-scrollbar-thumb{
        background: var(--vino);
        border-radius: 3px;
    }
    .dettped1::-webkit-scrollbar-thumb-thumb:active{
     width: 20px;
    }
    .dettped1::-webkit-scrollbar-track {
    background: var(--fondo);
    border-radius: 3px;
}
    .dettped1 .tblped{
        width: 100%;
        text-align: left;
        font-size: 13px;
        border-collapse: collapse;
    }
    .dettped1 .tblped .comped{
        color: grey;
        border-bottom: 1px solid grey;
    }
    .dettped1 .tblped #tcen{
    text-align: center;
    }
    .dettped1 .tblped #tder{
    text-align: right;
    }
    .dettped1 #cerrpedd{
        color: white;
        background: var(--rojo);
        width: 100%;
        display: inline-block;
        height: 100%;
        border-radius: 5px;
        box-sizing: border-box;
        padding-top: 6px;
        cursor: pointer;
    }
    .dettped1 .tblped #tdimg{
        text-align: center;
        width: 26px;

    }
    .dettped1 .tblped img{
        width: 25px;
        background: 0;
        margin-bottom: 1px;

    }
    .dettped1 .tblped img:hover{
        cursor: pointer;
    }
    .dettped1 .tblped #tdimg button{
        background: 0;
        border: 0;
    }
    #cattres, #cattbar, #cattpopsy, #cattcoffe{
        position: fixed;
        top: 55px;
        width: 100%;
        background: white;
        border-radius: 0px;
        height: auto;
        transform: .1s;

    }
    #categ:checked ~ #cattres{
         top: 57px;
        transform: .1s;
    }
    #categ1:checked ~ #cattbar{
         top: 57px;
        transform: .1s;
    }
    #categ2:checked ~ #cattpopsy{
         top: 57px;
        transform: .1s;
    }
    #categ3:checked ~ #cattcoffe{
        top: 57px;
        transform: .1s;
    }
    #categ, #categ1, #categ2, #categ3{
        display: none;
    }
    #cattres a, #cattbar a, #cattpopsy a, #cattcoffe a{
        display: inline-block;
        width: 24%;
        background: var(--naranja);
        margin-left: .5%;
        margin-right: .5%;
        margin-bottom: 1px;
        height: 30px;
        text-decoration: none;
        text-align: center;
        border-radius: 2px;
        margin-top: 1px;
        box-sizing: border-box;
        font-size: 3.5vw;
        color: white;
        transition: .2s;
        float: left;
        line-height: 2.5;
    }
    #cattres a:hover, #cattbar a:hover, #cattpopsy a:hover, #cattcoffe a:hover{
        background: var(--vino);
        color: white;
        transition: .2s;
    }

    .btnverp1{
        position: fixed;
        bottom: 5px;
        width: 98%;
        height: 60px;
        box-sizing: border-box;
        background: var(--rojo);
        border: 0;
        font-size: 30px;
        border-radius: 3px;
        color: white;
        text-align: center;
        cursor: pointer;
        left: 1%;
    }

    .btnverp1 img{
        background: 0;
        width: 20%;
        height: 80px;
        margin-top: 0px;
        float: left;
        background: #DE0F0F;
        height: 100%;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 0px 5px 5px 0px;
    }
    .btnverp1 b{
        background: 0;
        font-size: 20px;
        width: 80%;
        display: inline-block;
        float: left;
        margin-top: 5px;
    }
    #conf2, #conf1{
        width: 98.5%;
        position: fixed;
        background: #4CAB63;
        box-sizing: border-box;
        border-radius: 3px;
        bottom: 5px;
        height: 60px;
        cursor: pointer;

    }
    #conf2 b{
        background: 0;
        color: white;
        font-size: 25px;
        width: 50%;
        display: inline-block;
        text-align: center;
        margin-right: 5%;
        float: left;
        height: 100%;
        margin-top: 0px;
        margin-left: 5%;
    }
    #conf1 b{
        background: 0;
        color: white;
        font-size: 25px;
        width: 50%;
        display: inline-block;
        text-align: center;
        margin-right: 5%;
        float: left;
        height: 100%;
        margin-top: 14px;
        margin-left: 5%;
    }
    #conf2 img, #conf1 img{
        width: 40%;
        background: 0;
        margin-top: 0px;
        background: #39804A;
        padding: 5px 0px 0px 0px;
        box-sizing: border-box;
        float: left;
        height: 100%;
        border-radius: 0px 5px 5px 0px;
    }
    .catt1{
     width: 99%;
        float: left;
        height: 80px;
        position:fixed;
        bottom: 0px;
        background: white;
        margin-left: .5%;
    }
    .catt1 div{
        width: 24%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 70px;
        float: left;
        background: white;
    }
    .catt1 img{
        width: 100%;
        height: 100%;
        border-radius: 3px;
        background: 0;
        margin-top: 5px;
    }
    .catt1 button{
        height: 100%;
        border: 0;
        width: 100%;
        cursor: pointer;
       background: 0;
    }
    .catt1 button p{
        height: 100%;
        color: white;
        font-size: 12px;
        background: 0;
        cursor: pointer;
        transition: .2s;
        line-height: 6;
        margin-top: -70px;

    }
    .catt1 button p:hover{
        transform: scale(1.2,1.2);
        transition: .2s;

    }
    .prod1{
        width: 100%;
        float: right;
        text-align: center;
    }
    .prod1 .imgprod{
        width: 99%;
        border-radius: 3px;
        margin-bottom: 5px;
    }

        .prod1 #carac{
        width: 100%;
        text-align: center;
        overflow: hidden;
    }
    .prod1 #carac label{
        width: 100%;
        margin-left: 0%;
        margin-right: 0%;
        float: left;
        background: grey;
        display: inline-block;
        color: white;
        border-radius: 3px;
        font-size: 12px;
        margin-bottom: 3px;
        padding: 5px 0px 5px 0px;
    }
    .prod1 #carac input[type="radio"]{
        display: none;
    }
    .prod1 #carac input[type="radio"]:checked + label{
        background: var(--verde);
    }
    #confir{
        width: 95%;
        height: 50%;
        background: var(--green);
        position: fixed;
        top: 25%;
        border-radius: 5px;
        left: 0;
        display: none;
        z-index: 999;
        margin-left: 2.5%;
    }
    #confir img{
        background: 0;
        width: 80%;
        height: 80%;
        padding: 25% 10% 10% 10%;
    }
    #carac input[type="number"]{
        width: 98%;
        border: 1px solid silver;
        padding: 3px;
        text-align: center;
    }
        .tiempocom img{
        width: 25px;
        background: 0;
        margin-bottom: -5px;
    }
    .tiempocom td{
        font-size: 20px;
        padding: 3px;
    }
    .tiempocom {
        height: 30px;
    }
    .moduhor .panel_btn{
        width: 100%;
        float: left;
        height: auto;
        padding: 5px;
        box-sizing: border-box;
    }
    .moduhor .pedd{
        width: 100%;
        float: left;
        text-align: center;
        border-left: 1px solid silver;
        height: 100%;
        overflow: auto;
        padding: 5px;
        box-sizing: border-box;
        z-index: 999999;
        display: none;
        position: absolute;
        top: 0%;
    }
    .moduhor .panel_btn .labelcat{
        width: 24%;
        float: left;
        background: var(--vino);
        display: inline-block;
        color: white;
        padding: 3px;
        text-align: center;
        box-sizing: border-box;
        margin-left: .5%;
        margin-right: .5%;
        border-radius: 3px;
        cursor: pointer;
        transition: .2s;
        height: 50px;
        font-size: 15px;
        border: 0;
    }

    .moduhor .panel_btn .labelcat:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .moduhor .panel_btn input[type="radio"]:checked + button{
        background: var(--dorado);
        color: black;
    }
    .moduhor .panel_btn .cajaprod{
        width: 100%;
        float: left;
        height: auto;
        box-sizing: border-box;
        position: absolute;
        top: 150px;
        left: 0;
        padding: 5px;
        border-top: 1px solid silver;
    }
    .moduhor .panel_btn .cajaprod .btnventa{
        width: 24%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 70px;
        border: 0;
        background: var(--azul);
        color: white;
        margin-bottom: 5px;
        border-radius: 3px;
    }
    .moduhor .panel_btn .cajaprod .btnventa p, .moduhor .panel_btn .cajaprod .btnventa h4{
        background: 0;
        font-size: 12px;
    }
    .moduhor .pedd table{
        width: 100%;
        text-align: center;
        border-collapse: collapse;

    }
    .moduhor .pedd .tableped{
        height: 85%;
        overflow: auto;
    }
    .moduhor .pedd table td{
        border-bottom: 1px solid silver;
        padding: 3px;
    }
    .moduhor .pedd h3{
        color: var(--vino);
        font-size: 25px;
    }
    .moduhor .pedd table th{
        color: var(--vino);
        font-size: 18px;
    }
    .moduhor .pedd .pedfp{
        width: 100%;
    }
    .moduhor .pedd .pedfp img{
        width: 100%;
        height: auto;
        background: 0;
    }
    .moduhor .pedd .pedfp label{
        width: 14%;
        float: left;
        height: auto;
        padding: 5px;
        box-sizing: border-box;
        display: inline-block;
        border-radius: 3px;
        margin-left: .5%;
        margin-right: .5%;
        cursor: pointer;
        margin-bottom: 5px;
    }
    .moduhor .pedd .pedfp h4{
        width: 100%;
    }
    .moduhor .pedd .pedfp input[type="radio"]{
        display: none;
    }
    .moduhor .pedd .pedfp input[type="radio"]:checked + label{
        background: var(--amarillo);
    }
    .moduhor .pedd .pagoped label #h4{
        width: 30%;
        float:left;
        margin: 0;
        overflow: hidden;
    }
    .moduhor .pedd .pagoped #paga, .moduhor .pedd .pagoped #vueltas{
        width: 69%;
        float: left;
        padding: 3px;
        box-sizing: border-box;
        margin-bottom: 5px;
        font-size: 20px;
        font-weight:600;
        text-align: center;

    }
    .moduhor .pedd .pagoped #btnpago{
        width: 98%;
        padding: 5px;
        border: 0;
        font-size: 30px;
        background: var(--verde);
        color: white;
        height: 50px;
        position: absolute;
        bottom: 5px;
        right: 1%;
        border-radius: 3px;
    }
    .moduhor .pedd .pagoped #btnpago img{
        background: 0;
        width: 40px;
        margin-top: 0px;
        margin-bottom: -8px;
        margin-left: 10px;
    }
    .moduhor .pedd table #a{
        width: 50%;
    }
    .moduhor .pedd table #b{
        width: 20%;
    }
    .moduhor .pedd table #c{
        width: 30px;
    }
    .moduhor .pedd table td a{
        width: 20px;
        padding: 1px;
        box-sizing: border-box;
        display: inline-block;
    }
    .moduhor .pedd table td img{
        width: 20px;
    }
    .moduhor .pedd .pagoped #numaprov{
        margin: 0;
        width: 98%;
        padding: 3px;
        font-size: 20px;
        height: auto;
        margin-left: 1%;
    }

    .agua img{
        display: none;

    }
    .pedd .modcanped input{
        text-align: center;
        width: 100%;
        padding: 3px;
        box-sizing: border-box;
    }
    .labpedd{
        position: absolute;
        bottom: 5px;
        width: 98%;
        height: 50px;
        background: var(--verde);
        left: 1%;
        text-align: center;
        font-size: 30px;
        color: white;
        padding-top: 7px;
        box-sizing: border-box;
        border-radius: 3px;
    }
    #sectionped #mospedd{
     display: none;
    }
    #mospedd:checked ~ .pedd{
        display: block;
    }
    .pedd #cerrpedd{
        background: var(--rojo);
        width: 40px;
        display: inline-block;
        color: white;
        border-radius: 3px;
        position: absolute;
        top: 10px;
        left: 5px;
    }

    .pedd #confpedlab{
        display: inline-block;
        position: absolute;
        bottom: 5px;
        background: var(--verde);
        color: white;
        width: 98%;
        right: 1%;
        height: 60px;
        font-size: 30px;
        border-radius: 3px;
        padding-top: 10px;
        box-sizing: border-box;
        cursor: pointer;

    }
    .pedd .confpedcaja{
        position: absolute;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,.9);
        top: 0;
        left: 0;
    }
    .pedd .confpedcaja h3{
        height: 10%;
        background: 0;
        margin-top: 35%;
        font-size: 30px;
        color: white;
        font-weight: 100;
    }
    .pedd .confpedcaja a{
        width: 40%;
        float: left;
        margin-left: 30%;
        height: 80px;
        color: white;
        background: var(--verde);
        font-size: 50px;
        text-decoration: none;
        box-sizing: border-box;
        padding-top: 8px;
        margin-bottom: 20px;
    }
    .pedd .confpedcaja label{
        width: 20%;
        float: left;
        margin-left: 40%;
        height: 70px;
        color: white;
        background: var(--rojo);
        font-size: 40px;
        text-decoration: none;
        box-sizing: border-box;
        padding-top: 8px;
        border-radius: 3px;
        transition: .2s;
        cursor: pointer;
    }
    .pedd .confpedcaja label:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
        .nombre_mesa{
        position: fixed;
        top: 18px;
        z-index: 9999999;
        background: 0;
        width: 20%;
        height: 40px;
        left: 10%;
        font-size: 15px;
        text-align: center;
        color: white;
    }
    .nombre_mesa p{
        background: 0;
    }
        .alertfec{
        position: fixed;
        width: 100%;
        height: 100%;
        background: var(--vino);
        text-align: center;
        font-size: 40px;
        top: 0;
        left: 0;
        z-index: 999999;
    }
    .alertfec h2{
        background: 0;
        color: white;
        line-height: 1;
    }
    .alertfec img{
        width: 90%;
        height: 50%;
        margin-top:  5%;
        background: 0;
    }
    #panel_pagos {
        width: 98%;
        float: left;
        border-radius: 5px;
        border: 1px solid grey;
        padding: 5px;
        box-sizing: border-box;
        margin-left: 1%;
        height: auto;
    }

    #panel_pagos table {
        width: 100%;
        background: 0;
        text-align: left;
        font-size: 14px;
    }

    #panel_pagos #datosped {
        background: 0;
        border-radius: 20px;
        border-bottom: 1px dashed silver;
        margin-bottom: 5px;

    }

    #panel_pagos form {
        background: 0;
    }

    #panel_pagos form img {
        width: 50px;
        height: 50px;
        background: 0;
    }

    #panel_pagos form input[type=radio] {
        display: none;
    }

    #panel_pagos form input[type=radio]:checked + label img {
        background: var(--rojo);
        box-sizing: border-box;
        border-radius: 5px;
        transition: .2s;
    }

    #panel_pagos form label img:hover {
        cursor: pointer;
        transform: scale(.9, .9);
        transition: .2s;
    }

    #panel_pagos form label img {
        transition: .2s;
        padding: 5;
        box-sizing: border-box;
    }

    #panel_pagos form #f_p,#panel_pagos form #f_pex{
        width: 100%;
        overflow: hidden;
        height: auto;
        margin-bottom: 10px;
    }
    #panel_pagos form #f_p label,#panel_pagos form #f_pex label{
        display: inline-block;
        width: 19%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        text-align: center;
        font-size: 3.5vw;
        font-weight: 600;
    }
    #panel_pagos form #f_pex img {
        width: 40px;
        height: 40px;
        background: 0;
    }
    #panel_pagos form #f_pex input[type=radio]:checked + label img {
        background: var(--verde);
        box-sizing: border-box;
        border-radius: 5px;
        transition: .2s;
    }

    #panel_pagos form input[type=number],
    #panel_pagos form select {
        width: 95%;
        margin: 0px 0px 2px 0px;
        margin-left: 2.5%;
        border: 1px solid silver;
        padding: 2px;
        font-size: 18px;
        border-radius: 3px;

    }

    #panel_pagos p {
        font-size: 18px;
        text-align: left;
        margin: 2px 0px 2px 0px;
        text-align: center;
    }

    #panel_pagos form button {
        width: 95%;
        background: var(--verde);
        border: 0;
        border-radius: 3px;
        margin-left: 2.5%;
        color: white;
        font-size: 25px;
        padding: 5px;
        box-sizing: border-box;
        height: 40px;
        transition: .2s;
    }

    #panel_pagos form button img {
        width: 40px;
        height: 30px;
        background: 0;
        float: right;
        margin-right: 50px;
        margin-left: -50px;

    }

    #panel_pagos form button:hover {
        transform: scale(.95, .95);
        transition: .2s;
        cursor: pointer;
    }

    #panel_pagos #bajpag, #panel_pagos #bajprop {
        width: 10%;
        float: left;
        padding: 3px;
        margin: auto;
        height: 30px;
        margin-left: 1%;
        background: var(--verde);
    }
    #panel_pagos #prop{
        width: 85%;
        float: left;
    }
    #panel_pagos #bajpag img {
        width: 100%;
        margin: auto;
    }

    #panel_pagos #totp {
        width: 84%;
        float: left;
    }

    #panel_prod {
        width: 98%;
        height: auto;
        float: left;
        margin-left: 1%;
        border-radius: 5px;
        border: 1px solid grey;
        box-sizing: border-box;
        padding: 3px;
    }

    #panel_prod section {
        width: 100%;
        height: auto;
        float: left;
        background: 0;
        margin-left: 0%;
        margin-right: 0%;
        overflow-y: auto;
        margin-bottom: .5%;
        border: 1px solid silver;
        box-sizing: border-box;
        border-radius: 5px;
    }

    #panel_prod section table {
        text-align: center;
        width: 100%;
        border-collapse: collapse;
        background: 0;
        font-size: 13px;
    }

    #panel_prod section table td,
    #panel_prod section table th {
        background: 0;
        padding: 2px;
    }

    #panel_prod section table td {
        border-bottom: 1px solid silver;

    }

    #efep {
        text-align: center;
        font-size: 20px;
        color: var(--vino);
        margin-bottom: 5px;
    }

    #panel_prod #dep1 #tit {
        background: var(--vino);
        color: white;
    }

    #panel_prod #dep2 #tit {
        background: var(--dorado);
        color: white;
    }

    #panel_prod #dep4 #tit {
        background: #574A23;
        color: white;
    }

    #panel_prod #dep5 #tit {
        background: #FF2869;
        color: white;
    }

    #panel_prod input[type=checkbox] {
        cursor: pointer;
        transform: scale(1.4, 1.4);

    }

    #panel_prod #calcu {
        width: 100%;
        overflow: hidden;
    }

    #panel_prod #calcu input {
        border: 1px solid silver;
        height: 35px;
        border-radius: 5px;
        text-align: center;
        font-size: 20px;
    }

    #panel_prod #calcu div {
        width: 49%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        background: var(--verde);
        border-radius: 5px;
        padding: 2px;
        box-sizing: border-box;
        height: 35px;
    }

    #panel_prod #calcu #a p,
    #panel_prod #calcu #b p {
        font-size: 23px;
        width: 50%;
        float: left;
        height: 30px;
        background: 0;
        color: white;
        margin-left: 1%;
        text-align: center;
    }

    #panel_prod #calcu #b input {
        width: 15%;
        height: 30px;
        border: 0;
    }

    #panel_prod #calcu #a input {
        width: 45%;
        height: 30px;
        border: 0;
        margin-top: 1px;
        background: 0;
        color: white;

    }

    #panel_prod #calcu #b #division {
        width: 30%;
        background: 0;
        color: white;
    }
    .btnasicuenta{
        display: none;
    }
        #mosmail {
        background: var(--verde);
        color: white;
        border-radius: 3px;
        width: 12%;
        display: inline-block;
        margin-left: 2.5%;
        text-align: center;
        padding: 2px;
        box-sizing: border-box;
        float: left;
        margin-bottom: 5px;
        height: 30px;
    }

    #mosmail #img {
        width: 30px;
        height: 25px;
        background: 0;
        padding: 0;
    }

    #email {
        background: 0;
        border-radius: 3px;
        width: 82%;
        margin-left: 1%;
        text-align: center;
        padding: 2px;
        box-sizing: border-box;
        transition: .2s;
        border: 1px solid silver;
        transition: .2s;
        float: left;
        height: 30px;
        font-size: 15px;
    }
    #numaprov,
    #numaprov2 {
        width: 95%;
        margin-left: 2.5%;
        height: 20px;
        padding: 2px;
        border: 1px solid silver;
        border-radius: 2px;
        margin-bottom: 2px;
        display: none;
    }
        .impuestos{
        width: 100%;
        text-align: center;
        float: left;
        margin-bottom: 5px;

    }
    .impuestos input[type="checkbox"]{
        display: none;
    }
    .impuestos input[type="checkbox"]:checked + label{
        background: var(--naranja);
        color: white;
        padding: 3px;
        box-sizing: border-box;
        border-radius: 3px;
        margin-bottom: 5px;
        float: left;
        width: 50%;
        margin-left: 25%;
        cursor: pointer;
        border: 0;
    }
    .impuestos label{
        border: 1px solid silver;
        padding: 3px;
        box-sizing: border-box;
        cursor: pointer;
        border-radius: 3px;
        margin-bottom: 3px;
        float: left;
        width: 50%;
        margin-left: 25%;
    }
    #live5{
        margin-bottom: 5px;
        height: auto;
        overflow: hidden;
        border-bottom: 1px solid silver;
    }
    #live5 #tcomanda{
       width: 98%;
        float: left;
        background: var(--naranja);
        border-collapse: collapse;
        margin-left: .5%;
        margin-right: .5%;
        text-align: center;
        border: 2px solid var(--naranja);
        margin-bottom: 5px;

    }
    #live5 #tcomanda th{
        background: var(--naranja);
        color: white;
        font-weight: 100;
    }
    #live5 #tcomanda #td1{
        background: white;
        color: var(--vino);
        width: 10%;
    }
    #live5 #tcomanda td{
        border-bottom: 1px solid grey;
    }
    #live5 #tcomanda #td2{
    font-size: 13px;
    }
    #live5 #tcomanda td a, #live5 #tcomanda td button{
        display: inline-block;
        text-decoration: none;
        background: var(--verde);
        width: 98%;
        height: 35px;
        color: white;
        font-size: 25px;
        transition: .2s;
        margin-top: 2px;
        border: 0;
    }
    #live5 #tcomanda td a:hover, live5 #tcomanda td button:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    #live5 #tcomanda td a img, #live5 #tcomanda td button img{
        width: 25px;
        background: 0;
    }
    #cargando{
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/logo1.png') 50% 50% no-repeat rgba(255,255,255,0);
    background-size: 80%;
        display: none;
    }
    .nom_mesa{
        position: fixed;
        z-index: 2;
        top: 50px;
        left: 0px;
        background: 0;
        color: white;
        font-size: 30px;
        width: 100%;
        text-align: center;
        color: black;
        height: 40px;
    }
    .agua{
    background-image: url("../img/logo1.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 80%;
    height: 20%;
    margin: 0 auto;
    display: block;
    position: fixed;
        z-index: 1;
        left: 10%;
        top: 40%;
        display: none;
    }
    .cartanew{
       width: 100%;
        height: auto;
        
    }
    .cartanew .categoriasnew{
        width: 100%;
        position: fixed;
        z-index: 99;
        top: 130px;
        background: 0;
        
    }
    .cartanew .categoriasnew .btncat{
        width: 49%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 40px;
        background: var(--amarillo);
        border: 0;
        margin-bottom: 5px;
        font-size: 18px;
        color: black;
        font-weight: 600;
    }
    .cartanew .categoriasnew .cajacatnew{
        width: 100%;
        position: fixed;
        top: 130px;
        text-align: center;
        background: white;
        border-radius: 5px;
        height: 70%;;
        overflow: auto;
        padding: 3px;
        box-sizing: border-box;
    }
    .cartanew .categoriasnew .cajacatnew h1{
        font-size: 25px;
        background: 0;
        color: black;
        height: 40px;
        text-align: left;
        width: 98%;
        margin-left: 1%;
    }
    .cartanew .categoriasnew .cajacatnew .btncerrcat{
        width: 40px;
        float: right;
        height: 38px;
        font-size: 20px;
        color: white;
        background: var(--rojo);
        border: 0;
    }
    .cartanew .categoriasnew .cajacatnew form{
        background: 0;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew{
        background: 0;
        background: rgba(0,0,0,.8);
        width: 98%;
        margin-left: 1%;
        border-radius: 5px;
        padding: 5px;
        box-sizing: border-box;
        margin-bottom: 5px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew h2{
        font-size: 20px;
        background: 0;
        color: white;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .labelpronew{
        display: inline-block;
        width: 100%;
        text-align: left;
        padding: 4px;
        box-sizing: border-box;
        padding-left: 10px;
        margin-bottom: 5px;
        border-radius: 50px;
        height: auto;
        padding-top: 3px;
        transition: .2s;
        font-size: 20px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew input[type="radio"]:checked + label{
        background: var(--naranja);
        color: white;
        transition: .2s;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnscant{
        width: 100%;
        text-align: center;
        background: 0;
        margin-bottom: 5px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnscant img{
        height: 100%;
        background: 0;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnscant button{
        height: 40px;
        padding: 5px;
        border-radius: 50px;
        background: var(--amarillo);
        border: 0;
        width: 20%;
        float: left;
        box-sizing: border-box;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnscant input[type="number"]{
        border-radius: 50px;
        height: 40px;
        border: 1px solid silver;
        text-align: center;
        font-size: 25px;
        width: 50%;
        float: left;
        margin-left: 4.5%;
        margin-right: 4.5%;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnvender{
        width: 100%;
        height: 50px;
        background: var(--verde);
        border: 0;
        border-radius: 50px;
        padding: 5px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .btnvender img{
        height: 100%;
        background: 0;
    }
    .btnverpednew .labelverpednew{
        width: 98%;
        display: inline-block;
        position: fixed;
        bottom: 5px;
        right: 1%;
        background: var(--naranja);
        color: white;
        height: 100px;
        border-radius: 5px;
        padding: 10px;
        box-sizing: border-box;
        cursor: pointer;
        transition: .2s;
        z-index: 9;
    }
    .btnverpednew .labelverpednew:hover{
        background: var(--amarillo);
        transition: .2s;
    }
    .btnverpednew .labelverpednew img{
        background: 0;
        height: 100%;
        margin-right: 20px;
        float: left;
        width: 20%;
    }
    .btnverpednew .labelverpednew p{
        background: 0;
        width: 70%;
        float: left;
        text-align: center;
        height: 100%;
        font-size: 28px;
    }

    .cajaverpednew{
        position: fixed;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        border-right: 1px solid grey;
        z-index: 9999;
    }
    .cajaverpednew h1{
        text-align: center;
        margin-top: 5px;
        width: 100%;
        text-align: left;
    }
    .cajaverpednew h1 label{
        float: right;
        width: 40px;
        height: 30px;
        background: var(--rojo);
        color: white;
        text-align: center;
        border-radius: 5px;
        font-size: 22px;
    }
    .cajaverpednew .espacio{
        width: 100%;
        height: 50px;
    }
    .cajaverpednew table{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
    }
    .cajaverpednew table td{
        border-bottom: 1px solid silver;
        padding: 3px;
    }
    .cajaverpednew table select{
        width: 100%;
        height: 35px;
        font-size: 20px;
        border-radius: 5px;
        border: 0;
        text-align: center;
        text-align-last: center;
        background: var(--amarillo);
        cursor: pointer;
    }
    .btnconfpednew .labelconfpednew{
        position: absolute;
        width: 98%;
        display: inline-block;
        bottom: 10px;
        height: 100px;
        left: 1%;
        background: var(--verde);
        border-radius: 5px;
        color: white;
        padding: 10px;
        box-sizing: border-box;
        cursor: pointer;
        transition: .2s;
    }
    .btnconfpednew .labelconfpednew:hover{
        background: var(--amarillo);
        transition: .2s;
    }
    .btnconfpednew .labelconfpednew img{
        height: 100%;
        background: 0;
        width: 19%;
        float: left;
    }
    .btnconfpednew .labelconfpednew p{
        float: left;
        width: 80%;
        text-align: center;
        height: 40px;
        background: 0;
        font-size: 35px;
        padding-top: 20px;

    }
    .cajaverpednew .datpednew{
        height: 75%;
        overflow: auto;
    }
    .btnconfpednew .confpednew{
        position: absolute;
        height: auto;
        left: 1%;
        bottom: 10px;
        background: rgba(0,0,0,.8);
        border-radius: 5px;
        width: 98%;
        text-align: center;
        padding: 5px;
        box-sizing: border-box;
    }
    .btnconfpednew .confpednew h3{
        background: 0;
        color: white;
        font-size: 35px;
        margin-bottom: 5px;
    }
    .btnconfpednew .confpednew form{
        background: 0;
    }
    .btnconfpednew .confpednew form input{
        width: 100%;
        margin-bottom: 10px;
        height: 30px;
        text-align: center;
        font-size: 20px;
    }
    .btnconfpednew .confpednew form button{
        width: 70%;
        height: 60px;
        background: var(--verde);
        border: 0;
        color: white;
        font-size: 30px;
        margin-bottom: 5px;
        float: left;
        border-radius: 5px;
    }
    .btnconfpednew .confpednew label{
        display: inline-block;
        height: 60px;
        width: 29%;
        background: var(--rojo);
        color: white;
        font-size: 25px;
        border-radius: 5px;
        padding-top: 15px;
        box-sizing: border-box;
        float: left;
        margin-left: 1%;
        transition: .2s;
        cursor: pointer;
    }
    .btnconfpednew .confpednew label:hover{
        transition: .2s;
        transform: scale(.9,.9);
    }
    .btnconfpednew .labelentpednew{
        position: absolute;
        width: 98%;
        display: inline-block;
        bottom: 10px;
        height: 100px;
        left: 1%;
        background: var(--verde);
        border-radius: 5px;
        color: white;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        font-size: 40px;
        padding-top: 25px;
        transition: .2s;
        cursor: pointer;
    }
    .btnconfpednew .labelentpednew:hover{
        background: var(--amarillo);
        transition: .2s;
    }
    .btnconfpednew .entpednew{
        position: absolute;
        height: auto;
        left: 1%;
        bottom: 10px;
        background: rgba(0,0,0,.8);
        border-radius: 5px;
        width: 98%;
        text-align: center;
        padding: 5px;
        box-sizing: border-box;
    }
    .btnconfpednew .entpednew h3{
        background: 0;
        color: white;
        font-size: 35px;
        margin-bottom: 5px;
    }
    .btnconfpednew .entpednew button{
        width: 70%;
        height: 60px;
        background: var(--verde);
        border: 0;
        color: white;
        font-size: 30px;
        margin-bottom: 5px;
        float: left;
        border-radius: 5px;
    }
    .btnconfpednew .entpednew label{
        display: inline-block;
        height: 60px;
        width: 29%;
        background: var(--rojo);
        color: white;
        font-size: 25px;
        border-radius: 5px;
        padding-top: 15px;
        box-sizing: border-box;
        float: left;
        margin-left: 1%;
        cursor: pointer;
        transition: .2s;
    }
    .btnconfpednew .entpednew label:hover{
        transition: .2s;
        transform: scale(.9,.9);
    }
    .cajaverpednew table .impcuenta{
        width: 100%;
        height: 35px;
        border-radius: 5px;
        background: var(--naranja);
        color: white;
        font-size: 20px;
        border: 0;
    }
    .cajaverpednew .btnpagonew{
        position: absolute;
        width: 98%;
        display: inline-block;
        bottom: 10px;
        height: 100px;
        left: 1%;
        background: var(--verde);
        border-radius: 5px;
        color: white;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
        font-size: 50px;
        border: 0;
    }
    .cajaverpednew .btnpagonew img{
        background: 0;
        height: 100%;
        margin-left: 20px;
        margin-bottom: -15px;
    }
    .cajaverpednew table .cajalimmesa{
        width: 98%;
        text-align: center;
        background: rgba(0,0,0,.8);
        border-radius: 5px;
        margin-top: 10px;
        padding: 5px;
        box-sizing: border-box;
        position: absolute;
        bottom: 120px;
    }
    .cajaverpednew table .cajalimmesa div, .cajaverpednew table .cajalimmesa div form{
        background: 0;
        width: 100%;
    }
    .cajaverpednew table .cajalimmesa h3{
        text-align: center;
        width: 100%;
        background: 0;
        color: white;
        font-size: 30px;
    }
    .cajaverpednew table .cajalimmesa textarea{
        width: 100%;
        height: 70px;
        font-size: 20px;
        padding: 10px;
        box-sizing: border-box;
        border: 0;
        border-radius: 5px;
        margin-bottom: 5px;
        resize: none;
        overflow: hidden;
    }
    .cajaverpednew table .cajalimmesa button{
        width: 60%;
        float: left;
        border: 0;
        height: 60px;
        font-size: 30px;
        background: var(--verde);
        color: white;
        border-radius: 5px;
    }
    .cajaverpednew table .cajalimmesa label{
        width: 39%;
        float: left;
        border: 0;
        height: 60px;
        font-size: 25px;
        background: var(--rojo);
        color: white;
        margin-left: 1%;
        border-radius: 5px;
        padding-top: 15px;
        box-sizing: border-box;
        cursor: pointer;
    }
    .cajaverpednew table .btnlimmesa{
        display: inline-block;
        width: 100%;
        height: 35px;
        background: var(--rojo);
        color: white;
        border-radius: 5px;
        font-size: 20px;
        cursor: pointer;
        transition: .2s;
        box-sizing: border-box;
        padding-top: 5px;
    }
    .cajaverpednew table .btnlimmesa:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
        .cajaverpednew table .estados{
        width: 100px;
    }
    .cajaverpednew table .estados button{
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        height: 30px;
        padding: 3px;
        border: 0;

    }
    .cajaverpednew table .estados .btnest{
        background: var(--gris);
    }
    .cajaverpednew table .estados .btneli{
        background: var(--rojo);
    }
    .cajaverpednew table .estados button img{
        height: 100%;
        background: 0;
    }
        .cartanew .categoriasnew .cajacatnew .cajagruponew .notass{
        width: 100%;
        margin-bottom: 5px;
            background: 0;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .notass .labelm {
        float: left;
        width: 49%;
        margin-left: .5%;
        margin-right: .5%;
        padding: 2px;
        box-sizing: border-box;
        transition: .2s;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .notass .selectnot{
        width: 100%;
        border-radius: 3px;
        height: 35px;
        margin-top: 2px;
        margin-bottom: 3px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .notass .labelnot{
        display: inline-block;
        width: 49%;
        background: var(--amarillo);
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        border-radius: 50px;
        height: 25px;
        margin-bottom: 3px;
        text-align: center;
        cursor: pointer;
        font-size: 18px;
        height: 30px;
        box-sizing: border-box;
        padding-top: 4px;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .notass input[type="checkbox"]:checked + label{
        background: var(--naranja);
        color: white;
    }
    .cartanew .categoriasnew .cajacatnew .cajagruponew .notass .not3{
        width: 99%;
        height: 35px;
        padding: 5px;
        font-size: 20px;
        margin-left: .5%;
    }
    .cajaverpednew table td .comped{
        color: var(--rojo);
        font-size: 15px;
    }
        .vermenu{
        width: 50px;
        height: 50px;
        background: 0;
        position: fixed;
        top: 5px;
        left: 5px;
        z-index: 99999;
        border: 0;
    }
    .vermenu img{
        background: 0;
        height: 100%;
    }
    .cajamenunew{
        width: 100%;
        position: fixed;
        background: var(--vino);
        height: 100%;
        top: 0;
        z-index: 999;
        padding: 5px;
        box-sizing: border-box;
    }
    .cajamenunew h2{
        background: 0;
        color: white;
        width: 85%;
        float: left;
        height: 30px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .cajamenunew .ocumenu{
        width: 15%;
        float: left;
        background: var(--rojo);
        font-size: 20px;
        color: white;
        border: 0;
        height: 30px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .cajamenunew .espacio{
        height: 50px;
        width: 100%;
    }
    .cajamenunew .btnmenunew button{
        width: 49%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 90px;
        background: var(--dorado);
        border-radius: 5px;
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        margin-bottom: 3px;
    }
    .cajamenunew .btnmenunew button p, .cajamenunew .btnmenunew button img{
        background: 0;
    }
    .cajamenunew .btnmenunew button p{
        font-size: 20px;
        height: 25%;
        width: 100%;
        color: white;
    }
    .cajamenunew .btnmenunew button img{
        height: 70%;
    }
    .mesas{
        width: 100%;
        text-align: center;
    }
    .mesas .cajamesas{
        width: 100%;
        margin-bottom: 10px;
        height: auto;
        overflow: auto;
    }
    .mesas .cajamesas .btnmesas{
        width: 19%;
        margin-left: .5%;
        margin-right: .5%;
        height: 70px;
        color: white;
        border: 0;
        margin-bottom: 10px;
        float: left;
        font-size: 20px;
    }
    .mesas .cajamesas .btnmesas p{
        height: 20%;
        font-size: 10px;
        background: 0;
        width: 100%;
    }
        .categoriasnew .btnsuc{
        font-size: 15px;
        padding: 5px;
        box-sizing: border-box;
        margin-right: 50px;
        width: 90%;
        border: 2px solid var(--vino);
        margin-bottom: 5px;
        margin-left: 5%;
        height: 35px;
    }
    .categoriasnew .cajasucnew{
        position: fixed;
        top: 170px;
        width: 100%;
        left: 0;
        z-index: 1;
    }
    .cajasucnew .cerrcaja{
        position: fixed;
        top: 60px;
        left: 2px;
        height: 25px;
        width: 25px;
        border: 0;
        background: var(--rojo);
        color: white;
    }
    .cajaverpednew .btnpagodir{
        width: 100%;
        display: inline-block;
        bottom: 10px;
        height: 50px;
        background: var(--verde);
        border-radius: 5px;
        color: white;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
        font-size: 30px;
        border: 0;
    }
    .cajaverpednew .btnpagodir img{
        background: 0;
        height: 100%;
        margin-bottom: -10px;
    }
        .comandera .comanderaonline{
        width: 100%;
        text-align: center;
    }
    .comandera h1{
        width: 100%;
        font-size: 30px;
        color: var(--vino);
        text-align: center;
    }
    .comandera .comanderaonline .tablecoman{
        width: 99%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        text-align: center;
        border-collapse: collapse;
        border: 2px solid var(--vino);
        margin-bottom: 10px;
    }
    .comandera .comanderaonline .tablecoman th{
        background: var(--vino);
        color: white;
        font-size: 20px;
        padding: 5px;
    }
    .comandera .comanderaonline .tablecoman td{
        text-align: center;
        font-size: 25px;
        padding: 3px;
        border-bottom: 1px solid var(--vino);
    }
    .comandera .comanderaonline .tablecoman .tdcan{
        width: 20%;
    }
    .comandera .comanderaonline .tablecoman .tdpro{
        width: 80%;
    }
    .comandera .comanderaonline .tablecoman .btnconfped{
        width: 100%;
        height: 50px;
        background: var(--verde);
        padding: 5px;
        border-radius: 5px;
        border: 0;
    }
    .comandera .comanderaonline .tablecoman .btnconfped img{
        height: 100%;
        background: 0;
    }
    .comandera .comanderaonline #en_preparacion .tablecoman .btnconfpeduni{
        width: 35px;
        height: 35px;
        padding: 3px;
        border-radius: 5px;
        border: 0;
        background: var(--verde);
    }
    .comandera .comanderaonline #en_preparacion .tablecoman .btnconfpeduni img{
        background: 0;
        height: 100%;
    }
    .comandera .comanderaonline .tablecoman .reloj{
        text-align: left;
        height: 30px;
        background: 0;
        float: left;
    }
    .cajamesas button #nom_cli, .cajamesas button .nom_usu{
        height: 25%;
        margin-bottom: 0;
        font-size: 10px;
    }
    .cajamesas button h2{
        background: 0;
        font-size: 20px;
        height: 50%;
        border-top: 1px solid white;
        border-bottom: 1px solid white;
        padding-top: 4px;
        box-sizing: border-box;
    }
    .cajaaccesos{
        display: none;
    }
    .cajamenunew .estadosped{
        width: 100%;
        text-align: center;
        height: 30px;
        overflow: hidden;
        background: 0;
        float: left;
        margin-bottom: 5px;
    }
    .cajamenunew .estadosped button{
        width: 30%;
        float: left;
        margin-left: 1.5%;
        margin-right: 1.5%;
        height: 100%;
        background: white;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 5px;
        text-align: center;
        font-size: 18px;
        color: var(--vino);
    }
    .cajamenunew .estadosped button img{
        height: 100%;
        background: 0;
        margin-right: 5px;

    }
    .comandera .comanderaonline .tablecoman .mensaje_comanda{
        background: var(--amarillo);
        font-size: 5vw;
    }
    .cajaverpednew table .mensaje_comandera form{
        width: 100%;
        height: 40px;
    }
    .cajaverpednew table .mensaje_comandera form input{
        width: 80%;
        height: 100%;
        float: left;
        border: 1px solid silver;
        font-size: 20px;
        padding: 3px;
        box-sizing: border-box;
        border-radius: 5px;
    }
    .cajaverpednew table .mensaje_comandera form button{
        height: 100%;
        width: 18%;
        float: left;
        margin-left: 2%;
        background: var(--verde);
        border: 0;
        padding: 5px;
    }
    .cajaverpednew table .mensaje_comandera form button img{
        height: 100%;
        background: 0;
    }
    .cajaverpednew table .dev_ped button{
        width: 100%;
        height: 40px;
        background: var(--rojo);
        border: 0;
        color: white;
        font-size: 20px;
    }
    .mod_balance{
       width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        z-index: 1;
        overflow-y: auto;
    }
    .mod_balance .espacio_modventa{
        height: 60px;
        background: 0;
    }

    .mod_balance h1{
        text-align: center;
        width: 100%;
        color: var(--vino);
    }
    .mod_balance .cajas_balances{
        width: 98%;
        text-align: center;
        margin: auto;
        overflow: hidden;
        height: auto;
        padding: 5px;
        box-sizing: border-box;
    }
    .mod_balance .cajas_balances .cajas_bal{
        width: 98%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        border-radius: 5px;
        border: 2px solid var(--vino);
        height: 100px;
        padding: 5px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        margin-bottom: 10px;
        color: black;
    }
    .mod_balance .cajas_balances .cajas_bal .titulo{
        width: 70%;
        text-align: center;
        float: left;
        margin-left: .5%;
        margin-right: .5%;

    }
    .mod_balance .cajas_balances .cajas_bal .titulo h2{

        width: 100%;
        text-align: center;
        float: left;
        height: 50px;
        font-size: 5vw;

    }
    .mod_balance .cajas_balances .cajas_bal .titulo h2 img{
        height: 100%;
        text-align: left;
        margin-left: 0px;
        float: left;
    }
     .mod_balance .cajas_balances .cajas_bal .titulo button, .mod_balance .cajas_balances .cajas_bal .dato button{
         border: 0;
    }
    .mod_balance .cajas_balances .cajas_bal .dato{
        width: 50%;
        text-align: center;
        display: flex;
        height: 50%;
        align-content: center;
        align-items: center;
        text-align: center;

    }
    .mod_balance .cajas_balances .cajas_bal .dato h3{
        width: 100%;
        font-size: 6.5vw;
    }
    .mod_balance .cajas_balances #utilidad_bal{
        background: var(--vino);
    }
    .mod_balance .cajas_balances #utilidad_bal div{
        background: 0;
    }
    .mod_balance .cajas_balances #utilidad_bal img{
        background: 0;
    }
    .mod_balance .cajas_balances #utilidad_bal h2, .mod_balance .cajas_balances #utilidad_bal h3{
        background: 0;
        color: white;
    }
    .mod_balance .sub_btn{
        width: 100%;
        margin-bottom: 10px;
        height: auto;
        overflow: hidden;
        padding: 5px;
        box-sizing: border-box;
    }
    .mod_balance .sub_btn button{
        background: var(--amarillo);
        color: white;
        padding: 5px;
        font-size: 20px;
        float: left;
        margin-left: .25%;
        margin-right: .25%;
        border: 0;
        margin-bottom: 5px;
    }

     .mod_balance  .filtro_bal{
        width: 100%;
        overflow: hidden;
        margin-bottom: 5px;
        height: auto;
        padding: 3px;
        box-sizing: border-box;
    }
    .mod_balance  .filtro_bal form label{
        float: left;
        text-align: center;
        width: 100%;
    }
    .mod_balance  .filtro_bal form label input, .mod_balance  .filtro_bal form label select{
        padding: 3px;
        font-size: 20px;
        border-radius: 3px;
        border: 1px solid silver;
        height: 35px;
        width: 100%;
        margin-bottom: 3px;
    }
    .mod_balance  .filtro_bal form label button{
        background: var(--azul);
        height: 35px;
        padding: 4px;
        min-width: 50px;
        width: 100%;
        border: 0;
    }
    .mod_balance  .filtro_bal form label button img{
        height: 100%;
        background: 0;
    }
    .mod_balance h2{
        text-align: center;
    }
    .mod_balance .cajas_bal button{
        width: 100%;
    }
    .mesas .cajamesas .btnmesas .impcuenta{
        display: none;
    }
    .cajaverpednew .btnpagonewpri{
        width: 100%;
        height: 40px;
        background: var(--verde);
        border: 0;
        font-size: 20px;
        color: white;
        padding: 5px;
    }
    .cajaverpednew .btnpagonewpri img{
        background: 0;
        height: 100%;
        margin-left: 20px;
        margin-bottom: -5px;
    }
    .btnconfpednew .confpednew select{
        width: 100%;
        margin-bottom: 5px;
        height: 40px;
        font-size: 20px;
        border-radius: 5px;
    }
    .mod_repventas{
        width: 100%;
        text-align: center;
    }
    .mod_repventas h1{
        color: var(--vino);
    }
    .mod_repventas .filtro_repventas{
        width: 100%;
        text-align: center;
        overflow: hidden;
    }
    .mod_repventas .filtro_repventas label{
        width: 99%;
        display: inline-block;
        float: left;
        font-weight: 600;
        font-size: 15px;
        text-align: left;
        margin-left: .5%;
        margin-right: .5%;
        color: var(--vino);
        height: 65px;
    }
    .mod_repventas .filtro_repventas input, .mod_repventas .filtro_repventas .caja_select2, .filtro_repventas input, .filtro_repventas .caja_select2{
        height: 40px;
        width: 98%;
        float: left;
        text-align: center;
        font-size: 18px;
        font-weight: 100;
        margin-bottom: 5px;
        margin-left: 1%;
    }
    .mod_repventas .filtro_repventas button, .filtro_repventas button{
        width: 40px;
        height: 40px;
        float: left;
        margin-top: 0px;
        background: var(--azul);
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        width: 98%;
        margin-left: 1%;
    }
    .mod_repventas .filtro_repventas button img, .filtro_repventas button img{
        background: 0;
        height: 100%;
    }
    .filtro_repventas{
        
    }
    .mod_repventas .tabdatos{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
        overflow: auto;
    }
    .mod_repventas .tabdatos table{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        margin-bottom: 30px;
    }
    .mod_repventas .tabdatos table th, .mod_repventas .tabdatos table td{
        padding: 3px;
        border: 1px solid var(--vino);
    }
    .mod_repventas .tabdatos table th{
        color: var(--vino);
    }
    .mod_repventas .tabdatos table td .btnverped{
        width: 30px;
        height: 30px;
        padding: 3px;
        box-sizing: border-box;
        background: var(--amarillo);
        border: 0;
    }
    .mod_repventas .tabdatos table td .btnverped img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos table tr, .mod_repventas .tabdatos table td{
        background: 0;
    }
    .mod_repventas .tabdatos table tr:hover{
        background: var(--dorado);
        color: white;
    }
    .mod_repventas .tabdatos table #total{
        background: #D6D6D6;
    }
    .mod_repventas .tabdatos .rep_expor{
        width: 100%;
        height: 35px;
        margin-bottom: 5px;
    }
    .mod_repventas .tabdatos .rep_expor button{
        height: 100%;
        float: left;
        width: 35px;
        border: 0;
        padding: 3px;
        margin-right: 5px;
    }
    .mod_repventas .tabdatos .rep_expor button img{
        background: 0;
        height: 100%;
    }
    .mod_repventas .tabdatos .rep_expor .pdf{
        background: var(--rojo);
    }
    .mod_repventas .tabdatos .rep_expor .excel{
        background: var(--verde);
    }
    .mod_repventas .tabdatos .cajaverped{
        position: absolute;
        right: 0%;
        margin-top: 5px;
        background: white;
        border-radius: 5px;
        border: 2px solid var(--vino);
        padding: 5px;
        box-sizing: border-box;
        max-height: 500px;
        overflow-y: auto;
        width: 100%;
        bottom: 0;
    }
    .mod_repventas .tabdatos .cajaverped h2{
        background: var(--vino);
        color: white;
        width: 85%;
        float: left;
        height: 35px;
    }
    .mod_repventas .tabdatos .cajaverped .cerrarcajacerrped{
        width: 15%;
        float: left;
        background: var(--rojo);
        color: white;
        height: 35px;
        border: 0;
        border-radius: 0;
        font-size: 20px;
        font-weight: 600;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped{
        width: 100%;
        height: 35px;
        text-align: left;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .ticket, .mod_repventas .tabdatos .cajaverped .btsverped .anular{
        width: 35px;
        height: 100%;
        border: 0;
        padding: 5px;
        box-sizing: border-box;
        display: inline-block;
        border-radius: 5px;
        transition: .2s;
        cursor: pointer;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .anular:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .ticket img, .mod_repventas .tabdatos .cajaverped .btsverped .anular img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .ticket{
        background: var(--verde);
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .anular{
        background: var(--rojo);
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu{
        position: absolute;
        margin-top: 0px;
        background: var(--rojo);
        padding: 5px;
        box-sizing: border-box;
        border-radius: 5px;
        width: 90%;
        margin-left: 5%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form{
        background: 0;
        width: 100%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form label{
        width: 45%;
        margin: 0;
        margin-left: 1%;
        margin-right: 1%;
        float: left;
        display: inline-block;
        text-align: center;
        padding: 5px;
        border-radius: 5px;
        border: 2px solid var(--azul);
        margin-bottom: 5px;
        color: black;
        cursor: pointer;
    }

    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form label:hover{
        color: black;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form input{
        width: 98%;
        margin-left: 1%;
        height: 35px;
        padding: 3px;
        margin-bottom: 5px;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form .btnconanuventa{
        width: 98%;
        height: 40px;
        background: var(--verde);
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        margin-left: 1%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu form .btnconanuventa img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesanu h3{
        background: 0;
        text-align: center;
        color: white;
    }
    .mod_repventas .filtro_repventas #separar{
        float: left;
        height: auto;
        border-radius: 3px;
        text-align: center;
        box-sizing: border-box;
        padding-top: 0px;
        cursor: pointer;
        padding: 3px;
    }
    .mod_repventas .filtro_repventas #inputsepfec:checked + label{
        background: var(--azul);
        color: white;
    }
      .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod{
        position: absolute;
        margin-top: 0px;
        background: var(--amarillo);
        padding: 5px;
        box-sizing: border-box;
        border-radius: 5px;
        width: 90%;
        margin-left: 5%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form{
        background: 0;
        width: 100%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form label{
        width: 94%;
        margin: 0;
        margin-left: 1%;
        margin-right: 1%;
        float: left;
        display: inline-block;
        text-align: center;
        padding: 5px;
        border-radius: 5px;
        border: 2px solid var(--azul);
        margin-bottom: 5px;
        color: black;
        cursor: pointer;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form .totped{
        width: 95%;
        border: 0;
        font-weight: 600;
        font-size: 20px;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form .totped input{
        text-align: center;
        font-size: 20px;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form label:hover{
        color: black;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form input{
        width: 98%;
        margin-left: 1%;
        height: 35px;
        padding: 3px;
        margin-bottom: 5px;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form select{
        width: 98%;
        margin-left: 1%;
        height: 35px;
        padding: 3px;
        margin-bottom: 5px;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form .btnconmodventa{
        width: 98%;
        height: 40px;
        background: var(--verde);
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        margin-left: 1%;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod form .btnconmodventa img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .opcionesmod h3{
        background: 0;
        text-align: center;
        color: white;
    }
        .mod_repventas .tabdatos .cajaverped .btsverped .ticket, .mod_repventas .tabdatos .cajaverped .btsverped .modificar{
        width: 35px;
        height: 100%;
        border: 0;
        padding: 5px;
        box-sizing: border-box;
        display: inline-block;
        border-radius: 5px;
        transition: .2s;
        cursor: pointer;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .modificar:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .ticket img, .mod_repventas .tabdatos .cajaverped .btsverped .modificar img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos .cajaverped .btsverped .modificar{
        background: var(--amarillo);
    }
    .mod_repventas .tabdatos .btnvertiket{
        border: 0;
        width: 35px;
        height: 35px;
        padding: 5px;
        box-sizing: border-box;
        background: var(--azul);
    }
    .mod_repventas .tabdatos .btnvertiket img{
        height: 100%;
        background: 0;
    }
    .agua{
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: url('../img/logo1.png') 50% 50% no-repeat rgba(255,255,255,0);
    background-size: 20%;
    }
    .redimientos_meseros{
        display: none;
    }
      .buscador_ped{
        width: 100%;
        position: absolute;
        top: 80px;
        height: 50px;
        left: 0;
    }
    .buscador_ped #buscador_pro{
        width: 90%;
        float: left;
        margin-left: 5%;
        margin-top: 5px;
        height: 40px;
        border-radius: 50px;
        text-align: center;
        font-size: 5vw;
        border: 1px solid grey;
    }
    .buscador_ped #resultado_pro{
        
    }
    .buscador_ped #resultado_pro .caja_btn_busqueda{
        width: 90%;
        position: fixed;
        top: 130;
        height: auto;
        overflow: auto;
        z-index: 999;
        background: rgba(0,0,0,.8);
        padding: 5px;
        box-sizing: border-box;
        overflow: hidden;
        margin-left: 5%;
        border-radius: 10px;
    }
    .buscador_ped #resultado_pro div button{
        display: inline-block;
        color: white;
        background: var(--naranja);
        font-size: 4vw;
        width: 100%;
        text-align: center;
        border-radius: 50px;
        text-decoration: none;
        padding: 5px;
        box-sizing: border-box;
        height: 100%;
        -webkit-box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.75);
box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.75);
        margin-bottom: 5px;
        border: 0;
    }
    .buscador_ped #resultado_pro div{
        height: 60vh;
        overflow: auto;
        background: 0;
    }
    .buscador_ped #resultado_pro div form{
        background:0;
        width: 99%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 40px;
        margin-bottom: 5px;
    }
    .buscador_ped #resultado_pro div #btn_limpiar_busqueda{
        background: 0;
        width: 50%;
        margin-right: 50%;
        text-decoration: underline;
        text-align: left;
        -webkit-box-shadow: 0px 0px 0px 0px;
        
    }
    .cajaverpednew .btncredito{
        width: 100%;
        height: 40px;
        background: var(--naranja);
        border: 0;
        font-size: 20px;
        color: white;
        padding: 5px;
    }
    .cajaverpednew .btncredito img{
        background: 0;
        height: 100%;
        margin-left: 20px;
        margin-bottom: -5px;
    }
    .caja_credito{
        width: 100%;
    }
    .caja_credito input{
        width: 79%;
        height: 40px;
        float: left;
        text-align: center;
        font-size: 5vw;
        border: 1px solid silver;
    }
    .caja_credito button{
        width: 20%;
        float: left;
        height: 40px;
        margin-left: 1%;
        background: var(--verde);
        color: white;
        border: 0;
        font-size: 5vw;
    }
    .caja_btn_busqueda .label_pro{
        display: inline-block;
        width: 100%;
        margin-bottom: 5px;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 50px;
        background: white;
        color: black;
        font-size: 5vw;
        transition: .2s;
        cursor: pointer;
    }
    .caja_btn_busqueda input[type="radio"]:checked + label{
        background: var(--naranja);
        color: white;
        transition: .2s;
    }
    .caja_btn_busqueda .caja_confirmar_ped{
        width: 98%;
        position: absolute;
        bottom: 5;
        left: 1%;
        background: 0;
        background: black;
        padding: 5px 5px 0px 5px;
        box-sizing: border-box;
        border-radius: 5px;
    }
    .caja_btn_busqueda .caja_confirmar_ped .btnscant{
        background: 0;
    }
    .caja_btn_busqueda .caja_confirmar_ped .btnscant #btnmas,.caja_btn_busqueda .caja_confirmar_ped .btnscant #btnmenos{
        width: 14%;
        float: left;
        height: 60px;
        border-radius: 10px;
        background: var(--rojo);
        margin-left: .5%;
        margin-right: .5%;
    }
    .caja_btn_busqueda .caja_confirmar_ped .btnscant #btnmas img,.caja_btn_busqueda .caja_confirmar_ped .btnscant #btnmenos img{
        height: 100%;
        background: 0;
        
    }
    .caja_btn_busqueda .caja_confirmar_ped .btnscant #cant{
        height: 60px;
        border-radius: 10px;
        border: 0;
        text-align: center;
        font-size: 7vw;
        width: 35%;
        float: left;
        
    }
    .caja_btn_busqueda .caja_confirmar_ped #btn_confirmar{
        width: 35%;
        float: left;
        height: 60px;
        background: var(--verde);
    }
    .caja_btn_busqueda .caja_confirmar_ped #btn_confirmar img{
        height: 100%;
        background: 0;
    }
    .detpednew2{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        margin-top: 30px;
        position: absolute;
        height: 80%;
        background: 0;
        overflow: auto;
    }
    .detpednew2 table{
        width: 100%;
        border-collapse: collapse;
        
    }
    .detpednew2 table td{
        border-bottom: 1px solid black;
        padding: 3px;
        text-align: center;
        font-size: 3.5vw;
        background: 0;
    }
    .detpednew2 table #td1{
        width: 50%;
    }
    .detpednew2 table #td2{
        width: 10%;
    }
    .detpednew2 table #td3{
        width: 20%;
    }
    .detpednew2 table td .img_estado{
        width: 25px;
        height: 25px;
    }
    .detpednew2 table td .btn_eliminar{
        width: 25px;
        height: 25px;
        border: 0;
        background: 0;
    }
    .detpednew2 table td .btn_eliminar img{
        height: 100%;
        background: 0;
    }
    .detpednew2 table td b{
        display: inline-block;
        background: black;
        color: white;
        padding: 3px;
        box-sizing: border-box;
        border-radius: 5px;
        margin-right: 5px;
    }
    .detpednew2 table .th1{
        background: 0;
        color: white;
        padding: 5px;
        font-size: 5vw;
        border-radius: 5px 0px 0px 5px;
        
    }
    .detpednew2 table .th2{
        background: 0;
        color: white;
        padding: 5px;
        font-size: 5vw;
        border-radius: 0px 5px 5px 0px;
        
    }
    .detpednew2 table #tr_total_ped{
        background: var(--rojo);
    }
    .detpednew2 #form_conf_ped, .detpednew2 #form_pago_ped{
        background: 0;
        position: absolute;
        bottom: 40px;
        background: 0;
        height: 50px;
        width: 95%;
        left: 2.5%;
    }
    .detpednew2 #form_pago_ped{
        background: 0;
        position: absolute;
        bottom: 40px;
        background: 0;
        height: auto;
        width: 95%;
        left: 2.5%;
    }
    .detpednew2 #form_conf_ped button{
        height: 100%;
        width: 100%;
        font-size: 25px;
        background: var(--verde);
        border: 0;
        color: white;
        font-weight: 600;
        border-radius: 10px;
    }
    .detpednew2 #form_pago_ped #label_imp_fac{
        display: inline-block;
        width: 100%;
        text-align: center;
        border: 1px solid grey;
        font-size: 20px;
        border-radius: 50px;
        padding: 5px;
        box-sizing: border-box;
    }
    .detpednew2 #form_pago_ped #imp_fac:checked + label{
        background: grey;
        color: white;
    }
    .detpednew2 #form_pago_ped #imp_fac{
        display: none;
    }
    .detpednew2 #form_pago_ped .label_fp{
        display: inline-block;
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-right: 1%;
        text-align: center;
        font-size: 20px;
        margin-top: 10px;
        margin-bottom: 10px;
        font-size: 20px;
        border-radius: 50px;
        background: silver;
        padding: 5px;
        box-sizing: border-box;
    }
    .detpednew2 #form_pago_ped button{
        width: 100%;
        font-size: 30px;
        background: var(--verde);
        border: 0;
        color: white;
        font-weight: 600;
        border-radius: 10px;
        padding: 5px;
        box-sizing: border-box;
    }
    .detpednew2 #form_pago_ped input[type="radio"]:checked + label{
        background: var(--rojo);
        color: white;
    }
    .detpednew2 #form_pago_ped .vueltas{
        display: none;
        width: 90%;
        float: left;
        background: 0;
        padding: 5px;
        box-sizing: border-box;
        background: grey;
        border-radius: 5px;
        margin-left: 5%;
        margin-top: -5px;
    }
    .detpednew2 #form_pago_ped .vueltas input{
        width: 49%;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
        height: 35px;
        text-align: center;
        font-size: 5vw;
        border: 1px solid grey;
        border-radius: 5px;
    }
    .detpednew2 #form_pago_ped #pago_efectivo:checked ~ .vueltas{
        display: block;
    }
    .cajarescienew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    .cajarescienew div{
        width: 100%;
        border: 2px solid black;
        margin-bottom: 5px;
        border-radius: 5px;
    }
    .cajarescienew h2{
        font-size: 6vw;
        background: 0;
    }
    .cajarescienew h3{
        font-size: 6vw;
        background: 0;
    }
    .cajarescienew h4{
        font-size: 5vw;
        font-weight: 100;
        background: 0;
    }
    #bases{
        width: 100%;
        text-align: center;
        padding: 5px;
        overflow: auto;
    }
    #bases table{
        width: 100%;
        border-collapse: collapse;
        font-size: 4vw;
    }
    #bases table td{
        padding: 3px;
        border: 1px solid black;
    }
    #bases table td input{
        width: 100%;
        float: left;
        height: 30px;
        text-align: center;
        font-size: 4vw;
        margin-bottom: 3px;
        
    }
    #bases table td button{
        width: 100%;
        float: left;
        height: 30px;
        padding: 5px;
        box-sizing: border-box;
        background: var(--verde);
        border: 0;
    }
    #bases table td button img{
        height: 100%;
        background: 0;
    }
    #bases table td a{
        text-decoration: none;
        width: 100%;
        text-align: center;
        background: var(--rojo);
        color: white;
        font-size: 5vw;
    }
    .cuadrecajanew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        border-collapse: collapse;
    }
    .cuadrecajanew .tcontadornew td{
        border: 1px solid black;
        padding: 3px;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew #td2 input{
        width: 100%;
        float: right;
        margin-left: 5px;
        height: 30px;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew #td1 input, .cuadrecajanew .tcontadornew #td3 input{
        width: 80%;
        float: right;
        margin-left: 5px;
        height: 30px;
        text-align: center;
        border: 0;
    }
    .cuadrecajanew .tcontadornew #tot{
        text-align: center;
        padding: 3px;
    }
    .cuadrecajanew .tcontadornew #tot input{
        width: 80%;
        float: right;
        height: 30px;
        text-align: center;
        font-weight: 600;
        margin-bottom: 5px;
    }
    .cuadrecajanew .rescuadrenew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        font-size: 5vw;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew td,.cuadrecajanew .rescuadrenew .trescuadrenew th{
        border: 1px solid black;
        padding: 3px;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew a{
        text-decoration: none;
        color: black;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew input{
        widows: 100%;
        height: 30px;
        text-align: center;
        border: 0;
        font-size: 5vw;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew textarea{
        width: 100%;
        padding: 5px;
        font-size: 4vw;
        border-radius: 5px;
    }
    .cuadrecajanew .rescuadrenew .labeltipo{
        display: inline-block;
        width: 49%;
        background: silver;
        height: 30px;
        font-size: 6vw;
        border-radius: 5px;
        color: white;
        margin-bottom: 10px;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
    }
    .cuadrecajanew .rescuadrenew .inputipo:checked + label{
        background: var(--naranja);
    }
    .cuadrecajanew .rescuadrenew #btncuadre{
        width: 100%;
        height: 40px;
        background: var(--verde);
        color: white;
        border: 0;
        border-radius: 5px;
        padding: 5px;
        box-sizing: border-box;
        font-size: 6vw;
    }
    .cuadrecajanew .rescuadrenew #btncuadre img{
        background: 0;
        height: 100%;
        margin-bottom: -10px;
        margin-left: 20px;
    }
        .cajarescienew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    .cajarescienew div{
        width: 100%;
        border: 2px solid black;
        margin-bottom: 5px;
        border-radius: 5px;
    }
    .cajarescienew h2{
        font-size: 6vw;
        background: 0;
    }
    .cajarescienew h3{
        font-size: 6vw;
        background: 0;
    }
    .cajarescienew h4{
        font-size: 5vw;
        font-weight: 100;
        background: 0;
    }
    #bases{
        width: 100%;
        text-align: center;
        padding: 5px;
        overflow: auto;
    }
    #bases table{
        width: 100%;
        border-collapse: collapse;
        font-size: 4vw;
    }
    #bases table td{
        padding: 3px;
        border: 1px solid black;
    }
    #bases table td input{
        width: 100%;
        float: left;
        height: 30px;
        text-align: center;
        font-size: 4vw;
        margin-bottom: 3px;
        
    }
    #bases table td button{
        width: 100%;
        float: left;
        height: 30px;
        padding: 5px;
        box-sizing: border-box;
        background: var(--verde);
        border: 0;
    }
    #bases table td button img{
        height: 100%;
        background: 0;
    }
    #bases table td a{
        text-decoration: none;
        width: 100%;
        text-align: center;
        background: var(--rojo);
        color: white;
        font-size: 5vw;
    }
    .cuadrecajanew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        border-collapse: collapse;
    }
    .cuadrecajanew .tcontadornew td{
        border: 1px solid black;
        padding: 3px;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew #td2 input{
        width: 100%;
        float: right;
        margin-left: 5px;
        height: 30px;
        text-align: center;
    }
    .cuadrecajanew .tcontadornew #td1 input, .cuadrecajanew .tcontadornew #td3 input{
        width: 80%;
        float: right;
        margin-left: 5px;
        height: 30px;
        text-align: center;
        border: 0;
    }
    .cuadrecajanew .tcontadornew #tot{
        text-align: center;
        padding: 3px;
    }
    .cuadrecajanew .tcontadornew #tot input{
        width: 80%;
        float: right;
        height: 30px;
        text-align: center;
        font-weight: 600;
        margin-bottom: 5px;
    }
    .cuadrecajanew .rescuadrenew{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        font-size: 5vw;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew td,.cuadrecajanew .rescuadrenew .trescuadrenew th{
        border: 1px solid black;
        padding: 3px;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew a{
        text-decoration: none;
        color: black;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew input{
        widows: 100%;
        height: 30px;
        text-align: center;
        border: 0;
        font-size: 5vw;
    }
    .cuadrecajanew .rescuadrenew .trescuadrenew textarea{
        width: 100%;
        padding: 5px;
        font-size: 4vw;
        border-radius: 5px;
    }
    .cuadrecajanew .rescuadrenew .labeltipo{
        display: inline-block;
        width: 49%;
        background: silver;
        height: 30px;
        font-size: 6vw;
        border-radius: 5px;
        color: white;
        margin-bottom: 10px;
        float: left;
        margin-left: .5%;
        margin-right: .5%;
    }
    .cuadrecajanew .rescuadrenew .inputipo:checked + label{
        background: var(--naranja);
    }
    .cuadrecajanew .rescuadrenew #btncuadre{
        width: 100%;
        height: 40px;
        background: var(--verde);
        color: white;
        border: 0;
        border-radius: 5px;
        padding: 5px;
        box-sizing: border-box;
        font-size: 6vw;
    }
    .cuadrecajanew .rescuadrenew #btncuadre img{
        background: 0;
        height: 100%;
        margin-bottom: -10px;
        margin-left: 20px;
    }
    .mod_parametros{
        width: 100%;
    }
    .mod_parametros h1{
        text-align: center;
    }
    .mod_parametros .btsparametros{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    .mod_parametros .btsparametros button{
        height: 100px;
        margin-bottom: 5px;
        float: left;
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        border: 3px solid var(--vino);
        font-size: 6.5vw;
        padding: 10px;
        border-radius: 10px;
    }
    .mod_parametros .btsparametros button img{
        height: 70%;
        background: 0;
        margin-bottom: -5px;
        margin-right: 30px;
    }
    .mod_repventas .tabdatos input, .mod_repventas .tabdatos select{
        width: 100%;
        height: 35px;
    }
    .mod_repventas .tabdatos .btnmodsuc{
        width: 35px;
        height: 35px;
        padding: 5px;
        background: var(--verde);
        box-sizing: border-box;
        border: 0;
    }
    .mod_repventas .tabdatos .btnmodsuc img{
        height: 100%;
        background: 0;
    }
    .mod_repventas .tabdatos .activar button{
         width: 35px;
        height: 35px;
        padding: 5px;
        background: 0;
        box-sizing: border-box;
        border: 0;
    }
    .mod_repventas .tabdatos .activar button img{
        width: 100%;
        background: 0;
    }
    .modinv .botoneshead{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        border-bottom: 1px solid grey;
        height: auto;
        overflow: hidden;
        margin-bottom: 10px;
    }
    .modinv .botoneshead .activo{
        width: 100%;
        text-align: center;
        font-size: 15px;
        float: left;
        margin-bottom: 10px;
        border-bottom: 1px solid grey;
        height: auto;
        overflow: hidden;
    }
    .modinv .botoneshead .botones_head{
        width: 100%;
        height: 35px;
        margin-bottom: 10px;
        border: 0;
        background: var(--amarillo);
        color: black;
        font-size: 15px;
        font-weight: 600;
    }
    .modinv .botoneshead .ingcomp{
        width: 100%;
        padding: 5px;
        border-radius: 5px;
        border: 1px solid grey;
        box-sizing: border-box;
    }
    .modinv .botoneshead .ingcomp input[type="radio"]{
        display: none;
    }
    .modinv .botoneshead .ingcomp .label_head{
        display: inline-block;
        width: 29%;
        float: left;
        text-align: center;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 5px;
        margin-left: .5%;
        margin-right: .5%;
        border: 1px solid grey;
        background: white;
        height: 35px;
    }
    .modinv .botoneshead .ingcomp .cerrar_ventana{
        width: 9.5%;
        float: left;
        height: 35px;
        background: var(--rojo);
        color: white;
        border: 0;
        margin-left: .5%;
        border-radius: 5px;
        font-size: 18px;
        font-weight: 600;
    }
    .modinv .botoneshead .ingcomp #newcomp1{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .modinv .botoneshead .ingcomp #newcomp1 form input, .modinv .botoneshead .ingcomp #newcomp1 form select, .modinv .botoneshead .ingcomp #newum form input, .modinv .botoneshead .ingcomp #newum form select{
        width: 100%;
        height: 35px;
        border-radius: 5px;
        text-align: center;
        text-align-last: center;
        margin-bottom: 5px;
        border: 1px solid silver;
        font-size: 15px;
    }
    .modinv .botoneshead .ingcomp #newcomp1 form button[type="submit"], .modinv .botoneshead .ingcomp #newum form button[type="submit"]{
        width: 100%;
        height: 38px;
        background: var(--verde);
        border: 0;
        padding: 5px;
        box-sizing: border-box;
    }
    .modinv .botoneshead .ingcomp #newcomp1 form button[type="submit"] img, .modinv .botoneshead .ingcomp #newum form button[type="submit"] img{
        background: 0;
        height: 100%;
    }
    .modinv .botoneshead .repinv{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .modinv .botoneshead .repinv h2{
        width: 85%;
        text-align: left;
        float: left;
    }
    .modinv .botoneshead .repinv #cerrcaja{
        width: 15%;
        float: left;
        height: 35px;
        background: var(--rojo);
        color: white;
        border: 0;
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 5px;
    }
    .modinv .botoneshead .repinv .rep-inv{
        width: 100%;
    }
    .modinv .botoneshead .repinv .rep-inv a{
        display: inline-block;
        width: 100%;
        background: black;
        color: white;
        text-decoration: none;
        margin-bottom: 5px;
        height: 35px;
        border-radius: 5px;
        font-size: 20px;
        padding: 5px;
        box-sizing: border-box;
    }
    .modinv .botoneshead .inginv{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
        text-align: center;
    }
    .modinv .botoneshead .inginv p{
        font-weight: 600;
    }
    .modinv .botoneshead .inginv h2{
        float: left;
        width: 85%;
        text-align: left;
    }
    .modinv .botoneshead .inginv #cerrcaja{
        width: 15%;
        float: left;
        height: 35px;
        background: var(--rojo);
        color: white;
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 5px;
        border: 0;
    }
    .modinv .botoneshead .inginv .caja_select2{
        width: 100%;
        height: 35px;
    }
    .modinv .botoneshead .inginv .caja_select3{
        width: 80%;
        float: left;
        height: 35px;
    }
    .modinv .botoneshead .inginv #pselect3 {
        width: 80%;
        float: left;
    }
    .modinv .botoneshead .inginv #pselect4, {
        width: 19%;
        float: left;
        margin-left: 1%;
    }
    .modinv .botoneshead .inginv #can_mp{
        width: 19%;
        float: left;
        margin-left: 1%;
        height: 35px;
        text-align: center;
        margin-bottom: 5px;
    }
    .modinv .botoneshead .inginv button[type="submit"]{
        width: 100%;
        height: 35px;
        background: var(--verde);
        border: 0;
        padding: 5px;
        box-sizing: border-box;
    }
    .modinv .botoneshead .inginv button[type="submit"] img{
        height: 100%;
        background: 0;
    }
    .mod_repventas  .btsexportar{
        width: 100%;
        height: 35px;
        margin-bottom: 10px;
    }
    .mod_repventas  .btsexportar a{
        display: inline-block;
        height: 40px;
        text-decoration: none;
        margin-left: 10px;
        float: left;
        border: 2px solid black;
        padding: 5px;
        box-sizing: border-box;
        width: 50px;
    }
    .mod_repventas  .btsexportar a img{
        height: 100%;
        background: 0;
    }
    #cinv {
        width: 100%;
        text-align: center;
        margin: auto;
        padding: 5px;
        box-sizing: border-box;
        overflow: auto;
    }

    #cinv .tpro,
    #cinv .tpro1 {
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        border: 2px solid var(--vino);
        margin: auto;
        background: 0;
        font-size: 13px;
        margin-bottom: 150px;
    }

    #cinv .tpro th,
    #cinv .tpro1 th {
        background: var(--vino);
        color: white;
        font-size: 18px;
        font-weight: 100;
        text-align: center;
    }

    #cinv .tpro td,
    #cinv .tpro1 td {
        background: 0;
        width: 10%;
    }

    #cinv .tpro tr:hover,
    #cinv .tpro1 tr:hover {
        background-color: var(--dorado);
    }

    #cinv .tpro button,
    #cinv .tpro1 button {
        background: var(--amarillo);
        width: 90%;
        height: 35px;
        color: white;
        font-size: 20px;
        border: 0;
        border-radius: 20px;
        margin-top: 3px;
        margin-bottom: 3px;
        transition: .2s;
        cursor: pointer;
    }

    #cinv .tpro button:hover,
    #cinv .tpro1 button:hover {
        transform: scale(.9, .9);
        transition: .2s;
    }
    #cinv .tpro td {
        border: 1px solid var(--vino);
        padding: 3px;
    }

    #cinv .tpro .vermas {
        width: 25px;
        height: 25px;
        background: var(--amarillo);
        border-radius: 3px;
        padding: 3px;
        box-sizing: border-box;
        margin: 0;
        float: inherit;
    }

    #cinv .tpro .vermas img {
        width: 100%;
        background: 0;
    }

    #cinv .tpro #a {
        width: 1%;
    }
        .tpro input, .tpro select{
        border-radius: 3px;
        border: 1px solid silver;
    }
    .tpro input[type="radio"]{
        display: none;
    }
    .tpro img{
        height: 100%;
        background: 0;
    }
    #cinv .tpro .btnconf{
        background: var(--verde);
        border-radius: 3px;
        width: 95%;
        float: left;
        margin-left: 2.5%;
        padding: 3px;
        box-sizing: border-box;
    }
    #cinv .tpro .btneli{
        background: var(--rojo);
        border-radius: 3px;
        width: 95%;
        float: left;
        margin-left: 2.5%;
        padding: 3px;
        box-sizing: border-box;
        display: inline-block;
        height: 35px;
        color: white;
        font-size: 25px;
    }
    #cinv .tpro .td1{
        width: 5%;
    }
    #cinv .tpro .td2{
        width: 5%;
    }
    .confeli{
        position: fixed;
        width: 98%;
        left: 1%;
        border: 1px solid silver;
        border-radius: 3px;
        padding: 5px;
        box-sizing: border-box;
        top: 95px;
        -webkit-box-shadow: 0px 0px 23px -6px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 23px -6px rgba(0,0,0,0.75);
box-shadow: 0px 0px 23px -6px rgba(0,0,0,0.75)
    }
    .confeli h4{
        font-size: 20px;
        color: var(--rojo);
    }
    #cinv .tpro .confeli button{
        background: var(--rojo);
        border-radius: 3px;
    }
    #cinv .tpro .confeli .btnconfeli{
        background: var(--verde);
    }
    .tpro .inputcan input{
        width: 69%;
        float: left;
    }
    .tpro .inputcan span{
        width: 25%;
        float: left;
        height: 30px;
        margin-top: 2px;
        display: flex;
        align-items: center;
        text-align: center;
         background: 0;
    }
    .tpro .inputcan span p{
        text-align: center;
        width: 100%;
        font-size: .8vw;
        background: 0;
    }
    .tpro .tdes{
        width: 20%;
    }
    #cinv .tpro td .btntransferir{
        background: var(--naranja);
        border-radius: 3px;
        padding: 3px;
        box-sizing: border-box;
        display: inline-block;
        height: 35px;
        width: 95%;
        cursor: pointer;
        transition: .2s;
    }
    #cinv .tpro td .btntransferir:hover{
        transform: scale(.9,.9);
        transition: .2s;
    }
    .tpro .modtransferir{
        position: absolute;
        left: 10px;
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.16);
        border-radius: 5px;
        border: 1px solid silver;
        width: 30%;
        height: auto;
        z-index: 9999;
        top: 150px;
        padding: 8px;
        text-align: center;
        box-sizing: border-box;
    }
    .tpro .modtransferir input[type="number"]{
        width: 80%;
        float: left;
        font-size: 1vw;
        
    }
    .tpro .modtransferir p{
        width: 18%;
        float: left;
        text-align: center;
        height: 30px;
        margin-top: 2px;
        font-size: .8vw;
        padding-top: 5px;
        box-sizing: border-box;
        font-weight: 600;
        color: silver;
        margin-bottom: 10px;
    }
    .tpro .modtransferir .cancomp1{
        width: 100%;
        overflow: hidden;
        height: auto;
        border-bottom: 1px solid silver;
        margin-bottom: 10px;
    }
    #cinv .tpro .modtransferir .btn_cerr_caja{
        width: 20%;
        float: left;
        border-radius: 3px;
        background: var(--rojo);
        height: 30px;
        margin-top: 0;
    }
    #cinv .tpro .modtransferir h4{
        width: 80%;
        text-align: left;
        height: 30px;
        float: left;
        font-size: 1vw;
        color: var(--naranja);
    }
    #cinv .tpro .modtransferir .btnconf{
        width: 100%;
        margin: 0;
    }
    #cinv .tpro .modtransferir label{
        width: 30%;
        float: left;
        font-size: 1vw;
        height: 30px;
        margin-bottom: 5px;
        box-sizing: border-box;
        padding-top: 5px;
    }
    #cinv .tpro .modtransferir select{
        height: 30px;
        margin-bottom: 5px;
        width: 65%;
        float: left;
        margin-top: 0;
    }
    #cinv .tpro .modtransferir h3{
         width: 70%;
        float: left;
        height: 30px;
        margin-bottom: 5px;
        box-sizing: border-box;
        padding-top: 5px;
    }
    .labelmod{
        width: 150px;
        display: inline-block;
        text-align: center;
        background: var(--amarillo);
        font-size: 1vw;
        margin-left: 10px;
        border-radius: 3px;
        height: 30px;
        margin-top: 5px;
        padding: 3px;
        box-sizing: border-box;
        cursor: pointer;
    }
    #cinv .tpro .cajaverped .btncerr{
        width: 15%;
        float: left;
        background: var(--rojo);
        border-radius: 3px;
        height: 30px;
    }
    #cinv .tpro .cajaverped h2{
        width: 85%;
        float: left;
        height: 40px;
        text-align: left;
        box-sizing: border-box;
    }
    #cinv .tpro .cajaverped #p3{
        width: 100%;
        font-size: 1vw;
        font-weight: 600;
    }
    #cinv .tpro td .btnverped{
        width: 50px;
        border-radius: 3px;
        padding: 5px;
    }
    #cinv .tpro #tdbtnverped{
        width: 1%;
    }
    .modulo_inv{
        width: 100%;
    }
    .ingfacnew{
        width: 100%;
    }
    .ingfacnew .datfactnew {
        width: 100%;
        height: auto;
        padding: 5px;
        box-sizing: border-box;
    }
    .ingfacnew .datfactnew input, .ingfacnew .datfactnew select{
        width: 100%;
        height: 35px;
        margin-bottom: 5px;
    }
    .ingfacnew .datfactnew button{
        background: var(--verde);
        height: 35px;
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        width: 100%;
    }
    .ingfacnew .datfactnew button img{
        height: 100%;
        background: 0;
    }
    .ingfacnew .cajaprodfac{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    .ingfacnew .cajaprodfac .caja_select2, .ingfacnew .cajaprodfac input{
        height: 35px;
        width: 100%;
        margin-bottom: 5px;
        font-size: 5vw;
        text-align: center;
    }
    .ingfacnew .cajaprodfac input{
        padding: 5px;
        box-sizing: border-box;
        border: 1px solid grey;
    }
    .ingfacnew .cajaprodfac #btningprofac{
        background: var(--azul);
        height: 35px;
        padding: 8px;
        box-sizing: border-box;
        border: 0;
        width: 100%;
    }
    .ingfacnew .cajaprodfac #btningprofac img{
        height: 100%;
        background: 0;
    }
    .ingfacnew .tablaprodfac{
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }
    .ingfacnew .tablaprodfac table{
        width: 100%;
        text-align: center;
        border-collapse: collapse;
        margin-bottom: 5px;
    }
    .ingfacnew .tablaprodfac table td,.ingfacnew .tablaprodfac table th{
        border: 1px solid black;
        padding: 3px;
    }
    .ingfacnew .tablaprodfac #eliprodfac{
        background: var(--rojo);
        height: 35px;
        padding: 8px;
        box-sizing: border-box;
        border: 0;
        width: 100%;
    }
    .ingfacnew .tablaprodfac #eliprodfac img{
        height: 100%;
        background: 0;
    }
    .ingfacnew .tablaprodfac .confingfac{
        background: var(--verde);
        height: 35px;
        padding: 5px;
        box-sizing: border-box;
        border: 0;
        width: 100%;
        font-size: 6vw;
        color: white;
    }
    .ingfacnew .tablaprodfac .confingfac img{
        height: 100%;
        background: 0;
        margin-bottom: -5px;
        margin-left: 10px;
    }
    .ingfacnew .datfactnew #btn_eli_fac_temp{
        background: var(--rojo);
        color: white;
        font-size: 5vw;
    }
    #panel_pagos .pago_anticipado{
        display: inline-block;
        width: 100%;
        background: 0;
        color: var(--azul);
        font-size: 6vw;
        margin-bottom: 5px;
        margin-top: 5px;
        border-radius: 5px;
        padding: 3px;
        box-sizing: border-box;
        border: 2px solid var(--azul);
        cursor: pointer;
        text-align: center;
    }
    #panel_pagos #pago_anticipado{
        display: none;
    }
    #panel_pagos #pago_anticipado:checked + label{
        background: var(--azul);
        color: white;

    }
}