/* Fonts */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local("Roboto Thin"), local("Roboto-Thin"), url("../fonts/roboto/roboto-v15-latin-100.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-100.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), url("../fonts/roboto/roboto-v15-latin-100italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-100italic.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local("Roboto Light"), local("Roboto-Light"), url("../fonts/roboto/roboto-v15-latin-300.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-300.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: local("Roboto Light Italic"), local("Roboto-LightItalic"), url("../fonts/roboto/roboto-v15-latin-300italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-300italic.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local("Roboto"), local("Roboto-Regular"), url("../fonts/roboto/roboto-v15-latin-regular.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-regular.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: local("Roboto Italic"), local("Roboto-Italic"), url("../fonts/roboto/roboto-v15-latin-italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-italic.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local("Roboto Medium"), local("Roboto-Medium"), url("../fonts/roboto/roboto-v15-latin-500.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-500.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("../fonts/roboto/roboto-v15-latin-500italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-500italic.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local("Roboto Bold"), local("Roboto-Bold"), url("../fonts/roboto/roboto-v15-latin-700.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-700.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), url("../fonts/roboto/roboto-v15-latin-700italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-700italic.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: local("Roboto Black"), local("Roboto-Black"), url("../fonts/roboto/roboto-v15-latin-900.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-900.woff") format("woff");
}

@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), url("../fonts/roboto/roboto-v15-latin-900italic.woff2") format("woff2"), url("../fonts/roboto/roboto-v15-latin-900italic.woff") format("woff");
}

html,
body {
  font: normal normal 400 18px/1.5 Roboto, sans-serif;
}

.title {
  font: normal normal 300 1.3em/1.37 Roboto, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font: normal normal 500 1.3em/1.37 Roboto, sans-serif;
}

/*
h1 + *,
h2 + *,
h3 + *,
h4 + *,
h5 + *,
h6 + *,
.title + * {
  margin-top: 1rem;
}
*/

* + h3,
* + h4,
* + h5,
* + h6 {
  margin-top: 1rem;
}

@media screen and (min-width: 31.25em) {
  h1,
  h2 {
    font-size: 2em;
    line-height: 1.389;
  }

  h3,
  h4,
  h5,
  h6 {
    font-size: 1.5em;
    line-height: 1.37;
  }

  * + h3,
  * + h4,
  * + h5,
  * + h6 {
    margin-top: 2rem;
  }
}

@media screen and (min-width: 62.5em) {
  h1 {
    font-size: 2.5em;
    line-height: 1.352;
  }
}

@media screen and (min-width: 2000px) {
  html,
  body {
    font-size: calc(100vw / 100 - 2px);
  }
}

@media screen and (max-width: 499px) {
  html,
  body {
    font-size: 16px;
  }

  .title {
    font-size: 1.111em;
    line-height: 1.5;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-size: 1.111em;
    line-height: 1.5;
  }
}


.fas {
  font-family: FontAwesome;
}