/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}
/* E N D normalize.css */



/**
 * Swiper 4.5.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2019 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: February 22, 2019
 */
.swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s right,.2s -webkit-transform;transition:.2s right,.2s -webkit-transform;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right;transition:.2s transform,.2s right,.2s -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}


/* ==========================================================================
   FontFace
   ========================================================================== */

@font-face {
    font-family:'ciutadella-regular';
    src: url('css/fontes/ciutadella_regular.woff2') format('woff2'),
         url('css/fontes/ciutadella_regular.woff') format('woff');
    font-weight:normal;
    font-style:normal;
    font-display:swap;
    }

@font-face {
    font-family:'creative-vintage-draft';
    src: url('css/fontes/creative_vintage_draft.woff2') format('woff2'),
         url('css/fontes/creative_vintage_draft.woff') format('woff');
    font-weight:normal;
    font-style:normal;
    font-display:swap;}


/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  color: #222;
  font-size: 1em;
  line-height: 1.3;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background:#CF996D;
  color:#222;
  text-shadow:none;}

::selection {
  background:#CF996D;
  color:#222;
  text-shadow:none;}

/*a:focus{outline:2px dotted #000819}*/

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/*
   S T Y L E S  G E N E R A U X
*/
html, body{scroll-behavior: smooth;}
html,body{margin:0;padding:0;font-family:'ciutadella-regular',Arial,sans-serif;text-rendering:optimizeLegibility;
  background:linear-gradient(to right, #E76339, #E76339 50%, #CF996D 50%, #CF996D 100%)}
html,body{min-width:320px}
img{max-width:100%;height:auto}
picture{display:block;}
a{color:#000819;text-decoration:underline}
.black-bg a{color:#CF996D}
a:hover{text-decoration:none}
a.bt{display:inline-block;border:1px solid #000819;margin:0 0.25rem 0.25rem 0;padding:0.5em 1em;border-radius:1.5em;text-decoration:none;transition:all 0.2s}
a.bt:hover{background-color:#000819;color:#F4E3D4}
a.bt:focus-within{outline:2px solid #000819;outline-offset:4px}

a.bt.secondary{background-color:#000819;color:#F4E3D4}
a.bt.secondary:hover{background-color:transparent;color:#000819}
a.bt.secondary:focus-within{outline-color:#000819}


.black-bg a.bt{border-color:#CF996D;color:#CF996D;margin:1rem 0.25rem}
.black-bg a.bt.secondary{background-color:#CF996D;color:#000819}
.black-bg a.bt:hover,
.black-bg a.bt.secondary:hover{background-color:#E76339;border-color:#E76339;color:#000819}
.black-bg a.bt.secondary:focus-within{outline-color:#E76339}

.grey-bg a.bt:hover{color:#ced6de}
.grey-bg a.bt.secondary{color:#ced6de}
.grey-bg a.bt.secondary:hover{color:#000819}



header a.bt{color:#fff}
header a.bt:hover{background-color:#fff;color:#222}

h1, h2{
  font-family:'creative-vintage-draft', serif;
  text-rendering:optimizeLegibility;
  font-size:2em;
  line-height:1.4;
  margin:0;
  text-wrap:balance;}
h2{line-height:1.4}
h3{font-size:1em;margin-top:2em;margin-bottom:0.5em}

h2.ciutadella{font-family:'ciutadella-regular',Arial,sans-serif;font-weight:normal}

.cvd{font-family:'creative-vintage-draft', serif}
h3.cvd{font-weight:normal}

p.text-small{font-size:0.8em}
ul{list-style-type:none;padding:0;margin:0}
li > p{margin:0}
ul.liste > li{padding:1em 0}
ul.liste-puces{list-style-type:disc;margin-left:20px;padding-left:10px;line-height:1.1}
ul.liste-puces li{margin-top:5px}

.align-center{text-align:center}
.align-left{text-align:left}
.align-right{text-align:right}
.margin-bottom-0{padding-bottom:0}

.next-screen{position:sticky;bottom:0;padding:2em 0}
.next-screen-bt{
  display:block;text-indent:-1000px;width:60px;height:60px;overflow:hidden;
  background: url('img/next.png') bottom center no-repeat transparent;background-size:20px;}

.flex{display:flex}

.orange-color{color:#E76339}


/*
   L A Y O U T
*/
.col-container{display:flex;justify-content:space-between;}
#restaurant .col-container{flex-direction:column}



:root {
   --screenHeight100 : 100svh;
   --screenHeight90 : 90svh;}

/*
  H E A D E R
*/

ul.nav-accessibility{
  list-style:none;
  margin:0;
  padding:0.75rem;
  position:absolute;
  /*transform:translateY(-100%);*/
  z-index:1070}
ul.nav-accessibility:focus-within li a{
  opacity:1;
}
ul.nav-accessibility li {
  display:block;
  margin-right: .3125rem;}
ul.nav-accessibility li a{
  opacity: 0;
}

ul.nav-accessibility li a:focus{opacity: 1}

body > header{background-color:#CF996D;color:#000819}
header div.branding{opacity:0;height:0}



/* S E C T I O N S */
.section-label{text-transform:uppercase}
section{background-color:#F4E3D4}
section#accueil, section#footer{background-color:#000819;color:#F4E3D4}
section#restaurant,section#menus,section#horaires{background-color:#F4E3D4;color:#000819}
.grey-bg, section#exergue,section#salon-privatif,section#reservation{background-color:#9BA2AA;color:#000819}
section#accueil,section#footer,section#exergue,section#reservation-horaires{display:flex;flex-direction:column;justify-content:center;align-items:center}
main > section header p{margin-top:0.5em}
footer{background-color:#9BA2AA;color:#000819}
footer a{color:#000819} 


/* S E C T I O N S : A C C U E I L */
section#accueil h1,section#footer h1{
  height:500px;max-width:100%;max-height:100%;display:block;text-indent:-10000px;
  background:url("img/troisSoupes-logo-symbole-2x.gif") no-repeat center center;
  background-size:contain}
section#accueil .citation,section#footer .citation{text-align:center;color:#CF996D;margin:1em}
.citation p, .citation p{margin:0 0 0.5em 0}
section#accueil .inner,section#footer .inner{height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;}


/* S E C T I O N S : R E S T A U R A N T */
#restaurant .col-container{margin-bottom:4rem}
#restaurant h2{font-size:1.125rem}
#restaurant ul{padding:2rem 0}
#restaurant ul li{display:flex;align-items:center;margin-top:1rem}
#restaurant ul li::before{
  content:"1";
  display:block;
  width:0.75em;
  height:auto;
  margin-right:0.25em;
  font-family:'creative-vintage-draft', serif;
  font-size:3em;
  text-align:center;
  color:#79828C}
#restaurant ul li:nth-child(2)::before{content:"2";}
#restaurant ul li:nth-child(3)::before{content:"3";}
#restaurant ul li span{width:calc(100% - 80px)}
#restaurant .col.flex{justify-content:flex-end;align-items:center}
#restaurant .images-texte{margin:2em 0;text-align:center;}


/* S E C T I O N S : E X E R G U E */
section#exergue img{margin-bottom:2em}



/* S E C T I O N S : S O U P E S */
section#soupes li{border-bottom:1px solid #9BA2AA}

/* S E C T I O N S : M E N U */
section#menus .grid-container .bloc{display:flex;flex-direction:column;justify-content:space-between}
section#menus .grid-container .bloc,
section#menus .col.carte ul.liste li{border:1px solid #000819;margin-top:1em;padding:10px 30px}
section#menus .col.carte ul.liste li{padding:20px 30px}
section#menus .col > ul > li{border-bottom:1px solid #000819}
section#menus .col > ul > li span.cvd{display: block}
section#menus .col > ul > li:last-child{border-bottom:0}
section#menus .col.carte ul.liste li{display:flex;justify-content:space-between}
/*section#menus .col.carte.aperitifs-dinatoires{margin-top:2em}*/

/* S E C T I O N S : H O R A I R E S */
section#horaires{
  display:flex;justify-content:center;align-items:center;flex-direction:column;
  background-image:url('img/cuillere-fourchette.gif');
  background-repeat: no-repeat;background-position: center center;
  background-size:70%}
section#horaires .col{text-align:center}
section#horaires p{margin:0.5em auto 0 auto;max-width:250px}
/*section#horaires p:nth-child(3){}*/


/* S E C T I O N S : R E S E R V A T I O N */
section#reservation{display:flex;justify-content:center;align-items:center;flex-direction:column;}
section#reservation ul {display:flex;justify-content:center}
section#reservation ul li{margin:0.25em}
section#reservation img.gravure-telephone{margin-top:2em}


.swiper-container{width:100%;}
.swiper-slide{
  text-align:left;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;}
.content .swiper-slide p{width:100%;text-align:left;margin:20px 0 30px 0}
.swiper-slide img{width:100%;height:auto}

img.swiper-lazy{opacity:0;transition:0.25s opacity}
img.swiper-lazy.swiper-lazy-loaded{opacity:1}

.swiper-lazy-preloader{margin-top:-60px}

.swiper-button-next,
.swiper-button-prev{background-image: url("data:image/svg+xml,%3Csvg id='Calque_1' data-name='Calque 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='27 44 0 22 27 0 27 44'/%3E%3C/svg%3E")}
.swiper-button-next{transform: rotate(180deg)}
.swiper-button-next, .swiper-button-prev{margin-top:-60px}
.swiper-pagination{text-align:left}
.swiper-container-horizontal > .swiper-pagination-bullets{bottom:0}
.swiper-pagination-bullet-active{background:#518ecc}

.toggle{text-decoration:underline}
.toggle:hover{cursor:pointer;text-decoration:none}
.collapse{transition:all 0.2s}
.collapse.open{height:auto;overflow:visible}
.collapse.close{height:0;overflow:hidden}

/* .cryptedmail:after{content: attr(data-name) "@" attr(data-domain) "." attr(data-tld)} */



/*
  F O O T E R
*/

footer a.toggle{display:block;width:100%;text-align:center}

.sticky-menu{
  position:fixed;
  bottom:0;
  right:0;
  margin:30px;
  z-index:1000}
.sticky-menu ul{display:flex;align-items:flex-end;justify-content:flex-end;flex-direction:column}
.sticky-menu ul li{
  /*font-family:'creative-vintage-draft', serif;*/
  /* font-size:1.5em; */
  text-decoration:none;
  text-align:center}

.sticky-menu ul li a{
  display:block;
  height:100%;
  padding:1em 1em;
  font-size:0.9em;
  color:#000819;
  text-decoration:none;}




.sticky-menu ul li a.backtotop:hover,
.sticky-menu ul li a:hover{background-color:#000;color:#fff}




/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .sr-only class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (max-width: 1023px) {
  .desktop{display:none}

  main,footer{margin:0 10px}
  h1, h2{font-size:1.5em}
  h2.align-center{width:100%;text-align:center}
  button#nav-toggle{
    display:block;position:fixed;top:15px;right:25px;
    width:30px;height:30px;
    padding:0;margin:0;
    border:1px solid #CF996D;
    background:url('img/menu-mobile.svg') center left transparent;
    background-size:cover;
    background-color:#000819;
    text-indent:-1000px;
    overflow:hidden;
    z-index:100}
  button#nav-toggle:hover{cursor:pointer}
  a#mobile-reservation.bt{
    font-family:'creative-vintage-draft', serif;
    position:absolute;top:0;left:0;color:#CF996D;
    border:1px solid #CF996D;padding:0.3em 1em 0.2em 1em;top:15px;left:25px}
  a#mobile-reservation.bt:hover{background-color:#E76339;border:1px solid #000819;color:#000819}
  #navigation #nav{
    display:flex;opacity:0;
    transition: opacity 0.4s;
    position:fixed;
    width:calc(100% - 20px);
    height:100vh;
    background-color:#000819;
    margin:0 10px;
    z-index:-90}
  header.close{height:0;padding-top:0!important;overflow:hidden}
  /*header.open{height:auto}*/
  header.close #navigation #nav{}
  header.open #navigation #nav{z-index:90;opacity:1;}
  header.open button#nav-toggle{background-position: center right}
  body.no-scroll{overflow:hidden}
  body.no-scroll footer .sticky-menu{display:none !important}


  #navigation #nav ul{width:100%;display:flex;flex-direction:column;justify-content:flex-start;background-color:#1E2B46}
  #navigation #nav ul li{min-height:40px}
  #navigation #nav ul li:first-child{margin-top:60px}
  #navigation #nav ul li a{
    font-family:'creative-vintage-draft', serif;font-size: 1.1em;
    display:block;padding:1.25em 0;
    color:#F4E3D4;text-decoration:none;text-align:center}
  
  #navigation #nav ul li a:hover,
  #navigation #nav ul li a:focus{background-color:#E76339}
  #navigation #nav ul li a span{font-size:1.3em;line-height:1}
  
  .sticky-menu{width:calc(100% - 20px);margin:0 10px}
  .sticky-menu ul{flex-direction: row}
  .sticky-menu ul li{width:50%;font-family:'creative-vintage-draft', serif;}
  .sticky-menu ul li a.sticky-menu-reservation{background-color:#E76339}
  .sticky-menu ul li a.sticky-menu-reservation:hover{background-color:#000819}
  .sticky-menu ul li a.backtotop{background-color:#CF996D}
  

  section, footer{padding:15px}
  section{padding-top:25px;padding-bottom:15px}
  footer .content.open{padding-top:25px}
  footer{padding-bottom:60px}

  .grid-container .col2-r1.menu{margin-top:2rem}

  section#accueil,
  section#exergue,
  section#horaires,
  section#reservation{min-height:calc(var(--screenHeight100) - 300px);padding-top:0;padding-bottom:0}

  .citation{line-height:1.1}
  .citation p.text-small{margin-top:0.5em}

  section#exergue, section#reservation, section#horaires{padding-top:75px;padding-bottom:75px;}

  section#soupes ul li:last-child{border-bottom:0}

  section#horaires{
    display:flex;justify-content:center;align-items:center;flex-direction:column;
    background:url('img/cuillere-fourchette-90.gif') no-repeat center center #F4E3D4;
    background-size: 110%;}

  section#reservation ul{flex-direction:column;align-items:center}
  section#reservation ul li{margin:0.5em 0 0 0}

  section#accueil h1, section#footer h1 {
    margin:0 1em;
    max-width:calc(100% - 2em);
    width: 1000px;
    height:350px;
    background:url("img/troisSoupes-logo-symbole-vertical-2x.gif") no-repeat center center;
    background-size:auto;
    background-size:contain}

  

  section#menus .col.menu > p {margin:0.5em 0}
  /*section#menus .col.menu{margin-top:4em}*/
  section#menus .col.menu.aperitifs-dinatoires{margin-top:4em}

  section#horaires .col,
  section#reservation .col{margin-top:3em}
  section#horaire .col:first-child{margin-top:0}
  section#menus .col.menu ul.liste,
  section#menus .col.carte ul.liste li{padding:10px 15px}}


@media only screen and (max-width: 450px) {
  }

@media only screen and (max-width: 400px) and (max-height: 800px) {
  }

@media only screen and (min-resolution: 2dppx) and (max-width: 380px) {
  }

@media only screen and (max-width: 360px) {
  }

@media only screen and (max-width:599px){
  section#restaurant div.images picture{margin-bottom:15px}
  section#restaurant div.images picture:last-child{margin-bottom:0}

}

@media only screen and (min-width:600px){
  .images{display:flex;justify-content:space-between;overflow:hidden}
  .images .oneThird{width:calc(33.333333% - 20px);height:auto}
  .images .twoThirds{width:calc(66.666666% - 20px);height:auto}
  .images .half{width:calc(50% - 20px);height:auto}

}


@media only screen and (min-width: 1024px) {
  .mobile{display:none}
  #nav-toggle,#mobile-reservation{display:none}
  main,footer{margin:0 15%}

  body > header{padding:25px}
  section,footer{padding:40px}
  section,footer{padding-top:40px;padding-bottom:40px}
  
  /*footer .content.open{padding-top:50px}*/

  section{min-height:700px}
  section{min-height:calc(var(--screenHeight100) - 80px)}
  
  
  section#accueil h1,section#footer h1{max-width:100%;width:1000px;}

  body > header{position:fixed;top:0;right:0;width:calc(15% - 50px);height:calc(100vh - 50px);display:flex;flex-direction:column;justify-content:center;align-items:flex-end}
  body > header .branding{width:130px;height:auto}
  /* body > header .branding .header-image-container{display:none} */

  header div.branding{max-width:100%;height:0;opacity:1;overflow:hidden;transition: height 0.2s linear 0s}
  header div.branding a{
    display:block;text-indent:-1000px;width:200px;height:100px;max-width:100%;overflow:hidden;
    background: url("img/troisSoupes-logo-deuxLignes-2x.gif") no-repeat center right;
    background-size:contain;}
  header div.branding.show{height:100px}

  div#navigation{padding-top:0}
  div#navigation nav a{position:relative;display:inline-block;padding:0.25em;line-height:0.8;width:auto;transition:all 0.2s;background-color:#CF996D}
  div#navigation nav a:after{
    content: '';
    background: url("img/texture-gravure.gif") center center no-repeat;
    background-size: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0px;
    right: 0px;
    z-index: -1;
    transition:all 0.2s 0.2s}
  div#navigation nav a:hover,
  div#navigation nav a.current{padding:0.5em;background-color:#F4E3D4;color:#222;margin-right:10px}
  div#navigation nav a:hover:after,div#navigation nav a.current:after{bottom:-10px;right:-10px;}

  div#navigation nav a.bt span{
    display:block;
    text-transform:uppercase;
    font-size:40px;
    margin:0}

  header #navigation{margin-top:5px}
  header #navigation li{text-align:right;margin:0.75em 0}
  header #navigation li a{text-decoration:none;text-transform:uppercase;line-height:1}

  .col-container-two,.col-container-three{display:flex;width:100%;justify-content: space-between;}
  .col-container-two .col{width:calc(50% - 10px)}
  .col-container-three .col{width:33.333333%}
  .col.twoThirds{width:calc(66.666666% - 40px);}
  .col.oneThird{width:calc(33.333333% - 40px);}

  section#accueil{padding-top:0}
  .citation br{display: none}

  section#restaurant .col-container{flex-direction:row}
  section#restaurant h2{font-size:1.25rem}
  section#restaurant ul{padding:2em 0 4em 0}
  
  section#exergue h2{font-size:2em}

  section#soupes ul.liste{display: flex; flex-wrap: wrap;justify-content: space-between;}
  section#soupes ul.liste li{width:calc(50% - 10px)}
  section#soupes ul.liste li:nth-last-child(2),
  section#soupes ul.liste li:last-child{border-bottom:0}

  .grid-container{
    display:grid;
    grid-template-columns:1fr 60px 1fr;
    grid-template-rows:auto auto;
    grid-template-areas:
    "col1row1 gut col2row1"
    "col1row2 gut col2row2";}

  .grid-container .col1-r1{grid-area:col1row1}
  .grid-container .col1-r2{grid-area:col1row2}
  .grid-container .col2-r1{grid-area:col2row1}
  .grid-container .col2-r2{grid-area:col2row2}

  section#reservation ul{flex-direction:row}
  section#horaires .col-container-two{width:80%;margin:auto}
  .sticky-menu .sticky-menu-reservation{display:none}
  .sticky-menu ul li a{
    border:1px solid #000819;
    border-radius:2em;}
  .sticky-menu ul li a:focus-within{outline:2px solid #000819;outline-offset:4px}
}

@media only screen and (min-width:1200px) {
  section, footer{padding:60px}
  section#restaurant .images .oneThird{width:calc(33.333333% - 30px);height:auto}
  section#restaurant .images .twoThirds{width:calc(66.666666% - 30px);height:auto}
  section#soupes ul.liste li{width:calc(50% - 20px)}
  .col-container-two .col{width:calc(50% - 20px)}
}

@media only screen and (min-width:1600px) {
  body{font-size:1.3em}
  section, footer{padding:80px}
  section#restaurant .images .oneThird{width:calc(33.333333% - 40px);height:auto}
  section#restaurant .images .twoThirds{width:calc(66.666666% - 40px);height:auto}
  section#soupes ul.liste li{width:calc(50% - 30px)}
  .col-container-two .col{width:calc(50% - 30px)}
}

@media only screen and (min-width:2000px) {
  body{font-size:1.5em}
  section#restaurant h2{font-size:1.75rem}
  section#menus .col.menu ul.liste{margin-top:50px;padding:20px 60px;}
  section#menus .grid-container .bloc{margin-top:50px}
  section#menus .col.menu ul.liste > li{padding:2em 0}
  section#menus .col.carte ul.liste li{padding:40px 60px;margin-top:2em}
  section#soupes ul.liste li{padding:1.5em 0}
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}



