@import url("https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.4/css/bulma.min.css");
@import url("https://fonts.googleapis.com/css2?family=Cutive+Mono&family=Lato&display=swap");
html {
  font-family: "Cutive Mono", monospace !important;
  width: 100%;
  min-height: 100%;
  font-size: 20px;
  background: #fefefd;
  color: #25292d; }

body {
  position: relative; }

h1, .h1 {
  font-family: "Lato", sans-serif; }
  @media screen and (max-width: 1023px) {
    h1, .h1 {
      font-size: 36px;
      line-height: 36px; } }
  @media screen and (min-width: 1024px) {
    h1, .h1 {
      font-size: 48px;
      line-height: 52px; } }

h2, .h2 {
  font-family: "Lato", sans-serif; }
  @media screen and (max-width: 1023px) {
    h2, .h2 {
      font-size: 23px;
      line-height: 28px;
      margin-top: 0.5rem; } }
  @media screen and (min-width: 1024px) {
    h2, .h2 {
      font-size: 32px;
      line-height: 38px; } }

h3, .h3 {
  font-family: "Lato", sans-serif; }
  @media screen and (max-width: 1023px) {
    h3, .h3 {
      font-size: 24px;
      line-height: 28px; } }
  @media screen and (min-width: 1024px) {
    h3, .h3 {
      font-size: 32px;
      line-height: 32px; } }

h4, .h4 {
  font-family: "Cutive Mono", monospace !important; }
  @media screen and (max-width: 1023px) {
    h4, .h4 {
      font-size: 20px;
      line-height: 22px; } }
  @media screen and (min-width: 1024px) {
    h4, .h4 {
      font-size: 24px;
      line-height: 30px; } }

a {
  color: #25292d; }
  a:hover {
    text-decoration: underline; }

p, ul, li {
  font-family: "Cutive Mono", monospace !important;
  list-style-type: circle; }

dd {
  font-family: "Cutive Mono", monospace !important; }

p {
  hyphens: auto;
  text-align: justify; }

strong {
  font-family: "Lato", sans-serif; }

em {
  font-family: "Cutive Mono", monospace !important; }

.font__headers {
  font-family: "Lato", sans-serif; }
.font__standard {
  font-family: "Cutive Mono", monospace !important; }

.box {
  background-color: #f5f5f5;
  box-shadow: none; }

@media screen and (max-width: 1023px) {
  .column {
    padding: 0.25rem; } }

.watermark:before {
  content: " ";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.3;
  background: url("img/sa-circle.png") fixed no-repeat;
  background-position: 106% 106%;
  background-size: 300px 300px; }
