#quiz>.row>.col{
width: 100%;
}

#quiz>.row>.col:nth-child(1){
margin-top:25px; 
}

#quiz>.row>.col:nth-child(1),
#quiz>.row>.col:nth-child(2){
margin-bottom:18px;
}

#quiz>.row>.col:nth-child(1)>img{
display:block;
margin:auto;
}

#quiz>.row>.col:nth-child(2)>div>h1{
font-size:1em;
line-height:1.14em;
text-transform: uppercase;
text-align:center;
}

#quiz ul::after{
clear: both;
display:table;
content:"";
}

#quiz ul>li{
float:left;
display:block;
width:50%;
}

#quiz ul>li>a{
transition: color  0.3s, border-color  0.3s, background-color 0.3s;
-moz-transition: color  0.3s, border-color  0.3s, background-color 0.3s;
-webkit-transition: color  0.3s, border-color  0.3s, background-color 0.3s;
-o-transition: color  0.3s, border-color  0.3s, background-color 0.3s;
-ms-transition: color  0.3s, border-color  0.3s, background-color 0.3s;
display:block;
text-align:center;
cursor: pointer;
border:1px dashed #FFF;
}

#quiz ul>li>a:hover{
border-color:#FFF;
background-color:#FFF;
}

body.theme-0 #quiz ul>li>a:hover{ color:#1DB8B2; }
body.theme-1 #quiz ul>li>a:hover{ color:#404898; }
body.theme-2 #quiz ul>li>a:hover{ color:#E7216D; }

#quiz ul>li:nth-child(1)>a,
#quiz ul>li:nth-child(3)>a{
margin-right:5px;
}

#quiz ul>li:nth-child(2)>a,
#quiz ul>li:nth-child(4)>a{
margin-left:5px;
}

#quiz ul>li:nth-child(1)>a,
#quiz ul>li:nth-child(2)>a{
margin-bottom:5px;
}

#quiz ul>li:nth-child(3)>a,
#quiz ul>li:nth-child(4)>a{
margin-top:5px;
}

#quiz ul>li>a>span{
width:84%;
display:inline-block;
line-height:1.05em;
font-size:0.86em;
vertical-align: middle;
}

@media (max-height:750px) {

#quiz ul>li>a{
line-height:110px;
height:110px;
}

#quiz>.row>.col:nth-child(1)>img{
max-height:50px;
max-width:70%;
}

#quiz>.row>.col:nth-child(2)>div>h1{
font-size:1em;
}

}

@media (min-width:719px) {

#quiz>.row>.col:nth-child(1),
#quiz>.row>.col:nth-child(2){
margin-top:50px;
margin-bottom:25px;
margin-left:0;
margin-right:0;
}

#quiz>.row>.col:nth-child(1){
min-height:110px;
}

#quiz>.row>.col:nth-child(2){
height:120px;
line-height:120px;
}

#quiz>.row>.col:nth-child(1)>img{
width:auto;
height:auto;
position:absolute;
max-height:110px;
max-width:78%;
right:25px;
top:50%;
transform:translateY(-50%);
-moz-transform:translateY(-50%);
-webkit-transform:translateY(-50%);
-o-transform:translateY(-50%);
-ms-transform:translateY(-50%);
}

#quiz>.row>.col:nth-child(2)>div{
line-height:90px;
height:90px;
border-left:1px dashed #FFF;
padding:10px 0 10px 25px;
}

#quiz>.row>.col:nth-child(2)>div>h1{
vertical-align:middle;
display:inline-block;
text-align:left;
font-size:1.375em;
vertical-align:middle;
}

#quiz ul>li>a{
height:82px;
line-height:82px;
}

#quiz>.row>.col:nth-child(3){
width:65%;
margin-left:25%;
}

#quiz>.row>.col:nth-child(1){
position:relative;
width:25%;
}

#quiz>.row>.col:nth-child(2){
width:65%;
}

}

@media (min-width:950px) {

#quiz>.row>.col:nth-child(2)>div>h1{
font-size: 1.7em;
}

#quiz ul>li>a>span{
font-size:0.93em;
}

#quiz>.row>.col:nth-child(1){
min-height:120px;
}

#quiz>.row>.col:nth-child(2){
height:130px;
line-height:130px;
}

#quiz>.row>.col:nth-child(1)>img{
max-height:120px;
}

#quiz>.row>.col:nth-child(2)>div{
line-height:100px;
height:100px;
}

}

@media (min-width:1023px) {

#quiz ul>li>a>span{
font-size:1em;
}

#quiz ul>li>a{
height:100px;
line-height:100px;
}

#quiz ul>li:nth-child(1)>a,
#quiz ul>li:nth-child(3)>a{
margin-right:8px;
}

#quiz ul>li:nth-child(2)>a,
#quiz ul>li:nth-child(4)>a{
margin-left:8px;
}

#quiz ul>li:nth-child(1)>a,
#quiz ul>li:nth-child(2)>a{
margin-bottom:8px;
}

#quiz ul>li:nth-child(3)>a,
#quiz ul>li:nth-child(4)>a{
margin-top:8px;
}

}

@media (orientation:portrait) {

#quiz ul>li>a{
height:110px;
line-height:110px;
}

}

@media (orientation:portrait) and (min-height:750px) {

#quiz>.row>.col:nth-child(1)>img{
max-height:80px;
max-width:70%;
}

#quiz ul>li>a{
height:110px;
line-height:110px;
}

}

#quiz .question{
display:none;
}

#quiz .question.current{
display:block;
}

#quiz ul.question-style-emojis>li {
width:25%;
}

#quiz ul.question-style-emojis>li>a{
margin:auto;
width:90px;
height:90px;
border-radius:50%;
line-height: normal;
padding:14px;
}

#quiz ul.question-style-emojis>li>a>span{
margin:0;
padding:0;
background: url('./../img/emojis.svg') 0 50% no-repeat;
width:60px;
height:60px;
}

#quiz ul.question-style-emojis>li:nth-child(1)>a>span{
background-position: -0px 50%;
}

#quiz ul.question-style-emojis>li:nth-child(2)>a>span{
background-position: -70px 50%;
}

#quiz ul.question-style-emojis>li:nth-child(3)>a>span{
background-position: -140px 50%;
}

#quiz ul.question-style-emojis>li:nth-child(4)>a>span{
background-position: -210px 50%;
}

@media (max-width:480px) {

#quiz ul.question-style-emojis>li {
width:50%;
}

#quiz ul.question-style-emojis>li>a{
margin:14px auto;
}

}

#bubble{
position:absolute;
width:110px;
height:160px;
right:0;
bottom:0;
background-repeat: no-repeat;
}

body{
padding-bottom:166px;
}

#bubble.bubble-0{
background-image: url("./../img/bubble-0.png");
background-position: 10% -90%;
}

#bubble.bubble-1{
background-image: url("./../img/bubble-1.png");
background-position: 0% 0%;
}

#bubble>ul>li{
  display:none;
  position:absolute;
}

#bubble>ul>li>span {
font-family: lobster;
  color:#C0C0C0;
}

#bubble>ul>li{
  top:80px;
  width:180px;
  right:150px;
  text-align:right;
}

#bubble>ul:after{
  content: "";
  height:1px;
  width:40px;
  position:absolute;
  right:100px;
  top:100px;
  transform:rotate(19deg);
  -moz-transform:rotate(19deg);
  -webkit-transform:rotate(19deg);
  -o-transform:rotate(19deg);
  -ms-transform:rotate(19deg);
  display:block;
  background:#AFAFEF;
}