@-webkit-keyframes gradient-shift {
  0% {
    background-position: 0% 100%; }
  50% {
    background-position: 100% 100%; }
  100% {
    background-position: 0% 100%; } }
@keyframes gradient-shift {
  0% {
    background-position: 0% 100%; }
  50% {
    background-position: 100% 100%; }
  100% {
    background-position: 0% 100%; } }




.anchored-section {
  padding-top: 11rem;
  padding-bottom: 11rem; }

.center-vertically {
  margin-top: 50%;
  transform: translateY(-50%); }

.demo-background {
  overflow: hidden;
  position: relative;
  height: 240px;
  width: 100%;
  top: 7rem;
  left: 5rem;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: right; }
  @media (min-width: 40em) {
    .demo-background {
      background-position: left;
      top: 0;
      width: 400px;
      height: 440px; } }
  @media (min-width: 64em) {
    .demo-background {
      left: 0;
      width: 460px;
      margin-top: 5rem; } }
  @media (min-width: 84em) {
    .demo-background {
      width: 600px; } }

.make-logo {
  max-width: 96px;
  height: 104px;
  display: inline-block;
  position: relative; }
  .make-logo > img {
    margin-top: 50%;
    transform: translateY(-50%); }

.maker-headshot {
  max-width: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover !important;
  padding-top: 0;
  position: relative;
  display: block;
  height: 252px;
  color: white; }
  .maker-headshot::before {
    content: '';
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #0cabf9;
    background-image: linear-gradient(-216deg, #0cabf9 7%, #0d2dd1 97%);
    transition: opacity 250ms;
    opacity: 0; }
  .maker-headshot .maker-carousel__info,
  .maker-headshot .arrow-box {
    transition: transform 350ms ease, opacity 250ms;
    opacity: 0;
    transform: translate(0, 2rem); }
  .maker-headshot .arrow-box {
    transition: transform 450ms cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 250ms ease 100ms;
    transform: translate(0, 3rem);
    position: absolute;
    bottom: 2rem;
    right: 2rem; }
  .maker-headshot:hover, .maker-headshot:focus {
    text-decoration: none; }
    .maker-headshot:hover::before, .maker-headshot:focus::before {
      opacity: 0.7; }
    .maker-headshot:hover .maker-carousel__info,
    .maker-headshot:hover .arrow-box, .maker-headshot:focus .maker-carousel__info,
    .maker-headshot:focus .arrow-box {
      color: white;
      opacity: 1;
      transform: translate(0, 0); }
  .maker-headshot .maker-carousel__info {
    position: absolute;
    bottom: 2rem;
    left: 2rem; }
  @media screen and (max-width: 39.9375em) {
    .maker-headshot {
      height: 200px;
      margin-top: 16px; } }

@media (max-width: 39.9375em) {
  .demo-foreground {
    max-width: 195px; } }

.hero__bg__layer {
  position: absolute;
  
  top: -1.5%;
  left: -1.5%;
  right: -1.5%;
  bottom: -1.5%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  .hero__bg__layer svg {
    width: 100%; }

#hero__bg__blur {
  -webkit-filter: brightness(80%) blur(5px);
          filter: brightness(80%) blur(5px); }
  #hero__bg__blur::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(117.06deg, #0cabf9 2.17%, #0d2ed1 65.63%, #6750ff 82.42%);
    mix-blend-mode: multiply;
    opacity: 0.8;
    background-size: 200% 200%;
    -webkit-animation-name: gradient-shift;
            animation-name: gradient-shift;
    -webkit-animation-duration: 15s;
            animation-duration: 15s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear; }

body.ie #hero__bg__clip {
  display: none; }

body.ie #hero__bg__blur {
  -webkit-filter: brightness(80%);
          filter: brightness(80%); }
  body.ie #hero__bg__blur::before {
    mix-blend-mode: normal;
    opacity: 0.6; }

/*# sourceMappingURL=homepage.min.css.map */