html, body {
  height: 100%;
}

body {
  font-family: 'Traveling Typewriter', Sans-serif;
  font-size: 12px;
  line-height: 1.4em;
  color: #212121;
  background: #ebe8e3;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transition: .6s opacity ease;
}

body.loaded {
  opacity: 1;
}

.wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  background: #f5f5f5;
    background-image: url(../img/fond-nature.jpg);

}
body.page-privacy-policy .wrap,
body.page-legal-notices .wrap,
body.page-charte-de-confidentialite .wrap,
body.page-mentions-legales .wrap {
	background-attachment: fixed;
}

.strike {
    text-decoration: none;
    margin: 0 -.5em;
}
p {
  line-height: 1.6em;
}
p, blockquote, .p-like {
  margin-bottom: 1em;
  max-width: 55em;
  margin: 0 auto;

}

p.center { text-align: center; }
p.right { text-align: right; }
p.left { text-align: left; }

blockquote {
}

p img {
  max-width: 100%;
  margin: 1em 0;
}

header {
    padding: 1em;
}

h1 {
  font-weight: 600;
  font-size: 1.6em;
  line-height: 1.2em;
  letter-spacing: .06em;
  width: 6em;
}

h1:before {
}

h1:after {
}

h1 img {
  width: 100%;
}

h2 {
    font-size: 2em;
    margin-bottom: 1em;
}

h3 {
  font-size: 1.6em;
  max-width: 33.7em;
  margin: 0 auto .6em auto;
  line-height: 1.2em;
}

h5{
  font-style: italic;
  text-align: center;
  font-size: 14px;
}

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

a:hover {
    color: #aa0000!important;
}

header, footer, section {
  margin: 0 auto;
  position: relative;
}
header {
  z-index: 11;
}

.item {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 3;
}

input[name="tap"] + nav {
  opacity: 0;
  pointer-events: none;
  transition: 0.2s opacity ease-out;
  -webkit-transition: 0.2s opacity ease-out;
}

input[name="tap"]:checked + nav {
  opacity: 1;
  pointer-events: auto;
}

nav {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  font-family: 'Avenir', Sans-serif; letter-spacing: .04em;
  background-color: rgba(50, 50, 50, 0.5);
}

nav > div {
  position: relative;
  height: 100%;
}

nav > div > menu {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

nav > div > menu > li {
  list-style-type: none;
  text-align: center;
  padding: 1em;
  position: absolute;
  width: 10em;
  height: 10em;
  background-color: rgba(250,250,250,1);
  border: .45em solid  rgba(250,250,250,1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: .6s background-color ease-out;
  -webkit-transition: .6s background-color ease-out;
  background-color: rgba(230,230,230,1);
    box-shadow: 0 0 5px #666;
}
nav > div > menu > li.empty { pointer-events: none; }
nav > div > menu > li:hover {
  background-color: rgba(20,20,20,1);
}

nav > div > menu > li > a {
    text-transform: uppercase;
     transition: .3s color ease-out;
     -webkit-transition: .3s color ease-out;
         color: #212121;
    }
    nav > div > menu > li {
      cursor: pointer;
    }
    nav > div > menu > li:hover > a,
    nav > div > menu > li > a:hover {
  color: #837259;
}

nav > div > menu ul {
    font-size: .6em;
    pointer-events: none;
    text-align: left;
    padding: 0 1em;
    margin-top: 1em;
    margin-bottom: 1em;
    width: 100%;
    display: none;
    border-left: 1px solid #c1b49d;
    line-height: 1.35em;
}
nav > div > menu ul li a {
    color: #777777;
}

nav > div > menu  {
  height: 100vh;
}
nav > div > menu > li { top: -10em; right: -10em; transition: .3s top ease-out, .6s background-color ease-out, .3s right ease-out; z-index: 1}
nav > div > menu > li:nth-child(1) {   top: -10em; right: -10em; width: 12em; height: 12em; transition-delay: .1s; z-index: 1 }
nav > div > menu > li:nth-child(2) {  top: -10em; right: -10em; transition-delay: .2s;  z-index: 1}
nav > div > menu > li:nth-child(3) {  top: -10em; right: -10em; transition-delay: .3s; z-index: 1 }
nav > div > menu > li:nth-child(4) {  top: -10em; right: -10em; width: 7em;  height: 7em;  transition-delay: .4s;  z-index: 1}
nav > div > menu > li:nth-child(5) {  top: -10em; right: -10em; transition-delay: .5s; z-index: 1 }
nav > div > menu > li:nth-child(6) {   top: -10em; right: -10em; width: 8em; height: 8em; transition-delay: .6s;  z-index: 1}
nav > div > menu > li:nth-child(7) {   top: -10em; right: -10em; width: 4em; height: 4em; transition-delay: .7s;  z-index: 1}
nav > div > menu > li:nth-child(4) ul { display: none;}

nav > div > menu > li:nth-last-child(1) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .15s; top: -10em; right: -10em; width: .6em; height: .6em; padding: 0; z-index: 0;}
nav > div > menu > li:nth-last-child(2) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .25s; top: -10em; right: -10em; width: 1em; height: 1em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(3) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .35s; top: -10em; right: -10em; width: 1.6em; height: 1.6em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(4) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .45s; top: -10em; right: -10em; width: 2.2em; height: 2.2em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(5) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .55s; top: -10em; right: -10em; width: 2.8em; height: 2.8em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(6) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .575s; top: -10em; right: -10em; font-size: 1.6em; width: 0.6em; height: 0.6em; padding: 0; z-index: 0;}
nav > div > menu > li:nth-last-child(7) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .6s; top: -10em; right: -10em; font-size: 1.6em; width: 1em; height: 1em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(8) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .625s; top: -10em; right: -10em; font-size: 1.6em; width: 1.6em; height: 1.6em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(9) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .650s; top: -10em; right: -10em; font-size: 1.6em; width: 2.2em; height: 2.2em; padding: 0; z-index: 0; }
nav > div > menu > li:nth-last-child(10) { border: 0; background-color: rgba(255,255,255,0.6); transition-delay: .675s; top: -10em; right: -10em; font-size: 1.6em;  width: 2.8em; height: 2.8em; padding: 0; z-index: 0; }


input[name="tap"]:checked + nav > div > menu > li:nth-child(1) { top: 6em; right: 1em;}
input[name="tap"]:checked + nav > div > menu > li:nth-child(2) { top: 1em; right: 11.5em; width: 240px;}
input[name="tap"]:checked + nav > div > menu > li:nth-child(3) { top: 16em; right: 14em;}
input[name="tap"]:checked + nav > div > menu > li:nth-child(4) { top: 20em; right: 3em; width: 10em;
    height: 10em;}
input[name="tap"]:checked + nav > div > menu > li:nth-child(5) { top: 29em; right: 1em; width: 10em;
    height: 10em; }
input[name="tap"]:checked + nav > div > menu > li:nth-child(6) { top: 35em; right: 13em; }

input[name="tap"]:checked + nav > div > menu > li:nth-last-child(1) { top: attr(data-top); right: attr(data-right); }
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(2) { top: attr(data-top); right: attr(data-right);}
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(3) { top: attr(data-top); right: attr(data-right);}
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(4) { top: attr(data-top); right: attr(data-right);}
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(5) { top: attr(data-top); right: attr(data-right); }
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(6) { top: attr(data-top); right: attr(data-right); }
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(7) { top: attr(data-top); right: attr(data-right); }
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(8) { top: attr(data-top); right: attr(data-right); }
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(9) { top: attr(data-top); right: attr(data-right);}
input[name="tap"]:checked + nav > div > menu > li:nth-last-child(10) { top: attr(data-top); right: attr(data-right);}

input[name="tap"]:checked + nav > div > menu > li[data-top="1em"] { top: 1em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="2em"] { top: 2em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="3em"] { top: 3em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="4em"] { top: 4em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="5em"] { top: 5em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="6em"] { top: 6em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="7em"] { top: 7em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="8em"] { top: 8em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="9em"] { top: 9em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="10em"] { top: 10em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="11em"] { top: 11em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="12em"] { top: 12em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="13em"] { top: 13em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="14em"] { top: 14em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="15em"] { top: 15em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="16em"] { top: 16em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="17em"] { top: 17em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="18em"] { top: 18em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="19em"] { top: 19em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="20em"] { top: 20em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="21em"] { top: 21em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="22em"] { top: 22em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="23em"] { top: 23em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="24em"] { top: 24em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="25em"] { top: 25em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="26em"] { top: 26em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="27em"] { top: 27em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="28em"] { top: 28em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="29em"] { top: 29em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="30em"] { top: 30em; }
input[name="tap"]:checked + nav > div > menu > li[data-top="37em"] { top: 42em; }

input[name="tap"]:checked + nav > div > menu > li[data-right="1em"] { right: 1em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="2em"] { right: 2em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="3em"] { right: 3em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="4em"] { right: 4em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="5em"] { right: 5em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="6em"] { right: 6em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="7em"] { right: 7em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="8em"] { right: 8em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="9em"] { right: 9em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="10em"] { right: 3em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="11em"] { right: 11em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="12em"] { right: 12em; }
input[name="tap"]:checked + nav > div > menu > li[data-right="13em"] { right: 13em; }

nav > div > menu > li:nth-child(5) ul {
display: none;
}

section {
  margin: 1em auto;
  transform: translateY(0);
  opacity: 1;
  transition: opacity .3s ease-out;
}
/* , section:last-of-type  */
section.active{
  transform: translateY(0);
  opacity: 1;
}

article img {
  transform: translateX(2em);
  opacity: 0;
  transition: transform .6s ease-out, opacity .3s ease-out;
  transition-delay: 1s;
}

article img.animate {
  transform: translateX(0);
  opacity: 1;
}



.background-container {
  margin: 0 auto;
  -webkit-mask-box-image: url(../img/mask.svg);
  mask: url(../img/maskff.svg#maskid);
}

.background {
  width: 100%;
  height: 100vw;
  background-size: cover;
  background-position: 50%;
}

article {
  padding: 1em;
}

form {
  max-width: 44em;
  margin: 0 auto;
}

form input[type="text"], form input[type="submit"], form button, form textarea {
  font-size: 1em;
  font-family: 'Avenir', Sans-serif; letter-spacing: .04em;
  background: transparent;
  padding: .3em .6em;
  border: .25em solid #ccc;
  margin: .6em auto;
  width: 100%;
}

form input[type="text"].erreur, form textarea.erreur {
  border: .25em solid #FF9D9D;
}

form input[type="submit"], form button {
  border: .25em solid #212121;
  font-weight: bold;
  cursor: pointer;
}

form input[type="submit"]:hover, form button:hover {
  background: #212121;
  color: #f5f5f5;
}

.succes { text-align: center; color: #3FBD67; }

footer {
  font-family: 'Avenir', Sans-serif; letter-spacing: .04em;
  text-align: center;
    padding: 1.4em;
    background: #ebe8e3;
}

footer span {
  font-size: .8em;
  display: block;
  margin: .6em 0;
}

footer span.icon-mkb {
    font-size: 1.6em;
    vertical-align: middle;
}
article h1 {
    text-align: center;
    position: relative;
    width: auto;
    font-family: 'Times New Roman', serif;
    font-style: italic;
    letter-spacing: 0;
    margin-bottom: 0.5em;
    font-size: 2.5em;
}
article h1:after {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: -0.5em;
    width: 2.5em;
    border-bottom: .1em solid #837259;
    left: 0;
    right: 0;
    margin: 0 auto;
}

a {
  color: #212121;
}

p { text-align: left; line-height: 1.3; }

.cmn-toggle-switch__htx span,
.cmn-toggle-switch__htx span::before,
.cmn-toggle-switch__htx span::after {
  background-color: #837259;
}
h2 {
    max-width: 40em;
    margin: 0 auto 1.5em;
}
.background {position: relative;}
.background:before {
    content: '';
    position: absolute;
    display: inline-block;
    width: 99%;
    margin: auto;
    border-bottom: .1em solid #000;
    transform: rotate(17.5deg);
    top: 16%;}

.cuvee {

}
.carte .background:before {
  border-bottom: .1em solid #000;
}
  .next {
    text-align: center;
    padding: 5em;
    opacity: 1;
    z-index: 5;
  }

  .next.updating a {
    display: block;
    -webkit-animation: bounce 0.35s ease infinite alternate;
    animation: bounce 0.35s ease infinite alternate;
  }
  @keyframes bounce{
       from {transform: translateY(0);-webkit-transform: translateY(0);}
       to   {transform: translateY(-1em);-webkit-transform: translateY(-1em);}
  }
  @-webkit-keyframes bounce{
       from {transform: translateY(0);-webkit-transform: translateY(0);}
       to   {transform: translateY(-1em);-webkit-transform: translateY(-1em);}
  }
  .agelegal {
    width: calc( 100vw - 2em );
    height: calc( 100vh - 2em );
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url(../img/fond-dessin.png);
    background-size: cover;
    background-position: 50%;
    text-align: center;
  }
  .mfp-bg {
    background-image: url(../img/fond-nature.jpg);
    opacity: 1;
    background-size: cover;
    background-position: 50%;
    transition: 1s opacity ease;
  }
  .mfp-bg.closing {
    opacity: 0;
  }
  .mfp-wrap {
    padding: 1em;
    background-color: #2c2825;
    transition: 1s background-color ease;
  }

  .mfp-wrap.closing {
  background-color: rgba(255,255,255,0);
  }
  .mfp-wrap.closed .mfp-container {
    opacity: 0;
  }
  .mfp-wrap.closed {
  background-color: rgba(255,255,255,0);
  }

  .mfp-wrap {
  }
  .mfp-container {
    background-image: url(../img/fond-croquis.png);
    background-size: cover;
    background-position: 50%;
    top: 1em;
    right: 1em;
    left: 1em;
    bottom: 1em;
    max-width: calc( 100% - 2em);
    max-height: calc( 100% - 2em);
    transition: 1s opacity ease;
  }
  .mfp-container:before {

    display: none;

  }
  .closing  .mfp-container {
  transition: 1s opacity ease;
  }
  .mfp-content {
    transition: 1s opacity ease;
  }
  .closing .mfp-content {
    opacity: 0;
  }

  .agelegal img {
    width: 19em;
  }

  .agelegal p, .agelegal blockquote {
    color: #f1f1f1;
    text-align: center;
    margin: 2em 0;
  }

  .agelegal > div  {
    padding: 1em;
  }
  .agelegal p {
    font-family: 'Avenir', Sand-serif;letter-spacing: .04em;
    font-size: .8em;
      position: relative;
      margin-bottom: 4em;
    margin-right: auto;
    margin-left: auto;
  }


  .agelegal img + div p:first-child::after {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: -1.6em;
    width: 9.5em;
    border-bottom: .1em solid #837259;
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  .agelegal a {
    font-size: 1.4em;
    text-transform: uppercase;
    color: #f1f1f1;
    vertical-align: middle;
    letter-spacing: .05em;
    margin: .6em;
  }
  .agelegal a.passer {
      font-size: 1em;
  }
  .agelegal small {
      font-size: .8em;
  }
  .agelegal blockquote {
  }

  .mfp-content {
  }
  .cmn-toggle-switch__htx {
      background-color: transparent;
  }
  body::before{
    content: '';
    display: inline-block;
    position: fixed;
    background: #ebe8e3;
    width: 100%;
    height: 1em;
    left: 0;
    z-index: 11;
     top: 0;
  }

  header::before {
    content: '';
    display: inline-block;
    position: fixed;
    transform: skewX(45deg);
    -webkit-transform: -webkit-skewX(45deg);
    background: #ebe8e3;
    width: 10em;
    height: 10em;
    top: 0;
    font-size: 16px;
    right: -7em;
  }
  .cmn-toggle-switch__htx.active {
    background-color: transparent;
  }
  .strip {
    content: '';
    display: inline-block;
    position: fixed;
    background: #ebe8e3;
    width: 100%;
    height: 1em;
    top:0;
    z-index: 1;
  }
  .le-meunier-chez-dehours .background::before{
    border-bottom: .1em solid #f1f1f1;
  }

  li {
      list-style-type: none;
    }

    p.right a {
      display: inline-block;
      position: relative;
      color: #212121;
      font-size: 1.1em;
      margin-top: 30px;
      padding: 0 25px;
    }
    p.right a::before{
    content: '';
    background: rgba(255,255,255,0.8);
    left: -1em;
    right: -1em;
    height: 2.6em;
    margin-top: -.5em;
    transform: skewX(-17.5deg);
    display: inline-block;
    position: absolute;
    z-index: -1;
    transition: 0.5s;
    }

    p.right a:hover::before{
    background: rgba(255,255,255,1);
    }

.sonar-container {
  position: relative;
  width: 400px;
  height: 400px;
  margin: 0 auto;
  font-size: 14px;
  cursor: crosshair;
}
.sonar-container .overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index:2;
  pointer-events: none;
  border-radius: 400px;
}
.sonar-container .label {
  position: absolute;
  display: inline-block;
  color: #eee;
}
.sonar-container .label:nth-last-child(4)  {
  top: 3.2em;
  left: 2.6em;
  transform: rotate(-45deg);
}
.sonar-container .label:nth-last-child(3) {
  top: 3.2em;
  right: 2.6em;
  transform: rotate(45deg);
}
.sonar-container .label:nth-last-child(2) {
  bottom: 3.4em;
  left: 3.4em;
  transform: rotate(45deg);
}
.sonar-container .label:nth-last-child(1) {
    bottom: 3.5em;
    right: 3.0em;
    transform: rotate(-45deg);
}

.sonar-container .links {
  position: absolute;
  top: 0;
  left: 0;
  width: 400px;
  height: 400px;
  z-index:2;
  pointer-events: none;
 }
.sonar-container .links a {
  position: absolute;
  display: inline-block;
  /*background: #eeeeee;*/
  width: 2em;
  height: 2em;
  border-radius: 2em;
  /*border: 2px solid #f1f1f1; */
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  opacity:0;
  transition: .3s opacity ease-out;
  pointer-events: auto;
  margin: 0;
  padding: 0;
  background-image: url(../img/star.png);
  background-size: 30px 30px;
  background-position: 50%;
  background-repeat: no-repeat;

  background-repeat: no-repeat;
  transform-origin: 50% 55.5%;
    -webkit-transform-origin: 50% 55.5%;
  -webkit-animation: rotation 1.6s linear infinite ;
  animation: rotation 1.6s linear infinite ;
}
@keyframes rotation{
     from {transform: rotate(0);-webkit-transform: rotate(0);}
     to   {transform: rotate(360deg);-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes rotation{
     from {transform: rotate(0);-webkit-transform: rotate(0);}
     to   {transform: rotate(360deg);-webkit-transform: rotate(360deg);}
}
.sonar-container .links a:hover {
  opacity:1;
 }
 .jerome-dehours blockquote { text-align: center;
    font-size: 1.6em;
    line-height: 1.4em;}

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

  nav > div > menu ul {
      display: block;
  }

  header {
  padding: 2em 2em 4em;
  }

  header, section {
  }

  h1 {
    width: auto;
    text-align: center;
  }
  h1 img {
  width: 7em;
  }

  body { padding: 1em; }

  .item {
    position: fixed;
    right: .2em;
    top: .2em;
    z-index: 5;
  }
  .wrap {
  margin: 0 auto -6em;
    background-size: auto 97.5em;
    background-repeat: no-repeat;
  }

.page-contact-et-acces .wrap, page-mentions-legales .wrap {
background-size: auto 140em;
}


  footer, .push {
  
  }

  footer span {
  display: inline-block;
  }
  footer span::after {
    margin: 0em .3em;
    content: '•';
    vertical-align: middle;
  }
  footer span:last-of-type::after {
    display: none;
  }
   .sidebar2 {
   display: none;
   }

   .sidebar2 {
     display: block;
     position: fixed;
     right: 0;
     top: 0;
     bottom: 0;
     margin: auto;
    z-index: 9;
     height: 50vh;
     display: none;
     padding: 1em;
     font-size: 1.2em;
      padding: 2em;
   }

   .sidebar2 {
     display: flex;
     align-items: flex-end;
     justify-content: center;
     -webkit-flex-direction: column;
     flex-direction: column;
     font-family: 'Engravers Gothic', serif;
     line-height: 2em;
   }

     .sidebar2 a::before {
        content: " ";
        display: inline-block;
        margin: 0 .5em 0 0;
        background: #837259;
        width: 1em;
        height: 1em;
        border-radius: 1em;
        vertical-align: middle;
     }

     .sidebar2 a {
    display: inline-block;
    color: #fff;
    padding-right: 1em;
    text-align: right;
    line-height: .6em;
    margin-bottom: .6em;
    padding: .3em;
    color: #837259;
    text-transform: uppercase;
    font-family: "Traveling Typewriter", Sans-serif;
    font-size: 0.9em;
    white-space: nowrap;
    max-width: 1.3em;
    overflow: hidden;
    transition: 3s max-width ease;

     }

   .sidebar2 a span {
       display: inline-block;
    font-size: 1em;
       /* line-height: .8em; */
   }
     .sidebar2 a:hover  {
     color: #A3801A;
     text-shadow: 0 0 0 #ccc;
     max-width: 27em;
     }

  .container section {
   /*  min-height: 80em; */
  }

  .container section .background-container {
    position: absolute;
    width: 100%;
    z-index: 0;
    left: 0;
    right: 0;
    /* margin: -10em 0;*/
    margin: -10em 0;
  }

  .container section article {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
    height: 57.5em;
  padding-bottom: 8.85em;
  }

  .container section article:before {
  content: '';
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.7);
  position: absolute;
  top: 26.55em;
  right: 0;
  left: 0;
  bottom: 26.55em;
  max-width: 60em;
  margin: auto;
  z-index: -1;
  transform: skewY(13.5deg);
  -webkit-transform: -webkit-skewY(13.5deg);
  }


  .page-index section.le-meunier-chez-dehours + section.l-assemblage {
	margin-bottom: -13em;
   	 margin-top: 4em;
  }
 
  section.terre-de-meunier-brut,
  .container section.cuvee {
  min-height: 54.5em;
  }

  .container section.cuvee.carte {
  min-height: 77em;
  }

  .container section.cuvee.carte .background{

	    height: 140.5em;
}
.container section.cuvee.carte .background::before { display: none;}



  .container section.cuvee .background::before {
    transform: rotate(13.9deg);
  }

  .container section.terre-de-meunier-brut article,
  .container section.lieu-dit-la-croix-joly-extra-brut-vendange-2006 article,
  .container section.grande-reserve-brut article,
  .container section.les-vignes-de-la-vallee article,
  .container section.lieu-dit-brisefer-extra-brut-vendange-2007 article,
  .container section.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 article,
  .container section.trio-s-brut article,
  .container section.lieu-dit-la-croix-joly-rouge-vendange-2011 article,
  .container section.lieu-dit-maisoncelle-extra-brut-vendange-2006 article,
  .container section.oeil-de-perdrix---extra-brut article, 
  .container section.brut-nature article,
  .container section.millesime-2013 article{
    height: 54.5em;
  }
  .container section article {
    height: 57.5em;
  }

  .container section#la-croix-joly .background{
    height: 99.5em;
  }
  .container section#la-croix-joly article{
    height: 69.5em;
  }

  .container section.lieu-dit-la-croix-joly-extra-brut-vendange-2006 article,
  .container section.grande-reserve-brut article,
  .container section.les-vignes-de-la-vallee article,
  .container section.lieu-dit-brisefer-extra-brut-vendange-2007 article,
  .container section.lieu-dit-la-croix-joly-rouge-vendange-2011 article,
  .container section.trio-s-brut article,
  .container section.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 article,
  .container section.lieu-dit-maisoncelle-extra-brut-vendange-2006 article,
  .container section.terre-de-meunier-brut article, 
  .container section.oeil-de-perdrix---extra-brut article, 
  .container section.brut-nature article,
  .container section.millesime-2013 article{
    padding: 22.125em 0;
  }

  .container section.lieu-dit-la-croix-joly-extra-brut-vendange-2006 article div,
  .container section.grande-reserve-brut article div,
  .container section.les-vignes-de-la-vallee article div,
  .container section.lieu-dit-brisefer-extra-brut-vendange-2007 article div,
  .container section.lieu-dit-la-croix-joly-rouge-vendange-2011 article div,
  .container section.trio-s-brut article div,
  .container section.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 article div,
  .container section.lieu-dit-maisoncelle-extra-brut-vendange-2006 article div,
  .container section.terre-de-meunier-brut article div, 
  .container section.oeil-de-perdrix---extra-brut article div,
  .container section.brut-nature article div,
  .container section.millesime-2013 article div {
    max-width: 45em;
    padding-top: 60px;
  }

  .container section.lieu-dit-la-croix-joly-extra-brut-vendange-2006 h3,
  .container section.grande-reserve-brut h3,
  .container section.terre-de-meunier-brut h3,
  .container section.les-vignes-de-la-vallee h3,
  .container section.lieu-dit-brisefer-extra-brut-vendange-2007 h3,
  .container section.lieu-dit-la-croix-joly-rouge-vendange-2011 h3,
  .container section.trio-s-brut h3,
  .container section.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 h3,
  .container section.lieu-dit-maisoncelle-extra-brut-vendange-2006 h3,
  .container section.cuvee h3,
  .container section.oeil-de-perdrix---extra-brut h3, 
  .container section.brut-nature h3,
  .container section.millesime-2013 h3 {
    font-size: 1.2em;
    margin: 5px 0 0 0 ;
  }

  .container section.cuvee article:before,
  .container section.lieu-dit-la-croix-joly-extra-brut-vendange-2006 article::before,
  .container section.grande-reserve-brut article::before,
  .container section.les-vignes-de-la-vallee article::before,
  .container section.trio-s-brut article::before,
  .container section.lieu-dit-brisefer-extra-brut-vendange-2007 article::before,
  .container section.lieu-dit-la-croix-joly-rouge-vendange-2011 article::before,
  .container section.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 article::before,
  .container section.lieu-dit-maisoncelle-extra-brut-vendange-2006 article::before,
  .container section.terre-de-meunier-brut article::before,
  .container section.oeil-de-perdrix---extra-brut article::before,
  .container section.brut-nature article::before,
  .container section.millesime-2013 article::before{
    content: '';
    display: inline-block;
    background-color: rgba(250, 250, 250, 0.7);
    position: absolute;
    top: 10.55em;
    right: 0;
    left: 0;
    bottom: 5.7em;
    max-width: 0;
    width: 60em;
    margin: auto;
    z-index: -1;
    transform: skewY(13.9deg);
    -webkit-transform: -webkit-skewY(13.9deg);
    transition: .6s max-width ease-in;
}
  /*
  .container section.terre-de-meunier-brut article::before {
    top: 14.55em;
    bottom: 9.7em;
  }
  */
  .container section.trio-s-brut article::before{
  }

  .container section.cuvee.active article:before,
  .container section.active.lieu-dit-la-croix-joly-extra-brut-vendange-2006 article::before,
  .container section.active.grande-reserve-brut article::before,
  .container section.active.les-vignes-de-la-vallee article::before,
  .container section.active.trio-s-brut article::before,
  .container section.active.lieu-dit-brisefer-extra-brut-vendange-2007 article::before,
  .container section.active.lieu-dit-la-croix-joly-rouge-vendange-2011 article::before,
  .container section.active.lieu-dit-la-cote-en-bosses-extra-brut-vendange-2007 article::before,
  .container section.active.lieu-dit-maisoncelle-extra-brut-vendange-2006 article::before,
  .container section.active.terre-de-meunier-brut.active  article::before,
  .container section.active.oeil-de-perdrix---extra-brut article::before {
    
  max-width: 65em;
  }
    .container section.cuvee:last-of-type {
      margin-bottom: 0;
    }
  .container section.cuvee .background-container {
  z-index: 0;
  }

  .container > section.cuvee:not(.nos-cuvees) article {
  position: relative;
  padding: 22.125em 0;
  }

  .container section.cuvee.carte .background {
    background-size: 90% auto;
    background-position: 50% 40%;
    background-repeat:no-repeat;
    background-color: #ffffff;
  }
  .container section.cuvee.carte article:before {
    display: none;
    }
  .container section.la-collection article:before  {
    top: 4.75em;
    bottom: 2em;
  }
    .container section.la-collection .background-container,
    .container section.la-collection .background {
      background-color: #c9bdb1;
      -webkit-transition: opacity 1s ease, background-image 0.6s ease-in-out;
      transition: opacity 1s ease, background-image 0.6s ease-in-out;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      transform: translateZ(0px);
      -webkit-transform: translateZ(0px);
    }
  article {
  position: relative;
  z-index: 1;
  }
  article > div {
  opacity: 0;
  transition: .6s opacity ease-out;
  transition-delay: .6s;
  }
  .active  article > div{
    opacity: 1;
  }

  .container section:first-child { min-height: 0;
     }
  .container section:first-child article { height: auto; }

  .container section.une-demarche-raisonnee {
  }

  .container section.une-demarche-raisonnee article {
    color: #fff;
  }

  .container section.une-demarche-raisonnee article:before {
    display: none;
  }

  .container section.une-demarche-raisonnee article p {
    margin-bottom: 1em;
  }

  .container section.une-demarche-raisonnee article p + p{
    text-align: left;
  }

  .container section.une-demarche-raisonnee article p img{
    width: 8em;
    margin-top: 0;
  }

  .container section.une-demarche-raisonnee article p:nth-child(5) {

    float: left;
  }

  .container section.une-demarche-raisonnee article p + p a:first-child img{
    width: 26em;
    margin-right: 1em;
    margin-top: 0;
    border: 2px solid #f1f1f1;
  }

  .container section.le-meunier-chez-dehours article {
  }

  .container section.le-meunier-chez-dehours article h2{
  	color: #212121;
  }

/*
  section.le-meunier-chez-dehours article:before {
    background-color: rgba(50, 50, 50, 0.85);
    margin: 0 4em;
    top: 2.4em;
    right: 0;
    left: 6.2em;
    bottom: 18em;
    max-width: 38em;
  }
  */

  .container section.le-meunier-chez-dehours article::before {
    display: none;
  }

  .container section.le-meunier-chez-dehours p {
    text-align: left;
    color: #212121;
  }
  .container section.le-meunier-chez-dehours .background {
    background-position: 0 50%;
  }

  .container section.le-meunier-chez-dehours article{

  }

  .container section.le-meunier-chez-dehours article div{
    max-width: 55em;
    margin:auto;
  }

  .container section.le-meunier-chez-dehours article h2 + p + p{
    width:35%;
    padding-right: 3%;
    display: inline-block;
    vertical-align: middle;
  }

  .container section.le-meunier-chez-dehours article h2 + p + p img{
  	margin-bottom: 0;
  }

  .container section.le-meunier-chez-dehours article h2 + p + p +p{
    width:65%;
    display: inline-block;
    vertical-align: middle;
  }

  .container section.cave article{
  	padding-top: 200px;
  }

  .container section.cave article::before {
    display: none;
  }

  .container section.cave article div{

  	max-width: 55em;
    margin:auto;
  }

  .container section.cave article div p{
  	text-align: center;
  }

  .container section.cave article img {
    width: 80%;
  }


  .container section.l-assemblage article::before {
    display: none;
  }

  .container section.l-assemblage article div{
    max-width: 55em;
    margin: 0 auto;
  }

  .container section.l-assemblage article h2 + p + p{
    width:35%;
    padding-right: 6%;
    display: inline-block;
    vertical-align: top;
    line-height: 1.3;
  }

  .container section.l-assemblage article h2 + p + p +p{
    width:65%;
    display: inline-block;
    vertical-align: top;
  }

  section.l-assemblage img {
    width: 100%;
  }
  .container section.philosophie {
  }
  .container section.histoire article p:last-child {
    padding-left: 43%;
  }

  .container section.histoire article div{
    max-width: 55em;
    margin: 0 auto;

  }


  .container section.philosophie article:before {
    display: none;
  }
  .container section.philosophie article h2,
  .container section.philosophie article p {
        color: #f1f1f1;
  }
  section.philosophie article h2 + p + p {
      padding-right: 2%;
      display: inline-block;
      width: 49%;
      vertical-align: bottom;
  }

  section.philosophie article h2 + p + p + br{
      height: 15px!important;
  }

  section.philosophie article h2 + p + p + p {
      padding-right: 2%;
      display: inline-block;
      width: 49%;
      vertical-align: bottom;
  }
  section.philosophie article div{
    max-width: 55em;
    margin: 0 auto;
    vertical-align: top;
  }

  .container section.philosophie article p img {
    width: 38.4em;
  }
  section.philosophie article h2 + p + p img:first-of-type  {
    float: right;
    width: auto;
  }
  .container section.esprit-d-equipe article:before {
    display: none;
  }
  .container section.esprit-d-equipe article h2,
  .container section.esprit-d-equipe article p {
        color: #212121;
  }
  .container section.esprit-d-equipe .background {
    background-position: 25% 50%;
  }

  .container section.esprit-d-equipe article div{
    max-width: 55em;
    margin: 0 auto;
    vertical-align: top;
  }

  .container section.esprit-d-equipe article h2 + p + p {
    padding-right: 2%;
    display: inline-block;
    width: 49%;
    vertical-align: top;
  }

  .container section.esprit-d-equipe article h2 + p + p + p {
    padding-left: 2%;
    display: inline-block;
    width: 49%;
  }

  .container section.esprit-d-equipe article h2 + p + p + p img {
    width: 70%;
  }
  .container section.esprit-d-equipe article h2 + p + p + p + p {
    text-align: right;
  }
  .container section.esprit-d-equipe article img {
    width: 100%;
  }
  .container section.esprit-d-equipe{
  }
  .container section.la-reserve-perpetuelle {
    z-index: 1;
  }
  .container section.la-reserve-perpetuelle article:before {
    display: none;
  }
  .container section.la-reserve-perpetuelle article h2,
  .container section.la-reserve-perpetuelle article p {
    color: #f1f1f1;
  }
  .container section.la-reserve-perpetuelle article h2 + p + p img{
    float: right;
    width: 11em;
    margin-left: 2em;
    margin-top: 0;
  }
  .container section.la-reserve-perpetuelle{
  z-index: 2;
}
  .container section.les-artisans, .container section.video-presentation  {
    z-index: 3;
  }

  .container section.video-presentation  {
    top: -50px;
  }

  .container section.les-artisans article, .container section.video-presentation article{
    padding-top: 100px;
  }

   section.les-artisans p.right a::before, section.video-presentation p.right a::before {
     display: none;
   }
  .container section.les-artisans article:before, .container section.video-presentation article:before {
    bottom: 6.5em;
    top: 5.5em;
  }

  .container section.les-artisans article div, .container section.video-presentation article div{
    max-width: 55em;
  }

  .container section.les-artisans article h2, .container section.video-presentation article h2{
    margin:0;
  }

  .container section.les-artisans article h2 + p + p img, .container section.video-presentation article h2 + p + p img {
    width: 20em;
  }
  .container section.les-artisans article p:last-of-type, .container section.video-presentation article p:last-of-type {
    text-align: right;
    font-size: .8em;
    max-width: 66em;
  }
  .container section.les-artisans article p.right img, .container section.video-presentation article p.right img {
    width: 38em;
    margin-top: 0;
  }
  .cuvee h2 {
    text-transform: uppercase;
    margin-bottom: 0;
  }
  .maps iframe {
      pointer-events: none;
  }
  section.nos-cuvees.cuvee article a:hover::before,
  section.la-collection article a:hover::before { content: '▶'; margin-right: .5em;}
  section.nos-cuvees.cuvee article p.left { position: relative;}
  section.nos-cuvees.cuvee article p.left::before {
    content: '';
    display: inline-block;
    height: 6.5em;
    width: .20em;
    background: #777;
    position: absolute;
    left: 33.25em;
    top: 26.4em;
    font-size: .6em;
  }
  section.nos-cuvees.cuvee article p.left::after {
    content: '';
    display: inline-block;
    height: .5em;
    width: .5em;
    border-radius: .5em;
    background: #777;
    position: absolute;
    left: 39.75em;
    top: 39.45em;
    font-size: .5em;
  }
  section.nos-cuvees.cuvee article img { transition-delay: 0s; transition: transform 1.4s ease-out; -webkit-transition: transform 1.6s ease-out;
    -webkit-transform-origin: 50%; /* Chrome, Safari, Opera */
    margin: 0;
    width: 40em; height: 40em;}
   section.animate.nos-cuvees.cuvee article img{
    transform: rotate(0deg);
  }

     section.animate.nos-cuvees.cuvee article.r-grande-reserve-brut img { transform: rotate(-60deg);  }
     section.animate.nos-cuvees.cuvee article.r-les-vignes-de-la-vallee img {transform: rotate(-120deg);  }
     section.animate.nos-cuvees.cuvee article.r-terre-de-meunier-brut img { transform: rotate(-180deg); }
     section.animate.nos-cuvees.cuvee article.r-oeil-de-perdrix---extra-brut img { transform: rotate(-240deg);  }
     section.animate.nos-cuvees.cuvee article.r-brut-nature img { transform: rotate(-300deg); }
     section.animate.nos-cuvees.cuvee article.r-le-millesime img { transform: rotate(-360deg); }

     /* section.animate.nos-cuvees.cuvee article.r-rose-oeil-de-perdrix-brut-vendange-2008 img { transform: rotate(135deg);  }
     section.animate.nos-cuvees.cuvee article.r-lieu-dit-maisoncelle-extra-brut-vendange-2006 img { transform: rotate(270deg);  }
	*/

     section.animate.nos-cuvees.cuvee article.r-terre-de-meunier-brut div .inlineBlock:nth-child(2){

     }


  section.nos-cuvees.cuvee article:before {
    display: none;
  }
  section.la-collection article {
    position: relative;
    padding-top: 22.125em;
    padding-bottom: 22.125em;
  }
  section.la-collection article > div { width: 52em; }
  section.la-collection p {
        max-width: 36em;
        margin-left: 0;
  }
  section.la-collection p.center + li,
  section.la-collection p.center + li + li,
  section.la-collection p.center + li + li + li {
    padding-left: 13em;
  }

  section.la-collection article > div {
      margin-top: 5em;
  }
  section.la-collection article .b-parcelles,
  section.la-collection article .b-coteaux {
    margin: 3em 0;
  }
  section.la-collection article .b-parcelles {
    margin-top: 6em;
  }
  section.la-collection article .b-coteaux {
    margin-bottom: 1.5em;
  }
  section.la-collection .parcelles_map {
    background: #837259;
    background-image: url(../img/spinner.gif);
    background-repeat: no-repeat;
    background-position: 50%;
  }
  section.la-collection p.right {
    margin-left: 26em;
    min-height: 10.2em;
  }
section.la-collection article > div { width: 52em; position: relative; }
  section.la-collection .parcelles_map {
     margin: 0 auto;
    -webkit-mask-box-image: url(../img/mask.svg);
    mask: url(../img/maskff.svg#maskid);
    overflow: hidden;
    width: 17em;
    height: 17em;
    position: absolute;
    right: 1em;
    top: 13em;
  }
  section.la-collection .parcelles_map,
  section.la-collection .parcelles_map_shadow,
  section.la-collection .parcelles_map_cross {
    font-size: .9em;
    margin: 0 auto;
    width: 25em;
    height: 24em;
    position: absolute;
    right: 2.9em;
    top: 16.3em;
  }
  section.la-collection .parcelles_map_shadow {
    box-shadow: 0 0 10px #777;
    transform: skewY(16.1deg);
    height: 16.6em;
    top: 20em;
  }
  section.la-collection .parcelles_map_cross {
    background-image: url(../img/cross.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.6em;
    height: 1.6em;
    right: 4em;
    z-index: 2;
    top: 36.8em;
  }
  section.la-collection .parcelles_map > div {
    margin-top: -4em; }
   section.la-collection .parcelles_map > div iframe {   width: 26em;    height: 30em; }
    /* section.la-collection .background-container.b-lieu-dit-maisoncelle-extra-brut-vendange-2006 .background { background-image:url(/champagne-dehours.161125.fr/ups/htm/1080/_DSC3529.jpg) !important; }
  section.la-collection .background-container.b-lieu-dit-brisefer-extra-brut-vendange-2007 .background { background-image:url(/champagne-dehours.161125.fr/ups/htm/1080/_DSC3530.jpg) !important; }
  section.la-collection .background-container.b-lieu-dit-les-rieux-blanc-vendange-2011 .background {
  background-image:url(/champagne-dehours.161125.fr/ups/htm/1080/les-rieux.jpg) !important;
  }*/
  section.la-collection .background-container.b-parcelles .background {
  background-image:url(../img/b-parcelles.jpg) !important
  }
  section.la-collection .background-container.b-coteaux .background {
  background-image:url(../img/b-coteaux.jpg) !important
  }
  /*
  section.cuvee article {
    margin-bottom: -10em;
  }

  section.cuvee.nos-cuvees article ,section.cuvee.next article {
    margin-bottom: 0;
  }
  */

  .container .contact article div div{
    background: rgba(255,255,255,1);
    padding: 1em;
    width: 26em;
    float: right;
    margin: 0 2em;
    padding-right: 4em;
    font-size: .9em;
  }
  .container .contact article div div p {
    text-align: left;
    }

    section.parcelles article div{
      max-width: 55em;
    }

    section.parcelles article h2 + p + p{
      vertical-align: top;
      width: 55%;
      padding-right: 5%;
      display: inline-block;
    }

    section.parcelles article h2 + p + p + p{
      width: 45%;
      display: inline-block;
      vertical-align: top;
    }

    .contact-et-acces .background {
    height: 45.5em;
    }
    section.contact-et-acces {
    min-height: 46em;
    }
    section.contact-et-acces::after {
    content: "";
    display: none;
    height: 28em;
    width: 100%;
    background-color: #fff;
    position: absolute;
    bottom: 0;
    z-index: -1;
    }
    .contact-et-acces article {
    font-size: 1.1em;
    }
    .contact-et-acces article > div {
    width: 62em;
    margin-top: 2em;
    margin-bottom: 2em;
    }
    .contact-et-acces article h2 {
    font-size: 1.9em;
    }

    .contact-et-acces article p{
      font-size: 1em;
      margin-left: 0;
    }

    .contact-et-acces article blockquote {
    font-size: 1em;
     margin-left: 0;
    line-height: 1.4em;
    }
    .contact-et-acces.acces .background::before {
    display: none;
    }
    .access-map {
    height: 45.5em;
    }
    section.nos-cuvees .inlineBlock {
    width: 43em;
      display: inline-block;
      vertical-align: top;
    }
    section.nos-cuvees .inlineBlock + .inlineBlock {
    width: 23em;
    border-left: 5px #212121 solid;
     border-radius: 2px;
     padding-left: 20px;
     margin-top: 50px;
    }
    section.nos-cuvees .inlineBlock + .inlineBlock li{
    	margin-bottom: 10px;
    }
    section.nos-cuvees .inlineBlock + .inlineBlock li a{
    	margin-bottom: 10px;
    	color: #212121;
    }


    section.nos-cuvees .inlineBlock p.left a {
      pointer-events: none;
      
    }
    section.nos-cuvees div {
    width: 66em;
    margin: 0 auto;
    }
    .background {
    height: 80.5em;
    }
    .background:before {
    transform: rotate(13.9deg);
    }

    /* CUVEES PARCELAIRES */

    section.maisoncelle article div a{

    }

    section.carte article::before,
    section.maisoncelle article::before,
    section.la-croix-joly article::before,
    section.la-cote-en-bosses article::before,
    section.les-rieux article::before{
      display: none;
    }

    section.brisefer article::before,
    section.les-genevraux article::before,
    section.les-vignes-de-mizy article::before{
      max-width: 65em!important;
      content: '';
      display: inline-block;
      background-color: rgba(250, 250, 250, 0.7);
      position: absolute;
      top: 10.55em;
      right: 0;
      left: 0;
      bottom: 5.7em;
      width: 60em;
      margin: auto;
      z-index: -1;
      transform: skewY(13.9deg);
      -webkit-transform: -webkit-skewY(13.9deg);
      transition: .6s max-width ease-in;
    }

    section.carte article{
      align-items: flex-start;
    }
    section.carte article div{
      width: 55em;
    }
    section.carte article div li {
      margin-bottom: 8px;
    }
    section.carte article div li a{
      
    }
    section.carte article div li a{
      transition: 0.5s;
    }
    section.carte article div li a:hover{
      padding-left: 10px;
    }

    section.maisoncelle article div{
      max-width: 55em;
    }

    section.maisoncelle article div h3{
      margin-left: 0;
    }
    section.maisoncelle article div p + p {
      width: 33%;
      display: inline-block;
      vertical-align: top;
    }
    section.maisoncelle article div p + p + p {
      width: 66%;
      padding-left: 20px;
      display: inline-block;
      vertical-align: top;
    }

    section.maisoncelle article div h3 + p + p a,
    section.brisefer article div .txt-brisefer a,
    section.la-croix-joly article div p:nth-child(4) a,
    section.les-genevraux article div .txt-brisefer a,
    section.les-vignes-de-mizy article div p:nth-child(4) a,
    section.les-rieux article div p:first-child a {
      display: inline-block;
      position: relative;
      color: #212121;
      font-size: 1.1em;
      margin-top: 40px;
      padding: 0 25px;
    }
    section.maisoncelle article div h3 + p + p a::before,
    section.brisefer article div .txt-brisefer a::before,
    section.la-croix-joly article div p:nth-child(4) a::before,
    section.les-genevraux article div .txt-brisefer a::before,
    section.les-vignes-de-mizy article div p:nth-child(4) a::before,
    section.les-rieux article div p:first-child a::before{
      content: '';
      background: rgba(255,255,255,0.8);
      left: -1em;
      right: -1em;
      height: 2.6em;
      margin-top: -.5em;
      transform: skewX(-17.5deg);
      display: inline-block;
      position: absolute;
      z-index: -1;
      transition: 0.5s;
    }
    section.maisoncelle article div h3 + p + p a:hover::before,
    section.brisefer article div .txt-brisefer a:hover::before,
    section.la-croix-joly article div p:nth-child(4) a:hover::before,
    section.les-genevraux article div .txt-brisefer a:hover::before,
    section.les-vignes-de-mizy article div p:nth-child(4) a:hover::before,
    section.les-rieux article div p:first-child a:hover::before{
      background: rgba(255,255,255,1);
    }


    section.brisefer article div{
      max-width: 55em;
      margin-top: 9%;
    }

    section.brisefer article div p:first-child{
      text-align: right!important;
    }

    section.brisefer article img{
      width: 62%;
      padding-right: 30px;
    }

    section.brisefer article div p{
      width: 50%;
      display: inline-block;
      vertical-align: middle;
    }
    section.brisefer article div .txt-brisefer{
      width: 50%;
      display: inline-block;
      vertical-align: middle;
    }
    section.brisefer article div .txt-brisefer p {
      width: 90%;
    }

    section.la-croix-joly article div{
      max-width: 55em;
      margin-top: 9%;
    }
    section.la-croix-joly article div p + p {
      width: 40%;
      display: inline-block;
      vertical-align: top;
    }
    section.la-croix-joly article div p + p + p {
      width: 60%;
      padding-left: 20px;
      display: inline-block;
      vertical-align: top;
    }
    section.la-croix-joly article div h3{
      margin-left: 0;
    }

    section.les-genevraux article div{
      max-width: 55em;
      margin-top: 9%;
    }

    section.les-genevraux article div p:first-child{
      text-align: right!important;
    }

    section.les-genevraux article img{
      width: 52%;
      padding-right: 50px;
    }

    section.les-genevraux article div p{
      width: 50%;
      display: inline-block;
      vertical-align: middle;
    }
    section.les-genevraux article div .txt-brisefer{
      width: 50%;
      display: inline-block;
      vertical-align: middle;
    }
    section.les-genevraux article div .txt-brisefer p {
      width: 65%;
    }


    section.la-cote-en-bosses article div{
      max-width: 55em;
      margin-top: 9%;
    }

    section.la-cote-en-bosses article div h3{
      margin-left: 0;
    }
    section.la-cote-en-bosses article div img{
      margin: 0;
    }

    section.la-cote-en-bosses article div p + p {
      width: 40%;
      display: inline-block;
      vertical-align: top;
      padding-right: 30px
    }
    section.la-cote-en-bosses article div p + p + p {
      width: 60%;
      display: inline-block;
      vertical-align: top;
    }

    section.la-cote-en-bosses article div .right {
      width: 100%;
    }


    section.les-vignes-de-mizy article div{
      max-width: 55em;
      margin-top: 13%;
    }

    section.les-vignes-de-mizy article div h3{
      margin-left: 30px;
    }
    section.les-vignes-de-mizy article div h3 span{
      font-size: 0.8em;
    }
    section.les-vignes-de-mizy article div img{
      margin: 0;
    }

    section.les-vignes-de-mizy article div p + p {
      width: 70%;
      display: inline-block;
      vertical-align: top;
      padding: 0 30px;
    }
    section.les-vignes-de-mizy article div p + p + p {
      width: 30%;
      display: inline-block;
      vertical-align: top;
    }

    section.les-rieux article div{
      max-width: 55em;
      margin-top: 9%;
    }

    section.les-rieux article div h3 span{
      font-size: 0.8;
    }

    section.les-rieux article div p {
      width: 40%;
      display: inline-block;
      vertical-align: middle;
    }
    section.les-rieux article div p span{
      font-size: 1.6em;
    }
    section.les-rieux article div p span span{
      font-size: 0.8em;
    }

    section.les-rieux article div p + p {
      width: 60%;
      padding-left: 20px;
      display: inline-block;
      vertical-align: middle;
    }
    section.les-rieux article div h3{
      margin-left: 0;
    }




    html>/**/body .background:before, x:-moz-any-link, x:default {    transform: rotate(12.4deg);
    }
  }
@media only screen and (min-width : 701px) {
  body {
    font-size: 1.13vw;
    font-size: 1vw;
  }
}
@media only screen and (max-width : 700px) {
  .wrap {    background-repeat: no-repeat; }

}


    



/*
@media only screen and (min-width : 1400px) {
    body {
      font-size: 16px;
      max-width: 1400px;
    }
    .container section .background-container {
    position: absolute;
    width: 100%;
    z-index: 0;
    left: 0;
    right: 0;
    }

    nav > div {
      max-width: 89em;
      margin: 0 auto;
    }

}
*/



#okCookie{
	font-size: 0.75rem;
  background-color:#F2F2F2;
  color:#333333;
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  padding:10px;
  font-family:sans-serif;
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
  border-top:1px solid #ccc;
  z-index:10;
}

#okCookie p{margin:5px 0 0px 0; float:left;max-width:inherit;}

#okCookie #okClose, #okCookie #okCprivacy{
  padding:2px 5px;
  float:right;
  margin-left:10px;
  text-decoration:none;
  border-radius:3px;
  color:white;
}

#okCookie #okClose{
  color:#a0a8ae;
	border:1px solid #ccc;
}

#okCookie #okClose:hover{background-color:#a0a8ae;color:#ffffff}

#okCookie #okCprivacy{
  color:#a0a8ae;
	border:1px solid #ccc;
}

#okCookie #okCprivacy:hover{background-color:#a0a8ae;color:#ffffff}

.okcBeginAnimate{
    -webkit-animation: myfirst 2s; 
    animation: myfirst 2s;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes myfirst {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Standard syntax */
@keyframes myfirst {
    from {opacity: 0;}
    to {opacity: 1;}
}