a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

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:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none;
}

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

a,
button,
i {
  outline: 0;
}

input::-moz-focus-inner {
  border: 0;
}

* {
  outline: none;
}

button::-moz-focus-inner {
  border: 0;
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 100;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLoHRuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 300;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLt_QuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 400;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLoHQuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 500;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLrPQuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 700;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLmbXuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: italic;
  font-weight: 900;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOKCnqEu92Fr1Mu53ZEC9_Vu3r1gIhOszmOClHrs6ljXfMMLijXuAj-lg.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 100;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWubEbFmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 300;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWuaabVmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWubEbVmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWub2bVmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWuYjalmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 900;
  font-stretch: normal;
  src: url("https://fonts.gstatic.com/s/roboto/v51/KFOMCnqEu92Fr1ME7kSn66aGLdTylUAMQXC89YmC2DPNWuZtalmUiA8.ttf") format("truetype");
}

@font-face {
  font-family: Dancing Script;
  font-style: normal;
  font-weight: 400;
  src: url("https://fonts.gstatic.com/s/dancingscript/v29/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7BMSo3Sup5.ttf") format("truetype");
}

@font-face {
  font-family: Dancing Script;
  font-style: normal;
  font-weight: 700;
  src: url("https://fonts.gstatic.com/s/dancingscript/v29/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7B1i03Sup5.ttf") format("truetype");
}

body,
html {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
  font-size: 10px;
  -webkit-text-size-adjust: none;
}

body {
  background-size: cover;
  font-family: Roboto,sans-serif;
}

.clear {
  width: 100%;
  clear: both;
}

#preview-label {
  width: 200px;
  height: 46px;
  position: fixed;
  top: 0;
  left: 50%;
  margin: 0 0 0 -100px;
  border-radius: 0 0 5px 5px;
  z-index: 16;
  background-color: #fff;
  box-shadow: 0 0 30px rgba(0,0,0,.4);
  text-align: center;
  font-size: 1.6em;
  line-height: 46px;
  font-weight: 300;
  text-transform: uppercase;
}

@keyframes a {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

#preview-label span.moving-dot {
  height: 16px;
  width: 16px;
  border-radius: 8px;
  position: absolute;
  right: 16px;
  top: 50%;
  margin: -8px 0 0;
  box-sizing: border-box;
  border: 2px solid #26b9ad;
  opacity: 1;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-name: a;
}

#loading,
#submitting,
#thankyou {
  width: 100%;
  height: 100%;
  position: fixed;
  left: -100%;
  top: 0;
  z-index: 13;
  opacity: 0;
  overflow: hidden;
  padding: 100px;
  box-sizing: border-box;
  transition: opacity .2s,left 0s;
  transition-delay: .5s;
  background-color: #000828;
  background-image: url("/qre/media/01_dark.1ceb901e.png");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: auto 100%;
}

#submitting {
  z-index: 10;
}

#submitting-inner {
  width: 100%;
  height: 80px;
  text-align: center;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -40px;
  opacity: 1;
  transition: all .5s;
}

#submitting.done #submitting-inner {
  opacity: 0;
}

#submitting-inner h1 {
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 2em;
  font-weight: 300;
}

#submitting-inner #submitting-bar {
  width: 100%;
  height: 12px;
  border-radius: 6px;
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: hsla(0,0%,100%,.3);
  overflow: hidden;
}

#submitting-inner #submitting-bar .bar-content {
  width: 0;
  height: 100%;
  border-radius: 6px;
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  position: absolute;
  left: 0;
  top: 0;
  transition: all 1.5s ease-in;
}

#submitting-inner #submitting-bar.loaded .bar-content {
  width: 100%;
}

.start #loading {
  opacity: 1;
  left: 0;
  transition-delay: 0s;
}

input#start {
  cursor: pointer;
}

.end #thankyou,
.end_submit #submitting {
  opacity: 1;
  left: 0;
  transition-delay: 0s;
}

#loading-background,
#submitting-background,
#thankyou-background {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 11;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
}

#loading-background:after,
#qre-background:after,
#submitting-background:after,
#thankyou-background:after {
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: 8;
  background-color: #000;
  display: block;
  opacity: .65;
}

#loading-background:after,
#submitting-background:after,
#thankyou-background:after {
  opacity: .3;
}

#submitting-background:after {
  opacity: .5;
}

#submitting.done #submitting-background:after {
  transition: all .5s;
  opacity: .8;
}

#loading-content,
#submitting-content,
#thankyou-content {
  position: relative;
  z-index: 12;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

#loading-content .inner,
#thankyou-content .inner {
  text-align: center;
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  margin: 0;
  padding-bottom: 70px;
}

#loading-content .inner .logo,
#thankyou-content .inner .logo {
  box-sizing: border-box;
  display: inline-block;
  border-radius: 3px;
  background-color: hsla(0,0%,100%,.9);
  padding: 26px 50px;
  margin: 0 0 60px;
  max-width: 250px;
  position: relative;
}

#loading-content .inner .logo:after,
#thankyou-content .inner .logo:after {
  border-top: 10px solid hsla(0,0%,100%,.9);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  left: 50%;
  top: 100%;
  margin-left: -10px;
  content: "";
}

#loading-content .inner .logo img,
#thankyou-content .inner .logo img {
  width: 100%;
  height: auto;
}

#loading-content .inner h1,
#thankyou-content .inner h1 {
  color: #fff;
  font-family: Roboto,sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 4em;
  margin: 0 0 30px;
}

#thankyou-content .inner h1.big {
  font-weight: 700;
  font-size: 6em;
  margin-bottom: 30px;
  text-transform: none;
  letter-spacing: 0;
}

#loading-content .inner h2,
#thankyou-content .inner h1.big {
  font-family: Dancing Script,Lucida Handwriting,cursive;
  color: #fff;
}

#loading-content .inner h2 {
  font-size: 4em;
}

#loading-content .inner p,
#thankyou-content .inner p {
  color: #fff;
  font-weight: 300;
  font-size: 2em;
  line-height: 150%;
  margin: 0 0 10px;
}

#loading-content .inner input[type=button] {
  display: inline-block;
  padding: 16px 36px;
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
  font-size: 4em;
  font-weight: 400;
  border-radius: 3px;
  line-height: 100%;
  font-family: Dancing Script,Lucida Handwriting,cursive;
  text-transform: capitalize;
}

#loading-content .inner input[type=button].touch {
  background: linear-gradient(90deg,#26b9ad,#66cf97);
}

#thankyou-alreadydoneMandatory,
#thankyou-alreadydoneNonmandatory,
#thankyou-canceled,
#thankyou-completedPreview,
#thankyou-emptyQuestionnaire,
#thankyou-finished {
  display: none;
  z-index: 13;
}

.alreadydone #thankyou-alreadydoneNonmandatory,
.alreadydone_mandatory #thankyou-alreadydoneMandatory,
.alreadydone_nonmandatory #thankyou-alreadydoneNonmandatory,
.canceled #thankyou-canceled,
.empty #thankyou-emptyQuestionnaire,
.finished #thankyou-finished,
.preview #thankyou-completedPreview {
  display: block;
}

.privacy-text {
  font-weight: 300;
  color: #fff;
  font-size: 1.1em;
  left: 0;
  bottom: 0;
  width: 100%;
  margin-top: 6em;
  box-sizing: border-box;
  text-align: center;
}

@media screen and (max-width:768px) {
  .privacy-text {
    font-size: 1.3em;
  }
}

.privacy-text__links {
  margin-top: 1.5em;
}

.privacy-text a {
  color: #fff;
  margin: 1em;
  font-size: 1.1em;
}

.finished #thankyou-final a {
  color: #fff;
}

.finished #thankyou-final strong {
  font-weight: 700;
}

.finished #thankyou-final em {
  font-style: italic;
}

.thankyou-options {
  width: 100%;
  max-width: 400px;
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0 0 0 20px;
  height: 46px;
}

.thankyou-options .opt {
  width: 50%;
  box-sizing: border-box;
  padding: 0 20px 0 0;
  float: left;
  display: inline-block;
  height: 100%;
  transition: all .2s;
}

.thankyou-options .opt span {
  width: 100%;
  display: block;
  box-sizing: border-box;
  border: 1px solid #fff;
  border-radius: 3px;
  height: 100%;
  line-height: 44px;
  text-align: center;
  font-size: 1.8em;
  color: #fff;
  text-transform: uppercase;
  font-weight: 300;
}

.thankyou-options .opt.selected span {
  background-color: #fff;
  color: #26b9ad;
}

#error {
  width: 100%;
  position: fixed;
  box-sizing: border-box;
  padding: 30px 120px 30px 30px;
  top: -100%;
  left: 0;
  z-index: 15;
  opacity: 0;
  transition: all .2s;
}

.start #error {
  padding: 30px;
}

#error.showError {
  top: 0;
  opacity: 1;
}

#error-content {
  width: 100%;
  height: auto;
  display: block;
  background-color: #fff;
  position: relative;
  border-radius: 3px;
  padding: 16px 60px 16px 80px;
  box-shadow: 0 2px 10px rgba(0,0,0,.5);
  box-sizing: border-box;
}

#error-icon {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  background-color: #e00;
  color: #fff;
  font-size: 2.4em;
  font-family: Georgia;
  position: absolute;
  left: 20px;
  top: 50%;
  margin: -20px 0 0;
  line-height: 40px;
  text-align: center;
}

#error-content #error-message {
  width: 100%;
  padding: 16px 0;
}

#error-message p {
  font-size: 1.6em;
  line-height: 110%;
  font-weight: 300;
  color: #e00;
}

#error-dismiss {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background-color: #e0e0e0;
  position: absolute;
  right: 10px;
  top: 50%;
  margin: -12px 0 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}

#error-dismiss:after,
#error-dismiss:before {
  height: 2px;
  width: 16px;
  border-radius: 1px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -1px 0 0 -8px;
  content: "";
}

#error-dismiss:before {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
}

#wrapper {
  position: fixed;
  z-index: 6;
  background-color: #000828;
  background-image: url("/qre/media/01_dark.1ceb901e.png");
  background-repeat: no-repeat;
  background-size: auto 100%;
}

#qre-background,
#wrapper {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: 50%;
}

#qre-background {
  position: absolute;
  z-index: 7;
  background-size: cover;
}

#qre-content {
  box-sizing: border-box;
  padding: 0 90px 0 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
}

#qre-content,
form#qre {
  width: 100%;
  height: 100%;
}

form#qre {
  display: block;
  position: relative;
}

#qre-content #qre-slider {
  width: 100%;
  top: 100%;
  position: absolute;
  top: 0;
  box-sizing: border-box;
  transition: none;
  -webkit-transition: none;
  -moz-transition: none;
}

#qre-content #qre-slider .slide {
  position: relative;
  display: none;
  width: 100%;
  max-width: 760px;
  box-sizing: border-box;
  opacity: .15;
  transition: none;
  margin: 0 auto 40px;
  min-height: 150px;
  padding: 30px 0 40px;
}

#qre-content #qre-slider .slide span.marker {
  display: none;
}

#qre-content #qre-slider .slide.required span.marker {
  position: absolute;
  right: 0;
  top: 30px;
  border-right: 32px solid #fff;
  border-bottom: 32px solid transparent;
  content: "";
  width: 0;
  height: 0;
  z-index: 4;
  display: block;
}

#qre-content #qre-slider .slide.required span.marker:before {
  color: #26b9ad;
  content: "*";
  position: absolute;
  right: -30px;
  top: -2px;
  font-size: 3em;
}

#qre-content #qre-slider.hiRes .slide {
  transition: opacity .2s;
}

.slide:hover {
  opacity: .6;
}

#qre-content #qre-slider .slide.active {
  opacity: 1!important;
  display: block;
}

.slide:after {
  content: "";
  position: absolute;
  bottom: 37px;
  left: 0;
  height: 3px;
  width: 34px;
  background-color: #fff;
}

.slide .slide-shutter {
  height: 100%;
  width: 100%;
  z-index: 14;
  left: 0;
  top: 0;
  display: block;
  position: absolute;
}

.slide.active .slide-shutter {
  display: none;
}

nav#blackbar {
  position: fixed;
  top: 0;
  right: 0;
  width: 90px;
  height: 100%;
  z-index: 14;
  opacity: 1;
  transition: all .2s;
  -webkit-transition: all .2s;
  background-color: rgba(0,0,0,.7);
  transition-delay: 0s;
}

.end_submit nav#blackbar,
.end nav#blackbar,
.start nav#blackbar {
  right: -90px;
  opacity: 0;
}

.end_submit nav#blackbar {
  transition-delay: 0s;
}

#qre-next,
#qre-prev {
  height: 52px;
  width: 52px;
  box-sizing: border-box;
  border: 2px solid #fff;
  border-radius: 26px;
  display: block;
  background-color: hsla(0,0%,100%,0);
  position: absolute;
  left: 50%;
  margin: 0 0 0 -26px;
  opacity: .6;
  cursor: pointer;
  transition: opacity .2s,left 0s,margin-left 0s;
}

#qre-next.inactive,
#qre-prev.inactive {
  left: 100%;
  margin-left: 0;
}

#qre-prev {
  bottom: 90px;
}

#qre-next {
  bottom: 30px;
}

#qre-next:before,
#qre-prev:before {
  content: "";
  height: 18px;
  width: 18px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  display: inline-block;
  position: absolute;
  box-sizing: border-box;
  left: 50%;
  top: 50%;
  margin: -9px 0 0 -9px;
  z-index: 3;
}

#qre-prev:before {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  margin-top: -5px;
}

#qre-next:before {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  margin-top: -12px;
}

#qre-next.touch,
#qre-prev.touch {
  opacity: 1;
}

#qre-next:after,
#qre-prev:after {
  content: "";
  width: 400px;
  height: 400px;
  background-color: rgba(38,185,173,0);
  border-radius: 50%;
  opacity: 1;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 0;
  transform: translate3d(-50%,-50%,0) scale(.25);
  transition: all 0s;
}

#qre-next:active:after,
#qre-prev:active:after {
  opacity: 0;
  transform: translate3d(-50%,-50%,0) scale(1);
  background-color: #26b9ad;
  transition: all .2s;
}

#poweredbyhugo {
  width: 52px;
  position: absolute;
  left: 50%;
  top: 30px;
  margin: 0 0 0 -26px;
  opacity: .6;
}

#poweredbyhugo img {
  width: 100%;
  height: auto;
}

#qre-progressBar {
  width: 100%;
  height: 4px;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 14;
  box-sizing: border-box;
  padding: 0 90px 0 0;
  opacity: 1;
  transition: all .2s;
}

.start #qre-progressBar {
  opacity: 0;
}

#qre-progressContent {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: rgba(0,0,0,.6);
}

#qre-progressPercentage {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  box-sizing: border-box;
  background-color: #26b9ad;
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  border-radius: 2px;
  transition: all .2s;
}

#qre-progressPercentage #qre-progressLabel {
  position: absolute;
  left: 100%;
  bottom: 100%;
  box-sizing: border-box;
  padding: 10px;
  display: none;
  background-color: hsla(0,0%,100%,.3);
  border-radius: 4px 4px 4px 0;
  color: #fff;
  text-align: center;
  font-family: Roboto,sans-serif;
  font-weight: 300;
  font-size: 1.4em;
  margin: 0 0 10px;
  width: 50px;
  transition: all .2s;
}

#qre-progressPercentage #qre-progressLabel:before {
  border-left: 4px solid #fff;
  border-bottom: 4px solid transparent;
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  opacity: .3;
  transition: all .2s;
}

#qre-progressPercentage #qre-progressLabel:after {
  border-right: 4px solid #fff;
  border-bottom: 4px solid transparent;
  content: "";
  position: absolute;
  right: 0;
  top: 100%;
  opacity: 0;
  transition: all .2s;
}

#qre-progressPercentage #qre-progressLabel.r {
  margin: 0 0 10px -50px;
  border-radius: 4px 4px 0 4px;
}

#qre-progressPercentage #qre-progressLabel.r:before {
  opacity: 0;
}

#qre-progressPercentage #qre-progressLabel.r:after {
  opacity: .3;
}

#authWrapper {
  position: fixed;
  left: -100%;
  top: 0;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  padding: 100px 190px 100px 100px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  z-index: 6;
  opacity: 0;
  transition: left 0s,opacity .2s;
  transition-delay: 0s;
  background-color: #000828;
  background-image: url("/qre/media/01_dark.1ceb901e.png");
}

#authWrapper.showAuth {
  transition-delay: 0s;
  left: 0;
  opacity: 1;
}

#authWrapper .authContinue {
  height: 0;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 6;
  border-radius: 0 0 4px 4px;
  overflow: hidden;
  transition: all .2s;
}

#authWrapper.showContinue .authContinue {
  height: 56px;
}

#authWrapper .authContinue span {
  background-color: #26b9ad;
  text-align: center;
  line-height: 56px;
  color: #fff;
  width: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0 0 4px 4px;
  font-size: 1.8em;
  font-weight: 300;
  text-transform: uppercase;
}

#authWrapper .authContent {
  width: 100%;
  height: 100%;
  max-width: 740px;
  background-color: #fff;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
  position: relative;
  padding: 100px;
  box-sizing: border-box;
  box-shadow: 0 2px 30px #000;
}

#authWrapper .authClose {
  width: 42px;
  height: 42px;
  border-radius: 21px;
  background-color: rgba(0,0,0,.3);
  position: absolute;
  right: 20px;
  top: 20px;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
  -webkit-transform: rotate(45deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: rotate(45deg);
  -moz-transform-origin: 50% 50%;
  opacity: .5;
  transition: all .2s;
}

#authWrapper .authClose.touch {
  opacity: 1;
}

#authWrapper .authClose:after,
#authWrapper .authClose:before {
  width: 24px;
  height: 2px;
  border-radius: 1px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -1px 0 0 -12px;
  content: "";
}

#authWrapper .authClose:after {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
}

#authWrapper .authAfterMessage,
#authWrapper .authBeforeMessage {
  box-sizing: border-box;
  padding: 0 0 30px;
}

#authWrapper .authAfterMessage h1,
#authWrapper .authBeforeMessage h1 {
  font-size: 5em;
  color: #000;
  line-height: 100%;
  font-family: Dancing Script,Lucida Handwriting,cursive;
  font-weight: 700;
  display: block;
  text-align: center;
}

#authWrapper .authAfterMessage h1 span,
#authWrapper .authBeforeMessage h1 span {
  display: block;
  font-family: Roboto,sans-serif;
  font-weight: 400;
  font-size: .3em;
  line-height: 100%;
  margin: 0;
  padding: 10px 0;
}

#authWrapper .authAfterMessage p,
#authWrapper .authBeforeMessage p {
  font-family: Roboto,sans-serif;
  font-weight: 300;
  font-size: 2.4em;
  line-height: 140%;
  text-align: center;
  padding: 30px 0;
}

#authWrapper .authAfterMessage .authHugoSection,
#authWrapper .authBeforeMessage .authHugoSection {
  position: relative;
  width: 100%;
  font-family: Roboto,sans-serif;
  font-weight: 300;
  font-size: 2em;
  line-height: 140%;
  text-align: center;
  padding: 30px;
  box-sizing: border-box;
  opacity: .6;
}

#authWrapper.after .authBeforeMessage,
#authWrapper.before .authAfterMessage {
  display: none;
}

#authWrapper .authBeforeMessage .authHugoSection .extraMessage {
  display: none;
  margin-top: 16px;
}

#authWrapper.fb_noEmail .authBeforeMessage .authHugoSection .extraMessage {
  display: block;
}

#authWrapper .authAfterMessage .authHugoSection:before,
#authWrapper .authBeforeMessage .authHugoSection:before {
  height: 1px;
  width: 50%;
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  background-color: #000;
  margin: 0 0 0 -25%;
  opacity: .4;
}

#authWrapper .authAfterMessage .authHugoSection a,
#authWrapper .authBeforeMessage .authHugoSection a {
  font-weight: 400;
  text-decoration: none;
  color: #000;
}

#authWrapper .authSection {
  width: 100%;
  height: 42px;
  box-sizing: border-box;
  position: relative;
}

#authWrapper .authSection.email {
  padding: 0 90px 0 0;
}

#authWrapper input[type=email] {
  width: 100%;
  padding: 6px 10px;
  border-radius: 3px 0 0 3px;
  font-weight: 300;
  border: 1px solid #26b9ad;
  border-right: none;
}

#authWrapper .authSection.email a,
#authWrapper input[type=email] {
  height: 100%;
  box-sizing: border-box;
  font-size: 1.4em;
  font-family: Roboto,sans-serif;
}

#authWrapper .authSection.email a {
  position: absolute;
  width: 90px;
  right: 0;
  top: 0;
  border-radius: 0 3px 3px 0;
  border: 1px solid #26b9ad;
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  text-align: center;
  line-height: 40px;
  font-weight: 400;
  overflow: hidden;
  cursor: pointer;
}

#authWrapper .authSection.email a:before {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 4px;
  height: 4px;
  margin: -2px 0 0 -2px;
  border-radius: 2px;
  background-color: #fff;
  opacity: 0;
  z-index: 1;
  transition: all .2s;
  content: "";
}

#authWrapper .authSection.email a.touch:before {
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
  border-radius: 50px;
  opacity: 1;
}

#authWrapper .authSection.email a span {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  color: #fff;
  transition: all .2s;
}

#authWrapper .authSection.email a.touch span {
  color: #26b9ad;
}

#authWrapper .authSection.divider,
.authSection.inline.divider {
  text-align: center;
  font-family: Dancing Script,Lucida Handwriting,cursive;
  font-weight: 400;
  color: #ccc;
  line-height: 41px;
  font-size: 2em;
}

.authSection.inline.divider {
  font-family: Roboto,sans-serif;
  font-size: 1.6em;
  font-weight: 300;
  color: #fff;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: left;
  font-style: italic;
}

#authWrapper .authSection.divider:after,
#authWrapper .authSection.divider:before {
  height: 1px;
  width: 30%;
  content: "";
  background-color: #e8e8e8;
  position: absolute;
  top: 50%;
  margin: 0;
}

#authWrapper .authSection.divider:before,
.authSection.inline.divider:before {
  left: 10%;
}

#authWrapper .authSection.divider:after,
.authSection.inline.divider:after {
  right: 10%;
}

#authWrapper .authSection.facebook {
  text-align: center;
}

.authSection.inline.facebook {
  text-align: left;
}

#authWrapper .authSection.facebook a,
.authSection.inline.facebook a {
  display: inline-block;
  line-height: 42px;
  padding: 0 24px 0 10px;
  border-radius: 3px;
  background-color: #3b5999;
  border: 1px solid #3b5999;
  box-sizing: border-box;
  position: relative;
  cursor: pointer;
}

.authSection.inline.facebook a {
  border: 1px solid #8b9dc3;
}

.authSection.inline.facebook a:active {
  background-color: #8b9dc3;
}

#authWrapper .authSection.facebook a span,
.authSection.inline.facebook a span {
  line-height: 40px;
  display: block;
  color: #fff;
  font-family: Roboto,sans-serif;
  font-weight: 300;
  padding: 0 0 0 34px;
  position: relative;
  box-sizing: border-box;
  font-size: 1.4em;
}

#authWrapper .authSection.facebook span strong,
.authSection.inline.facebook span strong {
  font-weight: 400;
}

#authWrapper .authSection.facebook a span img,
.authSection.inline.facebook a span img {
  position: absolute;
  left: 0;
  top: 50%;
  margin: -14px 0 0;
  height: 24px;
  width: 24px;
}

.authSection.acceptTerms {
  width: 100%;
  padding: 12px 0;
  margin-bottom: 30px;
}

.authSection.acceptTerms .input-radio {
  width: 50%;
}

.qHelpText.emailNote {
  margin-top: 16px;
  display: none!important;
}

.fb_allowEmail #getme,
.fb_allowEmail .authSection.acceptTerms,
.fb_allowEmail .authSection.divider,
.fb_allowEmail .authSection.email,
.fb_allowEmail .qHelptext.msgbox,
.fb_noEmail .authSection.acceptTerms,
.fb_noEmail .authSection.divider {
  height: 0;
  overflow: hidden;
  padding: 0;
  transition: all .2s;
  margin: 0;
  opacity: 0;
}

.fb_noEmail .authSection.divider {
  margin-bottom: 16px;
}

.fb_noEmail .qHelpText.emailNote {
  display: block!important;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]:hover::-webkit-inner-spin-button {
  background: #eee url("/qre/media/up-down.4ea40568.png") no-repeat 50% 50%;
  background-size: 18px 22px;
  width: 18px;
  height: 18px;
  padding: 6px;
  position: relative;
  right: 6px;
  opacity: 1;
  border-radius: 40px;
}

@media screen and (max-width:768px) {
  input[type=number]::-webkit-inner-spin-button,
  input[type=number]:hover::-webkit-inner-spin-button {
    display: none;
  }
}

.vcentered {
  transform: translate3d(0,-50%,0);
}

@media screen and (max-width:360px) {
  .authSection.acceptTerms .input-radio label:after {
    margin-left: 12px;
  }
}

input[type=email],
input[type=number],
input[type=text],
textarea {
  -webkit-appearance: none;
  border-radius: 0;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

input:focus,
textarea:focus {
  outline-style: solid;
  outline-width: 0;
}

.slide label.qGroup,
.slide label.qQuestion {
  font-weight: 300;
  line-height: 100%;
  font-size: 2em;
  color: #fff;
  display: block;
  box-sizing: border-box;
  padding: 0 0 16px;
  margin: 0;
  position: relative;
}

.slide label.qQuestion a {
  color: inherit;
  text-decoration: none;
  font-weight: 400;
}

.slide label.qGroup {
  font-size: 2.5em;
  padding: 0 0 26px;
  margin: 0 0 30px;
}

.slide label.qGroup:after {
  position: absolute;
  left: -34px;
  top: 100%;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  content: "";
}

.slide label.qGroup:before {
  position: absolute;
  left: -20px;
  top: 100%;
  width: 100%;
  border-top: 2px solid #fff;
  content: "";
}

.slide label.qGroup span,
.slide label.qQuestion span {
  font-weight: 100;
  font-size: .5em;
  color: #fff;
  display: inline-block;
  padding: 0 10px 0 0;
  margin: 0;
  position: absolute;
  left: -40px;
  top: 0;
  margin: 6px 0 0;
  height: 20px;
  line-height: 20px;
  bottom: 0;
  opacity: .6;
}

.slide label.qGroup span {
  margin: 9px 0 0;
}

.slide label.qGroup span:after,
.slide label.qQuestion span:after {
  content: ")";
  position: absolute;
  right: 0;
  top: 50%;
  margin: -11px 0 0;
  height: 20px;
  line-height: 20px;
}

.slide .qHelpText {
  font-size: 1.4em;
  color: #fff;
  font-weight: 300;
  line-height: 140%;
  border: 1px solid #fff;
  border-radius: 4px;
  box-sizing: border-box;
  padding: 8px 10px 8px 38px;
  display: inline-block;
  max-width: 50%;
  position: relative;
  opacity: .5;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.slide .qHelpText.inGroupHead {
  font-size: .4em;
  display: inline-block;
  margin-top: 20px;
}

.slide .qHelpText a {
  color: inherit;
  font-weight: 400;
  text-decoration: none;
}

.slide .qHelpText:before {
  font-family: Georgia,serif;
  font-style: italic;
  font-size: .9em;
  font-weight: 400;
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 9px;
  border: 1px solid #fff;
  box-sizing: border-box;
  position: absolute;
  left: 10px;
  top: 50%;
  margin: -9px 0 0;
  content: "i";
  text-align: center;
  line-height: 17px;
  padding: 0 1px 0 0;
}

.slide .qHelpText.touch {
  opacity: 1;
}

.slide .qAnswer {
  display: block;
  width: 100%;
  position: relative;
  margin: 30px 0 10px;
  padding: 0 0 20px;
  max-height: calc(100vh - 200px);
  overflow-y: scroll;
}

.slide .qAnswer.hasSelect {
  overflow-y: visible;
}

.slide a.goNext {
  width: 90px;
  height: 36px;
  display: inline-block;
  box-sizing: border-box;
  font-size: 1.6em;
  color: #26b9ad;
  border-radius: 3px;
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  padding: 0;
  margin: 20px 0 0;
  font-family: Roboto,sans-serif;
  font-weight: 300;
  position: relative;
  opacity: .5;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
  cursor: pointer;
  overflow: hidden;
}

.slide.active a.goNext,
.slide a.goNext.touch {
  opacity: 1;
}

.slide a.goNext span {
  width: 20px;
  border-radius: 1px;
  height: 18px;
  margin: -9px 0 0 -16px;
}

.slide a.goNext span,
.slide a.goNext span:after {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  border-right: 2px solid #fff;
  z-index: 5;
}

.slide a.goNext span:after {
  width: 12px;
  height: 12px;
  border-bottom: 2px solid #fff;
  box-sizing: border-box;
  margin: -6px 0 0 -6px;
  content: "";
  transform: rotate(-45deg);
  transform-origin: 50% 50%;
  -webkit-transform: rotate(-45deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: rotate(-45deg);
  -moz-transform-origin: 50% 50%;
}

.slide a.goNext.touch span,
.slide a.goNext.touch span:after {
  border-color: #26b9ad;
}

.slide a.goNext.doneButton:before,
.slide a.goNext:before {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 0;
  transform: translate3d(-50%,-50%,0) scale(.04);
  background-color: #fff;
  opacity: 0;
  content: "";
  z-index: 2;
}

.slide a.goNext.doneButton:before,
.slide a.goNext:before {
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.slide a.goNext.touch:before {
  transform: translate3d(-50%,-50%,0) scale(1);
  opacity: .8;
}

.slide a.goNext.doneButton {
  width: auto;
  height: auto;
  margin: 50px 0 0;
}

.slide a.goNext.doneButton span {
  border: none;
  font-family: Dancing Script,cursive;
  font-size: 2.2em;
  color: #fff;
  width: 100%;
  height: 100%;
  position: relative;
  left: 0;
  top: 0;
  box-sizing: border-box;
  padding: 14px 50px;
  margin: 0;
}

.slide a.goNext.doneButton span:after {
  display: none;
}

.slide a.goNext.doneButton.touch span {
  color: #26b9ad;
}

.slide a.goNext.doneButton.touch:before {
  transform: translate3d(-50%,-50%,0) scale(3);
  opacity: .8;
}

.qAnswer input[type=email],
.qAnswer input[type=number],
.qAnswer input[type=text],
.qAnswer textarea {
  border: 0;
  border-bottom: 1px solid hsla(0,0%,100%,.3);
  width: 100%;
  display: inline-block;
  padding: 10px 0;
  box-shadow: 0 0 0 transparent;
  background: transparent;
  font-size: 1.8em;
  line-height: 24px;
  color: #fff;
  opacity: .8;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
  font-weight: 300;
  font-family: Roboto,sans-serif;
  resize: none;
}

.qAnswer .acceptTerms .terms-text {
  margin-top: 30px;
  margin-bottom: 30px;
  color: #fff;
  font-size: 1.2em;
}

.qAnswer .acceptTerms a {
  color: #fff;
  font-size: 1.2em;
}

.qAnswer input[type=email]:focus,
.qAnswer input[type=number]:focus,
.qAnswer input[type=text]:focus,
.qAnswer textarea:focus {
  color: #fff;
  opacity: 1;
  border-bottom: 1px solid #26b9ad;
  padding: 10px 0;
  resize: none;
}

.qAnswer input[type=email]::-webkit-input-placeholder,
.qAnswer input[type=number]::-webkit-input-placeholder,
.qAnswer input[type=text]::-webkit-input-placeholder {
  color: #fff;
  opacity: .7;
}

.qAnswer input[type=email]:-moz-placeholder,
.qAnswer input[type=email]::-moz-placeholder,
.qAnswer input[type=number]:-moz-placeholder,
.qAnswer input[type=number]::-moz-placeholder,
.qAnswer input[type=text]:-moz-placeholder,
.qAnswer input[type=text]::-moz-placeholder {
  color: #fff;
  opacity: .7;
}

.qAnswer input[type=email]:-ms-input-placeholder,
.qAnswer input[type=email]::-ms-input-placeholder,
.qAnswer input[type=number]:-ms-input-placeholder,
.qAnswer input[type=number]::-ms-input-placeholder,
.qAnswer input[type=text]:-ms-input-placeholder,
.qAnswer input[type=text]::-ms-input-placeholder {
  color: #fff;
  opacity: .7;
}

.qAnswer textarea {
  word-wrap: break-word;
  box-sizing: border-box;
  overflow: hidden;
}

.qAnswer textarea.noAnim {
  transition: none;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
}

.acceptTerms .input-checkbox,
.qMultiple .input-checkbox,
.qMultiple .input-radio,
.qYesNo .input-radio {
  box-sizing: border-box;
  width: 30%;
  position: relative;
  float: left;
  padding: 0 20px 0 0;
  overflow: hidden;
}

.acceptTerms .input-checkbox label,
.qMultiple .input-checkbox label,
.qMultiple .input-radio label,
.qYesNo .input-radio label {
  display: block;
  width: 100%;
  height: 42px;
  border-radius: 3px;
  border: 1px solid #fff;
  box-sizing: border-box;
  line-height: 40px;
  text-align: center;
  font-size: 1.6em;
  color: #fff;
  font-weight: 300;
  overflow: hidden;
  position: relative;
  transition: all .2s;
  cursor: pointer;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.acceptTerms .input-checkbox label {
  padding-left: 10px;
}

.acceptTerms .input-checkbox label:after,
.qMultiple .input-checkbox label:after,
.qMultiple .input-radio label:after,
.qYesNo .input-radio label:after {
  width: 8px;
  height: 12px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  position: absolute;
  left: 0;
  transform: translate3d(-100px,0,0) rotate(45deg);
  opacity: 0;
  top: 50%;
  margin: -7px 0 0 20px;
  box-sizing: border-box;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
  content: "";
}

.acceptTerms .input-checkbox label:before,
.qMultiple .input-checkbox label:before,
.qMultiple .input-radio label:before,
.qYesNo .input-radio label:before {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 0;
  background-color: hsla(0,0%,100%,0);
  opacity: 1;
  content: "";
  width: 800px;
  height: 800px;
  border-radius: 50%;
  transform: translate3d(-50%,-50%,0) scale(.005);
  transition: all 0s;
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -ms-transition: all 0s;
}

.acceptTerms .input-checkbox label.touch:before,
.qMultiple .input-checkbox label.touch:before,
.qMultiple .input-radio label.touch:before,
.qYesNo .input-radio label.touch:before {
  transform: translate3d(-50%,-50%,0) scale(1);
  opacity: 1;
  background-color: hsla(0,0%,100%,.3);
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.acceptTerms .input-checkbox input[type=checkbox],
.qMultiple .input-checkbox input[type=checkbox],
.qMultiple .input-radio input[type=radio],
.qYesNo .input-radio input[type=radio] {
  position: absolute;
  left: -1000px;
  top: 0;
  opacity: 0;
}

.acceptTerms .input-checkbox input[type=checkbox]:checked+label,
.qMultiple .input-checkbox input[type=checkbox]:checked+label,
.qMultiple .input-radio input[type=radio]:checked+label,
.qYesNo .input-radio input[type=radio]:checked+label {
  border: 1px solid hsla(0,0%,100%,0);
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.acceptTerms .input-checkbox input[type=checkbox]:checked+label:after,
.qMultiple .input-checkbox input[type=checkbox]:checked+label:after,
.qMultiple .input-radio input[type=radio]:checked+label:after,
.qYesNo .input-radio input[type=radio]:checked+label:after {
  transform: translateZ(0) rotate(45deg);
  opacity: 1;
}

.acceptTerms .input-checkbox input[type=checkbox]:checked+label:before,
.qMultiple .input-checkbox input[type=checkbox]:checked+label:before,
.qMultiple .input-radio input[type=radio]:checked+label:before,
.qYesNo .input-radio input[type=radio]:checked+label:before {
  background-color: hsla(0,0%,100%,0);
  opacity: 1;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.qMultiple .input-checkbox,
.qMultiple .input-radio {
  width: 80%;
  margin-bottom: 12px;
}

.qMultiple.many .input-checkbox,
.qMultiple.many .input-radio {
  width: 50%;
}

.qMultiple .input-checkbox label,
.qMultiple .input-radio label {
  padding-left: 15px;
  text-align: left;
}

.acceptTerms .input-checkbox input[type=checkbox]:checked+label {
  padding-left: 38px;
}

.qMultiple .input-checkbox input[type=checkbox]:checked+label,
.qMultiple .input-radio input[type=radio]:checked+label {
  padding-left: 48px;
  transition: all 0s;
}

.qMultiple textarea.qLongtext {
  display: none;
}

.acceptTerms .input-checkbox label,
.qMultiple .input-checkbox label,
.qMultiple .input-radio label {
  line-height: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  height: auto;
  min-height: 40px;
  padding-right: 10px;
}

.o-select {
  height: 42px;
  padding: 0 20px 0 0;
  width: 60%;
  margin: 0;
}

.o-select,
.o-selected {
  position: relative;
  box-sizing: border-box;
}

.o-selected {
  line-height: 40px;
  font-size: 1.6em;
  color: #fff;
  font-weight: 300;
  padding: 0 15px;
  border-radius: 3px;
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  overflow: hidden;
  cursor: pointer;
}

.o-selected:after {
  position: absolute;
  right: -5px;
  top: -5px;
  width: 60px;
  height: 60px;
  content: "";
  border-left: 1px solid #fff;
  background: linear-gradient(90deg,#26b9ad,#66cf97);
  transform: rotate(10deg);
  transform-origin: 50% 50%;
  -webkit-transform: rotate(10deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: rotate(10deg);
  -moz-transform-origin: 50% 50%;
  z-index: 1;
}

.o-selected:before {
  right: 0;
  top: 50%;
  width: 10px;
  height: 10px;
  margin: -6px 22px 0 0;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
  transform: rotate(45deg);
  transform-origin: 50% 50%;
  -webkit-transform: rotate(45deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: rotate(45deg);
  -moz-transform-origin: 50% 50%;
  z-index: 2;
}

.o-selected:before,
.o-wrapper {
  position: absolute;
  box-sizing: border-box;
}

.o-wrapper {
  width: 100%;
  height: 100%;
  left: -10000px;
  top: 0;
  border-radius: 3px;
  z-index: 6;
  padding: 0 20px 0 0;
  opacity: 0;
  transition: left 0s,opacity .2s;
  transition-delay: .2s,0s;
  -webkit-transition: left 0s,opacity .2s;
  -webkit-transition-delay: .2s,0s;
  -moz-transition: left 0s,opacity .2s;
  -moz-transition-delay: .2s,0s;
  -ms-transition: left 0s,opacity .2s;
  -ms-transition-delay: .2s,0s;
}

.showOpts .o-wrapper {
  left: 0;
  opacity: 1;
  transition-delay: 0s;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -ms-transition-delay: 0s;
}

.o-ui {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  position: relative;
  border-radius: 1px;
  display: block;
}

ul.o-list {
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 2px 30px #000;
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  list-style: none;
  padding: 10px 0;
  max-height: 250px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

ul.o-list li.o-option {
  width: 100%;
  height: 42px;
  display: block;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

ul.o-list li.o-option span {
  left: 3px;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  line-height: 42px;
  box-sizing: border-box;
  padding: 0 20px;
  opacity: .6;
  font-weight: 300;
  font-size: 1.4em;
}

ul.o-list li.o-option span,
ul.o-list li.o-option span:before {
  position: absolute;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

ul.o-list li.o-option span:before {
  left: -10px;
  top: 50%;
  height: 12px;
  width: 8px;
  border-bottom: 2px solid #26b9ad;
  border-right: 2px solid #26b9ad;
  opacity: 0;
  content: "";
  margin: -8px 0 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
}

ul.o-list li.o-option.touch span {
  opacity: 1;
  padding: 0 20px 0 25px;
}

ul.o-list li.o-option.selected span {
  color: #26b9ad;
  padding: 0 20px 0 46px;
  opacity: 1;
}

ul.o-list li.o-option.selected span:before {
  opacity: 1;
  left: 20px;
}

ul.o-list li.o-option:before {
  position: absolute;
  left: 0;
  top: 50%;
  width: 4px;
  height: 4px;
  background-color: #f0f0f0;
  border-radius: 2px;
  margin: -2px 0 0 -2px;
  opacity: 0;
  content: "";
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
  z-index: 1;
}

ul.o-list li.o-option.selected:before,
ul.o-list li.o-option.touch:before {
  width: 1200px;
  height: 1200px;
  border-radius: 600px;
  margin: -600px 0 0 -600px;
  opacity: 1;
}

ul.o-list li.o-option.selected:before {
  opacity: .5;
}

.qDateGroup {
  width: 60%;
  height: 42px;
  padding: 0 20px 0 0;
  margin: 0;
}

.qDateGroup .o-select {
  position: relative;
  float: left;
  width: 33%;
  padding: 0 20px 0 0;
  box-sizing: border-box;
}

.qDateGroup .o-select.d {
  width: 25%;
}

.qDateGroup .o-select.d:after,
.qDateGroup .o-select.m:after {
  position: absolute;
  left: 100%;
  height: 20px;
  width: 1px;
  background-color: #fff;
  transform: rotate(10deg);
  transform-origin: 50% 50%;
  -webkit-transform: rotate(10deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: rotate(10deg);
  -moz-transform-origin: 50% 50%;
  top: 50%;
  margin: -10px 0 0 -11px;
  content: "";
  opacity: .6;
}

.qDateGroup .o-select.m {
  width: 35%;
}

.qDateGroup .o-select.y {
  width: 40%;
}

.qDateGroup .o-select .o-selected {
  padding-right: 40px;
  text-align: center;
}

.qDateGroup .o-select .o-selected:after {
  right: -30px;
}

.qDateGroup .o-select .o-selected:before {
  right: -12px;
}

.qRating {
  width: 100%;
  position: relative;
  display: block;
  margin: 10px 0 30px;
}

.qRating .rating_lower,
.qRating .rating_upper {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.qRating .rating_lower {
  z-index: 0;
}

.qRating .rating_upper {
  z-index: 1;
}

.qRating .rating_lower .rating_star,
.qRating .rating_upper .rating_star {
  box-sizing: border-box;
  float: left;
  display: inline-block;
  position: relative;
  opacity: 0;
}

.qRating .rating_lower .rating_star {
  opacity: .4;
}

.qRating .rating_upper .rating_star {
  transition: all 0s;
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -ms-transition: all 0s;
}

.qRating .rating_lower .rating_star span.inner,
.qRating .rating_lower .rating_star span.outer,
.qRating .rating_upper .rating_star span.outer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  box-sizing: border-box;
  padding: 10px;
}

.qRating .rating_upper .rating_star span.inner {
  display: none;
}

.qRating .rating_lower .rating_star span.outer,
.qRating .rating_upper .rating_star span.outer {
  padding: 2px;
}

.qRating .rating_lower .rating_star span.inner:before,
.qRating .rating_lower .rating_star span.outer:before,
.qRating .rating_upper .rating_star span.outer:before {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  box-sizing: border-box;
  border: 1px solid #fff;
  display: block;
}

.qRating .rating_upper .rating_star.touch span.outer:before {
  border: 9px solid #fff;
  opacity: .5;
}

.qRating .rating_upper .rating_star.selected.touch span.outer:before,
.qRating .rating_upper .rating_star span.outer:before {
  border: 9px solid #44c4a3;
}

.qRating .rating_upper .rating_star.selected,
.qRating .rating_upper .rating_star.touch {
  opacity: 1;
  transition: all .2s;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
}

.qRating .rating_labels {
  height: 60px;
  position: absolute;
  top: 90px;
  width: 100%;
}

.qRating .rating_labels .llabel,
.qRating .rating_labels .mlabel,
.qRating .rating_labels .rlabel {
  width: 33%;
  float: left;
  height: 60px;
  color: #fff;
  font-size: 1.8em;
  font-weight: 300;
  font-family: Roboto,sans-serif;
  box-sizing: border-box;
}

.qRating .rating_labels .llabel {
  text-align: left;
}

.qRating .rating_labels .mlabel {
  text-align: center;
}

.qRating .rating_labels .rlabel {
  text-align: right;
}

.slide::-webkit-scrollbar {
  display: none;
}

@media (max-width:990px) {
  #loading,
  #thankyou {
    padding: 20px;
  }

  #qre-slider {
    padding: 0 60px;
  }

  #authWrapper {
    padding: 60px 150px 60px 60px;
  }

  #authWrapper .authContent {
    padding: 60px;
  }

  .slide .qHelpText {
    max-width: 80%;
  }

@media (max-width:990px) {
    .qYesNo .input-radio {
      width: 40%;
    }

    .qDateGroup,
    .qMultiple .input-checkbox,
    .qMultiple .input-radio,
    .qSelect {
      width: 100%;
    }
}

@media (max-width:700px) {
    #qre-slider {
      padding: 0 20px 0 60px;
    }

    #authWrapper {
      padding: 40px 130px 40px 40px;
    }

    #authWrapper .authContent {
      padding: 40px;
    }

    .slide .qAnswer.fw {
      padding-right: 20px;
      box-sizing: border-box;
    }

    .slide .qHelpText {
      max-width: 100%;
    }

    .qYesNo .input-radio {
      width: 50%;
    }

    .qDateGroup,
    .qMultiple .input-checkbox,
    .qMultiple .input-radio,
    .qMultiple.many .input-checkbox,
    .qMultiple.many .input-radio,
    .qSelect {
      width: 100%;
    }

    .qMultiple .input-checkbox label,
    .qMultiple .input-radio label {
      line-height: 20px;
      padding-top: 10px;
      padding-bottom: 10px;
      height: auto;
      min-height: 40px;
      padding-right: 10px;
    }
}

@media (max-width:550px) {
    #qre-slider {
      padding: 0 10px 0 30px;
    }

    #authWrapper {
      padding: 20px 110px 20px 20px;
    }

    #authWrapper .authContent {
      padding: 20px;
    }

    .slide label.qGroup,
    .slide label.qQuestion {
      padding-left: 30px;
    }

    .slide label.qGroup span,
    .slide label.qQuestion span {
      left: 0;
      padding: 0 6px 0 0;
    }

    .slide label.qGroup {
      font-size: 2em;
    }

    .slide label.qGroup:after {
      left: 0;
    }

    .slide label.qGroup:before {
      display: none;
    }

    .qDateGroup .o-select .o-selected {
      padding-right: 30px;
      text-align: center;
    }

    .qDateGroup .o-select .o-selected:after {
      right: -40px;
    }

    .qDateGroup .o-select .o-selected:before {
      right: -17px;
    }
}
}

@media (max-height:650px) {
  .start #loading {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .start #loading-content .inner {
    overflow-y: visible!important;
  }

  #authWrapper .authContent,
  #loading #loading-content {
    padding-top: 30px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }

  #loading-content .inner {
    padding-bottom: 10px;
  }

  #alreadydone-content .inner .logo,
  #loading-content .inner .logo,
  #thankyou-content .inner .logo {
    max-width: 200px;
  }

  #qre-content #qre-slider .slide {
    height: 100%;
    margin: 0 auto;
    padding: 10px 0 0;
    overflow-y: scroll;
    opacity: 0;
  }

  #qre-content #qre-slider {
    height: 100%;
  }

  #qre-content #qre-slider .slide:after {
    display: none;
  }
}

@media (max-width:650px) and (min-width:550px) {
  .qQuestion {
    margin-left: 40px!important;
  }
}

@media (max-width:650px) {
  #alreadydone,
  #loading,
  #thankyou {
    padding: 62px 30px;
  }

  #alreadydone-content .inner h1,
  #loading-content .inner h1,
  #thankyou-content .inner h1 {
    font-size: 2em;
  }

  #loading-content .inner input[type=button] {
    padding: 10px 30px;
  }

  #alreadydone-content .inner .logo,
  #loading-content .inner .logo,
  #thankyou-content .inner .logo {
    max-width: 200px;
  }

  nav#blackbar {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 62px;
    background-color: hsla(0,0%,100%,.1);
    transition-delay: 0s;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
  }

  #qre-next,
  #qre-prev {
    position: fixed;
    box-sizing: border-box;
    display: block;
    height: 42px;
    width: 42px;
    top: 10px;
    bottom: auto;
    left: auto;
    margin: 0;
    opacity: .6;
    transition: none;
    background-color: hsla(0,0%,100%,0);
    border: 2px solid #fff;
    border-radius: 21px;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
  }

  #qre-next {
    right: 10px;
  }

  #qre-next,
  #qre-prev {
    transition: all 0s;
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -ms-transition: all 0s;
  }

  #qre-prev {
    left: 10px;
  }

  #qre-next.inactive,
  #qre-prev.inactive {
    display: none;
  }

  #qre-next:after,
  #qre-prev:after {
    height: 200px;
  }

  #poweredbyhugo {
    width: 42px;
    position: fixed;
    left: 50%;
    top: 15px;
    margin: 0;
    opacity: .6;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }

  #authWrapper,
  #loading {
    padding: 20px;
    font-size: .8em;
  }

  #authWrapper .authContent,
  #loading #loading-content {
    padding-top: 30px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }

  #loading-content .inner {
    padding-bottom: 10px;
  }

  #authWrapper .authClose {
    width: 32px;
    height: 32px;
    border-radius: 16px;
    background-color: rgba(0,0,0,.3);
    position: absolute;
    right: 10px;
    top: 10px;
    transform: rotate(45deg);
    transform-origin: 50% 50%;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: 50% 50%;
    -moz-transform: rotate(45deg);
    -moz-transform-origin: 50% 50%;
    opacity: .5;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -ms-transition: all .2s;
  }

  #authWrapper .authClose.touch {
    opacity: 1;
  }

  #authWrapper .authClose:after,
  #authWrapper .authClose:before {
    width: 18px;
    height: 2px;
    border-radius: 1px;
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -1px 0 0 -9px;
    content: "";
  }

  #authWrapper .authAfterMessage .authHugoSection,
  #authWrapper .authBeforeMessage .authHugoSection {
    padding: 10px;
  }

  #authWrapper .authAfterMessage,
  #authWrapper .authBeforeMessage {
    padding: 0 0 10px;
  }

  #authWrapper .authAfterMessage h1,
  #authWrapper .authBeforeMessage h1 {
    font-size: 6em;
  }

  #authWrapper .authSection.email {
    padding: 0 70px 0 0;
  }

  #authWrapper .authSection.email a {
    width: 70px;
  }

  #authWrapper .authSection.facebook a span,
  #authWrapper input[type=email] {
    font-size: 1.6em;
  }

  #qre-content {
    padding: 62px 0 5px;
  }

  #qre-content #qre-slider {
    height: 100%;
    position: relative;
  }

  #qre-content #qre-slider .slide {
    height: 100%;
    margin: 0 auto;
    padding: 10px 0 0;
    overflow-y: scroll;
    opacity: 0;
  }

  #qre-content #qre-slider .slide:after {
    display: none;
  }

  .qDateGroup .o-select.d,
  .qDateGroup .o-select.m,
  .qDateGroup .o-select.y {
    width: 33%;
  }

  .qDateGroup .o-select .o-selected {
    font-size: 1.4em;
    padding-left: 8px;
  }

  .o-wrapper {
    position: fixed;
    padding: 0 20px;
    width: 100%;
    bottom: auto;
  }

  ul.o-list {
    top: auto;
    bottom: 0;
  }

  .qRating .rating_lower .rating_star span.inner,
  .qRating .rating_lower .rating_star span.outer,
  .qRating .rating_upper .rating_star span.outer {
    padding: 5px;
  }

  .qRating .rating_upper .rating_star span.inner {
    display: none;
  }

  .qRating .rating_lower .rating_star span.outer,
  .qRating .rating_upper .rating_star span.outer {
    padding: 2px;
  }

  .qRating .rating_upper .rating_star span.outer:before {
    border: 4px solid #44c4a3;
  }

  #qre-progressBar {
    padding: 0;
  }

  #qre-progressPercentage #qre-progressLabel {
    display: none!important;
    opacity: 0!important;
  }

  .slide a.goNext.doneButton {
    height: 32px;
    height: 52px;
    line-height: 52px;
    display: block;
    margin: 5px 20px 0 0;
  }

  .slide a.goNext.doneButton span {
    padding: 0;
    width: 100%;
    height: 100%;
    font-size: 1.8em;
    text-align: center;
  }

  #error,
  .start #error {
    padding: 16px;
  }

  #error-content {
    padding: 10px 40px 10px 56px;
  }

  #error-icon {
    width: 32px;
    height: 32px;
    border-radius: 16px;
    background-color: #e00;
    color: #fff;
    font-size: 2em;
    font-family: Georgia;
    position: absolute;
    left: 10px;
    top: 50%;
    margin: -16px 0 0;
    line-height: 32px;
    text-align: center;
  }

  #error-content #error-message {
    width: 100%;
    padding: 10px 0;
  }

  #error-message p {
    font-size: 1.3em;
    line-height: 110%;
    font-weight: 300;
    color: #e00;
  }

  #qre-content #qre-slider .slide.required span.marker {
    top: 0;
    right: 0;
  }

  .slide label.qGroup,
  .slide label.qQuestion {
    font-size: 1.5em;
  }

  .slide label.qGroup span,
  .slide label.qQuestion span {
    margin-top: 0;
    font-size: .75em;
  }

  .qAnswer input[type=email],
  .qAnswer input[type=number],
  .qAnswer input[type=text],
  .qAnswer textarea {
    margin-right: 20px;
    padding: 10px 5px;
    padding-right: 5px;
    opacity: 1;
    background-color: hsla(0,0%,100%,.1);
    border-bottom: 1px solid #fff;
  }

  .qAnswer input[type=email]:focus,
  .qAnswer input[type=number]:focus,
  .qAnswer input[type=text]:focus,
  .qAnswer textarea:focus {
    padding: 10px 5px;
  }

  .qAnswer input[type=email],
  .qAnswer input[type=number],
  .qAnswer input[type=text],
  .qAnswer textarea {
    font-size: 16px;
  }

  .qAnswer textarea {
    min-height: 60px;
    max-height: 200px;
  }

  .slide .qHelpText {
    margin-right: 10px;
    font-size: 1.3em;
    line-height: 1.5;
    opacity: .7;
  }

  .slide .qHelpText.inGroupHead {
    font-size: .9em;
  }
}