@charset "utf-8";

@font-face {
    font-family: Roboto-Condensed;
    src: url(../css/fuentes/Roboto-Condensed.ttf) format("opentype");
}

@font-face {
    font-family: Roboto;
    src: url(../css/fuentes/Roboto-Regular.ttf) format("opentype");
}

@font-face {
    font-family: MyriadPro;
    src: url(../css/fuentes/MyriadPro-Regular.otf) format("opentype");
}

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap");

body{
	text-align:center;
	font-size:14px;
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
               Arial, "Noto Sans", "Liberation Sans", sans-serif;
	color:#242424;
	height: 100%;
	background-size: 100% 200%;
	background-attachment: fixed;
	margin:0px;
}

  :root{
    --tile-radius: 16px;
    --tile-pad: 18px;
    --tile-shadow: 0 8px 24px rgba(0,0,0,.10);
    --tile-shadow-hover: 0 14px 40px rgba(0,0,0,.16);
    --tile-text: #ffffff;
  }

.franjaContenedor{
	margin: auto;
    max-width: 100%;
    overflow: auto;
	margin-bottom:30px;
	margin-top:30px; 
	padding-left: 20px;
    padding-right: 20px;
}

.franjaTexto{ text-align:left; margin-bottom:40px; }

.franjaVerMas{
	float: right;
    font-size: 40px;
	font-weight:normal;
    width: 25%;
    height: 420px;	
}

.franjaVerMas img{ width: 80px; }

.franjaVerMas p{
	margin-top: 120px;
}

.franjaContenedor h2{ 
	text-align: left;
    font-size: 28px;
    border-bottom: 1px #999 solid;
}

a{
	color:#666;
	text-decoration:none;
}

img{
	border:0px;}

a:hover{
	color:#79a500;
	text-decoration:underline;
}

hr{
	color: #530000;
	background-color: #530000;
	height: 2px;
	border:0px;
}

input[type="submit"], input[type="button"]{
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#79a500;
	# background-image: linear-gradient(to bottom, #8ec102, #4c6701);
	border:0px solid;
	height:26px;
	padding-bottom:3px;
	border-radius:5px;
	cursor:pointer;
}

input[type="submit"], input[type="button"]:active{
	color:#CCCCCC;
}

button{
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	# background-color:#a0da01;
	background-color: #709900;
	# background-image: linear-gradient(to bottom, #8ec102, #4c6701);
	border:0px solid;
	height:26px;
	padding-bottom:3px;
	border-radius:5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

button:active{
	color:#79a500;
}

input[type="buttonndd"]{
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#79a500;
	border:0px solid;
	height:26px;
	padding-bottom:3px;
	border-radius:5px;
}

input[type="submit"]{
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#79a500;
	border:0px solid;
	height:26px;
	padding-bottom:3px;
	border-radius:5px;
}

.pointer{ cursor:pointer; }

.botonEnlace{
	background:transparent;
	border:0;
	color:inherit;
	cursor:pointer;
	font:inherit;
	margin:0;
	padding:0;
}

.sprite {
    background-image: url('../imagenes/banderas/spriteBanderas.png');
    background-repeat: no-repeat;
    display: block;
}

.sprite-bg {
    width: 50px;
    height: 30px;
    background-position: -5px -5px;
}

.sprite-cs {
    width: 50px;
    height: 30px;
    background-position: -65px -5px;
}

.sprite-da {
    width: 50px;
    height: 30px;
    background-position: -125px -5px;
}

.sprite-de {
    width: 50px;
    height: 30px;
    background-position: -5px -45px;
}

.sprite-el {
    width: 50px;
    height: 30px;
    background-position: -65px -45px;
}

.sprite-en {
    width: 50px;
    height: 30px;
    background-position: -125px -45px;
}

.sprite-es {
    width: 50px;
    height: 30px;
    background-position: -5px -85px;
}

.sprite-et {
    width: 50px;
    height: 30px;
    background-position: -65px -85px;
}

.sprite-fi {
    width: 50px;
    height: 30px;
    background-position: -125px -85px;
}

.sprite-fr {
    width: 50px;
    height: 30px;
    background-position: -5px -125px;
}

.sprite-hr {
    width: 50px;
    height: 30px;
    background-position: -65px -125px;
}

.sprite-hu {
    width: 50px;
    height: 30px;
    background-position: -125px -125px;
}

.sprite-it {
    width: 50px;
    height: 30px;
    background-position: -5px -165px;
}

.sprite-lt {
    width: 50px;
    height: 30px;
    background-position: -65px -165px;
}

.sprite-lv {
    width: 50px;
    height: 30px;
    background-position: -125px -165px;
}

.sprite-nl {
    width: 50px;
    height: 30px;
    background-position: -185px -5px;
}

.sprite-no {
    width: 50px;
    height: 30px;
    background-position: -185px -45px;
}

.sprite-pl {
    width: 50px;
    height: 30px;
    background-position: -185px -85px;
}

.sprite-pt {
    width: 50px;
    height: 30px;
    background-position: -185px -125px;
}

.sprite-ro {
    width: 50px;
    height: 30px;
    background-position: -185px -165px;
}

.sprite-sk {
    width: 50px;
    height: 30px;
    background-position: -5px -205px;
}

.sprite-sl {
    width: 50px;
    height: 30px;
    background-position: -65px -205px;
}

.sprite-sv {
    width: 50px;
    height: 30px;
    background-position: -125px -205px;
}

i{
	display: inline-block;
	white-space: nowrap;
}

.sprite2 {
    background-image: url('../imagenes/sprite.png');
    background-repeat: no-repeat;

		display: inline-block;
	white-space: nowrap;
}

.sprite2-aceite {
    width: 54px;
    height: 54px;
    background-position: -5px -5px;
	float:left;
}

.sprite2-blog {
    width: 32px;
    height: 32px;
    background-position: -69px -5px;
}

.sprite2-carrito {
    width: 40px;
    height: 41px;
    background-position: -111px -5px;
	margin-top:-18px;
	float:left;
}

.sprite2-carritoBlanco {
    width: 40px;
    height: 41px;
    background-position: -161px -5px;
}

.sprite2-facebook {
    width: 29px;
    height: 28px;
    background-position: -69px -56px;
}

.sprite2-filter {
    width: 20px;
    height: 21px;
    background-position: -108px -56px;
}

.sprite2-github {
    width: 30px;
    height: 30px;
    background-position: -138px -56px;
}

.sprite2-gmail {
    width: 30px;
    height: 30px;
    background-position: -5px -96px;
}

.sprite2-jamon {
    width: 54px;
    height: 54px;
    background-position: -45px -96px;
	float:left;
}

.sprite2-linkedin {
    width: 30px;
    height: 30px;
    background-position: -109px -96px;
}

.sprite2-otros {
    width: 54px;
    height: 54px;
    background-position: -149px -96px;
	float:left;
}

.sprite2-queso {
    width: 54px;
    height: 54px;
    background-position: -211px -5px;
	float:left;
}

.sprite2-stackoverflow {
    width: 30px;
    height: 30px;
    background-position: -213px -69px;
}

.sprite2-tumblr {
    width: 30px;
    height: 30px;
    background-position: -213px -109px;
}

.sprite2-twitter {
    width: 29px;
    height: 28px;
    background-position: -5px -149px;
}

.sprite2-twitter2 {
    width: 30px;
    height: 30px;
    background-position: -109px -149px;
}

.sprite2-user {
    width: 40px;
    height: 40px;
    background-position: -213px -149px;
	margin-top:-8px;
}

.sprite2-vino {
    width: 54px;
    height: 54px;
    background-position: -5px -199px;
	float:left;
}


.sprite3-carritoBlanco {
    width: 40px; height: 41px;
    background: url('../imagenes/sprite3.png') -10px -55px;
}

.sprite3-categorias {
    width: 41px; height: 31px;
    background: url('../imagenes/sprite3.png') -70px -55px;
}

.sprite3-close {
    width: 25px; height: 22px;
    background: url('../imagenes/sprite3.png') -10px -116px;
}

.sprite3-flechaAbajo {
    width: 25px; height: 25px;
    background: url('../imagenes/sprite3.png') -153px -10px;
}

.sprite3-flechaArriba {
    width: 25px; height: 25px;
    background: url('../imagenes/sprite3.png') -153px -55px;
}

.sprite3-formasPago {
    width: 123px; height: 25px;
    background: url('../imagenes/sprite3.png') -10px -10px;
}

.sprite3-search {
    width: 20px; height: 20px;
    background: url('../imagenes/sprite3.png') -55px -116px;
}


.enlace{
	cursor:pointer;
}

.enlace:hover{
	text-decoration:underline;
}

#blogContenedor{ display:flex; }

#blogHome{
	margin-top:35px;
}
#avisoCookies{
	position:fixed;
	padding:10px;
	left:10px;
	bottom:10px;
	border:2px solid;
	background:#FFFFFF;
	z-index:999;
}

#avisoCookiesIzq{
	float:left;
	text-align:left;
	max-width:225px;
}

#avisoCookiesDcha{
	float:right;
	padding-left:5px;
}

#acordeon{
    max-height: 150px;
    overflow: hidden;
    margin-bottom: 25px;
    border-bottom: 2px solid;	
}

#leerTodo{
	font-weight:bold;
	clear:both;
	text-align:right;
	padding-right:20px;
	margin-top:-20px;
	margin-bottom:20px;

}

#blogArticle{
	float:left;
    padding-right: 50px;
	width: 800px;
    text-align: left;
    font-size: 16px;
	line-height: 23px;
	clear:both;
	margin-top:60px;
	margin-left: 40px;
}

#blogArticle h1{
	margin-top:-20px;
}
.blogShare{
	margin-bottom:10px;
}
#blogArticle h1{
	font-size:30px;
	line-height:40px;
}

#blogArticle h2{
	line-height:30px;
}

#blogContenido img{
	width:100%;
	height:auto;
}

#blogContenido a {
	color:#000;
	font-style:bold;
	text-decoration:underline; 
    font: bold 14px Arial;
}
 
#blogContenido h2 a {
	font-size:22px;
}  

#blogComprar{
    font-size: 22px;
    font-weight: bold;
    text-align: center;
	margin:auto;
	margin-top: 30px;
    padding-bottom: 20px;
}
#blogComprar a{
	font-size:22px;
	text-decoration:none;
}

#blogComprar a:hover{ text-decoration:underline; }

#blogComprar img{ max-width:300px; margin: 10px; }

#blogComprar img:hover{ opacity: 0.5; filter: alpha(opacity=50); }

#blogComprarDentro{
	margin:auto;
	display: inline-block;
	padding:20px 30px;
	box-shadow: 0px 10px 13px -7px #ccc;
    border-radius: 5px;
    border: 1px #d7d5d5 solid;
	max-width:400px;
}

#blogPubli{
	width: auto;
    flex: 1;
	text-align:center;
}

#blogPubli a:hover{
	text-decoration:none;
}

#blogPubli img{
	max-height:200px;
	max-width:100%;
}

.blogResTitulo{
	font-size: 22px;
	font-weight:bold;
	line-height:25px;
	margin-bottom:30px;
}

.blogResContent{
	width:100%;
	text-align:left;
}

.blogResContent img{
	width:100%;
	height:auto;
	cursor:pointer;
}

.blogProductoImg{

}

.blogProductoPrecio{
	font-size:16px;
	font-weight:bold;
}

.blogProducto{
	margin: 0px 10px 30px 10px;
	width:200px;
	height: 350px;
	display:inline-block;
	box-shadow: 0px 10px 13px -7px #ccc;
    border-radius: 5px;
    padding: 20px 12px;
	border: 1px #d7d5d5 solid;
}
}

.blogProductoMarca{
	font-weight: bold;
    font-size: 18px;
    color: #000;
    margin-bottom: 30px;
}

#blogCont{
	overflow:auto;
	width:100%;
	margin-top:20px;
	margin-left:20px;
	margin-bottom:20px;
}

#blogCont2{
	overflow:auto;
	width:100%;
}

.blogPost{
	float:left;
	width:22%;
	text-align:left;
	padding:1%;
}

.blogPost2{
	float:left;
	width:100%;
	text-align:left;
	margin-bottom:10px;
    padding-top: 10px;
}

.blogPost img{
	max-width:90%;
}

.blogPost2 img{
	max-width:90%;
}

.blogTitulo{
	min-height: 60px;
}

.blogTitle{
	font-weight:bold;
	font-size:15px;
}

.blogLeer{
	font-weight:bold;
}

#blog{
	float:left;
	width:15%;
	font-size:12px;
	font-weight:bold;
	margin-top:60px;
}

#blog img{
	width:50px;
}

#blog a{
	text-decoration:none;
}

#botonPagar{
    font-size: 18px;
    min-height: 20px;
    padding: 10px !important;
    height: 40px;
    min-width: 300px;
}

#breadCrumb {
	padding-left:0; 
	list-style-position:inside;
	padding-top:10px;
}
#breadCrumb li{
	float:left;
	list-style-type: none;
	margin-left:10px;
}
#breadCrumb li:before{content: "> "} 

#breadCrumb li:first-child:before{content: ""} 

#closeCategorias{ display:none; }

.precioTexto{ font-size:12px; font-weight:normal; }

#hamburguesaCategorias{ display:none; }

#hamburguesaCategorias{ cursor:pointer; border:0; background:transparent; padding:0; }

#headbox-blog{
	position:relative;
	float:left;
	width:100%;
	clear:both;
	height:250px;
}

#headbox-home{
	position:relative;
	float:left;
	width:100%;
	clear:both;
#	height:650px;
	height:250px;
}

#headbox-marca{
	position:relative;
	float:left;
	width:100%;
	clear:both;

	height:250px;
}

#headbox-otro{
	position:relative;
	float:left;
	clear:both;
	width:100%;
	clear:both;
	height:40px;
}

#headbox-caja{
	position:relative;
	float:left;
	width:100%;
	clear:both;
	height:80px;
}


#headbox-variable{
	position:relative;
	float:left;
	width:100%;
	clear:both;
}

#headbox-carrusel{
	position: absolute;
	width:100%;
	clear:both;
	height:400px;
	top: 260px; 
	z-index: 98;
	margin-top:-8px;
}

#indice{
	padding:10px;border:1px solid;background-color:#e5ecce; overflow:auto; font-size: 16px; line-height: 28px; margin-top: 20px;
}

.resultadoDatosVariables{
#	min-height:120px;
}

.resultadoDatosVariables2{
	float: right;
    margin-top: -110px;
    width: 220px;
}

.sinIndice #indice{
	display:none;
}

#mapa{
	padding-left:15%;
	text-align:left;
}

#mapa h3{
	margin-left:50px;
}

#mapa h4{
	margin-left:100px;
}

#mapa h5{
	margin-left:150px;
}

.mapaCat1{
	font-weight:bold;
	font-size:16px;
}

.masGrande{
	float:right;
	margin-bottom:-60px;
	margin-right:20px;
}

#contTextoBlog{
    clear: both;
    width: 100%;
	margin-top:-40px;
}

#textoCategoria{
    float: left;
    width: 55%;
    padding-top: 35px;
	padding-left: 20px;
	padding-right: 20px;
}

#textoCategoria2{
    float: left;
    width: 98%;
    padding-top: 60px;
	padding-left: 20px;
	padding-right: 20px;
}

#textoCategoria ::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    background: #E9E9E9;
}

#textoCategoria2 ::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    background: #E9E9E9;
}

#textoCategoria ::-webkit-scrollbar-thumb {
    background: #530000;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}

#textoCategoria2 ::-webkit-scrollbar-thumb {
    background: #530000;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}

#contenidoCategoria{
	max-height: 200px;
	height: 200px;
	overflow: scroll;
	padding-right: 20px;
	text-align: left;
	overflow-x: hidden;
	scrollbar-face-color: #530000;
	scrollbar-track-color: #E9E9E9
}

#contenedorCategorias{
	float:right;
	max-width:700px;
	margin-top: 20px;
	z-index: 400;
}

#cabecera{
	max-width: 1160px;
	padding-left:50px;
	height:40px;
	z-index: 400;
	color:#fff;
}

#incidencias{
	max-width: 1200px;
    width: 100%;
	margin:auto;
}

#header{
    position: absolute;
    top: 2px;
	width:100%;
	max-width:1350px;
}

.flechaOrden{
	width:15px;
	margin-bottom:-3px;
}

.botonSocial{
	padding-left:3px;
	padding-right:3px;
}

#botonMas{
	padding:10px;
	min-height:45px;
	padding-left:50px;
	padding-right:50px;
	margin-top:50px;
}

#social2{
	float:right;
	width:30%;
}

#sugerencias{
	background-color:#530000;
	color:#FFFFFF;
	padding:10px;
	position:absolute;
	margin-left:-180px;
	margin-bottom:-70px;
}

#sugerenciasSugerencias{
	min-width:160px;
	text-align:right;
	font-size:20px;
	font-weight:bold;
}

#sugerenciasSugerencias a{
	color:#FFFFFF;
}

#sugerenciasAyudanos{
	text-align:left;
	margin-top:-4px;
}

#buscador{
	margin-top:0px;
	float:right;
	text-align:right;
	padding-top:3px;
}

#envioCarrito{
	color:#666;
}

.resulBlog{
	width: 28%;
    float: left;
    margin: 20px;
	
	box-shadow: 0px 10px 13px -7px #ccc;
    border-radius: 5px;
    padding: 20px 12px;
    border: 1px #d7d5d5 solid;
}

#buscadorTexto{
	width:240px;
	height:17px;
	padding:3px;
	padding-left:7px;
	font-size:14px;
	vertical-align: middle;
}

#enlacesBlog{
	text-align:left;font-size:18px;line-height:30px;padding:10px;padding-bottom:20px;
}

#enlacesBlog a:hover{ text-decoration:underline }

#carritoIcono{
	padding-top:5px;
	float:right;
}

#carrito{
	float:right;
}

#cesta{
	padding-top:5px;
	color:#fff;
}

#cestaTitulo{
	float:left;
	font-size:12px;
	font-weight:bold;
}


#cestaNumProductos{
	float:left;
	font-size:16px;
	padding:5px;
}

#cestaPrecioTotal{
	float:left;
	margin-left:10px;
	font-size:16px;
	padding:5px;
	font-weight:bold;
}

#cestaDesplegar{
	float:right;
	margin-right:10px;
	display:block;
	cursor:pointer;
}

#cestaReplegar{
	float:right;
	margin-right:10px;
	display:none;
	cursor:pointer;
}

#carritoElemento{
	font-size:14px;
	padding:10px;
	border-bottom:1px solid;
	width:90%;
	margin:auto;
	overflow:auto;
	border-bottom: 1px #c2ae38 solid;
	color:#666;
}

.carritoSimbolo{
	font-size:24px;
	font-weight:bold;
}

.carritoImagen{
	float:left;
	min-width:60px;
}

.carritoDefinicion{
	float:left;
	max-width:150px;
	text-align:left;
	padding-left:5px;
	margin-top: 5px;
}

.carritoPrecio{
	float:right;
	margin-left:10px;
	padding-top: 15px;
}

.carritoControles{
	float:right;
	margin-left:20px;
	padding-top: 10px;
}

#totalFinal{
	font-weight:bold;
	font-size:16px;
	margin-bottom:40px;
}


#caja{ margin-top:-50px; }

#cajaLista{
	clear:both;
	overflow:auto;
	max-width:50%;
	margin:auto;
	padding-top:20px;
	margin-bottom:20px;
}

#cajaDatosEnvio{
	float:left;
	width:45%;
}

#cajaDatosFacturacion{
	float:left;
	margin-left:50px;
	width:45%;
}
#fechaBlog{
    margin-top: -20px;
    font-size: 11px;
}
.cajaTextos{
	width:60%;
	text-align:center; 
	margin:auto;
	font-size:16px;
}

#divContacto{
	width:480px;
	margin:auto;
	text-align:left; 
}

.cajaTextos input[type="text"],.cajaTextos select, .cajaTextos textarea{
	border-radius: 5px;
	padding: 8px;
	border: 1px #aaa solid;
	margin: 3px;
	min-width: 250px;
}
.cajaTextos select{
    min-width: 265px; 
}

.cajaTextos input[type="button"]{
	padding: 10px 15px 30px 15px;
}

.cajaTitulos{
	margin-top:30px;
	margin-bottom:30px;
	margin-left:20%;
	margin-right:20%;
	border-bottom:1px solid;
	padding-bottom:5px;
	text-align:left;
	font-size:20px;
	font-weight:bold;
	clear:both;
}

.cajaFlecha{
	font-size:18px;
	font-weight:bold;
	clear:both;
}

#cajaTotal{
	font-size:14px;
	margin:auto;
	text-align:right;
	padding-right:37%;
}

.caja{ padding-top:40px; }

#carritoLista{
	position:fixed;
	max-height:300px;
	min-width:350px;
	max-width:480px;
	overflow:auto;
	overflow-x:hidden;
	-ms-overflow-y: hidden;
	display:none;
	background-color:#FFFFFF;
	border: 1px #c2ae38 solid;
	padding-top:10px;
	z-index:100;
	margin-top:28px;
	padding-bottom:20px;
	padding-top:20px;
	margin-left:-170px;
}

#cestaFinalizar{
	float:right;
}

#cestaFinalizar input{
	max-width:135px;
}

#cestaFinalizarAbajo{
	float:right;
	margin-top:20px;
	margin-right:12px;
}

#cestaCerrarAbajo{
	float:left;
	margin-top:20px;
	margin-left:12px;
}

#carrusel{
#	border:2px solid;
	margin:auto;
	overflow:hidden;
	width:1140px;
	display:none;
}

#carousel{
	width:1140px;
	height:400px;
}

#carousel-nav{
	margin-left:3%;
}

.hSubcategoria{ font-weight:bold; }

.offer{
	height:20px;
}

.offer img{
	z-index:-20;
}

#mandosCarrusel{
	clear:both;
	margin-top:-8px;
	margin-left:-30px;
	display:none;
}

.mandoCarrusel{
	float:left;
	list-style:none;
	padding-left:8px;
	font-weight:bold;
}

.textoCarrusel{
	z-index:150;
	margin-top:-100px;
#	background-color:#BBB775;
background-color:rgba(187,183,117,0.7);
	border-radius:10px;
	color:#530000;
	font-size:35px;
	font-weight:bold;
	text-align:center;
	position:absolute;
	padding:20px;
	margin-left:15px;
	line-height:40px;
}

#categoriasMenu{
	margin:auto;
	clear:both;
}

.categoriaMenu{
	float:left;
	font-size:16px;
	font-weight:bold;
	width:140px;
	z-index:0;
	padding-bottom:10px;
}

.categoriaMenu a{
	text-decoration:none;
	color:#000;
}

.categoriaMenu4{ 
	width:170px !important;
}

.categoriasMenu2 .divSubcategorias{
	margin-top: 0px !important;
}

.encabezadoAcordeon{
	cursor:pointer;
	border-bottom: 1px #d7d5d5 solid;
	padding-bottom:10px;
}

.bloqueAcordeon{
	padding: 0px 35px;
}

#mas_texto{
	margin-top:60px;
	margin-bottom:70px;
}


.divSubcategorias{
    display: none;
    position: absolute;
    border: 2px #c2ae38 solid;
    border-radius: 15px;
    padding: 30px;
    background-color: #fff;
    width: 80%;
    transform: translate(-50%, -0%);
    left: 50%;
    box-shadow: 0px 20px 53px 0px #555;
	z-index:2;
}

.subcatPrin{
	font-size: 16px;
	text-align:left;
    float: left;
    display: block;
	min-width: 240px;
    padding-right: 20px;
}

.subcatPrin a{ color:#000; font-weight:500; font-size:16px !important; }

.subcatSec li { text-align:left; }
.subcatSec { text-align:left; color:#666; font-weight:bold !important;}
.subcatSec a { text-align:left; color:#666; }
.subcatSec a:hover {text-decoration:underline; }

	#categoriasHome{
		display: flex;
		justify-content:center;

	}

  .cat-tile{
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;

    min-height: 110px;
	width:20%;
    padding: var(--tile-pad);
    border-radius: 12px;
    overflow: hidden;

    color: var(--tile-text);
    text-decoration: none;
    box-shadow: var(--tile-shadow);
    transform: translateZ(0);
    isolation: isolate;
	margin:20px;
  }
  
  .cat-tile a{ text-decoration:none; }
  
  .cat-tile:hover{ 
	color: var(--tile-text);
	text-decoration:underline;
  }

  .cat-tile__bg{
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: -2;
    transform: scale(1.02);
    transition: transform .25s ease;
  }

	
  .cat-tile-1{
	background:
      
      url('../imagenes/categorias/vino.avif');	  
	  background-size: 100%;
	  background-position: 30% 50%;
  }
  
  .cat-tile-2{
	background:
      
      url('../imagenes/categorias/aceite.avif');	  
	  background-size: 100%;
	  background-position: 10% 50%;
  }
  
  .cat-tile-3{
	background:
      
      url('../imagenes/categorias/jamon.avif');	  
	  background-size: 100%;
	  background-position: 10% 50%;
  }
  
  .cat-tile-4{
	background:
      
      url('../imagenes/categorias/queso.avif');	  
	  background-size: 100%;
	  background-position: 10% 50%;
  }
  

  .cat-tile::before{
    content: "";
    position: absolute;
    inset: -40%;
    background: radial-gradient(circle at 15% 35%, rgba(255,255,255,.18), rgba(255,255,255,0) 55%);
    z-index: -1;
    opacity: .85;
    pointer-events: none;
  }

  .cat-tile__content{
	  display: inline-flex;
	  flex-direction: column;
	  gap: 6px;
	  padding: 10px 12px;
	  border-radius: 14px;
	  
	  background: rgba(0,0,0,.28);
	  backdrop-filter: blur(8px);
	  

  }

  .cat-tile__title{
	  background: transparent !important;
	  padding: 0 !important;
	  color: #fff;
	  border-radius: 0 !important;
	  font-weight: 600;
	  font-size: 22px;
	  line-height: 1.1;
  }

  .cat-tile__subtitle{
    font-size: 14px;
    line-height: 1.2;
    opacity: .9;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cat-tile__cta{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 15px;
	color: #fff;
    background: rgba(0,0,0,.24);
    border: 1px solid rgba(255,255,255,.18);
    backdrop-filter: blur(8px);
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    transition: transform .25s ease, background .25s ease;
  }

  .cat-tile__icon{
    transition: transform .25s ease;
  }

  .cat-tile:hover{
    box-shadow: var(--tile-shadow-hover);
    transform: translateY(-2px);
  }

  .cat-tile:hover .cat-tile__bg{
    transform: scale(1.06);
  }

  .cat-tile:hover .cat-tile__cta{
    background: rgba(255,255,255,.20);
    transform: translateY(-1px);
  }

  .cat-tile:hover .cat-tile__icon{
    transform: translateX(2px);
  }

  .cat-tile:focus-visible{
    outline: 3px solid rgba(255,255,255,.75);
    outline-offset: 3px;
  }

  /* Responsive */
  @media (max-width: 640px){
    .cat-tile{
      min-height: 96px;
      padding: 14px;
	  min-width: 300px;
	  margin:auto;
	  margin-top:20px;
    }
	
	#categoriasHome{ display:block; }
    .cat-tile__title{ font-size: 20px; }
    .cat-tile__subtitle{ font-size: 13px; }
    .cat-tile__cta{ padding: 9px 10px; }
  }


.textoCatMenu{
	float:left;
	margin-top:18px;
	margin-left:10px;
	font-size:16px;
	text-align:left;
	max-width:130px;
}

.textoCatMenu2{
	float:left;
	margin-top:5px;
	margin-left:0px;
	font-size:14px;
	text-align:left;
}

.textoCatMenu2 h3{
	font-size:16px;
	margin-bottom:0px;
	margin-top:0px;
	margin-left:0px;
	text-align:left;
}

#tituloHome{
	background-image: url('../imagenes/fondoHome2.jpg');
	width:100%;
	height:200px;
	margin-top: -250px;
    padding-top: 30px;
	filter: blur(3px);
	background-size: 100%;
}

#textoHome{
    font-family: "Roboto-Condensed" !important;
    font-weight: bold;
    width: 100%;
    height: 200px;
	font-size: 32px;
    color: #fff;
    margin-top: 110px;
    z-index: 1;
    padding-top: 30px;
    line-height: 10px;
    text-shadow: 0px 0px 12px rgba(0, 0, 0, 1);
    position: relative;	
}

#textoHome h1{
	font-size:52px;
	line-height: 45px;
}

.categoriaMenu:hover{
	border-bottom:2px #c2ae38 solid;
}


.scrolling {
	z-index:999;
    position: fixed;
	padding:5px;
	width:310px;
    top: 4px;
	margin-left: 460px;
    left: 50%;
    transform: translateX(-50%);
    top: 4px;
}

.cestaScroll {
	z-index: 99999;
    position: fixed;
    background: #FFF;
    color: #666 !important;
    border: 1px #c2ae38 solid !important;
	border-radius: 0px !important;
    border-top: 0px;
    min-width: 200px;
    margin-top: 40px;
    padding: 5px;
    margin-left: 495px;
    left: 50%;
    transform: translateX(-50%);
}


.cestaScroll #carritoLista{
	position:fixed;
	margin-top:35px;
	margin-left:-200px;
}

.cestaScroll #cestaTitulo img{
	margin-top: -2px;
    width: 25px;	
}

.cestaScroll #cestaNumProductos{
	font-size:14px;
	margin-top:5px;
}

.cestaScroll #cestaFinalizar{
	margin-top:5px;
}

.categoriaSeleccionada2{
	border-radius:0px 0px 0px 0px;
	color:#FFFFFF;
	background-color: #FFF !important;
}

.categoriasMenu2{
	z-index:100;
    position: fixed;
	background:#FFF;
	padding:0px;
	max-width:1250px;
	width:100%;
	left:50%;
    transform: translateX(-50%);
    top: -5px;
    border: 1px #c2ae38 solid;
	text-align:center;
	min-height: 30px;
    padding-top: 15px;
}


.categoriasMenu2 .categoriaMenu{
	float:left;
	font-size:14px;
	font-weight:bold;
	padding:0px;
	padding-left:10px;
	width:12%;
	max-width:200px;
	text-align:center;
	z-index:100;
	margin:0px;
}

.categoriasMenu2 .categoriaMenu:hover {
	background-color:#FFF !important;
}

.categoriasMenu2 .categoriaMenu img{ max-width:27px; margin-top:5px; margin-bottom:3px;}

.categoriasMenu2 .textoCatMenu {
	float: left;
	margin-top: 10px;
	text-align: left;
	padding-left:12px;
	font-size:14px;
	float:none;
	margin-left:50px;
}

#lineaCategorias{
    background-color: #DEDCBC;
    height: 4px;
    margin-top: -10px;
    width: 100%;	
}

#categoriaSeleccionada{
	border-bottom:4px #c2ae38 solid;
}

#categoriaSeleccionada a{
#	color:#FFFFFF;
}

#comprar{
	white-space: nowrap;
	min-width:250px;
	font-size:18px;
}

#comprar h1{
	line-height: 25px;
	margin-top: -5px;
}

#comprarContenido{
	clear:both;
	overflow:auto;
	margin:auto;
}

#comprarImagen{
	float:left;
	min-width:260px;
}
#comprarTexto{
	float:left;
	width:200px;
	text-align:left;
}

#comprarTexto select{
	font-size:18px;
}

#comprarTexto input[type="button"]{
	margin-top:-10px;
	font-size:18px;
}

#compraProducto{
	height: 40px;
    padding: 12px 30px;
    font-size: 16px;
    cursor: pointer;
	width:400px;
}

#compraProducto:hover{
	background-color:#4c6701;
}

#encuesta{
	margin-top:50px;
	font-size:14px;
	margin-bottom:100px;
}

#franja{
	width:100%;
	background-color:#c2ae38;
	min-height:40px;
}

.pedidoDetalles{
	text-align:left;
	width:50%;
	margin:auto;
	margin-top:20px;
	margin-bottom:20px;
}

.pedidoDetalle{
	text-align:left;
}

#personalDatos{
	width:80%;
	margin:auto;
	overflow:auto;
}

#personalPedidos{
	width:80%;
	margin:auto;
	overflow:auto;
}

.personalTitulo{
	border-bottom:1px solid;
	font-size:16px;
	font-weight:bold;
	text-align:left;
	padding-bottom:3px;
	margin-bottom:10px;
}

#formaPago{ transform: scale(1.4); }

#personalClave{
	float:left;
	margin-left:100px;
}

#personalDatosUsuario{
	float:left;
	margin-left:10%;
}

#subMenuFin{
#	border-bottom:2px solid;
}

.subcategoriasMenu{
	clear:both;
	background-color:#DEDCBC;
	overflow:auto;
	padding-bottom:5px;
#	border-left:2px solid;
#	border-right:2px solid;
}

.filtroCategoria{
	font-weight: bold;
    font-size: 18px;
    border-bottom: 5px #eee solid;
    padding-bottom: 3px;
    padding-left: 2px;
    margin: 10px;
}

.filtroElimina img{
	width:18px;
	margin-bottom:-4px;
}

.filtroExcedente{
	display:none;
}

.filtrosMax{
	color:#333300;
	font-size:14px;
	padding-left:10px;
    line-height: 35px;
}

.filtroClick{
	line-height: 25px;
	padding-left:15px;
}

.leerMas a{ color:#666; }

#iconoFiltros {
    margin: auto;
    margin-top: -30px;
    margin-bottom: -50px;
    margin-right: 45px;
    padding: 10px;
    width: 65px;
    margin-left: 40px;
    text-align: left;
    font-weight: 500;
    border: 1px #c2ad38 solid;
    border-radius: 10px;
    cursor: pointer;
    float: right;
}

#iconoFiltros:hover{
	border: 1px #ccc solid;
	
}

#iconoFiltros img{
	margin-bottom: -10px;
}

#menuFiltros{
	display:none;
	text-align:left;
	border-right:0px #ccc solid;
	float: left;
    width: 18% !important;
	max-width:300px;
	padding: 15px;
    margin-top: 35px;
    margin-left: 3%;
}

#resulAgrupa{
	margin:auto;
#	max-width:1120px;
	max-width: 1400px;
	overflow:auto;
	padding-top: 30px;
}

#resulEspera{
	clear:both;
}

.paginacionNumerica{
	margin: 18px auto 8px;
	text-align: center;
}

.paginacionNumerica a,
.paginacionNumerica .paginaActual{
	display: inline-block;
	min-width: 32px;
	height: 32px;
	line-height: 32px;
	margin: 3px;
	border: 1px solid #d7d7d7;
	border-radius: 4px;
	background: #fff;
	color: #555;
	font-weight: 600;
}

.paginacionNumerica .paginaActual{
	background: #709900;
	border-color: #709900;
	color: #fff;
}

.resultado3{
	padding:15px;
	overflow:auto;
	float:left;
	margin:5px;
	width:240px;
}

.resultado{
	overflow: auto;
    display: inline-block;
    width: 295px;
    height: 500px;
    margin: 20px;
    padding-top: 20px;
    border: 1px #f0f0f0 solid;
    background: #fff;
    box-shadow: 0px 10px 13px 0px #ccc;
	border-radius: 5px;
}

.resultado2{
	overflow: auto;
    display: inline-block;
    width: 380px;
    height: 260px;
    margin: 10px;
    padding-top: 20px;
    border: 1px #f0f0f0 solid;
    background: #fff;
    box-shadow: 0px 10px 13px 0px #ccc;
    border-radius: 5px;
}

.resultado2:hover{
	border: 1px #cfcfcf solid;
}

.textoRes{
	text-align:left;
	line-height:21px;
	color:#484848;
	max-width: 1320px;
    margin: auto;
	font-size: 16px;
	clear: both;
}

.textoCat{
	text-align:left;
}

.textoCat p{  }

.hLista{
    text-align: left;
    margin-left: 40px;
    margin-bottom: 0px;
    font-size: 18px !important;
	border: 0px !important;
}

.dobleAncho{
	width:490px !important;
}

.textoRes h2{
	line-height:26px;
	font-size:24px;
}

.textoRes h3{
	font-size: 22px;
}

.textoRes h4{
	font-size: 20px;
}

.textoRes h5{
	font-size: 18px;
}

.textoRes h6{
	font-size: 16px;
}

.textoRes a{
	color: #000000;
    text-decoration: underline;
    font-weight: bold;
}

.precioAntes{
	text-align:right;
	margin-bottom:10px;
	margin-right:8px;
	color:#696969;
}

.precioAnt{
	position:relative;
}
.strikethrough {
    position: absolute;
    width: 110%;
    border-top: 2px solid #CC0000;
    left: -2px;
    top: 40%;
    -ms-transform: rotate(-12deg);
    -webkit-transform: rotate(-12deg);
    transform: rotate(-12deg);
}
#comprar .resultado{
	width: 160px;
	font-size:12px;
	max-widht:120px !important;
	overflow:hidden !important;
}

#comprar .resultado .resultadoImagen{
	font-size:14px !important;
}

#comprar .resultado .resultadoImagen{
	max-width:120px;
}

#comprar .resultado .resultadoTexto{
	display:none;
}

#comprar .resultado .resultadoComprar{
	display:none;
}

.resultado:hover{
	box-shadow: 0px 10px 13px 7px #ccc;
}

.resultadoImagen3{
	margin-top:10px;
	max-width:240px;
	
}

.resultadoImagen:hover{
	opacity: 0.5;
}

.divResultadoImagen{
	height:270px;
	display: table;
	width:100%;
    margin-top: 20px;
}

.divResultadoImagen2{
	height: 250px;
    display: table;
    float: left;	
	width: 170px;
}

.resultadoImagen{
	margin-top: 10px;
	cursor:pointer;
	margin: auto;
    max-width: 100%;
    width: auto;
    max-height: 260px;
}

.subResultadoImagen{
	display: table-cell;
    vertical-align: middle;
    text-align: center;
	
}

.subResultadoImagen img{ margin-top:10px; }

.sumaProducto{
	display:none;
	
}

.h1Gris{
	font-size: 26px !important;
    color: #242424 !important;
	margin-bottom:20px !important;
}

#titResultados1{
    background-image: url("../imagenes/categorias/cat1_1920.jpg");
	background-position-y: -250px;
}

#titResultados2{
    background-image: url("../imagenes/categorias/cat2_1920.jpg");
	background-position-y: -200px;
}

#titResultados3{
    background-image: url("../imagenes/categorias/cat3_1920.jpg");
	background-position-y: -200px;
}

#titResultados4{
    background-image: url("../imagenes/categorias/cat4_1920.jpg");
	background-position-y: -500px;
}

#titResultados5{
    background-image: url("../imagenes/categorias/cat5_1920.jpg");
	background-position-y: -150px;
}

#titCategoria{
	max-width: 1200px;
    margin: auto;
	font-size: 26px;
	text-align:right;
    transform: scale(1.1,1);
    color: #000;
	margin-top: -280px;
    margin-bottom: 0px;
    padding-top: 30px;
    font-family: "Roboto-Condensed" !important;
    font-weight: 600;
    line-height: 40px;
    text-shadow: 0px 0px 12px rgb(255 255 255);
}

.titSolo{
	border-bottom: 1px #ccc solid; 
    width: 50%;
    margin-right: -20px !important;
    font-size: 32px !important;
    margin-top: -260px !important;
}

#contenedorTitulo{
	width: 1200px;
    margin: auto;
	margin-bottom: -100px;
	text-align: right;
}

.claim{
    margin-top: -20px !important;
	max-width: 1470px;
    margin: auto;
    font-size: 32px;
    color: #000;
    margin-bottom: 0px;
	margin-right: -128px !important;
	transform: scale(0.9,1);
	text-align:right;
}

.resultadosTitulo{
    background-repeat: no-repeat;
    background-size: 100%;
    font-family: "Roboto-Condensed" !important;
    background-attachment: fixed;
    background-position-x: center;
    font-weight: bold;
	width: 200px;
    opacity: 0.5;
    font-size: 32px;
    color: #000;
    margin-top: 250px;
	overflow: auto;
    padding-top: 30px;
	margin-bottom: 50px;
    line-height: 10px;
    text-shadow: 0px 0px 12px rgb(255 255 255);
}

.filtroCuadro{
	padding:10px;
	border-radius:5px;
	border: 1px #d7d5d5 solid;
    background: #fff;
    box-shadow: 0px 10px 13px -7px #ccc;
}

.resultadosTitulo h1{
	font-size:36px;
	line-height:40px;
	font-weight:100;
	color: #000;
	font-family: "Roboto-Condensed" !important;
	transform: scale(1.1,1);
}

.resultadosTitulo subtitulo{
	font-size:18px;
	font-weight:bold;
	text-align:left;
	clear:both;
	line-height:20px;
	margin-top:-10px;
}

.h1Marca{
	font-size:20px;
    margin-top: 60px;
	line-height:40px;
	font-weight:100;
	color: #000;
	font-family: "Roboto-Condensed" !important;
	transform: scale(1.1,1);
}

.resultadosTitulo h3{
	font-size:16px;
	line-height:20px;
	margin-top:-10px;
}

.resultadoAtributos{
	font-size:14px;
	font-weight:normal;
}

.resultadoTitulo h2{
	font-size:14px;
	margin-top:2px;
	margin-bottom:0px;
}

.palabraPrecio{
	font-weight:normal;
	font-size:14px;
}

.resultadoPrecio{
	text-align:center;
	font-weight: bold;
    color: #b4a02c;
    font-size: 24px;
}

.resultadoPrecio2{
	text-align: center;
    font-weight: bold;
    color: #b4a02c;
    font-size: 24px;	
}

.resultadoSinIva{
	font-size:12px;
}

.resultadoPrecioIva{
	text-align:right;
	font-size:12px;
	font-weight:bold;
}

.resultadoConIva{
	font-weight:normal;
}

.resultadoLotes{
	margin-top:10px;
	text-align:left;
	clear:both;
	overflow:auto;
}

.resultadoPrecioLote{
	font-weight:bold;
	float:right;
}

.resultadoMasOfertas{
	font-weight:bold;
	float:right;
	clear:both;
	margin-top:10px;
}

.resultadoTextoLote{
	float:left;
}

.resultadoComprar{
	margin-top:10px;
    vertical-align: baseline;
    text-align: center; 
}

.resultadoComprar2{
	vertical-align: baseline;
    text-align: center;
    float: right;
    margin-top: -70px;
    width: 220px;	
}

.resultadoTexto{
	text-align:left;
}


.resultadoTitulo{
	text-align:center;
	clear:both;
	font-size:16px;
	font-weight:bold;
	margin: 0px 15px;
	min-height: 75px;
	font-family: "Roboto-Condensed" !important;
}

.resultadoTitulo2{
    text-align: center;
    clear: both;
    font-size: 20px;
    font-weight: bold;
    margin-top: -230px;
    width: 220px;
    margin-bottom: 0px;
    min-height: 75px;
    font-family: "Roboto-Condensed" !important;
    float: right;	
}

#textoCat1{
	text-align:left;
	padding:0px 20px 0px 20px;
	clear:both;
	overflow:auto;
}

#textoCat2{
	text-align:left;
	display:none;
	padding:0px 20px 0px 20px;
}

#leerMas{
	text-align:left;
	padding:0px 0px 10px 20px;

}

.textoCaja{
	width:250px;
	text-align:right;
	float:left;
	padding: 12px;
}




.subcategoriaMenu{
	float:left;
	text-align:left;
	width:215px;
	border-bottom:2px solid;
	margin-left:10px;
	font-size:16px;
	margin-top:10px;
	bottom:0px;
    max-height: 30px;
    min-height: 30px;
}

.subcategoriaMenu4{
	width:275px !important;
}

.subcategoriaMenu h2{
	font-size:16px;
	margin-bottom:0px;
	margin-top:0px;
	text-align:left;
}

.subcategoriaMenu h1{
	font-size:16px;
	margin-bottom:0px;
	margin-top:0px;
	text-align:left;
}

#votacion{
	text-align:left;margin:20px;width:90%;font-size:12px;
}

.tag2{
	font-size:1.5em;
	font-weight:bold;
}

.tag3{
	font-size:1.17em;
	font-weight:bold;
}

.tag4{
	font-size:1.33em;
	font-weight:bold;
}

.tag5{
	font-size:0.83em;
	font-weight:bold;
}

#ordenacion{
	float:right;
	margin:auto;
	margin-top:-10px;
	padding-right:20px;
}

#divisas{
	float: left;
	height: 22px;
	width: 80px;
#	margin-right: 36px;
	margin-top: 10px;
	text-align: right;
}

#divisasCabecera{
	text-align:center;
}

#divisasCabecera img{
	margin-top:2px;
}

.divisa{
	text-align:center;
	padding:5px;
	width:70px;
}

.divisa .botonEnlace{
	width:100%;
}

#listaDivisas{
	border:1px #c2ae38 solid;
	background-color:#FFFFFF;
	color:#000;
	display:none;
	z-index:99;
	position:absolute;
	padding:5px;
}

#listaIdiomas{
	position:absolute;
	color:#000;
	height:310px;
	width:205px;
	overflow:scroll;
	overflow-x:hidden;
	display:none;
	background-color:#FFFFFF;
	border:1px #c2ae38 solid;
	padding-top:10px;
	z-index:99;
	margin-left:-50px;
}

#listaIdiomas a{ color:#000000; clear:both; }
#listaIdiomas a img{ float:left; }


.nombreIdioma{
	float:left;
	margin-left:5px;
	margin-top:5px;
}

.imagenIdioma{
	float:left;
	border:0px solid;
}

#idiomasCabecera{
#	border:1px solid;
	font-size:14px;
	font-weight:bold;
	height:25px;
	padding-top:6px;
}

#idiomasCabecera .flecha{
	float:right;
	margin-top:5px;
	cursor:pointer;
}

#idiomasCabecera #banderaP{
	margin-bottom:-4px;
	width:25px;
	height:15px;
	margin-right:5px;
}

.idiomaDesplegable{ 
	display:block;
	font-size:14px;
	font-weight:bold;
	clear:both; 
	padding:10px;
	margin-left:5px;
	margin-right:5px;
	overflow:auto;
}

.idiomaDesplegable:hover{ 
	background-color:#EEEDDD;
}

#divBuscadorBoton{
	float:right;
}

#buscadorBoton{
	font-size:16px;
	font-weight:bold;
	border-radius:0px;
	padding:0px;
	border:0px;
	margin-left:-4px;
	vertical-align: middle;
}

#buscadorBoton img{ margin-left:-5px; }

#contenido{
	background-color:#FFFFFF;
	margin:auto;
	max-width:1400px;
	width:100%;
	text-align:center;
	margin-top:10px;
	margin-bottom:-7px;
	padding-bottom:30px;
	overflow:auto;
}

#cuerpo{
	min-height:500px;
	text-align:center;
	width:100%;
	max-width:1400px;
	margin:auto;
	overflow:hidden;
}

#logo{
	float:left;
	margin-left:40px;
	margin-top:10px;
	min-height:60px;
	font-size:35px;
	font-weight:bold;
	text-align:right;
}	

#logo img{
	width:300px;
}

#logoPago{
    margin-bottom: -5px;
    
}

#logoTransporte{
    margin-bottom: -5px;
    max-height: 18px;	
}

#formasPagoLogo{
	position:absolute;
	margin-top:-35px;
	margin-left:215px;
	z-index:100;
}

#formasPagoLogo img{
	width:70px;
	max-width:70px;
}

#verColorRegion{
	text-align: center;
    margin: auto;
    font-size: 22px;
    padding: 10px;
    font-weight: 900;
    color: #000;
    margin-top: 10px;
    line-height: 30px;
	margin-bottom:10px;
	border: 1px #d7d5d5 solid;
    border-radius: 5px;
    max-width: 500px;
}

#mejores{
	margin-bottom:10px;
	overflow:auto;
}

#mejoresTexto{
	margin-top:10px;
	margin-bottom:10px;
	font-size:24px;
	font-weight:bold;
	text-align:left;
	padding:10px;
}

.mejoresCaja{
	border:2px solid;
	float:left;
	width:560px;
	margin:5px;
	overflow:auto;
	padding-bottom:20px;
	-moz-box-shadow: 0px 0px 8px 0px #530000; 
	-webkit-box-shadow: 0px 0px 8px 0px #530000; 
	box-shadow: 0px 0px 8px 0px #530000;
}

.mejoresTitular{
	text-align:left;
	font-size:30px;
	font-weight:bold;
	clear:both;
	line-height:50px;
	padding:15px;
	margin-bottom:5px;
}

.mejoresProducto{
	float:left;
	margin-left:20px;
	margin-top:-20px;
}

.mejoresTitulo{
	clear:both;
	font-size:22px;
	font-weight:bold;
	text-align:left;
	padding:10px;
	margin-bottom:10px;
	min-width:245px;
	float:right;
	min-height:40px;
}

.mejoresDatos{ clear:both; width:510px; overflow:auto;}

.mejoresImagen{ margin-top:10px;float:left; margin-bottom:20px; width:240px;}
.mejoresTextos{ float:right; width:255px; }
.mejoresDescripcion{ text-align:left; width:230px; min-height:100px; }
.mejoresPrecio{ font-size:18px;font-weight:bold; text-align:right;margin-right:20px;}
.mejoresPrecioIva{ font-size:14px;font-weight:bold; text-align:right;margin-right:20px;}
.mejoresComprar{ text-align:right;margin-right:20px; margin-top:15px;}

.pedidoProveedor{
    text-align: left;
    width: 800px;
    margin: auto;
    border: 1px #888 solid;
    padding: 20px;
    margin-top: 20px;
    border-radius: 15px;	
}

#menuHorizontal{
	margin:auto;
	max-width:1200px;
	width:100%;
	overflow:auto;
}

.parteMenuH{
	float: left;
    font-size: 16px;
    width: 16.45%;
    text-align: center;
    padding-bottom: 10px;
    border: 1px #bbb solid;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding-top: 10px;
    background-color: #eee;
}

.anchoConFichero{
	width: 14% !important;
}

.pestanaSeleccionada{
	background-color: #fff;
    border-bottom: 0px;
}

#slogan{
	margin-top:10px;
	margin-left:50px;
	font-size:14px;
	font-weight:normal;
}

#loginOculto{
	position:absolute;
	height:100px;
	width:238px;
	margin-left:-100px;
	overflow-x:hidden;
	display:none;
	background-color:#FFFFFF;
	border:1px solid;
	padding-top:10px;
	z-index:99;
	border: 1px #c2ae38 solid;
}

#idiomasSelect{
	float:left;
	height:22px;
	margin-top:3px;
}

#flechaLogin{
	margin-bottom: 5px;
    margin-left: 2px;
}

#login{
	float:right;
	text-align:center;
	font-size:14px;
	margin-right:30px;
	margin-left:30px;
	margin-top:5px;
}

.loginTexto{
	background-color:#79a500;
	color:#FFFFFF;
	padding:5px;
	margin:5px;
	min-width:100px;
	border-radius:10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url('css/PIE.htc');
	margin:auto;
	max-width:150px;
	margin-top:10px;
}

.loginTexto:hover{
	background-color: #79a500; 
}

.loginTexto:active{
	color:#CCCCCC;
}


.loginTexto a{
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}

.loginTexto .botonEnlace{
	color:#FFFFFF;
	font-weight:bold;
	width:100%;
}

#breadCrumb{
	margin:auto;
	float:left;
	margin-top:15px;
	clear:both;
	margin-left: 35px;
}

#producto{
	overflow:auto;
	margin-top:50px;
	clear:both;
}

#productoImagen{
	cursor:pointer;
	margin-top:10px;
	padding:20px;
	min-width:230px;
	max-width: 100%;
}

#productoImagen img{
	max-width: fit-content;
	max-height: 550px;
}

#producto h1{
	font-size:30px;
	font-weight:bold;
	text-align:left;
	clear:both;
	line-height:32px;
}



#producto h2{
	font-size:22px;
	font-weight:bold;
	text-align:left;
	clear:both;
	line-height:32px;
	max-width:65%;
}

#productoIzquierda{
	float:left;
	width: 38%;
}

#precioLabel{
	font-weight:normal;
}

#prodPrecioNum{
	text-align:left;
}

#prodPreciobotones{
	text-align:left;
	margin-top:20px;
}

#productoCentro{
	float:right;
	font-size:14px;
	width:58%;
	padding:20px;
}
#productoDerecha{
	float:right;
	font-size:14px;
	width:320px;
	background-color:#EEEDDD;
	padding:25px;
	text-align:center;
	margin-top:-80px;
}

.productoLotes{
	margin-top:50px;
}

#productoSimilares{
	margin-top:40px;
	clear:both;
	padding-top:30px;
	overflow:auto;
	text-align: left;
}

.resultadosFiltrosDesplegados{ width:75%; }

#productosRecomendados{ 
	margin-top:40px;
	clear:both;
	padding-top:30px;
	overflow:auto;
	text-align:left;
}

#textoExtra{
	text-align:left;
	font-size:16px;
	margin-top: -40px;
}

#contProv select{
	padding: 5px 10px;
    border-radius: 5px;
}

#contProv input{
	padding: 5px 10px;
    border-radius: 5px;
	border: 1px #555 solid;
}

#contProv input[type="submit"], input[type="button"] {
	padding-bottom: 23px !important;
}

.filaPed td{
	padding:5px;
}

#productosProveedor{
	margin-top:40px;
	clear:both;
	text-align:left;
}

#notaPrecio{
	font-size:14px;
}
#notaPrecioIva{
	font-size:14px;
	font-weight:normal;
}

#productoUnidades{
font-size: 18px;
    padding: 6px;
    min-height: 40px;
    margin-top: 3px;
    border: 1px #a5a4a4 solid;
    border-radius: 5px;
    margin-right: 5px;
    min-width: 55px;
    padding-left: 8px;
    margin-bottom: -5px;
}

.productoUnidadesResultados{
	font-size: 16px;
    min-height: 45px;
    border: 1px #a5a4a4 solid;
    border-radius: 5px;
    margin-right: 5px;
    min-width: 55px;
    padding-left: 8px;
    margin-bottom: -5px;
	padding-bottom: 2px;
}

.comprarResultados{
    min-height: 45px;
    width: 120px;
    cursor: pointer;
	margin-top: 20px;
}

.comprarResultados:hover{
	background-color:#4c6701;
}

.comprarResultados img{
	max-height:30px;
	margin-bottom:-12px;
}

.botonPagar{
	font-size: 18px !important;
	min-height: 50px;
    padding: 7px 20px;
}

.botonBlanco{
	color:#79a500 !important;
	border:2px #79a500 solid !important;
	background-color:#fff  !important;
}

#productoMedio{ overflow:auto;clear:both; width:100%; }
#price{ color: #c2ae38;
    font-weight: bold;
    font-size: 38px; } 
#productoAtributos{ float:left; margin-top: 40px; }
#productoPrecio{ }
#productoCompra{ float:right; }

#productoComprar{
	min-height:140px;
	margin-top:10px;
}

#productoComprar input{
	font-size:18px;
	height:40px;
	width:150px;
}

.productoTextoLote{
	margin-top:20px;
    font-size: 16px;
	text-align:center;
}

.productoPrecioLote{
	text-align:right;
	font-weight:bold;
}

.productoTexto{
	text-align: left;
    margin-top: 40px;
    font-size: 16px;
    line-height: 28px;
}

.productoTexto a{
	font-weight:bold;
	text-decoration:underline;
}

.productoAtributo{
	text-align:left;
	clear:both;
}

#nube{
	margin-top:40px;
	margin-left:50px;
	float:left;
	padding:40px;
	width:30%;
}

#titNube{
	text-align:left;
	clear:both;
	font-size:16px;
	font-weight:bold;
}

#nube h2{ display:inline; }
#nube h3{ display:inline; }
#nube h4{ display:inline; }
#nube h5{ display:inline; }

.totalPayPal{
	font-weight: bold;
	font-size: 16px;
}

#pie{
	margin-top:40px;
	width:100%;
	text-align:center;
	background-color:#ddd;
}

#despliegaFiltros{
	display:none;
	float:right;
	cursor:pointer;
	margin-top:-10px;
	font-size: 20px;
}

#pie2{
	
	max-width:1250px;
	margin:auto;
	padding:20px;
	overflow:auto;
	display: flex;
}

#pie3{
	width:100%;
	background-color:#666;
}

#pieIzq1{ float:left; text-align:left; width: 32%; padding-top: 40px;}
#pieIzq2{     width: 200px; text-align: center; float:left; padding-top:65px; }
#pieIzqBlog{ text-align:left;     flex: 1;  padding: 0px 20px;}
#pieDch{ float:right; text-align:left; }

#pieDch ul {
  list-style: none; /* Remove default bullets */
}

#pieDch ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #c2ae38; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

#faldonBlog{
	clear: both;
    width: 100%;
    display: flex;
}

#faldonBlogBlog{
	clear: both;
    width: 800px;
    padding: 0px;
    margin-left: 40px;
}


.faldonImagenBlog{
	max-height: 150px;
    overflow: hidden;
}

.faldonImagenBlog img{
	border: 0px;
    max-width: 400px;
    width: 100%;
}


.faldonElementoBlogBlog{
	box-shadow: 0px 10px 13px -7px #ccc;
    border-radius: 5px;
    padding: 20px 12px;
    border: 1px #d7d5d5 solid;
    margin: 10px;
    width: 44%;
    float: left;	
	min-height: 220px;
}

.faldonElementoBlog{
	padding: 20px;
    box-shadow: 0px 10px 13px -7px #ccc;
    border-radius: 5px;
    padding: 20px 12px;
    border: 1px #d7d5d5 solid;
    margin: 10px;
	flex:1;
}

.faldonTituloBlog{
	font-size: 22px;
    margin-bottom: 10px;
    min-height: 60px;
	font-weight:bold;
}

#social{
	margin-top:5px;
	margin-right:20px;
	float:left;
}

.titleTexto{
	font-weight:bold;
	font-size: 15px;
	line-height:45px;
}

#winequestContent{
	overflow:auto;
	clear:both;
	margin-top:-20px;
}

#winequest{
	float:right;
	width:60%;
	text-align:right;
	margin-top:20px;
	clear:both;
}

#winequest img{
	float:right;
	margin-top:-15px;
	margin-left:20px;
	margin-bottom:10px;
}

#verticalTextoLogo{
	margin-top:20px;
	max-width:280px;
	text-align:center;
}

#verticalTextoLogo h1{
	font-size:30px;
	line-height:36px;
	text-align:right;
}

#verticalTextoLogo h2{
	font-size:16px;
	line-height:24px;
	text-align:left;
}

#verticalLogoSF{
	margin-top:-110px;
	margin-right:-150px;
}

#verticales{
	clear: both;
	text-align: left;
	padding-left: 30px;
}

#websAmigas{
	 clear:both;
	 margin:50px;
	 float:right;
	 text-align:left;
	 max-width:400px;
}

#enlaceBlog{ float:right; margin-left: 10px; margin-top: 6px;}

.t18{
	font-size:18px;
}

#resul2{
	overflow:auto;
	text-align:center;
}

#nube{ display:none; }

.imgTexto{
	float: right;
    overflow: auto;
    margin: 15px;
	max-width:40%;
}

.tabla {
	display: table;
	width: 100%;
}

.tabla > .a {display: table-header-group;} 
.tabla > .b {display: table-row-group;    } 
.tabla > .c {display: table-footer-group; } 

#categoriasHome{ text-align:center;     padding: 0px 20px;}
.categoriaHome{ 
	display: inline-block;
    border: 1px #999898 solid;
    margin: 10px;
    margin-bottom: 20px;
    max-width: 244px;
    height: 100px;
    overflow: hidden;
}
}
.categoriaHome a { text-decoration:none; }
.categoriaHome a:hover{ text-decoration:none; }
.categoriaHome img{ 
    margin-left: -20%;
    opacity: 0.2; 
    margin-top: -20px;
}
.categoriaHome img:hover{ opacity: 1; filter: alpha(opacity=100); }
.categoriaHome .textoCatHome{ 
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff, 0 0 55px #fff, 0 0 75px #fff;
    -moz-text-shadow: 0 0 2px #fff;
    -webkit-text-shadow: 0 0 2px #fff;
    margin-top: -155px;
    font-size: 30px;
    color: #222;
    font-weight: bold;
    opacity: 1;
	transform: scale(1,1);
    z-index: 9999;
}

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.2s;
     -moz-transition-duration: 0.2s;
      -ms-transition-duration: 0.2s;
       -o-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

button:hover{
	# background-image: linear-gradient(to bottom, #b5f505, #4c6701);
}

input[type="submit"], input[type="button"]:hover{
	# background-image: linear-gradient(to bottom, #b5f505, #4c6701);
}

@media only screen and (max-width: 1370px) {
	.resultado{ width:250px; }
	.categoriaHome{ max-width: 207px; }
	#contenedorTitulo{ width:100%; }
	.titSolo{ margin-right: 6% !important; }
}

@media only screen and (max-width: 1250px) {
	.scrolling{ right:0px;  margin-left: auto; left: auto; transform: none; }
	.cestaScroll{ right:0px;  margin-left: auto; left: auto; transform: none; }
	.categoriaHome{ max-width:170px; }
	.categoriaHome img{ margin-left: -50%; }
	#productoIzquierda{ width:35%; }
	#productoCentro{ width: 600px; }
	#compraProducto{ width: 450px; }
}

@media only screen and (max-width: 1150px) { 
	#productoCentro{ width: 600px; }
	.franjaVerMas{ width: 180px; }
}

@media only screen and (max-width: 1100px) {
	.resFranjaId3{ display:none; }
	.franjaVerMas{ width:35%; }
	.categoriaMenu{ width:120px; }	
}
@media only screen and (max-width: 1000px) {
	#buscadorTexto{ width:150px; }
	.categoriaHome{ max-width:220px; }
	#productoCentro{ width: 550px; }
}	

@media only screen and (max-width: 940px) {
	#logo img{ width:250px; }
	#productoCentro{ width: 500px; }
	#compraProducto{ width: 350px; }
}

@media only screen and (max-width: 900px) {
	#logo img{ width:200px; }
}

@media only screen and (max-width: 840px) {
	#header #logo{ width:100%; text-align:center; margin-left:0px; margin-top:0px; float:none;}
	#header #logo img{ max-width:350px; width:100%;}
	#contenedorCategorias{ float:none; width:100%; text-align:center;}
	#tituloHome{ margin-top:-250px; }
	#categoriasMenu{ width:100%; max-width:100%; margin-left:8%;}
	.categoriaMenu{ width:20%; }
	.resultado{ width:27%; min-width: 240px;}
	#producto{ margin-top:120px; }
	#productoCentro{ width: 95%; margin-left:0px; }
	#textoExtra{ width: 95%; margin-left:0px; }
	#tituloHome h1{ font-size:42px; }
	.divSubcategorias{ margin-left: -35px; left: 0px; width:100%; }
	.resultado2{ width:360px; }
	#productoCentro{ width: 450px; }
	.resultadosTitulo{ margin-top:230px; }
	#titResultados1{ background-position-y: 120px; }
	#titResultados2{ background-position-y: 150px; }
	#titResultados3{ background-position-y: -100px; }
	#titResultados4{ background-position-y: 0px; }
	#titResultados5{ background-position-y: -50px; }
	#titCategoria{ margin-top: -110px; margin-bottom: 90px !important; text-align: center; }
	.claim{ display:none; }
	#blogContenedor{ display:block; }
	#entradilla{ margin:5px; }
}

@media only screen and (max-width: 750px) { 
	#productoCentro{ width: 400px; }
	#blogArticle{ margin:0px; padding: 0px 15px; margin-top:50px; font-size:18px;}
	#productoIzquierda{ float:none; width:100%; }
	#productoCentro{ float:none; width:92%; }
}	

@media only screen and (max-width: 500px) { 
	#productoMarcaEnlace{ font-size:18px; }
	#buscadorTexto{ width:75%; }
	#enlaceBlog{ margin-right: 10px; display:none;}
	.faldonElementoBlogBlog{ float:none; }
	#faldonBlogBlog { margin-left:0px; }
	#faldonBlog{ display:block; }
	#pie2{ display:block; }
	.titSolo{ border-bottom:0px; }
	#contenedorTitulo{ margin-bottom: 0px;}
	.bloqueAcordeon{ padding: 0px 10px; }
	.h1Marca{ max-width:90%; margin:auto; margin-top:40px; font-size:16px; margin-bottom:0px;}
	#cabecera{ padding-left:10px; }
	.h1Gris{ font-size:28px !important; margin-top: -70px !important; width:90%;}
	.claim{ display:none; margin-top: -10px; font-size: 28px; margin-bottom:10px; }
	#verColorRegion{ display:none; }
	#entradilla{ display:none; max-height:100px; margin-top:-20px; overflow:hidden; text-overflow: ellipsis; padding:0px 10px;}
	#mas_texto{ padding: 10px; }
	#categoriasHome{width: 100%; margin: 0px; padding:0px; text-align:center;}
	.categoriaHome{ margin-bottom: 10px;}
	.categoriaHome img{ margin-left: 0%; }
	#header #logo img{ width:200px; }
	#header #logo { margin-top: 50px; float: left; width: auto; margin-left: 20px;}
	#buscadorBoton img{ margin-left: -5px; }
	#buscador { float: none; margin: auto; text-align: center; clear: both;	}
	#franja{ min-height:80px; }
	.categoriaMenu{ float: none; text-align: left; width:auto;     font-size: 26px;}
	#categoriasMenu{ z-index: 3;float: right; position: absolute; right: 0px; margin-top: 50px; padding: 20px; border: 1px solid; background-color: #fff; max-width: 80%; display:none; }
	#hamburguesaCategorias{ display: block; position: absolute; right: 15px; top: 0px; margin-top: 95px; }
	#textoHome h1{ font-size:32px; line-height:30px; }
	#textoHome{ line-height:10px; margin-top:30px; font-size:22px;}
	#tituloHome{ margin-top: -200px; padding-top: 10px; padding-bottom: 40px; line-height:35px !important; font-size: 26px; height: 80px;} 
	#carrito{ margin-right:10px; }
	.cestaScroll{ right:25px; }
	#carritoLista{ margin-left:0px; right:0px;     max-width: 100%;}
	#loginOculto{ right: 0px; }
	#listaIdiomas{ margin-left:0px; left:0px;  }
	.resultado{ height:480px; width: 95%; margin: 10px;}
	.resultadoFiltros{ width: 43%; }
	#breadCrumb{ display:none; }
	#productoCentro{ width: 97%; float: none; padding: 5px;}
	#productoPrecio{ width:100%; text-align:center; float:none; margin-bottom: 40px; }
	#productoIzquierda{ float:none; width: 100%;}
	.productoTexto{ width:100%; font-size:16px; margin-top:0px;}  
	#producto h1{ max-width:100%; margin-top: 0px; font-size:26px; text-align:center;}
	#pieIzq1{ clear: both; float: none; text-align: center; width: 100%; padding-top: 0px; }
	#pieIzq2{ width: 100%; text-align: center; float: none; padding-top: 0px; padding-left: 0px; }
	#pieDch{ float:none; }
	.scrolling{ position: initial; }
	#productoImagen{ padding:0px; margin-top:0px; }
	#contenido{ margin-top:0px; margin: 0px;}
	#producto{ margin-top:0px; }
	#divSubcategorias{ visibility:hidden; }
	#login { margin-right: 10px; margin-left: 10px; }
	#tituloHome h1{ font-size:32px; margin-bottom: 0px;} 
	.resFranjaId2{ display:none; }
	.cajaTextos{ width:80%; }
	#cajaDatosFacturacion { margin-left:0px; width:100%; margin-bottom: 40px;}
	#cajaDatosEnvio{ width:100%; }
	.cajaTitulos{ width:80%; margin-left:10%; }
	#cajaLista{ max-width: 90%; }
	#formasPago img{ max-width:210px; }
	#formasPago table{ max-width:90%; }
	#blogArticle{ width:95%; padding:10px; }
	#blogComprar{ max-width: 90%; }
	.resulBlog{ width:90%; }
	#blogHome{ width:100%; }
	#divisas{ width: 60px; }
	.resultado2{ width:96%; margin:0px;  margin-top:15px;} 
	#productoAtributos{ margin-top: 20px; }
	#prodPreciobotones{ margin-left: 0px; margin-top: 10px; width: 100%; text-align:center;}
	#prodPrecioNum{ margin-left: -00px; float: none; width: 100%; text-align: center; }
	#compraProducto{  width: 260px; padding:12px 10px;}
	#productoImagen img {  max-height: 320px; }
	.resultadosTitulo{ margin-top:70px; margin-bottom:10px; } 
	#titCategoria{ margin-bottom:20px; margin-top: -80px; text-align:center;}
	#titResultados1{ background-position-y: 500px; }
	#titResultados2{ background-position-y: 500px; }
	#titResultados3{ background-position-y: 500px; }
	#titResultados4{ background-position-y: 500px; }
	#titResultados5{ background-position-y: 500px; }
	#titCategoria{ font-size:36px; }
	#iconoFiltros{ margin-right:15px; }
	#menuFiltros{ float: none; width:100% !important; display: none; position: absolute; background-color: #fff; border: 1px #ccc solid; border-radius: 5px;} 
	#despliegaFiltros{ float: none; }
	.resultadosFiltrosDesplegados{ width:47%; padding-right: 15px;}
	.hLista{ margin-left:10px; }
	.resultadoDatosVariables2{ margin-top:-140px; max-width:50%;}
	.resultadoComprar2 { display:flex; margin-top:-70px; width:220px; margin-right: -15px;}
	.productoUnidadesResultados{ height: 55px; margin-top: 5px; }
	.resultadoAtributos { font-size: 16px; }
	.comprarResultados{font-size:20px;width:130px;height: 55px; margin: 5px; padding: 5px;}
	.divResultadoImagen2 { margin:10px; width:150px;}
	.resultado2 { height:auto; overflow: hidden;}
	.resultadoTitulo2{ margin-top: -275px;  max-width: 50%;  max-height: 140px;   overflow: hidden; text-align:left;}
	.resultadoTitulo2 h3{ color:#000;font-size:28px; }
	.textoAntes{ display:none; } 
	.resultadoProductoNombre{ color:#000;font-size:22px; }
	.resultadoPrecio2{ text-align:left; font-size:28px; }
	.precioAntes{ margin-top: -58px; margin-right: 20px; }
}  





/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
  margin: auto;
  display: block;
  max-width: 700px;
}

#modalContent img{
	    max-height: 100vh;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  from {transform:scale(0)}
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
}





/* COLORBOX */


#colorbox, #cboxOverlay, #cboxWrapper { position:absolute; top:0; left:0; z-index:9999; overflow:hidden; }
#cboxOverlay{position:fixed; width:100%; height:100%; }
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;padding:30px;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#606b40;}
#colorbox{ z-index: 99999; }
    #cboxTopLeft{width:14px; height:14px; background:url(images/controls.png) no-repeat 0 0;}
    #cboxTopCenter{height:14px; background:url(images/border.png) repeat-x top left;}
    #cboxTopRight{width:14px; height:14px; background:url(images/controls.png) no-repeat -36px 0;}
    #cboxBottomLeft{width:14px; height:43px; background:url(images/controls.png) no-repeat 0 -32px;}
    #cboxBottomCenter{height:43px; background:url(images/border.png) repeat-x bottom left;}
    #cboxBottomRight{width:14px; height:43px; background:url(images/controls.png) no-repeat -36px -32px;}
    #cboxMiddleLeft{width:14px; background:url(images/controls.png) repeat-y -175px 0;}
    #cboxMiddleRight{width:14px; background:url(images/controls.png) repeat-y -211px 0;}
    #cboxContent{background:#fff; overflow:visible;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:5px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
        #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
        #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}

        #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(images/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
        #cboxPrevious{left:0px; background-position: -51px -25px;}
        #cboxPrevious:hover{background-position:-51px 0px;}
        #cboxNext{left:27px; background-position:-75px -25px;}
        #cboxNext:hover{background-position:-75px 0px;}
        #cboxClose{right:0; background-position:-100px -25px; display:none;}
        #cboxClose:hover{background-position:-100px 0px;}

        .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-150px 0px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-125px 0px;}