@import url("https://fonts.googleapis.com/css?family=Caveat:400,700|Roboto+Condensed:400,400i&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese");
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

html {
  font-size: 16px; }

.js-templates {
  display: none; }

body {
  padding: 0;
  margin: 0; }

.app-container {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center; }

body {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Caveat', cursive;
  font-weight: 700;
  color: #5c4b42; }

h1 {
  font-size: 3rem; }

h2 {
  font-size: 2.5rem; }

h3 {
  font-size: 2rem; }

h4 {
  font-size: 1.5rem; }

h5 {
  font-size: 1.25rem; }

h6 {
  font-size: 1rem; }

.stic-layer__display--text {
  display: flex;
  flex-direction: column;
  justify-content: flex-start; }
  .stic-layer__display--text[data-stic-layer-name^="dial"] {
    justify-content: flex-end; }

.stic-layer__display--text[data-stic-font="Caveat-Regular"] {
  font-family: 'Caveat', cursive; }

.stic-layer__display--text[data-stic-font="Caveat-Bold"] {
  font-family: 'Caveat', cursive;
  font-weight: 700; }

.stic-layer__display--text[data-stic-font="RobotoCondensed-Regular"] {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400; }

.stic-layer__display--text[data-stic-font="RobotoCondensed-Italic"] {
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  font-style: italic; }

.stic-layer__display {
  pointer-events: none; }

.stic-layer__display[data-stic-layer-name^="btn_"] {
  pointer-events: all;
  cursor: pointer;
  cursor: hand;
  -webkit-filter: grayscale(50%);
          filter: grayscale(50%);
  transition: -webkit-filter 150ms ease;
  transition: filter 150ms ease;
  transition: filter 150ms ease, -webkit-filter 150ms ease; }
  .stic-layer__display[data-stic-layer-name^="btn_"]:hover {
    -webkit-filter: grayscale(3%);
            filter: grayscale(3%); }

.stic-layer__display {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.stic-layer__display--text[data-stic-layer-name^="btntxt_"] {
  pointer-events: none; }

.stic-layer__display[data-stic-layer-name^="btn_"] {
  cursor: pointer; }

.screen--stic.screen--stic-quizz .stic-layer__display[data-stic-layer-name^="response"] {
  -webkit-filter: opacity(0.6);
          filter: opacity(0.6); }
  .screen--stic.screen--stic-quizz .stic-layer__display[data-stic-layer-name^="response"]:hover {
    -webkit-filter: opacity(1);
            filter: opacity(1); }

.screen--stic.screen--stic-quizz.active .stic-layer__display[data-stic-layer-name^="response"] {
  pointer-events: all;
  cursor: pointer;
  cursor: hand; }

.screen--stic.screen--stic-quizz .stic-layer__display[data-stic-layer-name^="feedback"] {
  display: flex;
  flex-direction: column;
  justify-content: center; }

.screen--stic.screen--stic-quizz .good [data-stic-layer-name^="response"],
.screen--stic.screen--stic-quizz .good [data-stic-layer-name^="bullit"],
.screen--stic.screen--stic-quizz .wrong [data-stic-layer-name^="response"],
.screen--stic.screen--stic-quizz .wrong [data-stic-layer-name^="bullit"] {
  -webkit-filter: opacity(0.6);
          filter: opacity(0.6); }
  .screen--stic.screen--stic-quizz .good [data-stic-layer-name^="response"].selected-answer,
  .screen--stic.screen--stic-quizz .good [data-stic-layer-name^="bullit"].selected-answer,
  .screen--stic.screen--stic-quizz .wrong [data-stic-layer-name^="response"].selected-answer,
  .screen--stic.screen--stic-quizz .wrong [data-stic-layer-name^="bullit"].selected-answer {
    -webkit-filter: none !important;
            filter: none !important; }

.app-container.loading:after {
  position: absolute;
  pointer-events: none;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url("/assets/img/ajax-loader-2.gif");
  background-position: center center;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  opacity: 0; }

@-webkit-keyframes loadingAppear {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes loadingAppear {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.app-container.loading:after {
  -webkit-animation: loadingAppear 350ms forwards;
          animation: loadingAppear 350ms forwards;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s; }

.page__navigation {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 2;
  height: 100vh;
  display: flex;
  flex-direction: column;
  pointer-events: none; }

.page__top-bar {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.3) 2px 2px 2px;
  z-index: 99;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  transition: -webkit-transform 500ms ease;
  transition: transform 500ms ease;
  transition: transform 500ms ease, -webkit-transform 500ms ease; }
  .page__top-bar.open {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  .page__top-bar .cookie__container {
    min-height: 3.5rem;
    width: 80%;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; }
    .page__top-bar .cookie__container button {
      width: 2rem;
      background: none;
      border: none;
      margin: 0;
      padding: 0;
      color: #5c4b42; }

button.control__backward {
  box-sizing: content-box;
  position: fixed;
  left: 2.25rem;
  padding: 0.9rem;
  top: 0;
  width: 2rem;
  z-index: 8;
  pointer-events: all;
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  cursor: hand;
  color: #5c4b42; }
  button.control__backward:disabled {
    cursor: none;
    pointer-events: none;
    opacity: 0; }

.end button.control__backward {
  display: none; }

label[for="menu-panel__switch"] {
  position: fixed;
  right: 2.25rem;
  padding: 0.9rem;
  top: 0;
  width: 2rem;
  z-index: 10;
  pointer-events: all;
  transition: color 175ms; }
  label[for="menu-panel__switch"] svg {
    -webkit-transform: rotate(0);
            transform: rotate(0);
    transition: -webkit-transform 175ms ease-in-out;
    transition: transform 175ms ease-in-out;
    transition: transform 175ms ease-in-out, -webkit-transform 175ms ease-in-out; }
    label[for="menu-panel__switch"] svg .open {
      opacity: 0;
      transition: opacity 175ms; }
    label[for="menu-panel__switch"] svg .close {
      opacity: 1;
      transition: opacity 175ms; }
  label[for="menu-panel__switch"].open svg {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg); }
    label[for="menu-panel__switch"].open svg .open {
      opacity: 1; }
    label[for="menu-panel__switch"].open svg .close {
      opacity: 0; }

.hidden-switch {
  display: none; }

.main-nav {
  pointer-events: all;
  background-color: #1592A5;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  transition: -webkit-transform 250ms ease-in-out;
  transition: transform 250ms ease-in-out;
  transition: transform 250ms ease-in-out, -webkit-transform 250ms ease-in-out;
  z-index: 9;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  .main-nav .list .list__item {
    line-height: 2; }
    .main-nav .list .list__item a {
      color: white;
      font-size: 2.625rem;
      text-decoration: none; }
      .main-nav .list .list__item a:hover {
        text-decoration: underline; }
  .main-nav .list .list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-top: 1px solid white; }
    .main-nav .list .list .list__item a {
      font-size: 1rem;
      color: white;
      text-decoration: none;
      text-transform: uppercase;
      opacity: 0.5;
      transition: opacity 150ms ease;
      padding: 0.5rem; }
      .main-nav .list .list .list__item a:hover {
        opacity: 0.8; }
      .main-nav .list .list .list__item a.active {
        font-weight: bold;
        opacity: 1; }

#menu-panel__switch:checked ~ .main-nav {
  -webkit-transform: translateX(0);
          transform: translateX(0); }

.end body .page__navigation {
  font-size: 0.7rem !important; }

body[data-on-color="default"] button.control__backward,
body[data-on-color="default"] label[for="menu-panel__switch"] {
  color: black; }

body[data-on-color="color"] button.control__backward,
body[data-on-color="color"] label[for="menu-panel__switch"] {
  color: white; }

.additional-menu-disabled .disableable {
  display: none; }

.page__interactions {
  position: absolute;
  bottom: 1rem;
  left: 0;
  z-index: 1;
  pointer-events: none;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center; }
  .page__interactions svg {
    width: 3rem;
    color: #000;
    opacity: 0;
    transition: opacity 375ms ease; }
    .page__interactions svg.hidden {
      opacity: 0; }
    .page__interactions svg.show {
      opacity: 1; }

@-webkit-keyframes interaction-pulse {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes interaction-pulse {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
    .page__interactions svg .interaction {
      -webkit-animation: interaction-pulse 450ms infinite alternate;
              animation: interaction-pulse 450ms infinite alternate; }

body[data-on-color="default"] .page__interactions svg {
  color: black; }

body[data-on-color="color"] .page__interactions svg {
  color: white; }

@-webkit-keyframes overlayShow {
  0% {
    opacity: 0; }
  1% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes overlayShow {
  0% {
    opacity: 0; }
  1% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes overlayIdle {
  0% {
    opacity: 1; }
  30% {
    opacity: 0.4; }
  100% {
    opacity: 0; } }

@keyframes overlayIdle {
  0% {
    opacity: 1; }
  30% {
    opacity: 0.4; }
  100% {
    opacity: 0; } }

.overlay.overlay--backward {
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 8;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  opacity: 0;
  color: #5c4b42; }
  .overlay.overlay--backward svg {
    width: 6em; }
  .overlay.overlay--backward.show {
    -webkit-animation: overlayShow 250ms forwards;
            animation: overlayShow 250ms forwards; }
  .overlay.overlay--backward.idle {
    -webkit-animation: overlayIdle 1s ease-out forwards;
            animation: overlayIdle 1s ease-out forwards; }

.js-enabled-only {
  display: none; }

html.js-enabled .js-enabled-only {
  display: inherit; }

.ie-browser-only {
  display: none; }

html.ie-browser .app-container {
  display: none; }

html.ie-browser .ie-browser-only {
  margin: auto;
  top: 25%;
  left: 25%;
  position: absolute;
  width: 50%;
  height: 50%;
  border: 1px solid red;
  display: inherit; }

* {
  tap-highlight-color: transparent;
  outline: none; }

.page__container {
  width: 80%;
  max-width: 640px;
  margin: 3rem auto 0.5rem auto; }
  .page__container h1 {
    text-align: center; }
  .page__container h2 {
    margin: 1.5em 0 1em 0; }
  .page__container em {
    font-weight: bold; }
  .page__container p {
    margin: 0.7rem 0;
    line-height: 1.2; }

.page--credits .credits__list {
  margin-top: 2em;
  margin-bottom: 3em;
  text-align: center; }
  .page--credits .credits__list dt {
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 0.5rem; }
  .page--credits .credits__list dd {
    margin-bottom: 1rem; }

.page--credits .partners__list {
  list-style-type: disc;
  list-style-position: inside;
  margin-bottom: 1rem; }
  .page--credits .partners__list li {
    margin: 0.4rem 0 0.4rem 0.25rem; }

.page--credits .rec {
  margin-top: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start; }
  .page--credits .rec img {
    max-height: 8rem;
    width: auto; }
  .page--credits .rec p {
    font-size: 0.85em; }

* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

html.about,
html.end,
html.credits {
  background-color: #1592A5;
  color: white !important; }
  html.about body,
  html.end body,
  html.credits body {
    font-size: 1.3em; }
  html.about h1, html.about h2, html.about h3, html.about h4, html.about h5, html.about h6,
  html.end h1,
  html.end h2,
  html.end h3,
  html.end h4,
  html.end h5,
  html.end h6,
  html.credits h1,
  html.credits h2,
  html.credits h3,
  html.credits h4,
  html.credits h5,
  html.credits h6 {
    color: white; }
  html.about a,
  html.end a,
  html.credits a {
    color: skyblue; }
  html.about a.control__back,
  html.end a.control__back,
  html.credits a.control__back {
    display: block;
    margin: 1em 0;
    color: white; }
    html.about a.control__back svg,
    html.end a.control__back svg,
    html.credits a.control__back svg {
      width: 1.4rem; }

html.end {
  background-color: #846a97; }
  html.end a {
    color: rgba(255, 255, 255, 0.85); }