.fs-form-overview {
  width: 100%;
  height: 100%;
}

.fs-form.fs-show {
  -webkit-animation: animFadeIn 0.5s;
  animation: animFadeIn 0.5s;
}

@-webkit-keyframes animFadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes animFadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fs-form.fs-show .fs-fields {
  -webkit-animation: animMove 0.5s;
  animation: animMove 0.5s;
}

@-webkit-keyframes animMove {
  from {
    top: 100px;
  }
}

@keyframes animMove {
  from {
    top: 100px;
  }
}

/* Visibility control of elements */
.fs-form-full .fs-fields > div,
.fs-nav-dots,
.fs-progress,
.fs-numbers,
button.fs-continue,
.fs-message-error,
.fs-message-final {
  display: none;
}

.no-js .fs-form-full .fs-fields > div {
  display: inline-block;
}

.fs-show {
  display: inline-block !important;
}

/* Fields */
.fs-fields {
  position: relative;
  margin: 0 auto;
  padding: 0;
  top: 0;
  list-style: none;
}

.fs-fields > div {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0;
  border: none;
}

.js .fs-form-full .fs-fields > div {
  position: absolute;
  width: 100%;
}

.fs-form-overview .fs-fields > div,
.no-js .fs-form .fs-fields > div {
  margin: 1em 0 2em;
  padding: 0 0 2em 0;
  border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}

@-webkit-keyframes animMoveUp {
  to {
    -webkit-transform: translateY(-100%);
  }
}

@keyframes animMoveUp {
  to {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

.fs-numbers.fs-show-prev .fs-number-current {
  -webkit-animation: animMoveDown 0.4s both;
  animation: animMoveDown 0.4s both;
}

@-webkit-keyframes animMoveDown {
  to {
    -webkit-transform: translateY(100%);
  }
}

@keyframes animMoveDown {
  to {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }
}

/* Animation classes & animations */
.fs-form div.fs-current {
  display: inline-block;
}

.fs-form div.fs-hide,
.fs-form div.fs-show {
  pointer-events: none;
}

/* Hide current li when navigating to next question */
.fs-form .fs-display-next .fs-hide {
  display: inline-block;
}

.fs-form .fs-display-next .fs-hide .fs-anim-lower,
.fs-form .fs-display-next .fs-hide .fs-anim-upper {
  -webkit-animation: animHideNext 0.5s cubic-bezier(0.7, 0, 0.3, 1) forwards;
  animation: animHideNext 0.5s cubic-bezier(0.7, 0, 0.3, 1) forwards;
}

.fs-form .fs-display-next .fs-hide .fs-anim-lower {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

@-webkit-keyframes animHideNext {
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -500px, 0);
  }
}

@keyframes animHideNext {
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -500px, 0);
    transform: translate3d(0, -500px, 0);
  }
}

/* Show new li when navigating to next question */
.fs-form .fs-display-next .fs-show .fs-anim-lower,
.fs-form .fs-display-next .fs-show .fs-anim-upper {
  -webkit-animation: animShowNext 0.5s cubic-bezier(0.7, 0, 0.3, 1) both 0.15s;
  animation: animShowNext 0.5s cubic-bezier(0.7, 0, 0.3, 1) both 0.15s;
}

.fs-form .fs-display-next .fs-show .fs-anim-lower {
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}

@-webkit-keyframes animShowNext {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 500px, 0);
  }
}

@keyframes animShowNext {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 500px, 0);
    transform: translate3d(0, 500px, 0);
  }
}

/* Hide current li when navigating to previous question */
.fs-form .fs-display-prev .fs-hide {
  display: inline-block;
}

.fs-form .fs-display-prev .fs-hide .fs-anim-lower,
.fs-form .fs-display-prev .fs-hide .fs-anim-upper {
  -webkit-animation: animHidePrev 0.5s cubic-bezier(0.7, 0, 0.3, 1) forwards;
  animation: animHidePrev 0.5s cubic-bezier(0.7, 0, 0.3, 1) forwards;
}

.fs-form .fs-display-prev .fs-hide .fs-anim-upper {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

@-webkit-keyframes animHidePrev {
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 500px, 0);
  }
}

@keyframes animHidePrev {
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 500px, 0);
    transform: translate3d(0, 500px, 0);
  }
}

/* Show new li when navigating to previous question */
.fs-form .fs-display-prev .fs-show .fs-anim-lower,
.fs-form .fs-display-prev .fs-show .fs-anim-upper {
  -webkit-animation: animShowPrev 0.5s cubic-bezier(0.7, 0, 0.3, 1) both 0.15s;
  animation: animShowPrev 0.5s cubic-bezier(0.7, 0, 0.3, 1) both 0.15s;
}

.fs-form .fs-display-prev .fs-show .fs-anim-upper {
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}

@-webkit-keyframes animShowPrev {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -500px, 0);
  }
}

@keyframes animShowPrev {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -500px, 0);
    transform: translate3d(0, -500px, 0);
  }
}
