@charset "UTF-8";
/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/* placeholder: proportions vidéo youtube responsive */
/* placeholder : width de 100vw */
/* changer delay selon position dans la liste*/
/* changer width selon position dans la liste */
/* line 6, ../sass/pourquoi.scss */
.node-79 .layout-content {
  margin-top: 30px;
}
/* line 9, ../sass/pourquoi.scss */
.node-79 h2 {
  margin-top: 25px;
}
/* line 12, ../sass/pourquoi.scss */
.node-79 .bg {
  background-color: #F3F5F6;
  margin-left: -25px;
  margin-right: -25px;
  margin-top: 22px;
  margin-bottom: 30px;
  padding: 15px 25px;
}
/* line 19, ../sass/pourquoi.scss */
.node-79 .bg > p {
  margin-top: 0;
}
/* line 22, ../sass/pourquoi.scss */
.node-79 .bg span {
  font-weight: 600;
  color: #B15BA3;
}
/* line 27, ../sass/pourquoi.scss */
.node-79 .wrapper-pourquoi {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-direction: reverse;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column-reverse;
  -moz-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}
/* line 32, ../sass/pourquoi.scss */
.node-79 .wrapper-pourquoi .left {
  width: 100%;
}
/* line 35, ../sass/pourquoi.scss */
.node-79 .wrapper-pourquoi .right {
  width: 100%;
}
/* line 40, ../sass/pourquoi.scss */
.node-79 .image {
  margin-left: -25px;
  margin-right: -25px;
  width: calc( 100% + 50px);
}
/* line 44, ../sass/pourquoi.scss */
.node-79 .image img {
  width: 100%;
  height: auto;
}
/* line 49, ../sass/pourquoi.scss */
.node-79 ul, .node-79 ol {
  padding: 0 0 0 20px;
  margin: 0;
}
/* line 52, ../sass/pourquoi.scss */
.node-79 ul li, .node-79 ol li {
  margin-bottom: 10px;
}

@media only screen and (min-width: 768px) {
  /* line 62, ../sass/pourquoi.scss */
  .node-79 .node__content {
    width: 640px;
    margin: 0 auto;
  }
  /* line 65, ../sass/pourquoi.scss */
  .node-79 .node__content .field--name-body {
    width: 640px;
    max-width: 640px;
    margin: 0 auto;
  }
  /* line 69, ../sass/pourquoi.scss */
  .node-79 .node__content .field--name-body h2.titre {
    margin-left: 25px;
  }
  /* line 74, ../sass/pourquoi.scss */
  .node-79 .bg {
    margin: 22px auto 40px;
  }
  /* line 77, ../sass/pourquoi.scss */
  .node-79 .wrapper-pourquoi {
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 0 0 0 25px;
  }
  /* line 80, ../sass/pourquoi.scss */
  .node-79 .wrapper-pourquoi .left {
    width: calc( 100% - 220px);
  }
  /* line 82, ../sass/pourquoi.scss */
  .node-79 .wrapper-pourquoi .left ul.nos-valeurs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;
  }
  /* line 86, ../sass/pourquoi.scss */
  .node-79 .wrapper-pourquoi .left ul.nos-valeurs li {
    width: calc(50% - 10px);
  }
  /* line 91, ../sass/pourquoi.scss */
  .node-79 .wrapper-pourquoi .right {
    width: 220px;
  }
  /* line 96, ../sass/pourquoi.scss */
  .node-79 .image {
    margin: 0 auto;
    display: block;
    width: 100%;
  }
  /* line 101, ../sass/pourquoi.scss */
  .node-79 h2.engagements {
    padding-left: 25px;
  }
  /* line 104, ../sass/pourquoi.scss */
  .node-79 ul.engagements {
    padding-left: 44px;
  }
}