h1, h2, h3, h4, h5 {
  letter-spacing: 1px;
}

body {
  font-size: 14px;
  font-family: 'Didact Gothic', serif;
}

p, li, footer p, footer p.hero-text-bold {
  font-size: 1.2em; /* 14px */
  line-height: 1.3em; /* 20px */
  /*margin: 1.4286em 0 0 0;*/
}
/* 30px - The quick brown fox jumps over the lazy dog */
.hero-text-title, .class-for-30px {
  font-size: 2.1429em; /* 30px */
  line-height: 1.3333em; /* 40px */
  margin-top: 0.6667em;  margin-bottom: 0.0000em;
}
/* 24px - The quick brown fox jumps over the lazy dog */
.class-for-24px {
  font-size: 1.7143em; /* 24px */
  line-height: 1.6667em; /* 40px */
  margin-top: 0.8333em;  margin-bottom: 0.0000em;
}
/* 22px - The quick brown fox jumps over the lazy dog */
h3, .class-for-22px {
  font-size: 1.5714em; /* 22px */
  line-height: 1.8182em; /* 40px */
  margin-top: 0.9091em;  margin-bottom: 0.0000em;
}
/* 21px - The quick brown fox jumps over the lazy dog */
h4, .class-for-21px {
    font-size: 1.5000em;
    line-height: 1.6em;
    margin-top: 0.9524em;
    margin-bottom: 0.0000em;
    max-width: 95%;
}
/* 18px - The quick brown fox jumps over the lazy dog */
.class-for-18px {
  font-size: 1.2857em; /* 18px */
  line-height: 1.1111em; /* 20px */
  margin-top: 1.1111em;  margin-bottom: 0.0000em;
}
/* 14px - The quick brown fox jumps over the lazy dog */
p, .media-body p {
  font-size: 1.2em; /* 14px */
}

header h1, section h1, h1 {
  font-size: 1.7em;
  line-height: 1.9em;
}

@media all and (max-width: 768px)
  {
    p, .media-body p {
      font-size: 1.0em; /* 14px */
    }
    }