.block_custom-project {
  position: relative;
  padding-top: var(--spacing);
  padding-bottom: var(--spacing);

  .project-image {
    position: relative;

    img {
      @media screen and (min-width: 768px) {
        border-radius: 0 20px 20px 0;
        width: 50%;
        max-width: 50%;
        height: 660px;
      }

      @media screen and (max-width: 767px) {
        width: 100%;
        height: 350px;
      }

      object-fit: cover;
    }

    p {
      position: relative;
      margin-top: 380px;
      color: var(--off-white, #F5F5F4);
      font-family: Taviraj;
      font-size: 21px;
      font-style: italic;
      font-weight: 300;
      letter-spacing: 0.42px;
    }
  }

  .container {
    display: flex;
    z-index: 2;
    width: 100%;

    @media screen and (min-width: 768px) {
      position: absolute;
      transform: translate(-50%, -50%);
      top: 50%;
      left: 50%;
    }

    @media screen and (max-width: 767px) {
      margin-top: -70px;
      position: relative;
    }

    .project-text {
      background: var(--green);
      border-radius: var(--border_radius);
      margin-left: auto;
      margin-right: 24px;

      @media screen and (min-width: 768px) {
        width: 55%;
        padding: 100px 91px;
      }

      @media screen and (max-width: 767px) {
        margin: 0 24px;
        padding: 50px var(--column_spacing_medium);
      }

      .custom-heading {
        color: var(--grey);
      }

      .custom-headline {
        color: var(--grey);
      }
    }
  }
}