.brand-wordmark {
  display: block;
  padding: 0 4px 28px;
}

.brand-logo-frame {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    background: transparent;
}

.brand-wordmark .brand-logo-frame {
    width: 100%;
}

.brand-logo-image {
  display: block;
  width: 100%;
  height: auto;
}

.login-wordmark {
  width: 270px;
}

.login-wordmark .brand-logo-frame {
    width: 100%;
}

.mobile-wordmark {
  width: 225px;
}

@media (max-width: 820px) {
  .login-wordmark {
    display: none;
  }

  .mobile-wordmark {
    display: flex;
  }
}