.user-is-tabbing :focus {
  outline: 1px dotted currentColor;
  outline-offset: 2px; }

.homepage-hero.hero.hero-wide .container-fluid {
  top: 50%;
  transform: translateY(-50%); }

@media (min-width: 768px) {
  .homepage-hero.hero.hero-wide .container-fluid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 3fr 2fr;
    grid-template-columns: 3fr 2fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto; }
  .homepage-hero.hero.hero-wide .container-fluid > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1; }
  .homepage-hero.hero.hero-wide .container-fluid > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2; } }

.homepage-hero .hero-content .hero-title::after {
  border-color: #fff; }

.homepage-hero .hero-content .hero-headline {
  font-size: calc(18px + (22 - 18) * ((100vw - 300px) / (1600 - 300)));
  font-family: "Lora", serif;
  padding-right: 140px; }

.homepage-hero .scroll-down {
  position: relative;
  margin: 120px 0 0;
  left: 20%;
  color: #fff;
  text-transform: uppercase;
  opacity: 0;
  animation: scroll-container .5s 2s forwards; }
  .homepage-hero .scroll-down p {
    font-weight: 600;
    font-size: calc(14px + (14 - 14) * ((100vw - 300px) / (1600 - 300)));
    font-family: "Work Sans", sans-serif; }
  .homepage-hero .scroll-down .mouse {
    position: relative;
    margin-bottom: 10px;
    display: block;
    width: 14px;
    height: 23px;
    border-radius: 35%;
    border: 2px solid #fff;
    left: 50px; }
    .homepage-hero .scroll-down .mouse:before {
      content: "";
      display: block;
      height: 60px;
      width: 0;
      border: 1px solid #fff;
      position: absolute;
      top: -60px;
      left: 3px; }
    .homepage-hero .scroll-down .mouse:after {
      content: "";
      display: block;
      position: absolute;
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: #fff;
      left: 3px;
      top: 2px;
      animation: mouse-ball 2s ease-out 3s infinite; }
    .homepage-hero .scroll-down .mouse.still:after {
      animation-name: none; }

@media (min-width: 768px) and (max-width: 991.98px) {
  .homepage-hero .hero-content .hero-headline {
    padding: 0; }
  .homepage-hero .hero-content .scroll-down {
    display: none; } }

@media (max-width: 767.98px) {
  .homepage-hero .hero-content .hero-headline {
    padding: 0; }
  .homepage-hero .hero-content .scroll-down {
    display: none; } }