/* roboto-regular - cyrillic_latin */
@font-face {
  font-weight: 400;
  font-style: normal;
  font-family: Roboto;
  src:
    local("Roboto"),
    local("Roboto-Regular"),
    url("/front/static/fonts/roboto-v20-regular.woff2") format("woff2"),
    url("/front/static/fonts/roboto-v20-regular.woff") format("woff");
  font-display: swap;

  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* roboto-500 - cyrillic_latin */
@font-face {
  font-weight: 500;
  font-style: normal;
  font-family: Roboto;
  src:
    local("Roboto Medium"),
    local("Roboto-Medium"),
    url("/front/static/fonts/roboto-v20-500.woff2") format("woff2"),
    url("/front/static/fonts/roboto-v20-500.woff") format("woff");
  font-display: swap;

  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* latin-ext */
@font-face {
  font-weight: 400;
  font-style: normal;
  font-family: Roboto-Ext;
  src:
    local("Roboto"),
    local("Roboto-Regular"),
    url("/front/static/fonts/RobotoExt.woff2") format("woff2");
  font-display: swap;

  /* Chrome 26+, Opera 23+, Firefox 39+ */
}

/* latin-ext */
@font-face {
  font-weight: 500;
  font-style: normal;
  font-family: Roboto-Ext;
  src:
    local("Roboto Medium"),
    local("Roboto-Medium"),
    url("/front/static/fonts/RobotoExt500.woff2") format("woff2");
  font-display: swap;

  /* Chrome 26+, Opera 23+, Firefox 39+ */
}

.image-fadeout {
  opacity: 0;
}

.fadein {
  animation: fade-in-from-none 0.3s ease-out;
}

@keyframes fade-in-from-none {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}