drupal-erable/web/themes/erabletheme/scss/_home.scss

.home_introduction {
  background-color: white;
  width: 100%;
  box-sizing: border-box;
  padding: 4rem 1rem;
  h2 {
    display: none;
  }
  > .logo {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 2rem;
    img {
      width: 50%;
      height: auto;
      @media (min-width: $breakpoint_tablet) {
          width: 100%;
      }
      @media (min-width: $breakpoint_desktop) {
          //width: 18vw;
      }
    }
    @media (min-width: $breakpoint_tablet) {
      width: 170%;
      margin: 0 3rem;
    }
  }
  article > div {
    height: unset !important;
    min-height: 100%;
    p {
      @include main_text_content();
      width: 100%;
      @media (min-width: $breakpoint_tablet) {
        padding-right: 3rem;
      }
    }
    @media (min-width: $breakpoint_tablet) {
      padding: 0 !important;
    }
  }
  div.more-link {
    @include fluo_button();
    margin-top: 3rem;
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    @media (min-width: $breakpoint_tablet) {
      position: absolute;
      left:0;
      right:0;
    }
  }
  @media (min-width: $breakpoint_tablet) {
    padding: 8rem 1rem;
    padding-top: 4rem;
    margin: 6rem 0;
    margin-left: 20vw;
    margin-right: 20vw;
    width: calc(100% - 40vw);
    display: flex;
    justify-content: space-around;
  }
}

// plus sur l'accueil
.home_consultation {
    position: relative;
    @include beige_gradient();
    width: 100%;
    padding: 4rem 0;
    h2 {
        @include main_title();
        margin-bottom: 1.2rem;
        @media (min-width: $breakpoint_tablet) {
            padding-left: 0 !important;
        }
        @media (min-width: $breakpoint_desktop) {
            margin-left: 12.5vw;
            max-width: 50vw;
        }
    }
    h2 + div {
        h2, h3, h4 {
            @include sous_titre_alt();
            @media (min-width: $breakpoint_desktop) {
                max-width: 50vw;
                margin-left: 12.5vw;
            }
        }
    }
    article > div {
        height: unset !important;
        p {
          @include main_text_content();
          @media (min-width: $breakpoint_desktop) {
              margin-left: 12.5vw;
              max-width: 50vw;
          }
        }
        @media (min-width: $breakpoint_tablet) {
            padding: 0 !important;
        }
    }
    div.more-link {
        @include fluo_button();
        margin-top: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        @media (min-width: $breakpoint_desktop) {
            display: flex;
            justify-content: flex-end;
        }
    }
    @media (min-width: $breakpoint_tablet) {
        padding-left: 12.5vw;
        padding-right: 12.5vw;
    }
}