:root {
  --font-400: "AvenirNextCyrRegular", serif;
  --font-500: "AvenirNextCyrMedium", serif;
  --font-600: "AvenirNextCyrDemi", serif;
  --font-700: "AvenirNextCyrBold", serif;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-red: #b72828;
  --color-whitesmoke: #efefef;
  --color-nero: #2a2a2a;
  --color-chardon: #f7e8dc;
  --color-eclipse: #393939;
  --color-brightsun: #ecc026;
}

body {
  font-family: var(--font-400);
  font-size: 14px;
  line-height: 21px;
  color: var(--color-black);
  background-color: var(--color-whitesmoke);
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--color-black);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

img, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

p:not(:last-child) {
  margin-bottom: 30px;
}

strong {
  font-family: var(--font-600);
}

@media (min-width: 768px) {
  body {
    font-size: 16px;
    line-height: 24px;
  }
}

@media (min-width: 1240px) {
  body {
    font-size: 24px;
    line-height: 36px;
  }
}

@media (max-width: 767px) {
  body.state-hidden {
    overflow: hidden;
  }  

  p:not(:last-child) {
    margin-bottom: 15px;
  }
}