@font-face {
  font-family: "triplicate_t3c";
  font-style: normal;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/triplicate_t3_code_regular.woff") format("woff");
}

@font-face {
  font-family: "triplicate_t3c";
  font-style: normal;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/triplicate_t3_code_bold.woff") format("woff");
}

@font-face {
  font-family: "triplicate_t3c";
  font-style: italic;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/triplicate_t3_code_italic.woff") format("woff");
}

@font-face {
  font-family: "triplicate_t3c";
  font-style: italic;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/triplicate_t3_code_bold_italic.woff") format("woff");
}

@font-face {
  font-family: "concourse_t3";
  font-style: normal;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/concourse_t3_regular.woff") format("woff");
}

@font-face {
  font-family: "concourse_t3";
  font-style: normal;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/concourse_t3_bold.woff") format("woff");
}

@font-face {
  font-family: "concourse_t3";
  font-style: italic;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/concourse_t3_bold_italic.woff") format("woff");
}

@font-face {
  font-family: "concourse_t3";
  font-style: italic;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/concourse_t3_italic.woff") format("woff");
}

@font-face {
  font-family: "equity_text_b";
  font-style: normal;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/equity_text_b_regular.woff") format("woff");
}

@font-face {
  font-family: "equity_text_b";
  font-style: italic;
  font-weight: normal;
  font-stretch: normal;
  src: url("/fonts/equity_text_b_italic.woff") format("woff");
}

@font-face {
  font-family: "equity_text_b";
  font-style: normal;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/equity_text_b_bold.woff") format("woff");
}

@font-face {
  font-family: "equity_text_b";
  font-style: italic;
  font-weight: bold;
  font-stretch: normal;
  src: url("/fonts/equity_text_b_bold_italic.woff") format("woff");
}

nav {
  text-align: center;
}

nav ul {
  padding-inline-start: 0;
}

nav ul li {
  display: inline;
}

nav ul li ~ li::before {
  content: " ";
}

nav ul li *::before {
  content: "[ ";
}

nav ul li *::after {
  content: " ]";
}

body {
  background: #f5f7fa;
  color: #1f2933;
  font-family: "equity_text_b", serif;
  font-size: 62.5%;
  font-size: 1rem;
  line-height: 1.6;
  max-width: 650px;
  margin: 40px auto;
  padding-left: 10px;
  padding-right: 10px;
}

h1 {
  line-height: 1.2;
  text-align: center;
  font-family: "concourse_t3", serif;
}

h2,
h3 {
  line-height: 1.2;
  font-family: "concourse_t3", serif;
}

h4 {
  line-height: 0.9;
  font-family: "concourse_t3", serif;
}

dt {
  font-weight: bold;
}

img {
  max-width: 650px;
}

.book {
  font-style: italic;
}

.container {
  margin: 0 auto;
}

a {
  text-decoration: none;
  font-weight: bold;
}

.lang {
  text-transform: lowercase;
  font-family: "concourse_t3", serif;
}

.nav {
  background: #fff;
  border-bottom: 1px solid #e4e7eb;

  &__items {
    display: flex;
    list-style-type: none;
  }

  &__item {
    a {
      display: block;
      padding: 12px 16px 12px 0;
    }
  }
}

.button {
  background: #52606d;
  border: 1px solid #52606d;
  border-radius: 4px;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 1rem;
  font-weight: 500;
  margin: 0 0 8px;
  padding: 12px;
  text-align: center;
  text-decoration: none;
  transition: all 0.25s;
  width: 100%;

  &:last-child {
    margin: 0;
  }

  &:hover {
    background: #3e4c59;
    border-color: #52606d;
  }

  &--primary {
    background: #4943ee;
    border-color: #4943ee;

    &:hover {
      background: #080986;
      border-color: #080986;
    }
  }

  &--secondary {
    background: transparent;
    border-color: #6e6cf1;
    color: #4943ee;

    &:hover {
      background: transparent;
      border-color: #312edd;
      color: #1919b6;
    }
  }
}

.center {
  text-align: center;
}

code {
  font-family: "triplicate_t3c", mono;
}

.code {
  font-family: "triplicate_t3c", mono;
}