@font-face {
    font-family: "GT-America";
    src: url('fonts/GT-America-Standard-Regular.otf');
    font-weight: normal;
}

@font-face {
    font-family: "GT-America";
    src: url('fonts/GT-America-Condensed-Black.otf');
    font-weight: bold;
}

html, body {
    width:100vw;
	height:100%;
    overflow-x:hidden;
    /* overflow:hidden; /* disables bouncy scroll / overscroll in iOS */
}

html {
    font-family: "GT-America", verdana, arial, sans-serif;
    background:#00326e;
	color:white;
}

body {
    background-size:cover;
    background-position:center bottom;
}

h1, h2, h3, h4 {
    font-weight:bold;
    line-height:1;
    margin:0 5vmin;
}

h1 {
    font-size:8vmin;
}

h2 {
    font-size:7vmin;
}

h3 {
    font-size:6vmin;
    line-height:1;
}

p {
    font-size:4.5vmin;
    line-height:1.3;
    margin:0 10vmin;
    display:inline-block;
}

div.topbar {
    position:absolute;
    left:0;
    top:0;
    width:100vw;
    height:16vmin;
    background:white;
    text-align:center;
    z-index:3;
}

div.topbar > img {
    height:8vmin;
    margin-top:4vmin;
}

button,
input[type=text],
input[type=email],
input[type=tel],
input[type=password],
input[type=number],
select {
    width:90vmin;
    height:13vmin;
    background:#f5821e;
    color:white;
    font-size:4.5vmin;
    position:relative;
    display:inline-block;
}

button:disabled,
input:disabled {
    opacity:0.5;
}

div.page {
    padding-top:16vmin;
    padding-bottom:5vmin;
}

div.page.moving {
    overflow-y:hidden;
}

/* WELCOME */

div.page[data-name=welcome] h1 {
    margin-top:12vmin;
}

div.page[data-name=welcome] p {
    margin-top:8vmin;
}

div.page[data-name=welcome] button {
    margin-top:10vmin;
}

/* QUESTION */

div.page[data-name=question] p {
    margin-top:8vmin;
}

div.page[data-name=question] p.question {
    margin-top:6vmin;
}

div.progress {
    height:2.5vmin;
    width:0;
    background:#f5821e;
}

button.option {
    height:auto;
    min-height:12.5vmin;
    line-height:1.5;
    padding:3vmin 5vmin;
    margin-top:5vmin;
    font-size:3.5vmin;
}

/* RESULT */

div.page[data-name=result] h1 {
    margin-top:6vmin;
    margin-bottom:4vmin;
}

div.page[data-name=result] p {
    margin:2vmin 10vmin;
}

div.page[data-name=result] button {
    margin-top:10vmin;
}