/** Add custome fonts **/
@font-face {
    font-family: "Lota Grotesque Regular";
    src:  url("../fonts/LotaGrotesque/Regular/LotaGrotesque-Regular.woff") format('woff');
  }

@font-face {
    font-family: "Lota Grotesque RegularIt";
    src:  url("../fonts/LotaGrotesque/RegularIt/LotaGrotesque-RegularIt.woff") format('woff');
}

@font-face {
    font-family: "Lota Grotesque Regular-Bold";
    src:  url("../fonts/LotaGrotesque/Bold/LotaGrotesque-Bold.woff") format('woff');
}

@font-face {
    font-family: "Lota Grotesque Regular-BoldIt";
    src:  url("../fonts/LotaGrotesque/BoldIt/LotaGrotesque-BoldIt.woff") format('woff');
}

/** Custom CSS **/

/* Visually hide content but not from screen reader */
.visually-hidden { /*/https://snook.ca/archives/html_and_css/hiding-content-for-accessibility */
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE 6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
}

.visually-hidden a:focus,
.visually-hidden input:focus,
.visually-hidden button:focus {
    position: static;
    width: auto;
    height: auto;
}

/* Font changes */
body {
    font-family: "Lota Grotesque Regular", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

strong {
    font-family: "Lota Grotesque Regular-Bold", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;;
}

em {
    font-family: "Lota Grotesque RegularIt", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;;
}

strong > em, em > strong {
    font-family: "Lota Grotesque Regular-BoldIt", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;;
}

/* Navigation changes */
nav {
    background-color: #ffffff !important;
    border: none !important;
}

/* Introduction paragraph */
p.introduction {
    font-family: "Lota Grotesque Regular-Bold";
    font-weight: bold;
    font-size: 4em;
    line-height: 1.2;
    padding-top: 1em;
}