.home-page-hero {
  background-color: @primary-1-color;
  overflow: hidden;

  .svg-logo {
    .lh-calc(margin-left, ~'50% - 97px');
    width: 420px;
  }

  .tagline {
    margin: 16px auto 0 auto;
    text-align: center;
    max-width: 575px;

    h2 {
      .mui-font-style-title;
    }

    h1, h2 {
      color: @dark-white;
      .mui-font-weight-light;
    }

    .demo-button, .github-button {
      margin-right: 32px;
      margin-top: 16px;

      .mui-raised-button-label {
        color: @primary-1-color;
      }
    }

    .github-button {
      margin-right: 0;
    }

    @media @device-large {
      margin-top: 32px;

      h1 {
        font-size: 56px;
      }

      h2 {
        .mui-font-style-headline;
        color: @dark-white;
        .mui-font-weight-light;
      }
    }
  }
}