@font-face {
  font-family: CalibreRegular;
  src: url(/fonts/calibre/CalibreWeb-Regular.eot);
  src: url(/fonts/calibre/CalibreWeb-Regular.eot?iefix) format("eot"),
    url(/fonts/calibre/CalibreWeb-Regular.woff) format("woff"),
    url(/fonts/calibre/CalibreWeb-Regular.ttf) format("truetype");
}

@font-face {
  font-family: CalibreMedium;
  src: url(/fonts/calibre/CalibreWeb-Medium.eot);
  src: url(/fonts/calibre/CalibreWeb-Medium.eot?iefix) format("eot"),
    url(/fonts/calibre/CalibreWeb-Medium.woff) format("woff"),
    url(/fonts/calibre/CalibreWeb-Medium.ttf) format("truetype");
}

@font-face {
  font-family: CalibreLight;
  src: url(/fonts/calibre/CalibreWeb-Light.eot);
  src: url(/fonts/calibre/CalibreWeb-Light.eot?iefix) format("eot"),
    url(/fonts/calibre/CalibreWeb-Light.woff) format("woff");
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  background-color: rgb(38, 92, 32);
  background-color: color(display-p3 0.15 0.36 0.13);
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  font-size: 14px;
  font-family: "CalibreRegular", sans-serif;
  color: rgb(255, 255, 255);
  text-rendering: optimizeLegibility;
  transition: background-color 0.35s ease-in-out;

  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  * {
    line-height: 1.4em;
  }
}

main {
  width: calc(100vw - 80px);
  margin: 90px auto 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

@media only screen and (min-width: 744px) {
  body {
    font-size: 19px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main {
    width: 690px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 36px;
    margin: 0;
  }
}

h1,
p,
a {
  margin: 0;
}

h1 {
  font-family: "HCo Sentinel SSm", serif;
  font-size: 22px;
  line-height: 28px;
  font-weight: 300;
}

p {
  font-size: 16px;
  letter-spacing: 6%;
}

@media only screen and (min-width: 744px) {
  h1 {
    font-size: 32px;
    line-height: 40px;
  }
  p {
    font-size: 23px;
  }
}

footer {
  margin-top: 1em;
  align-self: stretch;
  width: 257px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 30px;
}

@media only screen and (min-width: 744px) {
  footer {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 60px;
    margin-top: 0;
  }

  footer p {
    flex: 1;
  }
}

a {
  color: white;
  text-decoration-thickness: 0.5px;
  text-decoration-color: rgba(255, 255, 255, 0);
  text-underline-offset: 5px;
  transition: text-decoration-color 0.1s ease-in-out;
}

a:hover {
  text-decoration-color: rgba(255, 255, 255, 1);
}

a.button {
  appearance: none;
  display: block;
  padding: 12px 19px;
  margin-top: 19px;

  border-radius: 6px;

  color: white;
  background-color: rgb(31, 76, 26);
  background-color: color(display-p3 0.12 0.3 0.1);

  font-size: 16px;

  cursor: pointer;
  text-decoration: none;

  transition: background-color 0.15s ease-in-out;
}

@media only screen and (min-width: 744px) {
  a.button {
    font-size: 23px;
    margin-top: 26px;
  }
}

a.button:hover {
  opacity: 1;
  background-color: rgb(11, 56, 6);
  background-color: color(display-p3 0.02 0.2 0);
}

blockquote {
  font-weight: normal;
}

cite {
  font-style: normal;
}

strong,
strong em,
strong del {
  font-weight: 600;
}

hr {
  background-color: rgba(37, 35, 33, 0.64);
  box-sizing: content-box;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}
.clearfix {
  zoom: 1;
}

::selection {
  color: black;
  background: rgba(173, 255, 0, 1);
}
