header, footer {
    height: 4rem;
}
.header-content {
    display: flex;
    align-items: center;
}
.header-content img {
    margin-right: 1rem;
}

.highlight {background-color: #b0e57c; /* Color verdoso resaltado en las partes seleccionadas en el area map*/ }

body, html {
	background-color:#f4f7f6;
	height: 100%!important;
    margin: 0;
    font-size:16px;
    line-height:1.5;
    font-weight:300;
    font-family: 'Roboto', sans-serif;
}
/*
.slide { 
width: 100%;
background: url(/images/slide/slide1.jpg)no-repeat center bottom fixed;
padding: 50px 0;
display: block;
min-height: 1200px;
color: white;
border-bottom:solid 2px #027027;
margin-bottom:50px;
}
*/ 
.flag{ margin:-4px 10px 0px 0px;}

/*SEARCH*/
.formulario_referencia input[type=text] {
    width: 230px;
    -webkit-transition: width 0.4s ease-in-out; 
    transition: width 0.4s ease-in-out;
}

/* When the input field gets focus, change its width to 100% */
.formulario_referencia input[type=text]:focus {
    width: 100%;
}
/*SEARCH*/
.clearfix{
    clear:both;
    margin:0px;
    padding:0px;
}
input#referencia{
	text-align:center;
	    border: 4px solid #05a139;
}

.form-control:focus{
	border-color:#333;
}

.form-control {
    display: block;
    width: 100%;
    height: auto;
    padding: 10px 18px;
    font-size: 16px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #bed4cc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.intro-img{
	margin-top:25px;padding: 15px;background: #fff;border-radius: 4px;border: 1px solid #cfddd9;
}

h1, h2, h3, h4, h5, h6, .nav-pills li a{
	font-family: 'Roboto Condensed', sans-serif;
}

h1.cover-heading::after{
	content:"";
	width:100px;
	height:4px;
	background:#fff;
	margin:10px auto 20px;
	display:block;
}

.formulario_referencia h2{ 
    max-width: 680px;
    margin: 50px auto 15px;
}
h2 {
    font-weight: 600;
    text-transform: uppercase;
    line-height: 130%;
    margin: 0px;
    margin-bottom: 25px;
}
 
h3 {
    font-weight: 600;
    text-transform: uppercase;
    line-height: 130%;
	margin-bottom:25px;
}
img.foto{
	border-radius:4px;
	box-shadow:0px 15px 25px rgba(0,0,0,0.4)
}
.foto2{text-align:center; margin:0px auto;}
img[align="left"]{
	float:left;
	margin:0px 25px 15px 0px;
}
img[align="right"]{
	float:right;
	margin:0px 0px 15px 25px;
}
p.separator-top{
	    border-top: 1px solid #ddd;
    margin: 30px 15px 50px;
}
p {
    margin-bottom: 25px;
    line-height: 170%;
}

.btn {
    font-weight: 900;
    background-color: #333333;
    border: none;
    font-weight: 300;
    text-transform: uppercase;
	transition:all 0.2s ease;
    color: white;
}
.btn:hover{
	    background-color: #027027;
        color: white;
}

.video_portada{
width:100%;
position: absolute;
top: 0px;
left: 0px;
}
.form-control{
margin:0px 0px 10px 0px;
}
.row-fluid img {
	max-width:100%!important;
}
.home {  
height:100vh; 
overflow:hidden;
position: relative;
z-index: 0;
    margin: 0 0 30px;
}
img{
	max-width:100%;
}
.formulario_referencia {  position:absolute!important; top:200px; width: 100%; z-index:3; 	 }

.formulario_referencia h1 , .formulario_referencia h2, .formulario_referencia p {z-index:999999; color: white; width:100%; text-align:center;  text-shadow: 2px 2px #000000;}
.formulario_referencia h1 { font-size:68px!important}
.clearfix { clear: both; margin: 0px!important;}
.active a { background-color: #85b20f!important;}
.nav{ color: white; font-size: 18px;}
.nav li a {
    color: white!important;
    border-right: none;
}

.hvr-bounce-to-right::before {
    background: #85b20f none repeat scroll 0 0!important;
    
}
.navbar-inverse { border-bottom:none!important;}
.btn-carrito { width: 100%;}

.fa { padding: 5px; font-size: 32px!important;}
.numero {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 2px solid #85b20f;
    height: 70px;
    width: 70px;
    margin-top: 15px;
}
.tableform {
	min-width:550px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	overflow: hidden;
	border-left: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
		border:none;
}
.tableform th {
	background: #656870;
	padding: 10px;
	margin: 1px;
	color: #fff;

}
.checkbox-inline input { position:relative!important;}
.footer{
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
}
.tableform td {
	padding: 10px;
	margin: 1px;
	background: #eee;
	border-right: 1px solid #ddd;
	border-top: 1px solid #ddd;
}
.bg-white {
	background: #fff;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid #ddd;
	margin-top:50px;
}
hr {
    margin: 20px 0;
    border: 0; 
    border-top: 1px solid #d1ded9;
}
.caracteristica {
    display: block;
}

.radio-inline input.makibox { position:absolute;}

.detalle{ width:75%;  float:left; font-size:14px;}

.preu_carrito {
color: #027027;
    font-size: 16px;
    margin-top: 0px;
    padding: 0 !important;
    text-align: right;
	width: 17%;
	float:left;
}
.preu { font-size: 22px; color: #027027;}
.preu small {
     content: ""!important;
     display: inline!important;
     padding-left: 10px!important;
}

.preu_total { font-size:18px; font-style:bold; text-align:right; margin-right:20px; }

.panel-body {
    padding: 5px 15px!important;
}

.papelera { margin:2px; padding:0px!important; max-width:16px!important; width: 10%; float:right;}

.carro_alerta { height: 30px; width: 30px; position: absolute; left: -40px; top: 2px;
background-image: url(/images/alerta_carrito.png);
    background-repeat: repeat-x;
}

.header_moon { width: 100%!important;}
.nav { float: right;}
.nav li a {
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 1px;
    margin: 0 10px;
    font-size: 16px;
    padding: 7px 0px;
    font-style: normal !important;
}
.nav > li + li { margin-left: 0px!important;}
.nav li a:hover{
    color:#fff !important;
	background:transparent;
}
.nav li a::before{
	content:"";
	display:block;
	width:0px;
	position:absolute;
	bottom:0px;
	left:0px;
	height:4px;
	background:#fff;
	transition:all 0.3s ease;
}
.nav li a:hover::before{
	width:100%;
}
.caracteristica img {
    left: -10px;
    position: absolute; 
    top: -15px;
    width: 20% !important;
}

.boton_cien { width: 100%!important;}

.panel-success { min-height: 155px;}
.panel-title { text-align: center;}
.panel-title span { font-size: 12px!important; }
.numero h1 { 
    text-align: center;
    margin-top: 13px!important;
    color:#85b20f;
}
.blog-main { padding-left: 0px!important;}
.page-header { margin: 20px 0 20px!important;}

.col-md-2 .form-control { height: 75px!important; padding: 6px 3px!important;}

#head {
    border-top: 4px solid #05a139;
    /*min-height: 100px;*/
    /* position: absolute; */
    /* width: 100%; */
    z-index: 9;
    background-color: grey;
}
#contenido {
    margin-top: 0px !important;
    padding: 50px 15px;
}
#container { max-width: 1170px!important; margin: 0px auto!important; min-height: 100%!important;}
.navbar-inverse {
    background-color: transparent !important;   
}
.navbar {
    position: relative;
    min-height: 120px;
    margin-bottom: 20px;
    padding: 15px 0px;
    border: none;
}
.navbar-brand { padding: 0px!important;}

@media (min-width:980px)
{
	.navbar-brand img { max-height: 150px!important;}
}
@media (max-width:980px)
{
	.navbar-brand img { max-height: 50px!important;}
}
.radio-inline { padding: 0px!important;}
.radio-inline .img-thumbnail { padding: 0px!important;}

.carrito { margin-top: -42px;}

.carrito_sub { display: none;}

.panel-body label, .panel-body img { width: 100%}

.header-wok { 
    background-image: url(/images/header_wok.jpg);
    background-repeat: repeat-x;
    color: white;
    padding: 10px;
    border-radius: 15px 15px 0px 0px;
}
.header-wok h1, .header-wok p {
    text-shadow: 2px 2px black;
    text-align: left;
}
.header-sushi { 
    background-image: url(/images/header_sushi.jpg);
    background-repeat: repeat-x;
    color: white;
    padding: 10px;
    border-radius: 15px 15px 0px 0px;
}
.header-sushi h1, .header-sushi p {
    text-shadow: 2px 2px black;
    text-align: left;
}

.mod {
    border: 1px solid #eeeeee;
    display: inline-block;
    padding: 10px;
    margin: 10px 0px;
    width: 100%;
}

.col-md-2 .btn-success { width: 87px; text-align: center; margin: 20px 0px;}

.col-sm-offset-1 {
    margin-left: 4.333%!important;
}

.btn-success {  background-color: #027027!important;}
.panel-heading {  background-color: #027027!important; color: white!important;}

.scrollup {
    width: 40px;
    height: 43px;
    position: fixed;
    bottom: 50px;
    right: 100px;
    display: none;
    background-color: #027027;
    color: white;
}

#ingredients { display:none;}

.peu {
    font-size: 14px;
    margin: 2.5em auto auto;
    padding: 40px 15px;
    text-align: center;
    color: #fff;
   background-color: #027027;
}
.peu a{
	color:#fff;
	text-decoration:underline;
}
.peu a:hover{
	text-decoration:none;
}

/*#undun { display:none;}*/

#map { width:100%; height:500px; margin-top:50px;}

.panel-heading { min-height: 55px;}

.inline_moon{ margin-top:28px;}

input[type=checkbox], input[type=radio] { top: 2px;
    right: 7px; margin-left: 0px!important;}

.list-group label { display:block!important;}

.nav-tabs li {
background-color: #dff0d8 !important;
    float: left;
    margin: 0 1%;
    width: 48% !important;
	border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
}
.nav-tabs {
    border-bottom:none!important;
}
.nav-tabs li a {
border-right: none!important;
 margin-right: 0px!important;
}

.interior {
    min-height: 100%;
    padding-top: 100px;
    background: #f4f7f6 url(../images/bg-interior.jpg) center -100px no-repeat;
}
.velo{
	background:#000000a6;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
    z-index: 2;
}
.no-video{
	display:none;
	width:100%;
	height:100vh;
	background: #000 url(../images/poster.jpg) center top no-repeat;
	background-size:cover;
}
.table-responsive {
    border: none !important;
}
.tabla-anadir input{
	padding:5px 10px;
}

.cant, .anadir{
	width:45%;
}

#container {
    max-width: 1170px !important;
    margin: 0px auto !important;
}
#contenido {
    margin-top: 0px !important;
    padding: 50px 40px;
}
.wk, .wk:active{
background-image:url(../images/grande_box.png);
background-position:center;
background-repeat:no-repeat;

}
.ss, .ss:active{
background-image:url(../images/prod/makimango.jpg);
background-position:center;
background-repeat:no-repeat;
background-size:100%;
color:white;
}
.mn, .mn:active{
background-image:url(../images/prod/none.jpg);
background-position:center;
background-repeat:no-repeat;

}
.ot, .ot:active{
background-image:url(../images/prod/edamame.jpg);
background-position:center;
background-repeat:no-repeat;
background-size:100%;
color:white;
}
/* input[type=number]::-webkit-inner-spin-button,  */
/* input[type=number]::-webkit-outer-spin-button {  */
  /* -webkit-appearance: none;  */
  /* margin: 0;  */
/* } */



.col-md-2 .form-control {
    height: auto!important;
    padding: 6px!important;
    width: 87px;
}
.col-md-2 .btn-success {
    width: 87px;
    text-align: center;
    margin: 10px 0px;
}
@media (min-width:1024px){
.btn-block {
    width: 48%;
    height: 224px; 
    background-size: auto 100%;
    font-size: 48px;
    color: #fff;
    font-weight: bolder;
    text-shadow: 0px 0px 5px rgba(0,0,0,1);
    float: left;
    margin: 7px 7px 7px 0px !important;
	transition:all 0.2s ease;
	display:block;
}
.btn-block p { margin:auto 0px!important;  }
.btn-block:hover{

color: #fff;
}
.wk, .wk:active{
background-image:url(../images/grande_box.png);
background-position:center;
background-repeat:no-repeat;
}
.ss, .ss:active{
background-image:url(../images/prod/makimango.jpg);
background-position:center;
background-repeat:no-repeat;
background-size:100%;
}
.mn, .mn:active{
background-image:url(../images/prod/none.jpg);
background-position:center;
background-repeat:no-repeat;
}
.ot, .ot:active{
background-image:url(../images/prod/edamame.jpg);
background-position:center;
background-repeat:no-repeat;
background-size:100%;
}
}

.panel.panel-success{
overflow:hidden;
}
label input[type="radio"]{
transition:all 0.2s ease;
}
label input[type="radio"]:checked{
box-shadow:0px 0px 0px 1000px rgba(165,211,45,0.5);
}
.lista{
padding:20px 0px;
border-top:1px solid #ddd;
}

.ing {
    padding: 5px 10px;
    background: #f8f8f8;
    border: 1px solid #dedede;
    border-radius: 3px;
    width: auto;
    float: left;
    margin: 3px;
}

.altura{
min-height: 177px;
}
.total1 {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
    min-height: 177px;
    width: 100%;
}
.margin0{
margin:0px;
}
.lista .panel-title{
color:#333;
font-weight:bold;
}

.pull-left{
float:left;
}
.pull-right{ 
float:right; 
}

.total {
    padding: 10px 50px 20px;
    background-color: #A5D32D;
    color: #fff;
    margin: 0px 0px 50px;
    border-radius: 3px;
    border: 0px;
}

.registro {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
    
    width: 100%;
    max-width: 100%;
    margin: 0px auto 50px;
    min-height: 225px;
}



@media (max-width:480px){


navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    max-height: 100% !important;
}

.btn.btn-lg.btn-success{
    font-size: 26px !important; 
}

#yacliente .col-md-6, #registrar .col-md-6{
width:100% !important;
    border: 1px solid #dedede;
}

.row{margin:0px !important;}
.blog-main {
    padding: 0px!important;
}
.panel-success {
     min-height: auto;
}
.panel-body {
    margin: 0px 0px 0px 0px!important;
	    padding: 10px !important;
	}
.panel-success{margin: 0px 0px 10px 0px!important;}	
.navbar-toggle{margin-right:0px;}
.container{overflow:hidden;}
.header_moon{margin:0px !important;}
.nav-pills {
    width: 109%;
    border-top: 1px solid #91BA27;
    margin: 0px -15px;
}
.nav-pills>li {width: 25%;}
.nav-pills>li:last-child a {border:0px;}
.nav-pills>li a {text-align:center;}

.list-group-item {width: 100%!important;
    float: left;}

.blog-main .col-md-6  h3 {
    font-size: 18px;
    font-weight: 600;
    text-align: left !important;
    padding-left: 10px;
	margin:0px;
}
.blog-main .col-md-6  blockquote {
    padding: 0px 10px;
    margin: 0 0 0px;
    border-left: 0px;
}
.preu {
    font-size: 14px!important;
}
.mod { padding: 2px!important;}
.mod p { margin:0px!important;}
.blog-main .mod .col-md-6{
min-height:105px;
}

.blog-main .col-md-2 input.form-control{
float:left;
width: 48% !important;
}

.blog-main .col-md-2 button{
float:right;
        width: 48%;
    text-align: center;
    padding: 0px;
    height: 35px;
    line-height: 13px;
    margin: 10px 0px;
}





#head {
    min-height: 70px;
}
#container {
    max-width: 1170px!important;
    margin: 0px 10px!important;
}
.col-md-2, .col-md-6, .col-md-8, .col-md-4{
width:100%;
padding:0px;
}
.altura{
height:auto;
min-height:auto;
} 
.panel {
    margin-bottom: 0px;
    background-color: #fff;
    border: 0px;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.panel-heading {
    padding: 10px 15px;
    border-bottom: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.img-thumbnail {
    border-radius: 0px;
	}
.total1 {
    border: 1px solid #ddd !important;
    padding: 10px;
    text-align: center;
    min-height: 44px;
    width: 100%;
}	
.total1 h4 {
    margin: 0px !important;
    float: left;
	font-weight:bold;
}
.total1 p {
    margin: 0px !important;
    float: right;
	font-weight:bold;
	font-size:16px;
}
.panel img{
width:100%;
}
.scrollup {
    width: 40px;
    height: 43px;
    position: fixed;
    bottom: 71px;
    right: 2px;
}	
.registro{
min-height:auto;
}
.registro h4{
font-weight:bold;
}
#pedido .btn-success{
font-size:30px !important;
}

}

@media (max-width: 380px){



.blog-main .col-md-6 h3 {
    font-size: 14px;
}
blockquote {
    font-size: 11px !important;
}
}

.radio-inline a{transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; }
.col-md-4 .panel-body a:hover img{
    box-shadow: 0px 0px 80px rgba(0,165,211,45,1);
}
 
.list-group-item.col-md-3{
overflow:hidden;
}
.badge input[type="checkbox"]:checked {
    box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
	-webkit-box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
	-moz-box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
}
input.makibox[type="checkbox"]:checked {
    box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
	-webkit-box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
	-moz-box-shadow: 0px 0px 0px 400px rgba(165,211,45,0.5);
}


.btn {
   
    font-weight: 900;
    
}
.btn-carrito {
    width: 100%;
	border: 0px;
    background-color: #85B20F !important;
}
  
  @media (min-width: 768px) and (max-width:1024px){
.lista .col-md-2{
    width: 20%;
    float: left;
}  
.lista .col-md-8{
    width: 60%;
    float: left;
}  

}


@media (min-width: 480px) and (max-width: 760px){

.blog-main .col-md-6 {
    width: 48% !important;
    float: left;
    margin: 1%;
}
.col-md-6 h3{
margin:0px;
}
blockquote {
    padding: 10px 0px;
    margin:0px;
    font-size: 14px;
    border-left: 0px;
}
}

.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    max-height: 100%;
}
.carrito_sub .list-group{
padding:10px;
}


.contacto iframe{
	margin-bottom:30px;
}
.contacto .well{
	margin: 48px 0 0 !important; 
}
    

/*davidp*/
html, body {
    height:100%!important;
}
main {
    min-height:70vh!important;
}
.breadcrumb{background-color:transparent!important;
padding:0!important}

.btn-primary-header{
    background-color: transparent!important;
    font-family: Montserrat;
    text-transform: uppercase;
   /* font-weight: 700;
    font-size: 1rem!important;
    line-height: 1rem;*/
}

.btn-primary-header:hover{
    color: #05A139!important;
}
.btn-primary-header:selected{
    background-color: #05A139!important;
}
@media (min-width:768px){
#head .btn-group-sm>.btn, #head .btn-sm {
	position:relative!important;
    padding: 0px;
	padding-left: 0.7rem!important;
    padding-right: 0.7rem!important;
    border-radius:0px!important;
	    font-size: 14px!important;
    line-height: 25px!important;
	font-weight:700!important;
	border-radius:0px !important;
	
	
}
}
.btn-primary-header{position:relative!important;}
/*#head .btn-primary-header:hover::before {
    content: "";
    position: absolute;
    background-color: rgb(5,161,57);
    height: 2px;
    width: 100%;
    bottom: 0;
    left: 0;
}*/
#head .btn-primary-header:hover, #head .btn-primary-header.active{color: #05a139;
    background-color: black!important;
}
@media (max-width:768px){
.movil-men {
    padding: 0 !important;
    margin: 2rem auto;
}
#head .movil-men .btn-group-sm>.btn, #head .movil-men .btn-sm{
	font-size:0.7rem!important;
}
}

.btn:focus{
    border:none!important;
    outline:none!important;
	box-shadow: none!important;
  }

#head {
    border-top: 4px solid #05a139;
    background-color: #027027;
}
.peu {
    font-size: 13px;
    margin: 2.5em auto auto;
    padding: 2rem 1rem;
    text-align: center;
    color: #fff;
    background-color: #383d41;
}
.col-sm-12 .col-md-6 .col-lg-4{border: 0px solid lightgray!important;background-color:white;}
a {
    color: #027027;
    text-decoration: none;
    background-color: transparent;
}
a:hover{color:#383d41;}
#imageContainer{margin-right:1rem;}
.fa-shopping-cart:before {
    content: "\f07a";
    font-size: 11px;
}
h2 {
    font-weight: 400;
    text-transform: none;
    line-height: 130%;
    margin: 0px;
    margin-bottom: 25px;
}
.card h2 {
    font-weight: 600;
    text-transform:uppercase;
    line-height: 130%;
    margin: 0px;
    margin-bottom: 25px;
}
.card-header {
padding: 0rem .5rem;}
.card-body {
padding: 1rem;}
.table-hover tbody tr:hover {
    color: #212529;
    background-color: rgba(0, 0, 0, 0);
}
.micuenta_menu .nav li a{
    color:#05a139!important;
    float: left!important;
    padding-left: 0px!important;
}

.micuenta_menu ul{
    float: left!important;
}

.micuenta_menu{
    padding-left: 0px!important;
}

.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1170px;
}

.cabecera_web{
    background-image: url("https://roco2.crealogica.eu/wp-content/uploads/2024/10/piezas.webp");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}



/*menú mobile*/
@media screen and (max-width: 950px){
.movil-men {
    display: none !important;
}}
@media screen and (min-width: 950px){
.zak-toggle-menu {
    display: none !important;
}}
.zak-toggle-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 20px;
	position:absolute;
	right:1rem;
}
.zak-toggle-menu .zak-menu-toggle {
    padding: 0 2px;
    border: none;
    color: inherit;
    background: initial;
    line-height: normal;
}
.zak-toggle-menu .zak-icon {
    width: 28px;
    height: 28px;
    fill: #05a139;
}
.offcanvas{--bs-offcanvas-height: 80vh!important;}
#offcanvasTop{z-index:10000;}
.zak-mobile-nav-close {
    position: absolute;
        top: 16px;
    right: 16px;
    padding: unset;
    border: unset;
    color: unset;
    background-color: transparent !important;
    cursor: pointer;
    text-align: center;
}
.zak-mobile-nav-close .zak-icon {
    width: 24px;
    height: 24px;
	fill: #FAFAFA;
}
.zak-mobile-menu a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: start;
    padding: 14px 16px;
    color: #FAFAFA;
    word-break: break-word;
    -ms-hyphens: auto;
    hyphens: auto;
	font-family: Montserrat!important;
    font-weight: 400!important;
    font-size: 15px!important;
    line-height: 1.8!important;
}
.zak-mobile-menu a:hover{color:rgb(5,161,57)!important;}
.zak-mobile-menu li:last-child {
    border-bottom: none!important;
}
.zak-mobile-menu li {
    border-bottom: 1px solid #3F3F46;
}
.zak-icon {
display: block;
    font-family: "themegrill-icons";
    font-size: 1rem;
    font-style: normal;
	transition: all 0.3s;
}

.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl {
    --bs-offcanvas-zindex: 1045;
    --bs-offcanvas-width: 400px;
    --bs-offcanvas-height: 30vh;
    --bs-offcanvas-padding-x: 1rem;
    --bs-offcanvas-padding-y: 1rem;
    --bs-offcanvas-color: var(--bs-body-color);
    --bs-offcanvas-bg: var(--bs-body-bg);
    --bs-offcanvas-border-width: var(--bs-border-width);
    --bs-offcanvas-border-color: var(--bs-border-color-translucent);
    --bs-offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-offcanvas-transition: transform 0.3s ease-in-out;
    --bs-offcanvas-title-line-height: 1.5
}

@media (max-width: 575.98px) {
    .offcanvas-sm {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: flex;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        transition: var(--bs-offcanvas-transition)
    }
}

@media (max-width: 575.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-sm {
        transition:none
    }
}

@media (max-width: 575.98px) {
    .offcanvas-sm.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%)
    }

    .offcanvas-sm.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(100%)
    }

    .offcanvas-sm.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(-100%)
    }

    .offcanvas-sm.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(100%)
    }

    .offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing {
        transform: none
    }

    .offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing {
        visibility: visible
    }
}

@media (min-width: 576px) {
    .offcanvas-sm {
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-sm .offcanvas-header {
        display: none
    }

    .offcanvas-sm .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 767.98px) {
    .offcanvas-md {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: flex;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        transition: var(--bs-offcanvas-transition)
    }
}

@media (max-width: 767.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-md {
        transition:none
    }
}

@media (max-width: 767.98px) {
    .offcanvas-md.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%)
    }

    .offcanvas-md.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(100%)
    }

    .offcanvas-md.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(-100%)
    }

    .offcanvas-md.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(100%)
    }

    .offcanvas-md.show:not(.hiding),.offcanvas-md.showing {
        transform: none
    }

    .offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing {
        visibility: visible
    }
}

@media (min-width: 768px) {
    .offcanvas-md {
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-md .offcanvas-header {
        display: none
    }

    .offcanvas-md .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 991.98px) {
    .offcanvas-lg {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: flex;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        transition: var(--bs-offcanvas-transition)
    }
}

@media (max-width: 991.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-lg {
        transition:none
    }
}

@media (max-width: 991.98px) {
    .offcanvas-lg.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%)
    }

    .offcanvas-lg.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(100%)
    }

    .offcanvas-lg.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(-100%)
    }

    .offcanvas-lg.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(100%)
    }

    .offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing {
        transform: none
    }

    .offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing {
        visibility: visible
    }
}

@media (min-width: 992px) {
    .offcanvas-lg {
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-lg .offcanvas-header {
        display: none
    }

    .offcanvas-lg .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 1199.98px) {
    .offcanvas-xl {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: flex;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        transition: var(--bs-offcanvas-transition)
    }
}

@media (max-width: 1199.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-xl {
        transition:none
    }
}

@media (max-width: 1199.98px) {
    .offcanvas-xl.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%)
    }

    .offcanvas-xl.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(100%)
    }

    .offcanvas-xl.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(-100%)
    }

    .offcanvas-xl.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(100%)
    }

    .offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing {
        transform: none
    }

    .offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing {
        visibility: visible
    }
}

@media (min-width: 1200px) {
    .offcanvas-xl {
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-xl .offcanvas-header {
        display: none
    }

    .offcanvas-xl .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

@media (max-width: 1399.98px) {
    .offcanvas-xxl {
        position:fixed;
        bottom: 0;
        z-index: var(--bs-offcanvas-zindex);
        display: flex;
        flex-direction: column;
        max-width: 100%;
        color: var(--bs-offcanvas-color);
        visibility: hidden;
        background-color: var(--bs-offcanvas-bg);
        background-clip: padding-box;
        outline: 0;
        transition: var(--bs-offcanvas-transition)
    }
}

@media (max-width: 1399.98px) and (prefers-reduced-motion:reduce) {
    .offcanvas-xxl {
        transition:none
    }
}

@media (max-width: 1399.98px) {
    .offcanvas-xxl.offcanvas-start {
        top:0;
        left: 0;
        width: var(--bs-offcanvas-width);
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%)
    }

    .offcanvas-xxl.offcanvas-end {
        top: 0;
        right: 0;
        width: var(--bs-offcanvas-width);
        border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(100%)
    }

    .offcanvas-xxl.offcanvas-top {
        top: 0;
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(-100%)
    }

    .offcanvas-xxl.offcanvas-bottom {
        right: 0;
        left: 0;
        height: var(--bs-offcanvas-height);
        max-height: 100%;
        border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateY(100%)
    }

    .offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing {
        transform: none
    }

    .offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing {
        visibility: visible
    }
}

@media (min-width: 1400px) {
    .offcanvas-xxl {
        --bs-offcanvas-height:auto;
        --bs-offcanvas-border-width: 0;
        background-color: transparent!important
    }

    .offcanvas-xxl .offcanvas-header {
        display: none
    }

    .offcanvas-xxl .offcanvas-body {
        display: flex;
        flex-grow: 0;
        padding: 0;
        overflow-y: visible;
        background-color: transparent!important
    }
}

.offcanvas {
    position: fixed;
    bottom: 0;
    z-index: var(--bs-offcanvas-zindex);
    display: flex;
    flex-direction: column;
    max-width: 100%;
    color: var(--bs-offcanvas-color);
    visibility: hidden;
    background-color: #27272A;
    background-clip: padding-box;
    outline: 0;
    transition: var(--bs-offcanvas-transition)
}

@media (prefers-reduced-motion:reduce) {
    .offcanvas {
        transition: none
    }
}

.offcanvas.offcanvas-start {
    top: 0;
    left: 0;
    width: var(--bs-offcanvas-width);
    border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform: translateX(-100%)
}

.offcanvas.offcanvas-end {
    top: 0;
    right: 0;
    width: var(--bs-offcanvas-width);
    border-left: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform: translateX(100%)
}

.offcanvas.offcanvas-top {
    top: 0;
    right: 0;
    left: 0;
    height: var(--bs-offcanvas-height);
    max-height: 100%;
    border-bottom: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform: translateY(-100%)
}

.offcanvas.offcanvas-bottom {
    right: 0;
    left: 0;
    height: var(--bs-offcanvas-height);
    max-height: 100%;
    border-top: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
    transform: translateY(100%)
}

.offcanvas.show:not(.hiding),.offcanvas.showing {
    transform: none
}

.offcanvas.hiding,.offcanvas.show,.offcanvas.showing {
    visibility: visible
}

.offcanvas-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000
}

.offcanvas-backdrop.fade {
    opacity: 0
}

.offcanvas-backdrop.show {
    opacity: .5
}

.offcanvas-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)
}

.offcanvas-header .btn-close {
    padding: calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);
    margin-top: calc(-.5 * var(--bs-offcanvas-padding-y));
    margin-right: calc(-.5 * var(--bs-offcanvas-padding-x));
    margin-bottom: calc(-.5 * var(--bs-offcanvas-padding-y))
}

.offcanvas-title {
    margin-bottom: 0;
    line-height: var(--bs-offcanvas-title-line-height)
}

.offcanvas-body {
    flex-grow: 1;
    padding: var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);
    overflow-y: auto
}




.carrito-table th, .carrito-table td {
    vertical-align: middle;
    text-align: center;
}
.carrito-ref { width: 15%; text-align: left;}
.carrito-nombre { width: 45%; text-align: left;}
.carrito-precio { width: 10%; text-align: right;}
.carrito-acciones { width: 8%; }
.carrito-table input[type=number] {
    width: 60px;
    display: inline-block;
    vertical-align: middle;
}




.popup-borrar-producto {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffc107;
    color: #212529;
    padding: 20px 30px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    text-align: center;
    min-width: 320px;
    font-size: 1.1em;
}
.popup-btn {
    margin: 10px 10px 0 0;
    padding: 7px 18px;
    border-radius: 3px;
    border: none;
    cursor: pointer;
    font-size: 1em;
}
.popup-btn-disp, .popup-btn-precio {
    background-color: #000;
    color: #fff;
}
.popup-btn-cancelar {
    background-color: #fff;
    color: #212529;
    border: 1px solid #ccc;
}
.popup-recuperar-producto {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #28a745;
    color: #fff;
    padding: 20px 30px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    text-align: center;
    min-width: 320px;
    font-size: 1.1em;
}
.popup-btn-recuperar {
    background-color: #000;
    color: #fff;
}
.text-italic td, .text-italic th, .text-italic {
    font-style: italic !important;
}
#procesando-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100vw; height: 100vh;
    background: rgba(128,128,128,0.5);
    z-index: 9999;
}
#procesando-overlay .loader {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}