* {
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: auto;
  &:focus {
    outline: map_get($theme-colors, primary) auto 5px;
  }
}

body {
  @include font(sans-serif, light);
  @include font-size(text);
}

a {
  @include font(sans-serif, light);
  @include font-size(text);
}

p {
  @include font(sans-serif, light);
  @include font-size(text);
}

h1 {
  @include font(sans-serif, regular);
  @include font-size(h1);
}

h2 {
  @include font(sans-serif, light);
  @include font-size(h2);
}

h3 {
  @include font(sans-serif, light);
  @include font-size(h3);
}

h4 {
  @include font(sans-serif, light);
  @include font-size(h4);
}

h5 {
  @include font(sans-serif, light);
  @include font-size(h5);
}

h6 {
  @include font(sans-serif, light);
  @include font-size(h6);
}

input, textarea {
  @include font(sans-serif, light);
  @include font-size(text);
}

.section-title {
  text-align: center;
  color: map_get($theme-colors, text-dark);
  @include font-size(h2);
  &::after {
    content: '';
    display: block;
    width: 250px;
    height: 6px;
    margin: 15px auto;
    background: map_get($theme-colors, secondary);
    box-shadow: 0 8px 11px 0 map_get($theme-colors, shadow-secondary);
  }
}

.section-bg-grey {
  border-top: 1px solid map_get($theme-colors, border-light);
  border-bottom: 1px solid map_get($theme-colors, border-light);
  background: map_get($theme-colors, background-secondary);
}

// Beaver Builder
// Add container to row wrap.
div.fl-row.section {
  div.fl-row-content-wrap {
    @extend .container;
  }
}
// Add section title styling to title.
div.beaver-section-title {
  h2 {
    @extend .section-title;
  }
}

body > .wrapper {
  display: flex;
  flex-direction: column;

  > .wrap {
    flex-grow: 1;
  }
}

body.admin-bar > .wrapper {
  margin-top: 32px;
}
