#about-hero {
  width:100%;
  min-height:50vh;
  padding:top:120px;
  display:flex;
  align-items:center;
  justify-content: center;
  background-color:#0C243E;
  background-image:url('../images/dotted-icon-blue1.png');
  background-size:contain;
  background-repeat:no-repeat;
  background-position:right 10% center;
  animation: animatedBackground 3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

@keyframes animatedBackground {
	from { background-position: 0 0; }
	to { background-position: 90% 0; }
}

#about-hero blockquote {
  font-family: 'Intro';
  line-height: 1.1;
  letter-spacing: -0.03em;
  color:#BDD5EA;
  margin:60px 0 0.35em 0;
  font-family: 'Intro';
  line-height: 1.1;
  letter-spacing: -0.03em;
  color:#BDD5EA;
  font-size: clamp(
    var(--fluid-type-min, 1rem),
    calc(1rem + var(--fluid-type-target, 3vw)),
    var(--fluid-type-max, 1.3rem)
  );
  --fluid-type-min: 1.8rem;
  --fluid-type-max: 3rem;
  border-left:3px solid #FE5F55;
  padding-left:18px;
  font-style: italic;
  max-width:80%;
}

#about-hero .author {
  color:#ffffff;
  padding-left:21px;
  font-size:1.8rem;
  max-width:80%;
}

#approach {
  background-image:url('../images/dotted-icon-blue3-50.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left 10% center;
}