@import '../../../@theme/styles/themes';
@import '~@nebular/theme/styles/global/breakpoints';

@include nb-install-component() {
  $color-active: nb-theme(color-active-fg);

  .contact {
    text-align: center;
    margin-bottom: 4rem;
  }

  h1 {
    font-family: 'Helvetica Neue Bold', sans-serif;
    font-size: 2.5rem;
    color: $color-active;
    margin: 0;
  }

  p {
    font-family: unquote('"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'), sans-serif;
    font-size: 1.5rem;
    line-height: 1.5;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  .btn {
    font-family: nb-theme(font-main), sans-serif;
    border-radius: 3px;
    border: none;
    background: #ffffff;
    color: #000000;
    box-shadow: nb-theme(shadow-default);
    cursor: pointer;
    text-transform: uppercase;

    &.btn-demo {
      margin-top: 0.375rem;
      padding: 1.125rem 6.25rem;
      color: #ffffff;
      background-color: nb-theme(color-active-fg);
      box-shadow: nb-theme(shadow-btn);
    }

    &:hover {
      box-shadow: nb-theme(shadow-hover-green-btn);
    }

    &:active {
      box-shadow: nb-theme(shadow-active-green-btn);
    }
  }
}
