:root {
    --firstColor: #e7791c;
    --secColor: #f2ece9;
}
*{box-sizing: border-box}
a {text-decoration:none; color:inherit; transition: 0.2s ease}
body, html {margin:0; font-family:"Open Sans", sans-serif; font-size:0px; font-weight:400px; background-color:var(--secColor); scroll-behavior: smooth;}
h1,h2,h3,h4,h5,h6 {display:inline; color:inherit; font-weight:inherit; font-size:inherit}
button {all:unset; cursor:pointer; font-family:"Open Sans", sans-serif; transition: 0.2s ease}
section {position:relative; z-index:2}
sup {font-size:0.5em; line-height:0}
.condensed {font-family: 'Open Sans Condensed', sans-serif}
.bold {font-weight:700}
.bgFirstColor {background-color:var(--firstColor)}
.firstColor {color:var(--firstColor)}
.bgSecColor {background-color:var(--secColor)}
.secColor {color:var(--secColor)}
.bgWhite {background-color:white}
.white {color:white}
.bgBlack {background-color:black}
.black {color:black}
.caps {text-transform:uppercase}
.link {text-decoration:underline}
.nolink {text-decoration:none!important}
.light {font-weight:300}
.bold {font-weight:700}
.fz {font-size:0px}
.aleft{text-align:left}
.aright{text-align:right}
.acenter{text-align:center}
.vtop{vertical-align:top}
.vmiddle{vertical-align:middle}
.vbottom{vertical-align:bottom}
.ltr {direction:ltr}
.rtl {direction:rtl}
.wrapper {width:100%; max-width:1500px; margin:0 auto}
.mobile {display:none}
.desktop {display:block}
.padding {padding:min(4vw,20px) 0}
.inner-padding {padding:min(2vw, 15px)}
.radius {border-radius:min(3vw,20px)}
.floatL {float:left}
.floatR {float:right}
.ahover {opacity:0.7; cursor:pointer}
.ahover:hover {opacity:1}
.table {display:table}
.table .cell {display:table-cell}
.noTouch {pointer-events:none}


.fz14 {font-size:min(1.7vw, 14px); line-height:min(2.5vw, 18px)}
.fz16 {font-size:min(4vw, 16px); line-height:min(5vw, 22px)}
.fz18 {font-size:min(2vw, 18px); line-height:min(3vw, 20px)}
.fz20 {font-size:min(2vw, 20px); line-height:min(3vw, 24px)}
.fz21 {font-size:min(4vw, 20px); line-height:min(5vw, 26px)}
.fz22 {font-size:min(4vw, 18px); line-height:min(5vw, 26px)}
.fz26 {font-size:min(5vw, 26px); line-height:min(5.5vw, 28px)}
.fz32 {font-size:min(6vw, 32px); line-height:min(6.2vw, 34px)}
.fz36 {font-size:min(6.2vw, 36px); line-height:min(6.5vw, 40px)}
.fz40 {font-size:min(7vw, 40px); line-height:min(7.3vw, 44px)}
.fz60 {font-size:min(11vw, 60px); line-height:min(11vw, 62px)}



.icon-small {width:18px; display:inline-block; vertical-align:middle}
.icon-medium {width:25px; display:inline-block; vertical-align:middle}
.icon-large {width:35px; display:inline-block; vertical-align:middle}

.chevron {width:2vw; height:2vw; max-width:15px; max-height:15px; border-bottom:none!important; border-left:none!important}
.chevronDown {transform:rotate(135deg) translate(10px,5px)}
.chevronUp {transform:rotate(-45deg) translateX(-15px)}
.btn {cursor:pointer; white-space:nowrap; border-radius:100px; padding:min(2.5vw, 10px) min(5.5vw, 40px) min(2.5vw, 10px) min(5.5vw, 40px);}


.btnFirstColor {background-color:var(--firstColor); color:black; border:2px solid var(--firstColor) }
.btnFirstColor:hover {animation: button 0.2s ease-out forwards; background-color:transparent; color:var(--firstColor);}

.btnFirstColorOutlined {background-color:transparent; color:var(--firstColor); border:2px solid var(--firstColor) }
.btnFirstColorOutlined:hover {animation: button 0.2s ease-out forwards; border:2px solid black; color:black;}

.btnSecColor {background-color:var(--secColor); color:black; border:2px solid var(--secColor) }
.btnSecColor:hover {animation: button 0.2s ease-out forwards; background-color:transparent; color:var(--secColor);}

.btnSecColorOutlined {background-color:transparent; color:var(--secColor); border:2px solid var(--secColor) }
.btnSecColorOutlined:hover {animation: button 0.2s ease-out forwards; border:2px solid black; color:black;}

.btnBlackColor {background-color:black; color:white; border:2px solid black }
.btnBlackColor:hover {animation: button 0.2s ease-out forwards; background-color:transparent; color:black;}

.btnBlackColorOutlined {background-color:transparent; color:black; border:2px solid black }
.btnBlackColorOutlined:hover {animation: button 0.2s ease-out forwards; border:2px solid var(--firstColor); color:var(--firstColor);}

.btnWhiteColor {background-color:white; color:black; border:2px solid white }
.btnWhiteColor:hover {animation: button 0.2s ease-out forwards; background-color:transparent; color:white;}

.btnWhiteColorOutlined {background-color:transparent; color:white; border:2px solid white }
.btnWhiteColorOutlined:hover {animation: button 0.2s ease-out forwards; border:2px solid black; color:black;}


.firstColorBorder {border:2px solid var(--firstColor)}
.secColorBorder {border:2px solid var(--secColor)}
.blackColorBorder {border:2px solid black}
.whiteColorBorder {border:2px solid white}

.bigArrow {max-width:40px; max-height:40px; width:40px; height:40px}
.mediumArrow {max-width:30px; max-height:30px; width:30px; height:30px}
.smallArrow {max-width:26px; max-height:26px; width:26px; height:26px}
.leftArrow svg {transform:rotate(180deg)}
.topArrow svg {transform:rotate(-90deg)}
.downArrow svg {transform:rotate(90deg) translateX(-3px)}
.firstColorArrow svg path {fill:var(--firstColor)}
button.firstColorArrow:hover svg path {fill:black}

.secColorArrow svg path {fill:var(--secColor)}
button.secColorArrow:hover svg path {fill:white}

.whiteColorArrow svg path {fill:white}
button.whiteColorArrow:hover svg path {fill:black}

.blackColorArrow svg path {fill:black}
button.blackColorArrow:hover svg path {fill:white}

.colorArrow svg path {fill:currentColor}
button.colorArrow:hover svg path {fill:currentColor}

.noColorArrow svg path {fill:none}
button.noColorArrow:hover svg path {fill:none}

button:hover svg path {animation: button 0.2s ease-out forwards}

.hoverFirstColor:hover {color: var(--firstColor); border-color:var(--firstColor)}
.hoverSecColor:hover {color: var(--secColor); border-color:var(--secColor)}
.hoverWhiteColor:hover {color: white; border-color:white}
.hoverBlackColor:hover {color: Black; border-color:black}

hr {border:none; margin:min(2vw,15px) 0}
hr.firstColorBorder {border:1px solid var(--firstColor)}
hr.secColorBorder {border:1px solid var(--secColor)}
hr.blackColorBorder {border:1px solid black}
hr.whiteColorBorder {border:1px solid white}

/*
.padding10 {padding:10px}
.padding20 {padding:20px}
.padding30 {padding:30px}
.padding50 {padding:50px}
.margin10 {margin:10px}
.margin20 {margin:20px}
.margin30 {margin:30px}
.margin50 {margin:50px}
*/

.pi-swiper {position:relative; overflow:hidden; padding:80px 0}
.pi-swiper .arrow { position:absolute; top:97%; transform:translateY(-50%); z-index:2; border:none; width:5vw; height:5vw; cursor:pointer; user-select:none}
.pi-swiper .arrow-edge { position:absolute; top:47%; transform:translateY(-50%); z-index:2; border:none; width:5vw; height:5vw; cursor:pointer; user-select:none}
.pi-swiper .arrow-left {left:42%}
.pi-swiper .arrow-right {right:42%}
.pi-swiper .arrow-left-edge {left:5%}
.pi-swiper .arrow-right-edge {right:5%}
.pi-swiper .arrow-left-toleft {right:15%}
.pi-swiper .arrow-right-toleft {right:5%}
.noArrow .arrow-left {display:none}
.noArrow .arrow-right {display:none}
.pi-swiper .viewport {overflow:hidden;width:100%}
.pi-swiper .slider {display:flex}
.pi-swiper .slide {flex:0 0 auto; border-radius:20px; background-size:cover; background-position:center; position:relative; overflow:hidden}
.pi-swiper a.slide:hover {animation: slide 0.2s ease-out forwards}
@media (hover: hover) {.pi-swiper a.slide:hover img {transform:scale(1.1)}}
@media (hover: hover) {.pi-swiper a.slide:hover img.content-img {transform:scale(1)}}
.pi-swiper a.slide img {transition: 0.2s ease}
.pi-swiper .slide .bg-img {width: 100%; height: 100%; object-fit: cover; object-position: center}
.pi-swiper .slide .contain-img {width: 100%; height: auto}
.pi-swiper .slide .content-img {width: 100%; height: auto; position:relative}
.pi-swiper .slide .sale-tag {position:absolute; top:0; padding:10px 15px; z-index:2; margin:5px; border-radius:15px; background:#F00}
@media(max-width:1024px) {.pi-swiper .slide .sale-tag {padding:1vw 2vw; border-radius:1.5vw}}
.pi-swiper .slide-text {position:absolute; width:100%; z-index:2}
.pi-swiper .slide-text div {padding:min(2vw,20px)}
.pi-swiper .slide-text img {padding:min(2vw,20px)}
/*@media(max-width:1300px) {.pi-swiper .slide-text div {padding:2vw}}*/
.pi-swiper .slide-text div div {padding:0px}
.pi-swiper .slide .bottom-text {bottom:0%}
.pi-swiper .slide .middle-text {top:30%}
.pi-swiper .slide-arrow {position:absolute; right:min(2.5vw,30px); bottom:min(2vw,20px); visibility:hidden; z-index:100; transition: 0.2s ease}
.pi-swiper .slide-arrow span {display:block}
/*.pi-swiper a.slide:hover .whiteColorArrow svg path {fill:black}
.pi-swiper a.slide:hover .firstColorArrow svg path {fill:white}*/
.pi-swiper .show-arrow .slide-arrow {visibility:visible}
.pi-swiper .show-arrow .text {padding-right:min(4vw,50px)}

.pi-video {position:relative;top: 0;left: 0;width: 100vw; overflow: hidden; z-index:1}
.pi-video .pi-video-wrapper {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100vmax; height: 100vmax; min-width: 100vw; min-height: 95vh}
.pi-video iframe {width: 100%;height: 100%;object-fit: cover;border: none; border:0}
.pi-video .video-overlay {position: relative;top: 0;left: 0;width: 100%;height: 100%; z-index: 1; display:table}
.pi-video .video-overlay .wrapper {display:table; height:100%}
.pi-video .video-overlay .cell-content {display:table-cell}

.pi-textImg {display:table; width:100%; overflow:hidden}
.pi-textImg .bg-img {display:table-cell}
.pi-textImg .bg-img img {width:100%; height:100%; object-fit:cover; object-position:center; position:absolute; top:0; left:0; z-index:1; transition: 0.2s ease}
.pi-textImg .hoverElem img {position:absolute; top:0px; opacity:1}
.pi-textImg .bg-img .ltr img {max-width:50%}
.pi-textImg .bg-img .rtl img {max-width:50%; margin-left:50%}
.pi-textImg .split {display:table-cell; width:50%}
.pi-textImg .cell-content {position:relative; z-index:2; padding:min(5vw, 50px)}
.pi-textImg .cell-content .btn-wrapper {padding-top:20px; padding-bottom:30px}
.pi-textImg .cell-img {position:relative; height:100%}
.pi-textImg .cell-img .img-wrapper{display:flex; text-align:center}
.pi-textImg .cell-img .img-wrapper-video {width:100%}
.pi-textImg .cell-img iframe {width:100%; aspect-ratio:16/9}
.pi-textImg .cell-img .img-merged picture:nth-child(1) img{margin-left:2vw; margin-top:20px; position:relative; z-index:2}
.pi-textImg .cell-img .img-merged picture:nth-child(2) img{margin-left:-5vw; margin-top:-20px; position:relative; z-index:1}
.pi-textImg .cell-img img.original{width:100%; height:auto}
.pi-textImg .cell-img img.square{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:1/1}
.pi-textImg .cell-img img.vertical{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:1080/1350}
.pi-textImg .cell-img img.horizontal{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:16/9}

.pi-textImg .img-slider {overflow:hidden}
.pi-textImg .img-slide {position:absolute; top:0; left:0}
.pi-textImg .img-slider picture {opacity:0; transform:translateX(100%); transition:transform 0.6s ease, opacity 0.6s ease; top:0; left:0; width:100%}
.pi-textImg .img-slider picture.active {opacity:1; transform:translateX(0); z-index:2}
.pi-textImg .img-slider picture.exit-left {transform:translateX(-100%); opacity:0; z-index:1}
.pi-textImg .img-slider picture.exit-right { transform:translateX(100%);  opacity:0; z-index:1}


.pi-grid {font-size:0}
.pi-grid .tile {display:inline-table; position:relative; overflow:hidden; vertical-align:top}
.pi-grid a.tile:hover {animation: slide 0.2s ease-out forwards}
@media (hover: hover) {.pi-grid a.tile:hover .bg-img {transform:scale(1.05)}}
.pi-grid a.tile .bg-img {transition: 0.2s ease}


.pi-grid .tile .bg-img {position:absolute; top:0; object-fit:cover; object-position:center; width:100%; height:100%; z-index:1}
.pi-grid .tile .contain-img {position:absolute; top:0; left:0; width:100%; height:auto; z-index:1}
.pi-grid .tile .content-img {max-width:100%; height:auto}
.pi-grid .tile .cell-content {display:table-cell}
.pi-grid .tile .cell-content .text{position:relative; z-index:2}
.pi-grid .tile .vbottom {bottom:0}

.pi-grid .tile-arrow {position:absolute; right:min(2.5vw,30px); bottom:min(2vw,20px); visibility:hidden; z-index:100; transition: 0.2s ease}
.pi-grid .tile-arrow span {display:block}
.pi-grid .show-arrow .tile-arrow {visibility:visible}
.pi-grid .show-arrow .text {padding-right:min(4vw,50px)}
.pi-grid .arrow { position:absolute; top:97%; transform:translateY(-50%); z-index:2; border:none; width:5vw; height:5vw; cursor:pointer; user-select:none}

.pi-grid .tile .cell-content img.square{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:1/1}
.pi-grid .tile .cell-content img.vertical{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:1080/1350}
.pi-grid .tile .cell-content img.horizontal{width:100%; height:auto; object-fit:cover; object-position:center; aspect-ratio:16/9}


.pi-accordeon .accordeon {padding:min(2vw,20px)}
.pi-accordeon .accordeon .text {width:95%; display:inline-block; vertical-align:bottom}
.pi-accordeon .accordeon .chevron_ {width:5%; display:inline-block; vertical-align:bottom; transform:translateY(-10px)}
.accordeonLabel {padding-top:20px}
.accordeonContent { max-height:0; opacity:0; overflow:hidden; transition:max-height 0.3s ease-out, opacity 0.3s ease-out}
.accordeonContent[aria-hidden="false"] { max-height:500px; opacity:1}
.accordeonContent[aria-hidden="true"] { max-height:0; opacity:0;}

/*
.pi-grid .margin10 .tile {margin:5px}
.pi-grid .margin20 .tile {margin:10px}
.pi-grid .margin30 .tile {margin:15px}
.pi-grid .margin50 .tile {margin:25px}
*/

#header {top:0; left:0; z-index:100; position:fixed; background-color:black; width:100%; transition: 0.4s ease}
#header.transparent {background-color:transparent}
#header .header-logo {width:35vw; max-width:220px; height:auto}
#header .table {padding:15px 0px}
#header .table .cell {padding:0px 10px}
#header .nav-container {width:100%; display:flex; gap:2vw; justify-content:right; align-items: center}
#header .nav-item {list-style:none; cursor:pointer; position:relative}
#header .burger {width:35px}
#header .burger .bar {width:35px; height:4px; background:#FFF; margin:5px 0px; border-radius:100px; transition: 0.3s ease}
#header .burger .bar:nth-of-type(2) {width:25px}
#header .burger:hover .bar {animation: bar 0.2s ease forwards; background-color:var(--firstColor)}
#header .burger:hover .bar:nth-of-type(2) {animation: bar 0.3s ease forwards}
#header .burger:hover .bar:nth-of-type(3) {animation: bar 0.4s ease forwards}
#header .nav-item .nav-link:hover {cursor:pointer; transition: 0.2s ease; color:var(--firstColor)}
#header .sub-link {transition: 0.2s ease; position:absolute; width:270px; border-radius:15px; margin-top:10px; padding:10px; opacity: 0; visibility: hidden;pointer-events: none;}
#header .nav-item:hover .sub-link, #header .sub-link:hover {  opacity: 1; visibility: visible; pointer-events: auto;}

@keyframes bar {0% { transform: scaleX(1); } 50% { transform: scaleX(0.55); } 100% { transform: scaleX(1); } }
@keyframes button {0% { transform: scale(1); } 50% { transform: scale(0.85); } 100% { transform: scale(1); } }
@keyframes slide {0% { transform: scale(1); } 50% { transform: scale(1); } 100% { transform: scale(1); } }
@keyframes sidebar {0% { transform: translateX(50vw); } 100% { transform: translateX(0px); } }
@keyframes introduce {0% { transform: translateX(10%);opacity:0 } 100% { transform: translateX(0vw);opacity:1 } }
@keyframes fade-in {0% {opacity:0 } 100% { opacity:1 } }
.pi-textImg .cell-content, .pi-textImg .cell-img, .pi-textImg .bg-img, .pi-grid, .pi-swiper {opacity:0}
.introduce { animation: introduce 1s ease forwards; animation-delay:0.5s}
.fade-in { animation: fade-in 1s ease forwards; animation-delay:0.5s }

@media(max-width:1500px) {
  #header .header-logo {max-width:180px}
  #header .table {padding:10px 0px}
  #header .btn {margin-right:15px}
  #header .burger{margin-right:15px}
  .fz14 {font-size:min(2vw, 12px); line-height:min(2.5vw, 16px)}
  .fz16 {font-size:min(4vw, 14px); line-height:min(5.5vw, 20px)}
  .fz18 {font-size:min(2vw, 16px); line-height:min(3vw, 18px)}
  .fz20 {font-size:min(2.5vw, 18px); line-height:min(3.5vw, 22px)}
  .fz22 {font-size:min(4vw, 16px); line-height:min(5vw, 24px)}
  .fz26 {font-size:min(5vw, 24px); line-height:min(5.5vw, 26px)}
  .fz32 {font-size:min(6vw, 30px); line-height:min(6.2vw, 32px)}
  .fz36 {font-size:min(6.2vw, 32px); line-height:min(6.5vw, 36px)}
  .fz40 {font-size:min(7vw, 37px); line-height:min(7.3vw, 40px)}
  .fz60 {font-size:min(11vw, 55px); line-height:min(11vw, 58px)}
}
  .promo-mobile {position:relative; z-index:1; width:270px; margin-left:10vw; display:none}
@media(max-width:1150px) {
  .promo-mobile {display:block}
  #header .table {table-layout:fixed}
  #header .lang {display:none}
  #header .nav-item .nav-link {display:none}

  #hero {margin-bottom:-20vh}

  .pi-swiper .hide-first {opacity:0; position:absolute; z-index:-1000}

  .hours-price-container {width:100%}

  #hero-menu .split {width:100%; display:block}
  #hero-menu .cell-content {max-width: none !important; min-width: none !important; width:100%!important}
  #hero-menu .cell-img {max-width: none !important; min-width: none !important}
  #hero-menu .pi-textImg .bg-img .ltr img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}
  #hero-menu .pi-textImg .bg-img .rtl img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}
}

@media(max-width:1024px) {
  #Restaurants .bg-img {display:none!important}
  .mobile {display:block}
  .desktop {display:none}
  .pi-textImg .wrapper .split {width:100%; display:block}
  .pi-textImg .cell-img .img-wrapper{display:inline-block}

  .pi-textImg .wrapper .bg-img .ltr img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}
  .pi-textImg .wrapper .bg-img .rtl img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}

  /*.pi-textImg .wrapper .bg-img img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}*/
  .pi-textImg .wrapper .bg-img .hoverElem {display:none}
  .cell-content {max-width: none !important; min-width: none !important}
  .cell-content .cell-wrapper {max-width: none !important; min-width: none !important}
  .cell-img {max-width: none !important; min-width: none !important}
  .bg-img {max-width: none !important; min-width: none !important}

  .cell-content {max-width: none !important; min-width: none !important; width:100%!important}
}

@media(max-width:800px) {

  .bigArrow {max-width:30px; max-height:30px}
  .mediumArrow {max-width:20px; max-height:20px}
  .smallArrow {max-width:20px; max-height:20px}

  .pi-swiper {padding:40px 0}
  .pi-textImg .cell-img .img-wrapper{display:inline-block}
  .pi-textImg .split {width:100%; display:block}

  .pi-textImg .bg-img .ltr img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}
  .pi-textImg .bg-img .rtl img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}

  /*.pi-textImg .bg-img img {position:relative; min-width:none!important; max-width:none!important; margin-left:0%!important}*/

  .cell-content {max-width: none !important; min-width: none !important; width:100%!important}

  .hours-price-container {width:50%}
}

@media(max-width:650px) {

.pi-swiper .fz14 {font-size:2.5vw; line-height:3vw}
.pi-swiper .fz20 {font-size:3vw; line-height:4vw}
.pi-swiper .fz40 {font-size:7vw; line-height:7.3vw}
.pi-swiper .fz60 {font-size:11vw; line-height:11vw}


.fz14, .fz20, .fz40, .fz60 {-webkit-text-size-adjust: 100% !important; transform: none !important; text-size-adjust: 100% !important}



}





/* custom class begin */

.socials-icon a {width:30px; display:inline-block; margin:2px; opacity:0.7}
.socials-icon a:hover {opacity:1; animation: button 0.2s ease-out forwards;}

#footer .wrapper {max-width:90%}
#footer .btn {display:inline-block}
#footer .footer-cell {display:table-cell; position:relative; vertical-align:top}
#footer .footer-cell:nth-child(1) {width:45%}
#footer .footer-cell:nth-child(2) {width:15%}
#footer .footer-cell:nth-child(3) {width:40%}
#footer .nav-item {padding:2px; padding-right:25px; box-sizing:border-box; display:block; break-inside:avoid; margin-bottom:10px}
#footer .nav-wrapper {column-count: 3;column-gap: 20px}
#footer .legal {display:inline-block}
#footer .legal a {text-decoration:underline; display:inline-block}
.notice-confidence {bottom:0.5vw; left:0.5vw; right:0.5vw; border-radius:min(2vw,15px)}
.two-fiche-big div:nth-child(2){font-size:15px!important}
.two-fiche-big div:nth-child(2){font-size:12px!important; line-height:15px}
.cta-notice {border-radius:50px}
.pi-notice {font-size:12px!important; line-height:15px}

@media(max-width:1200px) {
  #footer .footer-cell:nth-child(3) {display:none}
}


#hero {margin-bottom:-5vh; z-index:1}


.showNav {width:100vw}
.hideNav {width:0%}
.toggleNav {user-select:none; cursor:pointer}
#navigation {height:100%; position:fixed; overflow:hidden; top:0; right:0; z-index:1000; transition: 0.4s ease; background:rgba(0,0,0,0.5)}
#navigation .sidebar {height:100%; width:100vw; max-width:600px; position:absolute; z-index:2; overflow-x:hidden; overflow-y:auto; top:0; right:0; padding:min(4vw,30px)}
#navigation .sidebar .close {position:absolute; right:min(4vw,35px); top:min(2vw,15px); z-index:10}
#navigation .libro-off {display:none}
#navigation .libro-on {display:block}
#navigation .sidebar-off {display:none}
#navigation .sidebar-on {display:block}
.side-bar-transition {animation: sidebar 0.2s ease forwards}
.sidebar .btn {display:inline-block}
.sidebar .sideBtn {display:inline-block;vertical-align:3px; transform:scale(0.8)}
.city-select {background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2 4l5 5 5-5'/></svg>")}
.city-select {-webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:18px; margin:20px 0px; border-radius:100px; background-color:transparent; padding:10px 40px 10px 20px; width:100%; max-width:400px; cursor:pointer; background-repeat:no-repeat; background-position:right 15px center; background-size:18px}
.city-select::-ms-expand {display: none}
.city-select:focus {outline: none; border-color: #5c3b00}
#navigation nav .padding {padding:min(2vw,10px) 0}
#libro iframe {width:100%; height:1100px; border:0}

.bgHalf {position:absolute; width:100%; min-height: 230px; height:30vw; max-height:420px}
.hours-price-container {display:inline-block; width:50%; min-width:200px; padding:10px 15px}
/*.hours-price-container:nth-child(odd) {padding-right:15px}
.hours-price-container:nth-child(even) {padding-left:15px}*/
.hours-price-block {display:flex; align-items:center; width:100%; font-size:16px; color:#000; gap:10px}
.hours, .price {flex-shrink:0}
.dashed-line {flex-grow:1; height:12px; background-image:linear-gradient(to right, #000 50%, transparent 50%); background-size:15px 1px; background-repeat:repeat-x; background-position:center bottom}

.googleMap {-webkit-filter: grayscale(100%); filter: grayscale(100%); width: 100%; height: 30vw; min-height: 450px}

.dish-grid {column-count:2; column-gap: 20px;}
@media(max-width:1500px) {
  .dish-grid {column-count:3}
}
@media(max-width:1150px) {
  .dish-grid {column-count:2}
}
@media(max-width:750px) {
  .dish-grid {column-count:2}
}
.dish-item {padding:12px 0px;  text-align:left; line-height:min(4vw,20px)}


/*
.dish-grid {grid-template-rows: masonry; masonry-auto-flow: pack; grid-auto-flow: dense; align-items: start; display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:20px; padding:10px 0; border:1px solid #F00}
@media(max-width:1500px) {
  .dish-grid {grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:15px; padding:10px 0}
}
@media(max-width:1150px) {
  .dish-grid {grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:10px; padding:10px 0}
}
@media(max-width:750px) {
  .dish-grid {grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:10px; padding:10px 0}
}
.dish-item {padding:0px; text-align:left; ; border:1px solid #FF0}
*/



@media(max-width:650px) {
#header .burger{margin-right:5px; transform:scale(0.9)}
#navigation {transition: 0.2s ease}
.hours-price-container {width:100%}
}

form.wpcf7-form p {font-size:min(4vw, 16px); font-weight:700}
form.wpcf7-form label {font-size:min(4vw, 16px); font-weight:700}
form.wpcf7-form span {font-size:min(3vw, 14px); font-weight:400}

span label {
  display: block;
  width: 100%;
}

form.wpcf7-form {padding: 0 min(5vw, 80px); font-size:min(4vw, 16px); max-width:1000px; margin:0 auto;}

form.wpcf7-form input, form.wpcf7-form select, form.wpcf7-form textarea {appearance: none; -webkit-appearance: none; -moz-appearance: none; border-radius:5px; box-shadow:none; outline:none; font:inherit; border:0; resize:none}

form.wpcf7-form input, form.wpcf7-form select, form.wpcf7-form textarea {cursor:pointer; background:transparent; width:100%; box-sizing:border-box; border: 2px solid black; padding:10px; margin:4px 0 15px }
form.wpcf7-form input[type=submit] {max-width:200px; background:#000; color:#FFF; border-radius:100px}
/* custom class end */



input[type="checkbox"] {
  width: 20px;
  height: 20px;
  max-width: 20px;
  max-height: 20px;
  position: relative;
  background: white;
  vertical-align: -20px;
}

/* quand c’est coché */
input[type="checkbox"]:checked {
  background-color: #000;
  border-color: #000;
}

/* petit "check" en CSS */
input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}