@charset "UTF-8";
/* CSS Document */




html {font-family:'Magra', sans-serif;     margin: 0;
padding:0; border:0;}
a { text-decoration:none;}
body { margin: 0; padding: 0; }
.wrap {background-color:#ebdbc1; border:0; margin:0; overflow: hidden;
background-image: url(https://menusqr.netlify.app/images/fondo.jpg);
background-size: 320px;
background-position: 50% 0%;}
header {padding:2rem 0 1rem; text-align:center; font-style:normal; font-size:4rem; color:#002278; font-weight: bold;}
.contacto {font-size:1.6rem; font-weight:100; margin:0; text-decoration:none; text-align: center; padding: 0 0 3rem; color:#002278; display: flex;
justify-content: center;}
/*.contacto i {color:#002278; font-size: 1.5rem; padding-left: 1.2rem;}*/
.contacto img {width:25px; padding-left: 30px; filter: brightness(0) saturate(100%) invert(8%) sepia(72%) saturate(5404%) hue-rotate(224deg) brightness(91%) contrast(102%);}
header, h1, h2, .subtitulos {font-family:'Playfair Display', serif; color:#002278; font-weight: 900;
font-style: italic;}
h3 {font-family: 'Magra'; font-weight: 200; color:#002278; font-style: italic;}
h3 a {color:#002278; text-decoration:underline;}
/*SOCIAL*/
.SOCIAL {
z-index: 500;}

.SOCIAL i {
opacity: 0;
max-height: 1em;
white-space: nowrap;
/*transition: .1s;*/
font-size: 1rem;
line-height: 110%;
text-align:right;
position: absolute;
right: 3.5rem;
font-family: 'Magra', sans-serif;
}


/*BOTON SOCIAL*/


.FCBK, .TWITTER, .INSTA, .MAIL, .BACK, .HOME, .WHATS, .LNKDN {
display: inline-block;
font-family: "Font Awesome 5 Brands";
color: #ECDEC7;
text-decoration:none;
font-size: 1.5rem;
line-height: 2rem;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
width: 2.25rem;
height: 2.25rem;
cursor: pointer;
text-align:center;
}

.FCBK:before {
    content: "\f39e";
}



.TWITTER:before {
    content: "\f099";
}

.WHATS:before {
    content: "\f232";
}

.MAIL:before {
	font-family: 'Font Awesome 5 free';
    content: "\f0e0";
	font-weight: 900;
}




.BACK:before {
	font-family: 'Font Awesome 5 free';
    content: "\f00d";
	font-weight: 900;
}

.LNKDN:before {content: "\f08c"}


/*.MAIL:hover::before, .TWITTER:hover::before, .FCBK:hover::before, .INSTA:hover, .BACK:hover, .HOME:hover, .pre:hover, .post:hover, .WHATS:hover::before {
-moz-filter: hue-rotate(0deg) saturate(1) brightness(2.5);
-o-filter: hue-rotate(0deg) saturate(1) brightness(2.5);
-ms-filter: hue-rotate(0deg) saturate(1) brightness(2.5);
-webkit-filter:hue-rotate(0deg) saturate(1) brightness(2.5);
filter:hue-rotate(0deg) saturate(1) brightness(2.5);}

BOTON BACK TO TOP*/
.back-to-top {
display: none;
text-align: center;
font-size: 2rem;
background: rgba(25, 26, 41, 0.7);
color:#ffffff;
position: fixed;
z-index: 90;
right: 0.25rem;
bottom: 0;
padding: 1.1rem 1rem;
border-radius: 2rem;
/*	width: 4.75rem;
	height: 4.75rem;text-indent: -9999px;
background: url(https://qr.benditolomito.com/wp-content/uploads/2022/05/bt_top.png) no-repeat center 43%;
	background-size: contain;*/
}
.back-to-top:before {
	font-family: 'Font Awesome 5 free';
    content: "\f062";
	font-weight:900;}

/*BOTON TEXT ME*/
.text-me {
	display: block;
	width: 3.75rem;
	height: 3.75rem;
	text-indent: -9999px;
	position: absolute;
	z-index: 999;
	right: 1.25rem;
	top: 1.8rem;
	background: url(https://darezd.netlify.app/imagenes/ICONOS/BT_TEXT.svg) no-repeat center 43%;
}



/*.MAIL:hover, .GPLUS:hover, .TWITTER:hover, .FCBK:hover, .BACK:hover, .HOME:hover, .WHATS:hover, .pre:hover, .post:hover, .LNKDN:hover {
-moz-filter: hue-rotate(0deg) saturate(0.2) brightness(3);
-o-filter: hue-rotate(0deg) saturate(0.2) brightness(3);
-ms-filter: hue-rotate(0deg) saturate(0.2) brightness(3);
-webkit-filter:hue-rotate(0deg) saturate(0.2) brightness(3);
filter:hue-rotate(0deg) saturate(0.2) brightness(3);
}*/

.FCBK:hover i, .TWITTER:hover i, .WHATS:hover i, .MAIL:hover i, .BACK:hover i, .LNKDN:hover i, .WHATS:hover i {opacity:1.0; color:#AD9883;}


.lightbox-text-link {text-decoration:none!important; color:#002278;}
.contenidodemo h1, .contenidomovil h1 {color:#002278; text-align:center;padding: 1rem 0;}
#demo h1 {padding:0;}
h1 {font-size:2rem; line-height: 15%;}
.subtitulos {text-align:center; font-size:3.5rem; color: #002278; padding: 3rem 2rem 2rem; font-weight:700; line-height: 70%;}
.subtitulosegundo {font-size:1.5rem; font-weight:normal; text-align:center;}
sup {text-align:center;}
.phoneframe {border:12px solid black; width:280px; height:620px; overflow:auto;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
margin: 2.5rem; flex-basis: 280px; flex-grow: 0;
	flex-shrink: 0;}
.phoneframe img {max-width:100%; ;
}

.delivery {grid-gap: 2rem;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
	margin: 0 4rem!important; height: 26rem;
}
/*.delivery li {display:inline-block; margin: 0.35rem 0;
}
.delivery li:before {content:"\f111"; font-family: "Font Awesome 6 Pro"; font-size:0.4rem;
font-weight: 600; margin: 0 0.5rem 0 -1rem; position:absolute;}*/
sub {margin-top: 5rem;
    line-height: 130%;}
.BOTONERA, .cambiocontenido {display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
justify-content: center;
width:280px;
position:sticky;
cursor:pointer;
top:0;
z-index:40; margin: 0;
}
.cambiocontenido {position: sticky;
bottom: 0;
z-index: 990;
justify-content: center;
}

.UK, .ES, .FR {
display:block;
text-indent:-625rem;
width:3rem;
height:3rem;
background-repeat:no-repeat;
background-size:contain;
cursor: pointer;
margin: 0.5rem 1rem;
z-index:222;}
.LES {display:block;}
.LFR, .LUK {display:none;}
.UK {background-image: url(https://menusqr.netlify.app/images/uk.png);}
.ES {background-image: url(https://menusqr.netlify.app/images/sp.png);}
.FR {background-image: url(https://menusqr.netlify.app/images/fr.png);}
.menu_lang, .menu_contenido {display: none;}
.platos, .vinos, .postres {display: block;
	width: 4rem;
	height: 4.5rem;
	z-index: 999;
	cursor: pointer;
	    text-indent: -9999px;
    margin: 0 5px;

}
.platos {background: url(https://menusqr.netlify.app/images/menu.png) no-repeat center 43%; background-size: contain;}
.vinos {background: url(https://menusqr.netlify.app/images/bebida.png) no-repeat center 43%; background-size: contain;}
.postres {background: url(https://menusqr.netlify.app/images/post.png) no-repeat center 43%; background-size: contain;}
.menucomida, .menudevinos, .menudepostres{position: relative; top: -5rem;
    margin-bottom: -9.5rem;
    padding: 0;
    list-style-type: none;
}
.menudevinos, .menudepostres {display:none}
.mensaje {font-size:1.25rem; padding: 0 1.25rem 2rem; line-height:150%; font-weight:400; margin:0; color:#1A191F;}

.contenidodemo {display:flex;
flex-direction:row;
padding-bottom: 3rem;
justify-content: center; flex-wrap: wrap;
/*display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;*/
box-sizing: content-box;
max-width:1200px;
margin:0 auto;
}

.contenidomovil {display: flex;
    flex-direction: column;
    padding-bottom: 3rem;
    justify-content: center;
    flex-wrap: wrap;
	align-items: center;}


.contenidodemo div {margin: 0 1rem;
   border: 2px solid #FBF7d0;
    border-radius: 18px;
    padding: 0 1.5rem;
max-width: calc(25%);
}

.contenidodemo h2 {
    text-align: center;}

#demo, #entrega	{
    border: 2px solid #FBF7d0;
    border-radius: 18px;
    padding: 2rem 0;
    margin: 0 auto 4rem;
	max-width: 1120px;
	    width: calc(100% - 2rem);
}

#demo div {border:none; margin:0 auto; max-width: 50%; padding: 0;}
.examples {margin:0 auto; max-width:80rem;}

.cards_petxines, .cards_victoria, .cards_kitsume, .cards_benditolomito, .cards_jamonarte
{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  position: relative;
  height:21.875rem;
  width:100%;

}

.card
{
  display:flex;
  width:285px;
  height:600px;
  border-radius:2.3rem;
  transform-origin:center center;
  transform:scale(1) translate(0px,0px) perspective( 750px ) rotateY(0deg);
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
  transition-duration: 0.5s;
  position:absolute;
  top:0;
  z-index:3;
  cursor: pointer;
  overflow:hidden;
}

.card *
{
  pointer-events: none;
}

.card--leftleft
{
  transform:scale(0.75) translate(-550px,0px) perspective( 750px ) rotateY(10deg);
  z-index:1;
}


.card--left
{
  transform:scale(0.85) translate(-280px,0px) perspective( 750px ) rotateY(10deg);
  z-index:2;
}

.card--center
{
  transform:scale(1) translate(0px, 0px) perspective( 750px ) rotateY(0deg);
  z-index:3;
}

.card--right
{
  transform:scale(0.85) translate(280px,0px) perspective( 750px ) rotateY(-10deg);
  z-index:2;
}


.card--rightright
{
  transform:scale(0.75) translate(550px,0px) perspective( 750px ) rotateY(-10deg);
  z-index:1;
}

#x_petxines, #x_victoria, #x_kitsume, #x_benditolomito, #x_jamonarte, #folletos, #displaymesa, #vallaspetxines, #greezydiner, #menuresto, #bardetapas {padding: 2rem 4rem 20rem; border-top:1px solid #0B65BA;}
/*#x_petxines {background-image: url(https://menusqr.netlify.app/images/fondopetxines.jpg);}
#x_kitsume {background-image: url(https://menusqr.netlify.app/images/fondokitsume.jpg);}
#x_victoria {background-image: url(https://menusqr.netlify.app/images/fondovictoria.jpg);}
#x_benditolomito {background-image: url(https://menusqr.netlify.app/images/fondobendito.jpg);}
#folletos {background-image: url(https://menusqr.netlify.app/images/fondobread.jpg);}
#folletos h1, #folletos h2, #folletos li {color:#ffffff; text-shadow: 3px 3px 5px rgba(0,0,0,0.6);}
#x_benditolomito li, #x_benditolomito h1, #x_benditolomito h2{color:#adc3d1;}
*/

#displaymesa, #vallaspetxines, #greezydiner, #menuresto, #bardetapas {padding-bottom: 5rem!important;}
#menuresto h1 {margin-bottom:20px;}
#vallaspetxines .examples {margin-bottom:1rem;}
.valla {margin: 0 auto;
    width: 100%;
	position: absolute;
    z-index: 10;
    left: 0;}
.valla img {    margin: 0 auto;
    display: block;}
#folletos img, #greezydiner img {margin: 3rem 0 0; max-width:100%;}
#folletos {padding-bottom:5rem;}

.vallasheader {    display: flex;
    max-width: 80rem;
    margin: 0 auto;
	    align-items: center;}
.li-img {padding: 0; margin: 1rem 0 0 -0.5rem; list-style-type: none;
}
#descripcion img { max-width:100%;}
#folletos img {-webkit-box-shadow: 2px 4px 10px 2px rgba(0,0,0,0.44);
box-shadow: 2px 4px 10px 2px rgba(0,0,0,0.44);}
.desplazadores {display: flex;
    justify-content: space-between;
    position: relative;
    top: 300px;
    z-index: 1200; font-size:3rem; color:#000000; pointer-events: none; width:460px;margin: 0 auto; }
.previous:before {font-family: "FontAwesome";
    content: "\f053";border-radius: 30px;
    padding: 5px 15px;
    background: rgba(255,255,255, 0.5); font-size: 3rem;}
.next:before {font-family: "FontAwesome"; content: "\f054";border-radius: 30px;
    padding: 5px 15px;
    background: rgba(255,255,255, 0.5); font-size: 3rem; }
#menuresto .previous:before, #menuresto .next:before {color: #B89A86;}
.globos {position: absolute;
    pointer-events: none;}
.globos ul {list-style:none;}
.globo1 img {transform: rotate(180deg); -webkit-filter: drop-shadow(-6px -12px 6px rgba(0,0,0,0.48));
    filter: drop-shadow(-6px -12px 6px rgba(0,0,0,0.48));}
.globo3 img {transform: scaleX(-1); -webkit-filter: drop-shadow(-6px 12px 6px rgba(0,0,0,0.48));
    filter: drop-shadow(-6px 12px 6px rgba(0,0,0,0.48));}
.globo2 img {-webkit-filter: drop-shadow(6px 12px 6px rgba(0,0,0,0.48));
    filter: drop-shadow(6px 12px 6px rgba(0,0,0,0.48));}

.globo1 {position: relative;
    right: -230px;
    top: 20px;}
.globo2 {position: relative;
    top: 20px; left:-150px;}
.globo3 {position: relative;
    right: -230px;
    top: 25px;}

.globo1 li:last-child {padding-left:80px;}
.globo2 li:first-child {padding-right:180px;margin-left: -50px;}
.globo3 li:first-child {padding-left:80px;}

.lang {margin:-0.5rem auto;}
.lang div {display: flex;
    justify-content: center; list-style:none; margin: 0;}
.lang span {width: 5rem;
    height: 5rem; margin: 0 0.5rem; line-height: 1150%;
    text-align: center;
    font-size: 12px;
    color: #554c41; font-style: italic;}

.textorusolargo {-webkit-transform: scale(0.75,1);
    -moz-transform: scale(0.75,1);
    -ms-transform: scale(0.75,1);
    -o-transform: scale(0.75,1);
    transform: scale(0.75,1);
    display: inline-block;
    margin-left: 0!important;}

.bt_LES, .bt_LUK, .bt_CAT, .bt_LFR, .bt_RUS {cursor: pointer;}

.bt_LES {background:url(https://menusqr.netlify.app/images/flagES.png);background-size: contain; background-repeat: no-repeat;}
.bt_LUK {background:url(https://menusqr.netlify.app/images/flagUK.png); background-size: contain; background-repeat: no-repeat;}
.bt_LFR {background:url(https://menusqr.netlify.app/images/flagFR.png); background-size: contain; background-repeat: no-repeat;}
.bt_CAT {background:url(https://menusqr.netlify.app/images/flagCT.png); background-size: contain; background-repeat: no-repeat;}
.bt_RUS {background:url(https://menusqr.netlify.app/images/flagRU.png); background-size: contain; background-repeat: no-repeat;}


.mLES {display:block;}
.mLUK, .mLFR, .mCAT, .mRUS {display:none;}

#displaymesa img {max-width: 65%;}

.delivery.mRUS li {
    margin: 0.2rem 0;
}

.delivery.mRUS sub {
    margin-top: 34rem; line-height:1%;
}

.delivery li:last-child {

}

.jssort101 .p .cv {border:none!important;}

/*POPUP ICONOS VALLAS*/
.vallapetxines1, .vallapetxines2, .vallapetxines3, .vallapetxines4 { opacity: 0;
  visibility: hidden; text-align:center; transition-duration: 0.35s;}
.vallapetxines1.is-visible, .vallapetxines2.is-visible, .vallapetxines3.is-visible, .vallapetxines4.is-visible
{opacity: 1;
visibility: visible;
-webkit-animation: spin1 0.5s 1 linear;
-moz-animation: spin1 0.5s 1 linear;
-o-animation: spin1 0.5s 1 linear;
-ms-animation: spin1 0.5s 1 linear;
animation: spin1 0.5s 1 linear;
transition-duration: 0.35s;
}
/*FIN POPUP ICONOS VALLAS*/


.greezylogo {text-align:center; z-index:5; position:absolute; margin: 20% 5%; max-width:38vw;}

.greezylogo img {box-shadow:none!important; }
.greezyflyer img {border:12px solid #fff;}

.greezyflyer {margin: 5% 0 0 44%;
    max-width: 400px;}

.greezyflyer2 {margin: 20% 0 0 60%;}
.greezyflyer2 img {-webkit-transform: rotate(22deg);
    -moz-transform: rotate(22deg);
    -o-transform: rotate(22deg);
    display: inline-block;
    transform: rotate(22deg);}

/*JSSOR MENUES*/
#jssor_2 {top:60px!important; left:unset!important; margin:0 auto;}
.menues {display:flex; justify-content: center; gap: 40px;}
.menu {display:flex; padding: 0 10px 20px; max-width: 100vw; }
.menu img {max-width:100%; margin: 0 auto 2rem; display: block; }
.menuinfo {right:0;top:0;width:160px; position:absolute;color:#002278; padding:0 12px;}
.menuinfo .mensaje {padding-bottom:320px;}
.menudoble {gap:5px; padding:0;}
.menudoble img {height: max-content;}

/* inViewport */

[data-inviewport="scale-in"] {
transition: 1.2s;
opacity: 0;
-webkit-transform-origin: center right;
-moz-transform-origin: center right;
-ms-transform-origin: center right;
-o-transform-origin: center right;
transform-origin: center right;
transform: scale(1.5);
-ms-transform: scale(1.5);
-webkit-transform: scale(1.5);
-o-transform: scale(1.5);
-moz-transform: scale(1.5);
}
[data-inviewport="scale-in"].is-inViewport {
opacity: 1;
transform: scale(1.0);
-ms-transform: scale(1.0);
-webkit-transform: scale(1.0);
-o-transform: scale(1.0);
-moz-transform: scale(1.0);
}
/*jssor slider loading skin spin css*/
.jssorl-009-spin img {
animation-name: jssorl-009-spin;
animation-duration: 1.6s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}

@keyframes jssorl-009-spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}

/*jssor slider arrows*/
.jssora106 {display:block;position:absolute;cursor:pointer; width:55px;height:55px;top:360px;}
.jssora106 .c {fill:#fff;opacity:.3;}
.jssora106 .a {fill:none;stroke:#000;stroke-width:350;stroke-miterlimit:10;}
.jssora106:hover .c {opacity:.5;}
.jssora106:hover .a {opacity:.8;}
.jssora106.jssora106dn .c {opacity:.2;}
.jssora106.jssora106dn .a {opacity:1;}
.jssora106.jssora106ds {opacity:.3;pointer-events:none;}

/*jssor slider thumbnail skin 101 css*/
.jssort101 .p {position: absolute;top:0;left:0;box-sizing:border-box;background:#000;}
.jssort101 .p .cv {position:relative;top:0;left:0;width:100%;height:100%;border:2px solid #000;box-sizing:border-box;z-index:1;}
.jssort101 .a {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;visibility:hidden;}
.jssort101 .p:hover .cv, .jssort101 .p.pdn .cv {border:none;border-color:transparent;}
.jssort101 .p:hover{padding:2px;}
.jssort101 .p:hover .cv {background-color:rgba(0,0,0,6);opacity:.35;}
.jssort101 .p:hover.pdn{padding:0;}
.jssort101 .p:hover.pdn .cv {border:2px solid #fff;background:none;opacity:.35;}
.jssort101 .pav .cv {border-color:#fff;opacity:.35;}
.jssort101 .pav .a, .jssort101 .p:hover .a {visibility:visible;}
.jssort101 .t {position:absolute;top:0;left:0;width:100%;height:100%;border:none;opacity:.6;}
.jssort101 .pav .t, .jssort101 .p:hover .t{opacity:1;}


/*jssor slider bullets*/
.jssorb106 {position:absolute;}
.jssorb106 .i {position:absolute;cursor:pointer;}
.jssorb106 .i .b {fill:#002278;/*fill-opacity:0.5;*/stroke:#fff;stroke-width:1800;stroke-miterlimit:10;stroke-opacity:0.8;}
.jssorb106 .i:hover .b {fill:#fff;fill-opacity:1;stroke:#2b1908;stroke-opacity:1;}
.jssorb106 .iav .b {fill:#FFFBEE;fill-opacity:1;stroke-width:1800;stroke:#002278;stroke-opacity:0.6;}
.jssorb106 .i.idn {opacity:.3;}


/*GRID*/
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* auto-fit ajusta mejor el relleno */;
  grid-gap: 0;
  margin: 3rem 1rem 4rem;
}

.grid-item {
position: relative;
overflow: visible;
margin-right: -20px;
margin-bottom: -20px;
background-color: transparent; /* Fondo inicial */
z-index:1;

}

.grid-item img {
object-fit: cover;
width: 100%;
z-index:1;
transition: transform 0.2s ease-in-out, z-index 0.2s ease-in-out, margin 0.2s ease-in-out;
}

.IMAGECOL img {
display: block;
max-height: 100%;
max-width: 100%;
pointer-events: none;
-webkit-filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.3));
filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.3));
  z-index: 1;
}


.INFOCOL {
display: flex;
flex-direction: column;
color: #012429;
position: absolute;
bottom: 20px;
left:0;
font-size:20px;
font-family: "Elsie", serif;
font-weight: 900;
font-style: normal;
line-height:100%;
width:100%;
transition: bottom 0.2s ease-in-out, z-index 0.2s ease-in-out;
text-shadow: rgb(255, 255, 255) 3px 0px 0px, rgb(255, 255, 255) 2.83487px 0.981584px 0px, rgb(255, 255, 255) 2.35766px 1.85511px 0px, rgb(255, 255, 255) 1.62091px 2.52441px 0px, rgb(255, 255, 255) 0.705713px 2.91581px 0px, rgb(255, 255, 255) -0.287171px 2.98622px 0px, rgb(255, 255, 255) -1.24844px 2.72789px 0px, rgb(255, 255, 255) -2.07227px 2.16926px 0px, rgb(255, 255, 255) -2.66798px 1.37182px 0px, rgb(255, 255, 255) -2.96998px 0.42336px 0px, rgb(255, 255, 255) -2.94502px -0.571704px 0px, rgb(255, 255, 255) -2.59586px -1.50383px 0px, rgb(255, 255, 255) -1.96093px -2.27041px 0px, rgb(255, 255, 255) -1.11013px -2.78704px 0px, rgb(255, 255, 255) -0.137119px -2.99686px 0px, rgb(255, 255, 255) 0.850987px -2.87677px 0px, rgb(255, 255, 255) 1.74541px -2.43999px 0px, rgb(255, 255, 255) 2.44769px -1.73459px 0px, rgb(255, 255, 255) 2.88051px -0.838247px 0px;}



.PRICE {font-size:50px;
line-height:60%;
font-family: "Abril Fatface", serif;
font-weight: 400;
font-style: normal;
}
.PRICE span {font-size: 25px;
letter-spacing:-5px;}
.PRICE sup {font-size:30px;
letter-spacing:0px;
 position: relative;
  bottom: 0.2em;}

.grid-item:hover img {
transform: scale(1.3);
z-index:50;
position:relative;
}



.grid-item:hover .INFOCOL {
 bottom:-15px; z-index:50;
}

.SUJET, .PRICE {transform: scale(0.75);
transition: transform 0.2s ease-in-out, margin-bottom 0.2s ease-in-out,
  margin-right 0.2s ease-in-out;
}

.grid-item:hover .SUJET, .grid-item:hover .PRICE {
transform: scale(1);
margin-bottom:8px;
margin-right:10px;
}

@media only screen and (max-width : 1440px)
{.menuinfo {display:none;}
#menuresto h3.examples {margin: 10px 0 30px 30px;}
.menues {padding: 0 10px;}
.menuinfo .mensaje {padding-bottom:0;}
#jssor_2 {width:unset!important;}
#menuresto {padding: 1rem 0.5rem 20rem;}
#menuresto .examples {margin-left: 30px;}

}

@media only screen and (max-width : 1010px)
{
.contenidodemo div {max-width: calc(25%); margin:0 auto;}
.mensaje li img {max-width:100%;}

}
@media only screen and (max-width : 900px)
{body {background: #7B7E97;}

	.wrap {margin: 0 auto;
    max-width: 560px;
}
header {font-size: 2.2rem; padding:2rem 1rem;}
.subtitulos {font-size:2.2rem; padding:1rem; line-height: 120%;}
.subtitulosegundo {font-size:1.25rem; display:none;}
.contenidodemo {display:block; padding:0 1rem; margin:0;}
.mensaje {font-size:1.2rem}
#x_petxines, #x_victoria, #x_kitsume, #x_benditolomito, #x_jamonarte, #folletos, #displaymesa, #vallaspetxines, #greezydiner {
    padding: 1rem 2rem 20rem;}
#menuresto	{padding: 1rem 0.5rem 20rem;}
.phoneframe {margin: 0 auto;
}
h1 {line-height: 120%; padding:0!important;}
h2 .fas, h2 .fa {display:none;}
header h4 {
    font-size: 1.5rem;
    margin: 1rem 0 0;
}
.contacto {padding: 1.5rem 0;
    background: #8076B1;
    color: #EAD7FE; display:flex;  justify-content: space-evenly;}

.contacto img {filter: brightness(0) saturate(100%) invert(98%) sepia(26%) saturate(5344%) hue-rotate(185deg) brightness(98%) contrast(104%);
padding:0;}
.WHATSAPP:before {color: #EAD7FE; padding:0;}
.contenidodemo div, #demo div {max-width: 100%; margin:0; border:0; padding:0;}
#demo, #entrega {padding:0rem; border:0; }

.li-img {text-align: center; margin: 1rem auto;}
.li-img img {max-width: unset;}

#descripcion img {
    max-width: unset;
}
.desplazadores {margin: 0 -2rem; width:unset; font-size:2.5rem;}
.previous:before, .next:before {padding: 4px 12px;}
.jssora106 {transform: scale(0.65)!important;}
#folletos {
    padding: 1rem 2rem 3rem;
}
#folletos img {
    margin: 1rem 0 3rem;
    max-width: 100%;
    transform: scale(1.2);
}

.SOCIAL {display: flex; position:fixed;
padding: 0.5rem 2rem 0;
border-radius: 3rem;
align-items:baseline;
top: auto;
right: auto; width:fit-content;
left: 50%;
transform: translate(-50%, 0%);
bottom: 0px;
background:#ffffff;
}
.SOCIAL div {display:block;}

.SOCIAL i {display:none; opacity:0;}
.FCBK:hover i, .TWITTER:hover i, .WHATS:hover i, .MAIL:hover i {display:none; }

.FCBK, .TWITTER, .INSTA, .MAIL, .BACK, .HOME, .WHATS, .LNKDN {color:#002278; width:auto; margin: 0 10px;}
.globos {display:none!important;}
/* .cards
  {
    flex-direction:column;
    margin:auto 0;
  }

  .card
  {
    display:flex;
    width:90%;

  }
.card--leftleft
  {
    transform:scale(0.75) translate(0px, -200px) perspective(750px) rotateY(0) rotateX(-10deg) translateZ(-5px);
  }
  .card--left
  {
    transform:scale(0.85) translate(0px, -92px) perspective(750px) rotateY(0) rotateX(-10deg) translateZ(-5px);
  }

  .card--center
  {
    transform:scale(1) translate(0px, 0px) perspective( 750px ) rotateY(0deg)  rotateX(0deg) translateZ(5px);
  }

  .card--right
  {
    transform:scale(0.85) translate(0px, 92px) perspective(750px) rotateY(0) rotateX(10deg) translateZ(-5px);
  }

  .card--rightright
  {
    transform:scale(0.75) translate(0px, 200px) perspective(750px) rotateY(0) rotateX(10deg) translateZ(-5px);
  }*/
 .lang {
    margin: -0.4rem auto;
}
.lang span {width: 3.5rem;
    height: 3.5rem;
    margin: 0 0.25rem;
	line-height: 900%;
   }
.textorusolargo {margin-left: -0.25rem!important;}


.delivery {
    columns: 1;
    margin: 0 1rem!important; height:unset;
}

sub {
    margin-top: 2rem;
    text-align: center;
}

#jssor_1 {left:-32px!important;}
#vallaspetxines .examples {
    margin-bottom: 0rem;
}
.vallasheader {width:100%; flex-wrap: wrap;}
.thumb {width:50%; margin:0 auto 1rem;}
.thumb img {
   display: block;
   width: 100%;
   height: auto; /* maintain aspect ratio*/
   margin: auto; /*optional centering of image*/
}
.thumb {display:none;}
#displaymesa img {max-width: 100%;}

#folletos img {transform:none;}
.vallapetxines1, .vallapetxines2, .vallapetxines3, .vallapetxines4, .jssort101 {display:none;}
.greezyflyer, .greezyflyer2, .greezylogo {margin: 0 auto;
    position: relative;
    width: 100%; max-width:100%;}
.greezyflyer img {border:4px solid #fff;}

#vallaspetxines {
    padding-bottom: 0rem!important;
}

[data-inviewport="scale-in"], [data-inviewport="scale-in"].is-inViewport { transform: none; opacity:1;}

.menues {font-size:200%; text-align:center;}
.menues ul {font-size:120%; display:flex;}
.menues ul li {margin:0 36px}
.menuinfo {right:unset; width:auto;}
#jssor_2 {top:30px!important;}

.greezyflyer2 img {-webkit-transform: none;
    -moz-transform: none;
    -o-transform: none;
    transform: none;}
}



@media only screen and (min-width : 901px) {

#descripcion img { max-width:100%; margin-left: 0px;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;}

#descripcion img:hover { transform: scale(1.45); margin-top:60px;
 }

.desplazadores {display:none;}

.SOCIAL {position:fixed;
display: block;
background: rgba(25, 26, 41, 0.2);
top: 5rem;
width: 3rem;
right: 0;
text-align: center;
padding: 0.5rem 0 0;
border-radius: 10px 0 0 10px;
bottom: auto;
margin:0;
left: auto;
transform: unset;
}
.SOCIALGLOBAL {background:none; width: unset; position:static;left: 0; transform: unset; display: flex; justify-content: center;}
.SOCIALGLOBAL i {position:relative; right: unset; text-align:center; font-size: 0.75rem; padding-top:0.75rem;}
.SOCIALGLOBAL .FCBK, .SOCIALGLOBAL .TWITTER, .SOCIALGLOBAL .INSTA, .SOCIALGLOBAL .MAIL, .SOCIALGLOBAL .WHATS, .SOCIALGLOBAL .LNKDN {line-height:80%; padding: 1rem 2rem;
display: inline-grid; justify-items:center;}
.FCBK, .TWITTER, .MAIL, .HOME, .BACK, .WHATS, .LNKDN {
margin-bottom:0.75rem; border:none;
}

.demo, #menuresto h3 {display:none;}

#displaymesa h2 {width: 37%;}
.vallaR {display:none;}
}

@media only screen and (min-width : 861px) and (max-width:1010px) {

#demo.contenidomovil div {	max-width:60%}
.globo1 {}
.globo3 {}

.demo, h3 {display:none;}
}


@media only screen and (min-width:576px) {

.grid-item {z-index:unset;}
}


@media only screen and (max-width: 576px) {
  #bardetapas {
    padding: 2rem 1rem 3rem!important}
.grid {
grid-template-columns: repeat(2, 1fr);
margin: 0 0px 0 -5px; padding: 12px;
 }

 .grid-item a img {margin-left: -6px;
	 transform: scale(0.96);
}
.grid-item a:hover img {
transform: scale(0.96);
}

.grid-item.active a:hover img {transform: scale(1.85);}

.grid-item:hover .INFOCOL {
 bottom:0;
}

.grid-item:hover .SUJET, .grid-item:hover .PRICE {
transform: none;
margin-bottom:unset;
margin-right:unset;}

.IMAGECOL {margin-bottom:10px;}
.INFOCOL {flex-direction:row;
	align-items: center;
	bottom:0px;
	justify-content: start;
width: min-content;
text-align: center;
left: 40%;
transform: translateX(-40%);
}
.SUJET, .PRICE {transform:none;
	    line-height: 100%;
	    padding: 0 0px 0px 10px;}
.SUJET {font-size:16px;}
.PRICE {font-size:36px; padding-right:14px;}
.PRICE span {font-size:18px;}
.PRICE sup {font-size:18px; bottom: 0.05rem;}


.grid {grid-gap: 12px; margin:0; display:grid;
}

.menuitem {font-size:3rem;}

#berberechos, #jamon, #chips, #pepinillos, #almejas, #albondigas, #alitas,
#fritas, #banderillas, #aceitunas, #rusa, #paella, #olivasnegras,
#pantomate, #boquerones, #anchoas, #tortilla, #chistorra, #pimientos {display:none;}
/**FIN FONDO DE COLOR**/

#bardetapas .examples {margin-left: 1rem}

}