body{
font-family: 'Montserrat',sans-serif;
padding-bottom:50px;
}

#header{
position:relative;
z-index:99999;
}

#section,
#footer,
#header{
padding:15px 25px 15px 25px;
}

#footer{
position:absolute;
bottom:0;
left:0;
right:0;
}

#section{
min-height:70px;
padding-top:0!important;
padding-bottom:0!important;
}

#header>.row>.col:nth-child(1),
#header>.row>.col:nth-child(3){
width:25%;
}

#header>.row>.col:nth-child(2){
width:50%;
position:relative;
}

#header>.row>.col:nth-child(1)>a,
#header>.row>.col:nth-child(2)>a,
#header>.row>.col:nth-child(3)>a{
display:block;
line-height:70px;
height:70px;
}

#header>.row>.col:nth-child(1)>a>*,
#header>.row>.col:nth-child(2)>a>*,
#header>.row>.col:nth-child(3)>a>*{
display:inline-block;
vertical-align:middle;
}

#header>.row>.col:nth-child(1)>a{
text-align:left;
}

#header>.row>.col:nth-child(2)>a{
text-align:center;
}

#header>.row>.col:nth-child(3)>a{
text-align:right;
}

#header>.row>.col:nth-child(1)>a>img,
#header>.row>.col:nth-child(3)>a>img{
display:inline-block;
max-height:85%;
max-width:85%;
}

#title-text{
font-size:0.7em;
text-transform: uppercase;
}

@media (min-width:450px){
#title-text{
font-size:0.85em;
}
#header>.row>.col:nth-child(1)>a,
#header>.row>.col:nth-child(3)>a{
text-align:center;
}
}

@media (min-width:590px){
#title-text{
font-size:0.9em;
}
}

@media (min-width:660px){
#title-text{
font-size:1em;
}
}

@media (min-width:710px){
#title-text{
font-size:1.05em;
}
}

@media (min-width:800px){
#title-text{

}
}

#steps-line{
position:absolute;
bottom:-12px;
height:2px;
background:#FFF;
left:0;
right:0;
}

#steps-line>li{
border-radius:50%;
display:block;
width:12px;
height:12px;
border:1px solid #FFF;
background:cadetblue;
position:absolute;
margin-left:-6px;
margin-top:-6px;
}

@media (min-width:700px){
#steps-line{
bottom:-19px;
}
}

@media (min-width:700px){
#steps-line{
bottom:-21px;
}
}

body:not(.view-quiz) #steps-line>li{
display:none;
}

body:not(.view-quiz) #steps-line>li:nth-child(1),
body:not(.view-quiz) #steps-line>li:nth-child(6){
display:block;
background:#FFF;
}

#steps-line>li:nth-child(1){
left:0%;
}

#steps-line>li:nth-child(2){
left:20%;
}

#steps-line>li:nth-child(3){
left:40%;
}

#steps-line>li:nth-child(4){
left:60%;
}

#steps-line>li:nth-child(5){
left:80%;
}

#steps-line>li:nth-child(6){
left:100%;
}

#steps-line>li.complete{
background:#FFF!important;
}

body.theme-0 #steps-line>li{background-color:#1DB8B2;}
body.theme-1 #steps-line>li{background-color:#404898;}
body.theme-2 #steps-line>li{background-color:#E7216D;}

#footer{
font-size:0.6em;
text-align:center;
}

#footer a{
cursor: pointer;
}

#footer a:hover{
text-decoration:underline;
}

@media (min-width:960px){
#section,
#header,
#footer{
width:910px;/* 960 = 910 + 2*25 (padding) */
margin:auto;
}
}

@media (min-width:1024px){
#section,
#header,
#footer{
width:974px;/* 1024 = 974 + 2*25 (padding) */
margin:auto;
}
}

@media (min-width:1150px){
#section,
#header,
#footer{
width:1100px;/* 1150 = 1100 + 2*25 (padding) */
margin:auto;
}
}

#popup{
display:none;
position:fixed;
top:0;
bottom:0;
right:0;
left:0;
overflow: hidden;
font-size:0.9em;
z-index:999999;
}

body.popup-mode{
overflow: hidden;
}

body.popup-mode #popup{
display:block;
}

#popup>:nth-child(1){
position:absolute;
top:0;
bottom:0;
right:0;
left:0;
background:#222;
opacity:0.6;
}

#popup>:nth-child(2) {
position: absolute;
background:#1DB8B2;
top:0;
bottom:0;
right:0;
left:0;
overflow: auto;
}

#popup>:nth-child(2)>.row{
padding:25px;
}

#popup>:nth-child(2)>.row:nth-child(1){
padding-bottom:0;
}

#popup>:nth-child(2)>.row:nth-child(2){
padding-top:0;
padding-bottom:0;
}

#popup>:nth-child(2)>.row:nth-child(1)>.col,
#popup>:nth-child(2)>.row:nth-child(2)>.col,
#popup>:nth-child(2)>.row:nth-child(3)>.col{
width:100%;
}

#popup p{
font-size:0.85em;
}

#popup h1{
font-size:1.4em;
text-transform: uppercase;
font-weight: 600;
margin-bottom:13px;
padding-bottom:13px;
border-bottom: 1px dashed #FFF;
}

#popup>:nth-child(2)>.row:nth-child(3)>.col:nth-child(1)>a{
transition: background-color 0.34s , color 0.34s;
display:inline-block;
padding:0.31em 0.56em;
border:1px dashed #FFF;
font-size:1.1em;
cursor: pointer;
}

#popup>:nth-child(2)>.row:nth-child(3)>.col:nth-child(1)>a:hover{
border-style:solid;
color:#1DB8B2;
background-color:#FFF;
}

#popup>:nth-child(2)>.row:nth-child(2)>.col:nth-child(2)>p{
margin-top:13px;
}

@media (min-width:490px){

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

#popup>:nth-child(2)>.row:nth-child(2)>.col:nth-child(1)>p{
padding-right:13px;
}

#popup>:nth-child(2)>.row:nth-child(2)>.col:nth-child(2)>p{
margin-top:0;
padding-left:13px;
}

}

@media (min-width:760px) and (min-height:432px) {

#popup {
font-size:1em;
}

#popup>:nth-child(2)>.row{
padding:25px;
}

#popup>:nth-child(2) {
width:760px;
max-height:432px;
bottom:auto;
right:auto;
left:50%;
top:50%;
transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
}

}