body {
	font-family: helvetica;
	margin: 0;
	padding: 0;
	height: 100%;
}

@media only screen and (min-width: 600px) {
	body {
		max-width: 500px;
		margin: auto;
	}
}

fieldset {
	width: 95%;
	margin-top: 0.2em;
	margin-bottom: 0.2em;
	border-radius: 10px;
	box-shadow: 2px 2px grey;
}

legend {
	font-size: 1.5em;
	font-weight: bold;
	font-variant: small-caps;
	color: darkblue;
}

#headline {
	font-weight: bold;
	display: block;
	width: 100%;
	margin: 0px;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	background-color: green;
	color: white;
	text-align: center;
}

.container {
	background-color: white;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0.1em;

	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.button {
	background-color: whitesmoke;
	padding: 0.2em;
	margin-top: 0.3em;
	margin-bottom: 0.3em;

	line-height: 1.5em;

	font-size: 1.4em;
	font-variant: small-caps;
	text-align: center;
	
	cursor: pointer;
	border-radius: 10px;
	box-shadow: 2px 2px grey;
	color: black;
	max-width: 95%;
}

@media not (hover: none) {
	.button:hover {
		background-color: lemonchiffon;
	}
}

.duty {
	background-color: mistyrose;
}

.btn_select {
	border: solid 1px green;
	background-color: lightgreen;
}

.button_group {
	display: flex;
	justify-content: space-between;
	width: 100%;
	gap: 0.2em;
}

.button_group div {
	flex: 1 1 auto;
}

.flexspacer {
	max-width: 20px !important;
}

.map {
	height: 180px;
	background-color: whitesmoke;
	display: block;
	cursor: crosshair;
}

.foto {
	/* max-width: 200px; */
	height: 150px;
	width: 98% !important;
	background-color: mistyrose;
	display: flex;
	cursor: grab;
}

.foto_icon {
	text-align: center;
	vertical-align: center;
	line-height: 75px;
	color: darkred;
	flex: 1 1 auto;
	margin: 1em;
}


#foto_img {
	display: block;
	max-width: 200px;
	max-height: 150px;
	margin: auto;
}

#data_foto_cam,#data_foto_mem {
	display: none;
}

label {
	padding: 0.2em;
	margin-top: 0.2em;
	margin-bottom: 0.2em;

	font-size: 0.8em;
	font-variant: small-caps;
	font-weight: bold;
	color: darkred;
}

label input,textarea {
	background-color: mistyrose;
	display: block;
	font-size: 1.9em;
	padding: 0.2em;
	border: none;
	width: 95%;
	border-radius: 10px;
	box-shadow: 2px 2px grey;
	color: black;
}

label#data_melder_lbl div {
	/*display: flex;
	flex-wrap: wrap;*/
}

.inp_ok {
	background-color: lightgreen;
}

.inp_nok {
	background-color: red;
}

.navigation {
	display: flex;
	flex-wrap: wrap;
	
	width: 100%;
	position: absolute; 
	bottom: 1.8em; 
	height: 1.8em;
}

.single {
	flex: 1 1 auto;
	width: 100%;
}

.grow {
	flex-grow: 1;
}

.hidden {
	display: none;
}

#credit {
	width: 100%;
	text-align: center;
	font-size: 0.75em;
	font-family: monospace;
}

#data_meldung {
	background-color: whitesmoke;
}

.bullet {
	color: lightgreen; 
	width: 1.5em;
	text-align: center;
}

.darkred {
	color: darkred; 
}

.red {
	color: red; 
}

.green {
	color: darkgreen; 
}

.center {
	text-align: center;
}

.bold {
	font-weight: bold;
	font-size: 1.2em;
}