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

@media screen and (min-width: 920px) {
  .mobile {
    display: none; } }

.agence {
  margin-top: 150px;
  padding-top: 30px; }
  @media screen and (max-width: 920px) {
    .agence {
      margin-top: 80px; } }
  .agence h3 {
    font-size: 18px !important;
    line-height: 34px;
    font-weight: 300; }
  .agence #dropDown p {
    margin: 10px 0; }
  .agence #dropDown > p {
    cursor: pointer;
    font-weight: bold; }
    @media screen and (max-width: 1400px) and (min-width: 1100px) {
      .agence #dropDown > p i {
        display: none; } }
    @media screen and (min-width: 1400px), screen and (max-width: 1100px) {
      .agence #dropDown > p.open i {
        transform: scaleY(-1);
        -webkit-transform: scaleY(-1);
        transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out; }
      .agence #dropDown > p.open + .dropDown-content {
        max-height: 250px; } }
  .agence #dropDown ul, .agence #dropDown li {
    font-size: 14px;
    color: white;
    list-style-type: none;
    padding: 0; }
  .agence #dropDown .dropDown-content {
    display: inline-block;
    max-height: 0px;
    overflow-y: hidden;
    transition: all 0.7s ease-in-out;
    -webkit-transition: all 0.7s ease-in-out; }
  .agence .situation {
    padding-top: 30px; }
    .agence .situation .container h3 {
      position: relative;
      text-transform: uppercase;
      margin-bottom: 30px; }
      .agence .situation .container h3:after {
        content: '';
        position: absolute;
        width: 800%;
        height: 1px;
        background-color: #0E4142;
        left: -25px;
        top: 50%;
        transform: translate(-100%); }
    .agence .situation > div {
      white-space: nowrap;
      font-size: 0px;
      display: flex;
      flex-wrap: wrap;
      flex-direction: row; }
      .agence .situation > div .half {
        vertical-align: top;
        display: inline-flex;
        width: 50%;
        white-space: normal;
        overflow: hidden; }
        .agence .situation > div .half p {
          position: relative;
          color: white;
          margin: 10px 0; }
          .agence .situation > div .half p i {
            position: absolute;
            top: 5px;
            right: -40px; }
        .agence .situation > div .half .dropDown-content {
          text-align: right; }
        .agence .situation > div .half h3 {
          position: relative;
          font-size: 24px;
          color: white; }
          .agence .situation > div .half h3:after {
            content: '';
            position: absolute;
            display: block;
            width: 800%;
            height: 1px;
            right: -25px;
            top: 50%;
            background-color: white !important;
            transform: translate(100%); }
        .agence .situation > div .half:nth-child(2) {
          text-align: right;
          padding-bottom: 80px; }
          .agence .situation > div .half:nth-child(2) > div {
            display: flex;
            flex-direction: column;
            justify-content: center;
            width: 100%;
            background-color: #0E4142;
            padding: 0 170px; }
            @media screen and (max-width: 1100px) {
              .agence .situation > div .half:nth-child(2) > div {
                padding: 30px 60px 30px 30px; } }
  .agence .container-border {
    padding: 60px 30px;
    box-sizing: border-box;
    text-align: justify; }
    .agence .container-border.marginTop {
      margin-top: -100px; }
    .agence .container-border p {
      margin-top: 15px;
      margin-bottom: 0; }
      .agence .container-border p a {
        color: #85BAA0; }
    .agence .container-border .quote {
      font-size: 18px !important;
      line-height: 34px;
      font-weight: 300;
      text-align: center; }
    .agence .container-border .center {
      text-align: center; }
    .agence .container-border .right {
      text-align: right; }
    @media screen and (max-width: 920px) {
      .agence .container-border {
        padding: 50px 30px; } }
  .agence .philosophy {
    margin-top: -100px; }
    .agence .philosophy > div {
      white-space: nowrap;
      font-size: 0px;
      display: flex;
      flex-wrap: wrap;
      flex-direction: row; }
      .agence .philosophy > div .half {
        vertical-align: bottom;
        display: inline-flex;
        width: 50%;
        white-space: normal;
        overflow: hidden; }
        .agence .philosophy > div .half p {
          color: white; }
        .agence .philosophy > div .half > div {
          overflow: hidden; }
        @media screen and (max-width: 1290px) {
          .agence .philosophy > div .half .fade > p {
            display: none; } }
        .agence .philosophy > div .half #dropDown p {
          position: relative; }
          .agence .philosophy > div .half #dropDown p i {
            position: absolute;
            top: 5px;
            left: -40px; }
        .agence .philosophy > div .half h3 {
          position: relative;
          font-size: 24px;
          color: white; }
          .agence .philosophy > div .half h3:after {
            content: '';
            position: absolute;
            display: block;
            width: 800%;
            height: 1px;
            left: -25px;
            top: 50%;
            background-color: white !important;
            transform: translate(-100%); }
        .agence .philosophy > div .half h4 {
          font-size: 30px;
          color: white;
          font-weight: 300; }
        .agence .philosophy > div .half:nth-child(1) {
          text-align: left; }
          .agence .philosophy > div .half:nth-child(1) > div {
            display: flex;
            flex-direction: column;
            justify-content: center;
            width: 100%;
            margin-top: 80px;
            background-color: #0E4142;
            padding: 30px 170px; }
            @media screen and (max-width: 1100px) {
              .agence .philosophy > div .half:nth-child(1) > div {
                padding: 30px 30px 30px 60px; } }
  @media screen and (max-width: 1100px) {
    .agence .half {
      width: 100% !important; }
      .agence .half:not(.img) > div {
        padding: 30px 0; }
      .agence .half.img {
        height: auto !important;
        padding: 0 !important; }
        .agence .half.img img {
          position: relative !important; } }
  .agence .half.img {
    position: relative;
    box-sizing: content-box;
    height: 0;
    padding-top: calc(83.6%/2); }
    .agence .half.img img {
      position: absolute;
      top: 0;
      width: 100%;
      height: 100%; }

/*# sourceMappingURL=agence.css.map*/