body{
	font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica,
            Arial, sans-serif, "Apple Color Emoij", "Segoe UI Emoji","Segoe UI Symbol";
	font-size: 115%;
    background-color:  #FAFAFA;
    color: black;	
	display: flex;
	justify-content: center;
}

#appcontainer{
 color:black;	
 position: relative;
 background-color: #FAFAFA; 
 text-align: center;
 width: 100%;
 height: 18em;
}

#spracheauswaehlen{
	position: absolute;
	padding-top: 5px;
	top: 0%;
	left: 1%;
	/*border: solid rgb(0, 0, 0) 1px;*/
    border-radius: 6px;
	height: 2.8em;
	width: 97%;
	background-color: white;
	
}

.clAuswahlsprache{
	 font-size: 115%;
	 height: 2.3em;
}

#schalter{
	position: absolute;
	/*border: solid rgb(0, 0, 0) 1px;*/
    border-radius: 6px;
	padding-top: 10px;
	top: 20.0%;
	left: 1%;
	height: 2.6em;
	width: 97%;
	background-color: white;
}

#fremdsprache{
	position: absolute;
    border-radius: 6px;
	padding-top: 5px;
	font-size: 100%;
	height: 2.8em;
	width: 97%;
	left: 1%;
	top: 40.2%;
	background-color: white;
}

#deutsch{
	position: absolute;
	font-size: 100%;
	/*border: solid rgb(0, 0, 0) 1px;*/
    border-radius: 6px;
	padding-top: 5px;
	height: 88px;
	width: 97%;
	top: 60.2%;
	left: 1%;
	background-color: white;
}

#nachricht{
	position: relative;
	font-size:100%;
	height: 3em;
	/*border: solid rgb(0, 0, 0) 1px;*/
    border-radius: 6px;
	top: 91.2%;
	left: 1%;
	width: 97%;
	background-color: white;
}


#start {
	display: flex;
	position: absolute;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	top: 8.00%;
	left: 2.00%;
	width: 20.00vw;
	height: 48px;
	color: white;
	background-color: #6200EE;
	overflow: hidden;
	font-family: Verdana, sans-serif;
	padding: 0px;
	margin: 0px;
}

#weiter {
	display: flex;
	position: absolute;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	top: 8.00%;
	left: 78.00%;
	width: 20.00%;
	height: 48px;
	color: white;
	background-color: #6200EE;
	overflow: hidden;
	font-family: Verdana, sans-serif;
	padding: 0px;
	margin: 0px;
}



#schalterueberpruefen{
	display: flex;
	position: absolute;
	align-items: center;
	justify-content: center;
	top: 35%; 
	left: 69.00%;
	width: 28.00%;
	height: 48px;
	color: white;
	background-color: #6200EE;
	/*border: solid rgb(0, 0, 0) 2px;*/
	overflow: hidden;
	font-family: Verdana, sans-serif;
	padding: 0px;
	margin: 0px; 
}

.classeingabefeldantwortdeutsch{
	position: relative;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:120%;
	color: #000000;
	background-color: #F1F7FF;
	top: 5%;
	width: 30vw;
	height: 48px;
}

/* Barrierefreiheit für Menschen mit Sehbehinderung */
#IdAuswahlsprache:focus{background-color: yellow; color: black}
#start:focus{background-color: yellow;}
#weiter:focus{background-color: yellow;}
#schalterueberpruefen:focus{background-color: yellow;}
#ideingabefeldantwortdeutsch:focus{background-color: yellow;}


/****************************************************************** 
*                          Media Queries                          *
*******************************************************************/


@media only screen and (min-width: 768px){ /*Ipad Ipad 2 Ipad Mini / Kleine Tablets
	
/* Schalter anpassen */


#start {
	height: 60px;
}

#weiter {
	height: 60px;
}

#schalterueberpruefen{
	
	top: 27%; 
	height: 60px;
}



/* Div-Container anpassen */



#spracheauswaehlen{
	
	height: 2.8em;
}


#schalter {
	height: 3.3em;
	top: 20.5%;
}

#fremdsprache{
	height: 1.3em;
	top: 45.0%;
}

#deutsch{
	height: 86px;
	top: 57.0%;
}

#nachricht{
	top: 88.0%;
}

}

@media only screen and (max-width: 394px){ /*iPhone 12 pro*/

#ideingabefeldantwortdeutsch{
	width: 30vw;
	left: -10px;
	
}

#schalterueberpruefen{
	left: 66.00%;
	width: 32.00%;
}

}