@primary-color: #4286f4;

@navigation-background: #fffffff1;
@navigation-link-color: #555;

@transition: all 300ms ease-in-out;

//html, body {
//  height: 100%;
//}
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Roboto, "Helvetica Neue", sans-serif;
  font-size: 14px;

  background: #373b44; /* fallback for old browsers */
  background: -webkit-linear-gradient(to top, #373b44, #4286f4); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to top, #373b44, #4286f4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  background-attachment: fixed;
}

p {
  margin: 8px 0;
}

h1, h2, h3, h4 {
  color: @navigation-link-color;
  padding: 0;
  margin: 0 0 20px 0;
}

.mat-form-field {
  width: 100%;
}

.mat-form-field .mat-form-field-infix {
  width: unset;
}

.mat-form-field.mat-form-field-appearance-standard .mat-form-field-underline {
  height: 0;
}


.content > *:not(router-outlet) {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

.btn-icon {
  opacity: 0.2;
  transition: all 300ms ease-in-out;

  &:hover {
    opacity: 1;
  }
}

html, body {
  height: 100%;
}

body {
  margin: 0;
  font-family: Roboto, "Helvetica Neue", sans-serif;
}