// PROFILE IMAGE
<div class="profile__banner">
  <div class="column__two column__two--4-2 column--merge-a">
    <div class="column column--merge-a column--mb-r">
      <div class="heading--6">
        President, Fitch Ratings
      </div>
      <h1 class="heading--1">Ian Linnell</h1>
      <div class="divider"></div>
    </div>
    <div class="column column--merge-a column--mb-r">
      <div class="profile__image">
        <img alt="Ian-Linnel" src="https://images.ctfassets.net/03fbs7oah13w/1yLPkU9FodIJMbiy2supDP/d92621e818ba9077974bc1ae16bb4ead/ian-linnell.png?w=474&amp;h=452&amp;q=80&amp;fm=png">
      </div>
    </div>
  </div>
</div>


// BACKGROUND IMAGE
<div class="profile__banner bg--img" style="background-image: url(https://rmkcdn.successfactors.com/b89612a3/c73a3191-1a6b-412a-a77a-c.jpg);">
  <div class="column__two column__two--4-2 column--merge-a">
    <div class="column column--merge-a column--mb-r sb--3">
      <h1 class="heading--1">Analysts</h1>
      <div class="divider sb--1"></div>
      <p> We have over 2000 employees drawing on over 100 years of experience rating over 20,000 entities around the world. It is our ability to see things from every angle and simplify the complex that gives us the edge in a highly competitive market. </p>
      <p> At the heart of what makes us different is our people. </p>
      <p>
        <strong> Browse our, ratings, insights and latest market commentary through a selection of our diverse, global analysts and authors. Check back often as we feature new thought leaders from across Fitch Ratings.</strong>
      </p>
    </div>
    <div class="column column--merge-a column--mb-r"></div>
  </div>
</div>

  // PROFILE BANNER
  --profile-banner-background: #eff0f1;

.profile__banner {
  position: relative;
  min-height: 30rem;
  margin: 6.6rem 0 3rem;
  padding: 7rem 7rem 0;
  background-color: var(--profile-banner-background);
}
.profile__banner.bg--img {
  margin-top: 0;
}
.profile__image {
  margin-top: -13.6rem;
  float: right;
}
.profile__image img {
  width: 100%;
  height: auto;
  display: block;
}
.profile__teaser .image-wrapper {
  aspect-ratio: 1/1;
}
.profile__teaser .image-wrapper img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.profile__teaser a {
  color: inherit;
}
.profile__teaser a:hover, .profile__teaser a:focus {
  text-decoration: none;
}

/* iPad Pro Portrait - iPad Landscape */
@media only screen and (max-width: 1024px) {
  .profile__image {
    margin-top: -9rem;
  }
}
/* iPad Portrait  */
@media only screen and (max-width: 768px) {
  .profile__banner {
    min-height: 27.8rem;
    padding: 4.8rem 3.6rem 0;
  }
  .profile__image {
    margin-top: -1.8rem;
  }
}
/* iPhone 6 onwards */
@media only screen and (max-width: 480px) {
  .profile__banner {
    margin-top: 0;
    padding: 4.8rem 2.4rem 0;
  }
  .profile__image {
    margin-top: 4.8rem;
  }
}

@import '../abstracts/_mixins';

.profile {
  &__banner {
    position: relative;
    min-height: 30rem;
    margin: 6.6rem 0 3rem;
    padding: 7rem 7rem 0;
    background-color: var(--profile-banner-background);

    &.bg--img {
      margin-top: 0;
    }
  }

  &__image {
    margin-top: -13.6rem;
    float: right;

    img {
      width: 100%;
      height: auto;
      display: block;
    }
  }
  &__teaser {
    .image-wrapper {
      aspect-ratio: 1/1;
      
      img {
        object-fit: cover;
        width: 100%;
        height: 100%;
      }

    }
    a {
      color: inherit;

      &:hover,
      &:focus {
        text-decoration: none;
      }
    }
  }
}

@include mq-2 {
  .profile {
    &__image {
      margin-top: -9rem;
    }
  }
}
@include mq-3 {
  .profile {
    &__banner {
      min-height: 27.8rem;
      padding: 4.8rem 3.6rem 0;
    }

    &__image {
      margin-top: -1.8rem;
    }
  }
}
@include mq-4 {
  .profile {
    &__banner {
      margin-top: 0;
      padding: 4.8rem 2.4rem 0;
    }
    &__image {
      margin-top: 4.8rem;
    }
  }
}