* {
  touch-action: pan-y;
}

html,
body {
  min-height: 100%;
  margin: auto;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.navbar {
    transition: transform 0.3s ease;
    /*background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.2));*/
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 2%, rgba(0, 0, 20, 0.8) 100%)
}

.navbar.hidden {
    transform: translateY(-100%);
}

main.qp-flex-container{
  display: flex;
  flex-direction: column;
  min-height: 200vh;
  flex: 1 1 auto;
  min-height: 0
}

#buttonsContainer {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.qp-button {
  flex: 1 1 0;
  min-height: 64px;
}

.qp-question-text{
    backdrop-filter: blur(64px);
    backdrop-filter: blu
    -webkit-backdrop-filter: blur(16px);
}