::-webkit-scrollbar{-webkit-appearance:none;width:12px}::-webkit-scrollbar-thumb{border-radius:4px;background-color:#3e413d;-webkit-box-shadow:0 0 1px rgba(255,255,255,.5)}


/*======================================
    CSS GENERALES 
======================================*/

*{
	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
	font-family: "gotham_htfmedium", sans-serif;
}

body, html {
	width: 100%;
	overflow-x: hidden;
	font-family: "gotham_htfmedium", sans-serif;
	height: 100%
  margin:0px;
  padding: 0px;

}

:root{
	 --bg-gd-color-one: #00b052;
	 --bg-gd-color-two: #007336;
}



.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: url('../images/gifsoccer.gif') 50% 50% no-repeat rgb(255,255,255);
    opacity: .8;
}



a {
	font-size: 14px;
	line-height: 1.7;
	color: #666666;
	margin: 0px;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
   -o-transition: all 0.4s;
   -moz-transition: all 0.4s;
   text-decoration: none;
}

a:focus {
	outline: none !important;
}

a:hover {
	text-decoration: none;
  color: #666666;
}


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

p {
	font-size: 14px;
	line-height: 1.7;
	color: #666666;
	margin: 0px;
}

ul, li {
	margin: 0px;
	list-style-type: none;
}


input {
	outline: none;
	border: none;
}

textarea {
  outline: none;
  border: none;
}

textarea:focus, input:focus {
  border-color: transparent !important;
}

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; }
textarea:focus::-moz-placeholder { color:transparent; }
textarea:focus:-ms-input-placeholder { color:transparent; }

input::-webkit-input-placeholder { color: #999999;}
input:-moz-placeholder { color: #999999;}
input::-moz-placeholder { color: #999999;}
input:-ms-input-placeholder { color: #999999;}

textarea::-webkit-input-placeholder { color: #999999;}
textarea:-moz-placeholder { color: #999999;}
textarea::-moz-placeholder { color: #999999;}
textarea:-ms-input-placeholder { color: #999999;}


label {
  display: block;
  margin: 0;
}


button {
	outline: none !important;
	border: none;
	background: transparent;
}

button:hover {
	cursor: pointer;
}

input[type='checkbox'] {
   width: 25px;
   height: 25px;
   display: inline-block;
   margin-left: 5%
}

.regular-checkbox {
  -webkit-appearance: none;
  background-color: #fafafa;
  border: 1px solid #cacece;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
  padding: 9px;
  border-radius: 3px;
  display: inline-block;
  position: relative;
}

.regular-checkbox:active, .regular-checkbox:checked:active {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

.regular-checkbox:checked {
  background-color: #e9ecee;
  border: 1px solid #adb8c0;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
  color: #99a1a7;
}

.regular-checkbox:checked:after {
  content: '\2714';
  font-size: 14px;
  position: absolute;
  top: 0px;
  left: 3px;
  color: #99a1a7;
}


.selectForms{
     width: 90%; 
     margin-left: 5%; 
     height: 40px; 
     top:50%; 
     margin-top: -20px; 
     position: absolute; 
     border: none; 
     outline: none; 
     background: transparent; 
     box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}

.selectForms:hover{
   box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
   border: none; 
   outline: none;
}

.selectForms option{
  background: #F8F9FA;
  border: none;
  outline: none
}



.selectForms:focus{
   background: #F8F8FA;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
     border: none; 
     outline: none;
}


.selectForms option{
   padding: 30px;
   background: #F8F9FA;
   display: block;
}

select{
  -webkit-appearance:menulist!important; 
}

/*======================================
     LOGIN 
======================================*/


.limiter {
  width: 100%;
  margin: 0 auto;
  height: auto;
}

.container-login100 {
  width: 100%;  
  min-height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 15px;

  background: url(../images/over_image.jpg);

}

#resumenOrderDay{
  cursor: pointer;
}


/*======================================
     MENSAJES DE ALERTA
======================================*/

.txt1 {
  font-size: 13px;
  line-height: 1.4;
  color: #cccccc;
}



/*======================================
    FORMULARIOS
======================================*/


.wrap-login100 {
  width: 560px;
}


.login100-form,
.style-forms {
  width: 100%;
  background-color: transparent;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}

.login100-form-title {
  width: 100%;
  display: block;
  font-family: "peace_sansregular";
  font-size: 3em;
  color: #fefefe;
  line-height: 1.2;
  text-transform: uppercase;
  text-align: center;
}


.wrap-input100 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  width: 50%;
  height: 75px;
  position: relative;
  border: 1px solid #e0e0e0;
  border-bottom: none;
  background-color: #fff;
  display: inline-block;
}

.wrap-input100.rs1 {
  border-top-left-radius: 12px;
  border-right: none;
}

.wrap-input100.rs2 {
  border-top-right-radius: 12px;
}

.wrap-input100.rs3 {
  border-radius: 0px;
  border-right: none;
}

.wrap-input100.rs4 {
  border-radius: 0px;
}


.wrap-input100.rs5 {
  border-radius: 0px;
  width: 100%;

}


.wrap-input100.rs6 {
  border-radius: 12px;
  width: 100%;
  border: 1px solid #e0e0e0;

}



.wrap-input100.rs7 {
  border-radius: 12px 12px 0px 0px;
  width: 100%;
  border: 1px solid #e0e0e0;
  border-bottom: none;

}

.wrap-input100.rs8 {
  border-radius:  0px;
  width: 100%;
  border: 1px solid #e0e0e0;
}

.wrap-input100.rs9 {
  border: none; 
  height: 50px; 
  width: 100%; 
  background: none
}


.wrap-input100.rs10 {
  border-radius:  0px;
  border: 1px solid #e0e0e0;
}

.wrap-input100.rs11 {
  border-radius:  0px;
  border: 1px solid #e0e0e0;
}






.label-input100 {
  font-size: 15px;
  color: #555555;
  line-height: 1.2;

  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  padding-left: 30px;
  left: 0;
  top: 28px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}

.input100 {
  font-size: 15px;
  color: #555555;
  line-height: 1.2;

  display: block;
  width: 100%;
  background: transparent;
  padding: 0 20px;
  padding-top: 20px
}

input.input100 {
  height: 100%;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}


.input100:focus {
  height: 55px;
}

.input100:focus + .label-input100 {
  top: 10px;
  font-size: 13px;
  color: #111111;
}

.has-val {
  height: 55px !important;
}

.has-val + .label-input100 {
  top: 10px;
  font-size: 13px;
  color: #111111;
}



.container-login100-form-btn {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.login100-form-btn {
  font-size: 15px;
  color: #fff;
  line-height: 1.2;
  text-transform: uppercase;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  width: 100%;
  height: 70px;
  overflow: hidden;
  background: #171616;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
  position: relative;
  z-index: 1;
}


.login100-form-btn-act,
.login100-form-btn-can {
  font-size: 15px;
  color: #fff;
  line-height: 1.2;
  text-transform: uppercase;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  width: 50%;
  height: 70px;
  overflow: hidden;
  background: #111111;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
  position: relative;
  z-index: 1;
}

.login100-form-btn-act
{
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 0px;
}

.login100-form-btn-can
{
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 12px;
  background: #ffff;
  background: linear-gradient(#959494,#A7A5A5);
  background: -o-linear-gradient(#959494,#A7A5A5);
  background: -moz-linear-gradient(#959494,#A7A5A5);
}

.login100-form-btn::before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  opacity: 0;

  background: #ffff;
  background: linear-gradient(#CDA434,#EEBC34);
  background: -o-linear-gradient(#CDA434,#EEBC34);
  background: -moz-linear-gradient(#CDA434,#EEBC34);

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
  color:#fff;
}


.login100-form-btn:hover {
  background-color: transparent;
  color:#fff;
}
.login100-form-btn:hover:before {
  opacity: 1;
  color:#fff;
}


.login100-form-btn:active{
  color: #ffff!important;
   text-decoration: none
}

.login100-form-btn:link{
  color: #ffff!important;
  text-decoration: none
}

.login100-form-btn:visited{
  color: #ffff!important;
  text-decoration: none
}


@media (max-width: 576px) {
  .wrap-input100 {
    width: 100%;
  }

  .wrap-input100.rs1 {
    border-top-right-radius: 12px;
    border-right: 1px solid #e0e0e0;
  }

  .wrap-input100.rs2 {
    border-top-right-radius: 0px;
  }

   .wrap-input100.rs3, 
   .wrap-input100.rs4{
    border-radius: 0px;
    border-right: 1px solid #e0e0e0;
  }

}



/*======================================
     CONTENEDORES 
======================================*/

.limiter{
  margin: 0px;
  padding: 0px;
}



.wrap{
  width:90%; 
  margin: auto; 
  margin-top: 20px; 
  padding: 0; 
  height: 50px; 
  border-radius: 5px; 
  box-shadow: 0px 0px 16px 1px rgba(0,0,0,.2);
}

.wrap-box{
  width:94%; 
  margin: auto; 
  margin-top: 20px;
}


.wrap-box-shadow{
  height: 100%;
  border-radius: 5px; 
  box-shadow: 0px 0px 16px 1px rgba(0,0,0,.2);
}


.box-container-line{
    border: 1px solid #ECECEC; 
    border-radius: 5px; 
    height: 80px
}




/*======================================
     BARRA FIJA INFERIOR
======================================*/


.title-menu{
	font-family: peace_sansregular;
	font-size: 1em;
	color: #7F7F7F;
  line-height: 40px;
  display: block;
  text-align: center;
}

.nav-fixed{
	width: 100%; 
	height: 40px; 
	position: fixed; 
	bottom: 0px; 
	left: 0px; 
  border-top: 1px solid #C6C6C6;
  z-index: 100;
  background: #FFFF
}

.wrap-nav-fixed{
	height: 100%; 
	width: 90%; 
	margin-left: 5%;
}

.top-fixed{
  width: 100%; 
  position: fixed; 
  top: 0px; 
  left: 0px; 
  border-bottom: 1px solid #F5F5F5;
  z-index: 100;
  background: #FFFF;
}


.item-slider-menu{
   height: 30px; 
   margin-top: 5px; 
   border-radius: 4px; 
   border: 1px solid #171616; 
   text-align: center; 
   color: #ffff;
   padding: 5px; 
   display: inline-block; 
   background:#171616;
   cursor: pointer;
   margin-right: 5px;
   font-size: .8em
}


.item-slider-menu:hover{
  background: #ffff;
  color: #171616;
  
}


.active-menu-option{
     background: #ffff!important;
     color: #666666!important;
     cursor: pointer!important;
}


/*======================================
     RECUADROS RESUMEN
======================================*/
.detail-num-item{
   font-size: .7em;
   display: block;
   width: 25px;
   height: 25px;
   border-radius: 50%;
   background: #CDA434;
   color:#fff;
   padding: 5px;
   text-align: center;
   font-weight: bold
}

.detail-num-item{
  position: absolute;
  top:5px;
  right: 5px;
}



.title-box-container{
   display: block;
   font-size: .9em;
   color: #666666;
   padding: 5px; 
   border-bottom: 1px solid #ECECEC;
   text-align: center;
}



.totals-title-box span{
   display: block;
   text-align: center;
   font-size: .8em;
   color: #666666
}



/*======================================
     CATEGORIAS 
======================================*/

#wrap-menu-items{
   padding: 10px;
   position: relative;
}



.item-menu{
   padding: 5px;
     height: 140px;
}

.item-menu a{
   display: block;
   width: 100%;
   height: 100%;
   border-radius: 4px;
   border:1px solid #A7A5A5;
   position: relative;
   cursor: default;
}



.item-menu a img{
   position: absolute;
   width: 140px;
   height: 80px;
   right: 10px;
   top:5px;
   border-radius: 4px
   
}


.item-menu a span.name-item{
    position: absolute;
   left: 10px;
   top:10px;
   font-size: .95em;
   width: 100px;
   font-weight: bold;
}

.item-menu .prices-box{
  display: block;
   position: absolute;
   left: 10px;
   top:90px;
   color: #959494
}

.price-item{
  display: block; 
  font-size: .9em; 
  font-weight: bold; 
  color: #fff;
  border-radius: 3px;
  background:#CDA434; 
  padding:5px 15px
}

.pricedescount-item{
  display: block; 
  font-size: .75em; 
  font-weight: bold;
  margin-right: 5px; 
  text-decoration:line-through; 
  color:#cccccc;
}

.descount-item{
  display: block; 
  font-size: .9em; 
  font-weight: bold; 
  margin-top: -67px; 
  color: #CDA434; 
  padding: 5px 13px; 
  border-radius: 3px;
  border:1px solid #CDA434;
  text-align: center;
  
}



.btn-item-category{
  display: inline-block; 
  font-size: .9em; 
  font-weight: bold; 
  margin-right: 5px; 
  color: #fff;
  border-radius: 3px;
  background:#959494; 
  border: 1px solid #959494; 
  padding:5px 15px;
  cursor:pointer;
}

.btn-item-category:hover{
   background: none;
   color: #959494
}



.box-btn-categorys{
  position: absolute; 
  top:90px;
  width: 98%; 
  text-align: right;
}



.msg-box-container{
  position: fixed; 
  width: 100%; 
  height: 100px; 
  top:0px; 
  left:0px; 
  z-index: 2000;
  display: block;
}


.wrap-message{
  position: relative; 
  width: 100%; 
  height: 100%;
}

.box-message{
  width: 280px; 
  height: 60px; 
  background: #CDA434; 
  border-radius: 5px; 
  float: right; 
  margin-top: 15px; 
  margin-right: 10px;
}

.box-message span{
  font-size: 1em; 
  color: #fff; 
  display: block; 
  text-align: center; 
  line-height: 60px;
}


.hide-object{
  display: none;
}

#msg-box-container{
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

/*======================================
     DETALLE ORDENES
======================================*/



.link-minus-plus{
    width: 35px;
    height: 35px;

}

.link-minus-plus span{
    width: 35px;
    height: 35px;
    padding: 8px; 
    background: #CDA434;
    color: #fff;
    cursor: pointer;
    border-radius: 3px
}

.link-minus-plus span:hover{
   background: #F4BD28;

}


/*======================================
   MODALES GENERAL
======================================*/
.box-fixed-modal{
    position: fixed; 
    z-index: 300; 
    top:0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(255,255,255,1); 
    display: none
}

#modal-opencash{
   z-index: 400; 
}

.box-fixed-modal > .wrap-modal{
  position: relative; 
  width: 100%; 
  height: 100%
}


.box-fixed-modal > .wrap-modal > .box-modal{
    width: 32%; 
    background: #ffff; 
    border-radius: 4px; 
    margin: auto; 
    margin-top: 1%; 
    box-shadow: 0px 0px 16px 1px rgba(0,0,0,.2); 
    padding: 20px
}


.modal-header-box{
   border-radius:5px; 
   border: 1px solid #959494; 
   height: 100px; 
   position: relative;
}

.modal-header-box > .info-left{
   position: absolute; 
   font-size: .8em; 
   left: 10px; 
   top: 5px; 
   color: #CAC8C3
}

.modal-header-box > .info-center{
   position: absolute; 
   font-size: .8em; 
   left: 135px; 
   top: 5px; 
   color: #CAC8C3
}


.modal-header-box > .info-left-middle{
   position: absolute; 
   font-size: .8em; 
   left: 10px; 
   top: 22px; 
   color: #CAC8C3
}



.modal-header-box > .info-left-bottom{
   position: absolute; 
   font-size: .8em; 
   left: 10px; 
   top: 40px; 
   color: #CAC8C3
}



.modal-header-box > .info-right{
   position: absolute; 
   font-size: .8em; 
   right: 10px; 
   top: 5px; 
   color: #CAC8C3
}

.modal-header-box > .info-main-big{
    display: block; 
    text-align: right; 
    font-size: 3em; 
    line-height: 100px;
    padding: 10px; 
    color: #959494
}


/***** MODAL KEYBOARD ************/
#modal-keyboard{
   z-index: 500;
}

.box-key{
  margin:0px!important;
  padding: 2px!important
}

.key{
   display: block; 
   font-size: 3em; 
   color: #959494; 
   text-align: center; 
   line-height: 80px;
   background:  #ECECEC;
   border: 1px solid #ECECEC;
   height: 80px;
   cursor: pointer;
}

.key:hover{
  background: none;

}

/***** MODAL ORDERS DETAIL ************/
#modal-detailsorder > .wrap-modal > .box-modal > .modal-header-box > .info-main-big{
   line-height: 60px;
   font-size: 1.8em
}

#wrap-order-car{
   max-height: 230px;
   overflow-y: scroll;
}

.box-order{
   padding: 10px; 
   margin-top:10px
}

.m0p0{
  margin:0px;
  padding: 0px
}

.m0p2{
  margin:0px;
  padding: 2px
}



.item-detail-order{
  font-size: .8em; 
  color: #171616; 
  display: block 
}

.item-price-detail-order{
  font-size: .8em; 
  color: #959494; 
  display: block;
}

.item-modal-order{
  height: 40px;
  max-height: 40px;
  margin: 0px!important
}



/***** MODAL  DETAILS CASH ************/
#modal-detailscash,
#modal-opencash,
#modal-closecash,
#modal-outscash{
  display: none
}

/*======================================
    BOTONES
======================================*/
.btn-big{
  display: block; 
  font-size: 3em;  
  text-align: center; 
  cursor: pointer;
}

.btn-medium{
  display: block; 
  font-size: 1.2em; 
  color: #ffff; 
  text-align: center; 
  line-height: 50px;
  cursor: pointer;
}

.btn-small{
  display: inline-block; 
  font-size: .8em; 
  color: #ffff; 
  text-align: center; 
  cursor: pointer;
  border-radius: 3px;
  padding:8px;

}


.btn-gold{
   border: 1px solid #CDA434!important;
   background: #CDA434!important;
   color: #ffff!important;
}

.btn-dark{
   border: 1px solid #959494;
   background: #959494;
   color: #ffff;
}

.btn-dark:hover{
   background: #A7A5A5;
   border: 1px solid #A7A5A5;
}

.btn-gold:hover{
   background: #F4BD28!important;
   border: 1px solid #F4BD28!important;
 
}


  .btn-close-modal{
    font-size: 2em; 
    display: block; 
    text-align: right;
  }

    .btn-close-modal:hover{
        color: #c6c6c6
    }


.box-buttons span{
  float: right;
  margin-top:5px;
  margin-left: 5px
}




/*======================================
    MODULO UOTS
======================================*/

.container-totals{
   width:90%; 
  margin: auto; 
  margin-top: 40px; 
  padding: 0; 
}






/*======================================
   OCULTAR MOSTRAR 
======================================*/

.obj-hidden{
  display: none;
}

.obj-show{
  display: block;
}




/*======================================
    TABLAS CON ENCABEZADOS FIJOS
======================================*/

.wrapper {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.wrapper > .container {
  width: 100%;
  overflow-y: auto;
  height: 450px;
  border-top: 41px solid transparent;
  border-bottom: 41px solid transparent;
}

.wrapper > .container > table {
  border-spacing: 0;
  border-collapse: collapse;
  width: 100%;
}

.wrapper > .container > table td + td {
  border-left: 1px solid #fff;
}

.wrapper > .container > table td, .wrapper > .container > table th {
  border-bottom: 1px solid #fff;
    background: rgba(205,164,52,.4);
  padding: 10px;
}

.wrapper > .container > table tbody td{
    font-size: .8em
}

.wrapper > .container > table thead tr th,
.wrapper > .container > table tfoot tr td {
  height: 0;
  line-height: 0;
  margin: 0;
  padding-top: 0;
  padding-bottom: 0;
  color: transparent;
  border: none;
  white-space: nowrap;
}

.wrapper > .container > table thead tr th div,
.wrapper > .container > table tfoot tr td div {
  position: absolute;
  color: #666666;
  padding: 10px;
  margin-left: -10px;
  line-height: normal;
  width: 100%;
  z-index: 2;
  text-align: left;
  font-weight: bold;
  font-size: .9em;
}



.wrapper > .container > table thead tr th div {
  top: 0;
}

.wrapper > .container > table tfoot tr td div {
  bottom: 0;
}

.wrapper > .container > table thead tr th:first-child div,
.wrapper > .container > table tfoot tr td:first-child div {
  border-left: none;
}


.info-bar-top{
  font-size: .7em; 
  color: #CAC8C3
}