@font-face {
	font-family: "Source Sans";
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	src: url("sourcesans-regular.woff") format("woff");
}

@font-face {
	font-family: "Source Sans";
	font-weight: normal;
	font-style: italic;
	font-variant: normal;
	src: url("sourcesans-italic.woff") format("woff");
}

@font-face {
	font-family: "Source Sans";
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	src: url("sourcesans-bold.woff") format("woff");
	src: url("sourcesans-bold.woff") format("woff");
}

body {
	margin: 0;
	padding: 0;
}

a {
	color: rgb(75, 155, 65);
	text-decoration: none;
}

header {
	display: block;
	background: rgb(75, 155, 65);
	padding: 12px 18px 15px 18px;
	clear: both;
}

header p {
	margin: 0;
	color: rgb(255, 255, 255);
}

header a {
	color: rgb(255, 255, 255);
}

header a strong {
	text-decoration: underline;
}

main {
	display: block;
	box-sizing: border-box;
}

nav {
	display: block;
	background: #d2e6cf;
	background: rgba(75, 155, 65, 0.25);
	margin: 25px 0 0 0;
	padding: 18px;
}

article {
	xxmargin: 25px 0 0 0;
}

section {
	position: fixed;
	right: 0;
	top: 0;
	width: 25%;
	overflow-y: scroll;
	height: 100%;
	box-sizing: border-box;
	padding: 18px;
	background: rgb(35, 75, 30);
}

section p, section h1, section h2, section h3, section ul li {
	color: rgb(255, 255, 255);
}

section h2, section h3 {
	font-weight: bold;
}

section div.kopf h2 {
	float: left;
}

section div.kopf h2 + p {
	float: right;
}

section div.kopf {
	clear: both;
	height: 36px;
	margin: 0 0 18px 0;
}

aside {
	box-sizing: border-box;
	margin: 25px;
	width: calc(100% - 50px);
	height: 50px;
	background: url("kopf.svg") no-repeat;
}

aside div {
	float: left;
	margin: 14px 0 0 0;
}

aside div + div {
	float: right;
	margin-top: -10px;
}

aside div + div ul {
	float: left;
	margin-bottom: 0;
}

aside div + div p {
	margin: 5px 7px 0 0;
}

aside form {
	xxfloat: right;
}

header p {
    margin-top: 5px;
    margin-right: 15px;
}

header, header form {
    display: flex;
    height: 30px;
}

header form button {
    margin: 0 0 0 5px;
    padding: 0;
}

h1, h2, h3, p, ul, ol, li, table, td, th, label, input, textarea, div.eingabe, select, option, button, legend, span, figcaption {
	font: normal normal 15px/18px "Source Sans", sans-serif;
	text-align: left;
	vertical-align: top;
}

form {
	margin: 0;
}

input, textarea {
	outline: none;
}

legend {
	color: rgb(75, 155, 65);
}

h1, h2, h3, p, ul, ol, li, table {
	margin: 0 0 18px 0;
}

h2 {
	font-weight: bold;
}

ul {
	padding-left: 18px;
}

button {
	background: rgb(75, 155, 65);
	color: rgb(255, 255, 255);
	margin: 0 0 18px 0;
	padding: 5px 7px 5px 7px;
	border: none;
}

button.passiv {
	background: rgba(75, 155, 65, 0.5);
}

table {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	margin: 0 0 18px 0;
}

table th {
	font-weight: bold;
	text-overflow: ellipsis;
	overflow: hidden;
}

table th a {
	color: rgb(255, 255, 255);
}

table th a span.sortierung {
	display: inline-block;
	width: 5px;
	height: 11px;
	background: url("icon_sortierung_auf.svg") no-repeat top right;
	margin: 3px 0 0 4px;
}

table th a span.sortierung.ab {
	background-image: url("icon_sortierung_ab.svg");
}

table tr:nth-child(odd) td, table tr:nth-child(odd) th {
    background: rgba(75, 155, 65, 0.1);
}

table tr:nth-child(odd) td, table tr:nth-child(odd) th {
    background: rgba(75, 155, 65, 0.1);
}

table tr + tr td, table tr + tr th {
    border-top: 1px solid rgb(75, 155, 65);
}

table tr.erledigt td {
    background-color: rgba(75, 155, 65, 0.5);
}

table tr.erledigt td, table tr.erledigt td span {
  font-style: italic;
}

table tr.aktuell {
    outline: 3px solid red;
    outline-offset: -3px;
}

table thead tr:nth-child(odd) th {
	background: rgb(75, 155, 65);
	color: rgb(255, 255, 255);
}

table tr td, table tr th {
    padding-top: 8px;
    padding-left: 9px;
    padding-right: 9px;
}

table tr td, table tr th {
    padding-bottom: 9px;
}

/*table td span {
	display: inline-block;
	border-radius: 100%;
	height: 11px;
	width: 11px;
	margin: 3px 7px 0 0;
}*/

table td > span {
	display: flex;
    flex-direction: row;
}

table td > span img {
	margin: 0 5px 0 0;
}

table td > span span {
	margin: 5px 0 0 0;
}

table td {
	text-overflow: ellipsis;
	overflow: hidden;
}

table tr:target td {
    font-weight: bold;
}

table ~ p {
	padding-left: 9px;
    padding-right: 9px;
}

nav ul, ul.nav {
	margin: 0 0 0 -7px;
	padding: 0;
}

ul.nav {
	margin: 0 0 18px 3px;
}

nav ul li, ul.nav li {
	display: inline-block;
	margin: 0 0 0 7px;
}

nav ul li a, ul.nav li a {
	display: inline-block;
	border: 1px solid rgb(75, 155, 65);
	padding: 4px 6px 4px 6px;
}

nav ul li strong a, ul.nav li strong a {
	background: rgb(75, 155, 65);
	color: rgb(255, 255, 255);
}

nav li span {
	display: inline-block;
	background: rgb(255, 120, 0);
	color: rgb(255, 255, 255);
	border-radius: 100%;
	text-align: center;
	margin-left: 4px;
	padding: 0 5px 0 5px;
}

label, input, textarea, button {
	display: block;
	width: 100%;
	max-width: 400px;
	margin: 8px 0 8px 0;
}

input, textarea, button {
	padding: 10px;
}



div.karte {
	left: 0;
	width: 100%;
	height: 285px;
}

#anmeldung {
	margin: 0 4px 0 4px;
}






fieldset table tr:nth-child(odd) td {
	background: none;
}

fieldset table tr td:first-child {
	width: 180px;
}

div.fotos {
	overflow: scroll;
	display: flex;
	margin: 0;
	background: rgba(100, 80, 70, 0.25);
}

#zoom {
	position: absolute;
	display: none;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgb(75, 155, 65, 0.75);
	z-index: 9;
}

#zoom img {
	position: absolute;
	width: 100%;
	top: 50%;
  	transform: translateY(-50%);
}

div.adresse {
	margin: 0 0 10px 0;
	padding: 10px;
	background: rgba(100, 80, 70, 0.25);
}

div.adresse p:last-child {
	margin: 0;
}


#schritt0, #schritt1, #schritt2, #schritt3, #schritt4, #schritt5 {
	padding: 0 10px 0 10px;
}

#schritt2, #schritt3, #schritt4, #schritt5 {
	display: none;
}

div.kamera {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgb(0, 0, 0);
	z-index: 10;
}

div.kamera video, div.kamera canvas {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

div.kamera canvas {
	object-fit: contain;
}

div.kamera button.ausloeser {
	position: absolute;
	left: 50%;
	bottom: 10px;
	margin-left: -50px;
	width: 100px;
	height: 100px;
	border-radius: 100%;
	background: rgba(255, 255, 255, 0.25);
	text-align: center;
}

input[type="checkbox"] {
    display: inline-block;
    width: auto;
    margin-right: 5px;
}

input[type="checkbox"] + span {
    display: inline-block;
    margin-top: 5px;
}