:root{
	--zeilenhoehe: 9vH;
	--hgfarbe: darkblue;
	--vgfarbe: lightgrey;
}

body{
	margin:0;
	background-color: var(--hgfarbe);
	color:  var(--vgfarbe);
	font-family: sans-serif;
}

textarea{
	width:48vW;
	height:75vH;
}


textarea#eingabe{
	color: red;
}

button,input{
	min-width:6em;
	height:5em;
}

button#convertButton{
	color: red;
}

text{
	font-family: sans-serif;
	font-size: var(--zeilenhoehe);
	text-anchor: middle;
	fill: var(--vgfarbe);
	dominant-baseline:ideographic;
}

div#projection{
	width:98vW;
	height:100vH;
	margin:0 auto;
}

div#steuerung{
	display: flex;
	justify-content: center;
	gap: 0.5vW;
	width:98vW;
	height:100vH;
	margin:0 auto;
}

div#markierungsDiv{
	position:relative;
	top: -0.5em;
	background-color: buttonface;
	display: inline-block;
	visibility: hidden;
}

div#tooltip{
	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width:100%;
	height: 10vH;
	background-color:var(--hgfarbe);
	color: var(--vgfarbe);
	box-sizing: border-box;
	border: 1px solid var(--vgfarbe);
	align-items: center;
	justify-content: center;
}

select{
	padding:1.8em;
	background-color: buttonface;
}

label{
	font-family: sans-serif;
	font-size:0.8em;
	padding:2em;
	color: black;
	background-color: buttonface;
//	border: 1px solid var(--vgfarbe);
	display: inline-block;
	cursor: pointer;
}

input{
	display:none;
}

svg{
//	border:1px solid red;
	background-color: var(--hgfarbe);
}