/*-------
// global reset
//-----*/
* {
    margin: 0;
    padding: 0;
}
canvas {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}
html {
	border: 0;
	outline: 0;
	background: transparent;
}
/*-------
// general
//-----*/
body {
    background-color: #f4f4f9;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    width: 100%;
    max-height: 100%;
}
.centered {
    width: 100%;
    max-height: 100vh;
    text-align: center;
}
h1 {
    font-size: 1.5em;
}
h2 {
    font-size: 1.4em;
}
h3 {
    font-size: 1.3em;
}
h4 {
    font-size: 1.25em;
}
h4 {
    font-size: 1.2em;
}
h5 {
    font-size: 1.1em;
}
h6 {
    font-size: 1em;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    color: indigo;
}
p {
	text-align: justify;
}
table {
    border-spacing: 0;
}
select {
	font-family: inherit;
    font-size: 1em;
    border: 0.063em solid #C0C0C0;
	-webkit-border-radius: 0.313em;
    border-radius: 0.313em;
	padding-left: 0.313em;
    vertical-align: top;
}
button,
input {
    font-size: inherit;
	text-align: left;
	text-decoration: none;
	width: 6.25em;
	margin: 0;
    border: 0.063em solid #C0C0C0;
	-webkit-border-radius: 0.313em;
    border-radius: 0.313em;
    touch-action: manipulation;
}
button,
input[type=submit] {
	text-align: center;
    height: 1.5em;
	background-color: indigo;
    color: white;
	border: none;
	text-decoration: none;
    width: 100%;
	cursor: pointer;
    transition: background-color 0.3s ease;
}
button:hover,
input[type=submit]:hover {
    background-color: #7000C3;
}
button:active,
label {
    display: inline-block;
	font-family: inherit;
    text-align: left;
    height: 1em;
    padding-bottom: 0.5em;
    vertical-align: middle;
}
.emoji {
    font-size: 0.86em;
    padding-bottom: 0.85em;
}
input[type=email],
input[type=number],
input[type=text] {
    padding-left: 0.313em;
    flex-grow: 1;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}
input[type=submit]:active {
    background-color: #380061;
}
input[type=checkbox] {
    appearance: none;
    width: 1.125em;
    height: 1.125em;
    border-radius: 0.125em;
    background-color: #FFFFFF;
    cursor: pointer;
    vertical-align: middle;
    position: relative;
}
input[type=checkbox]:checked {
    background-color: #007BFF;
    border-color: #007BFF;
}
input[type=checkbox]:checked::before {
    content: "\2713";
    font-size: 0.938em;
    color: #FFFFFF;
    position: absolute;
    transform: translate(25%, -8%);
}
input[type=radio] {
    bottom: 0.125em;
}
.checkboxes {
    margin: 0 auto;
}
label {
    padding-left: 0.25em;
    cursor: pointer;
    vertical-align: middle;
}
.label-textbox {
    padding: 0.125em 0 0 0;
}
.section {
    background-color: white;
    padding: 10px;
    min-width: 355px;
    max-width: 400px;
    margin: 0 auto 0.938em auto;
    border-radius: 0.5em;
    box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);
}
.section-group {
    display: flex;
}
.form-group {
    display: flex;
    margin-bottom: 0.75em;
}
#footer {
    display: block;
    line-height: 1.625em;
    padding: 0.15em 0;
    margin-bottom: 0;
    margin-left: calc(env(safe-area-inset-left) + 2.188em);
    margin-right: calc(env(safe-area-inset-right) + 2.188em);
    bottom: 0;
}
.footer-group {
    font-size: 1em;
    background-color: white;
    border-bottom: 0.25em solid #f4f4f9;
    display: inline-block;
    padding: 0.15em 0;
    border-radius: 0.5em;
}
.checkbox-group {
    width: 22.5em;
    display: inline-flex;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}
.bold {
    font-weight: bold;
}
.fault {
    color: red;
}
.chart {
    box-sizing: border-box;
    display: inline-block;
}
.externallink, .fullscreen {
	vertical-align: baseline;
}
#fullscreen_exit, #fullscreen_enter {
    display: none;
    position: fixed;
    bottom: 0.313em;
    right: 0.313em;
    font-size: 1.25em;
    border: 0;
    outline: none;
    cursor: pointer;
    padding-right: env(safe-area-inset-right);
}
.arrow {
    border: solid black;
    border-width: 0 0.125em 0.125em 0;
    display: inline-block;
    padding: 0.188em;
    transform: rotate(-45deg) translate(0em, -0.125em);
    -webkit-transform: rotate(-45deg) translate(0em, -0.125em);
}
.optional::after {
    content: " (Optional)";
    font-style: italic;
    font-size: 0.75em;
}
.required::after {
    content: "*";
    color: rgba(255, 0, 0, 1);
}
