@font-face {
font-family: Futura;
src: url('Futura_Book_Regular.otf');
format("opentype");
}
body {
	background-color: lightgrey;
	font-family: Futura sans-serif;
}
#content-wrapper {
	border-style: solid;
	border-width: 1px;
	background-color: white;
}
.content {
	width: 100%;
}
.active {
	display: block;
}
.inactive {
	display: none;
}
#welcome-page {
	text-align: center;
	margin-top: 1.2em;
}
#header {
	text-align: center;
}
.title {
	text-align: center;
}
.question_number {
	text-align: right;
}
.bi-play-fill:hover {
    cursor: pointer;
}
textarea {
	width:100%;
}
input[type="radio"] {
  margin-right: 5px;
}
input[type="checkbox"] {
  margin-right: 5px;
}
.slider { 
	margin: 10px;
 }
 .slider_number {
	 border: solid 1px black;
	 padding: 4px;
	 width: min-content;
 }
 .underline {
	text-decoration: underline;
 }
 .no-border {
	 border: none;
 }
 
 span.f {   
	-moz-box-orient:vertical;   
	display:inline-block;    
	vertical-align:middle;    
	margin:0 0.2em;  
} 
.bruchstrichoben {
	display: block;
	text-align:center; 
	margin:0 0.2em; 
	border-bottom:solid 1px navy;
} 
.bruchstrichmitte {
	display: block; 
	text-align:center;   
	margin:0 0.2em; 
	border-bottom:solid 3px; 
}
.bruchstrichunten {
	display: block;  
	text-align:center;  
	margin:0 0.2em; 
}

.bruchstrichmitte input,
.bruchstrichunten input{
	width: 50px;
}

.sequence {
		text-align: center;
		font-weight: bold;
}

.small-text {
	font-size: smaller;
}
.normal-text {
	font-size: medium;
}

.center {
	text-align: center;
}

.welcome {
	text-align: justify;
}

canvas {
	background: #FFF;
	display: block;
	margin: 40px auto 10px;
	border-radius: 5px;
	border-left: 1px solid #E0E0E0;
	border-right: 1px solid #E0E0E0;
	border-top: 1px solid #E0E0E0;
	box-shadow: 0 4px 0 0 #E0E0E0;
	cursor: url(../media/cursor.png), crosshair;
}

.remainingQuestion {
	border: 2px solid red;
	padding: 3px;
	margin-left: -3px;
}

.singletext {
	text-align: center;
}