h1, h2, h3, h4, h5, h6 {
  font-style: normal;
  font-weight: normal;
  color: #333333;
  font-family: 'Open Sans', sans-serif;
}

h1.left, h2.left, h3.left, h4.left, h5.left, h6.left {
  text-align: left;
}

h1.center, h2.center, h3.center, h4.center, h5.center, h6.center {
  text-align: center;
}

h1.right, h2.right, h3.right, h4.right, h5.right, h6.right {
  text-align: right;
}

h1, .h1 {
  font-size: 28px;
  line-height: 34px;
}

h1-l, .h1-l {
  font-size: 31px;
  line-height: 36px;
}

h1-s, .h1-s {
  font-size: 24px;
  line-height: 28px;
}

h2, .h2 {
  font-size: 28px;
  line-height: 34px;
}

h3, .h3 {
  font-size: 24px;
  line-height: 28px;
}

h4, .h4 {
  font-size: 21px;
  line-height: 24px;
}

h5, .h5 {
  font-size: 16px;
  line-height: 20px;
}

h6, .h6 {
  font-size: 14px;
  line-height: 18px;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin: 0;
  padding: 0;
}

.type-small,
.type-small a {
  font-size: 12px;
  line-height: 16px;
}

.light-txt, .light-txt p, .light-txt a, .light-txt h1, .light-txt h2, .light-txt h3, .light-txt h4, .light-txt svg {
  color: #ffffff !important;
}

.dark-txt, .dark-txt p, .dark-txt a, .dark-txt h1, .dark-txt h2, .dark-txt h3, .dark-txt h4, .dark-txt svg {
  color: #333333 !important;
}

.txt-light, .txt-light a:not(.button), .txt-light h1, .txt-light h2, .txt-light h3, .txt-light h4, .txt-light h5, .txt-light h6, .txt-light p {
  color: #fff;
}

.txt-dark, .txt-dark a:not(.button), .txt-dark h1, .txt-dark h2, .txt-dark h3, .txt-dark h4, .txt-dark h5, .txt-dark h6, .txt-dark p {
  color: #333;
}

h1, h2, h3, .h1, .h1--l, .h2, .h3 {
  font-family: "colour-sans", "open_sans_regular", Helvetica, Arial, sans-serif;  
}

.non-latin h1, .non-latin h2, .non-latin h3, .non-latin .h1, .non-latin .h1--l, .non-latin .h2, .non-latin .h3 {
  font-family: "open_sans_regular", Helvetica, Arial, sans-serif;
}

label {
  font-size: 12px;
  line-height: 16px;
}

.onedomain-component a {
  font-size: inherit;
}

.onedomain-component .button span {
  font-size: 16px;
}

@media only screen and (min-width: 768px) {
  h1, .h1 {
    font-size: 42px;
    line-height: 50px;
  }

  h1-l, .h1-l {
    font-size: 54px;
    line-height: 64px;
  }
  
  h1-s, .h1-s {
    font-size: 32px;
    line-height: 40px;
  }
  
  h2, .h2 {
    font-size: 36px;
    line-height: 42px;
  }
  
  h3, .h3 {
    font-size: 32px;
    line-height: 38px;
  }
  
  h4, .h4 {
    font-size: 24px;
    line-height: 28px;
  }
  
  h5, .h5 {
    font-size: 18px;
    line-height: 22px;
  }
  
  h6, .h6 {
    font-size: 16px;
    line-height: 20px;
  }
}