body {
	font-family: Verdana;
	display: flex;
	flex-flow: row wrap;
}
/* Mobile first - alle Dokument-Blöcke bekommen 100% Breite */

body,
footer div,
nav {
	width: 99%;	
}

loginform,
header,
nav,
nav a,
article,
section,
aside,
footer {
	border-radius: 0px 0.5em 0.5em;
	border: 1px solid;
	padding: 10px;
	margin: 10px;
	flex: 1 100%;
}

.inline-h {
	display: inline-block;
}

.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.align-center {
	text-align: center;
}

.centerdiv {
	margin: 0 auto;
}

.ie-div {
	display: none;
}

.text-decoration-none {
	text-decoration: none;
}

@media only screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.ie-div { 
		display: block;
	}
}

@media only screen {

	loginform {
		background: #F1F3F4;
		border-color: #d5d5d5;
		display: flex;
		flex-flow: row wrap; 
		display: inline-block;
		width: 95%;
		background: #fffbf0;
		border: 1px solid #dfac20;
		margin: 0 auto;
		text-decoration: none;
		text-align: center;
	}

	loginform form table {
		margin: 0 auto;

	}

	loginform table tr td:first-child {
		text-align: right;
	}

	loginform table tr td:last-child {
		text-align: left;
	}

	loginform table tr td:last-child input {
		width: 150px;
	}

	header {
		background: #F1F3F4;
		border-color: #d5d5d5;
		display: flex;
		flex-flow: row wrap;
	}

	header * {
		flex: 1 1 0%;
	}

	header img {
		flex: 0 0 150px;
		margin-right: 20px;
	}

	nav {
		white-space: nowrap;
	}

	nav,
	nav ul,
	nav li {
		margin: 0;
		padding: 0;
		border: none;
	}
	header nav {
		flex: 1 1 100%;
	}

	nav ul {
		display: flex;
		flex-direction: column;
	}

	nav li {
		list-style-type: none;
		margin: 1.3em 0;
		float: left;
		flex: 1 1 100%; 
	}

	nav a {
		display: inline-block;
		width: 95%;
		background: #FEFEFE /* #fffbf0 */;
		border: 1px solid #dfac20;
		margin: 0;
		text-decoration: none;
		text-align: center;
	}

	nav a:hover,
	nav a:focus {
		background-color: #FE4444 /* #dfac20 */;
	}

	section {
		background: #F1F3F4;
		border-color: slateblue;
	}

	article {
		background: #ffede0;
		border-color: #df6c20;
	}

	aside {
		background: #ebf5d7;
		border-color: #8db243;
	}

	footer {
		background: #e4ebf2;
		border-color: #8a9da8;
		display: flex;
		flex-flow: row wrap;
		
	}

	footer * {
		flex: 1 1 0%; 
		justify-content: space-between;
	}

	footer p {
		text-align: right;
	}

	.auto-style1 {
		background-color: #FF0000;
		color: #000000;
	}

	.auto-style2 {
		background-color: #FFFFFF;
	}

	header h1 {
		flex: none;

	}

	.div400px {
		width: 400px;
	}

	.div400px p {
		font-size: 14px;
	}

	.div400px a {
		font-size: 14px;
		color: blue;
	}

	.auswahl-item,
	.auswahl-wrapper {
		max-width: 300px;
	}

	.auswahl-drop {
		width: 100%;
		background: none;
	}

	nav a {
		border-radius: 5px;
	}

	nav a,
	.auswahl-drop a {
		box-shadow: 0px -2px 5px #000000 inset, 0px 2px 5px #fefefe inset;
		border: none;
	}

	.auswahl-drop a {
		border-radius: 0px 0px 0 0;
	}

	.auswahl-drop a:first-child {
		border-radius: 5px 5px 0 0;
	}


	.auswahl-drop a:hover {
		background-color: #FE4444;
	/*	color: #dfac20 !important; */
	}

	/*
	.ist-waehrung:after {
		content:" €";
	}
	*/

	button {
		cursor: pointer;
	}

	#login-button {
		flex: none;
		margin: 0;
	}

	li.logout-button {
		flex: none;
		width: 150px;
	}

	.auftr-sufu {
		display: block;
		flex: 1 1 100%;
		margin-left: 15px;
	}

	.auftr-sufu input {
		width: 200px;
		transition: width 1s;
	}

	.auftr-sufu input:focus {
		width: 250px;
		transition: all 1s;
	}

	.sortier-auswahl {
		display: inline-block;
	}

	.sortier-auswahl {
		margin: 0 0 10px 0;
	}

	.selection-list {
		position: absolute;
		margin: 0 0 0 5px;
		padding: 5px;
		width: 400px;
		z-index: 1000;
		color: #FEFEFE;
	/*	background-color: rgba(50,50,50,0.8); */
	}

	.selection-list a li {
		list-style: none;
		line-height: 2.0em;
		padding: 1px 5px;
	}

	.selection-list a li:hover {
		color: #FE4466;
	}

	.selection-list a:nth-child(odd) li {
		background-color: #444444;
	}
	.selection-list a:nth-child(even) li {
		background-color: #555555;
	}

	.selection-list a {
		text-decoration: none;
	}

	.mu-tabelle-auftraege {
		width: 1600px;
		margin: 0 auto;
		font-size: 0.9em;
		line-height: 1.3em;
		border-collapse: collapse;
		box-shadow: -3px -3px 6px;
		overflow: scroll;
	}

	.mu-tabelle-logs {
		margin: 0 auto;
	}

	.mu-tabelle-stats {
		line-height: 1.3em;
	}

	.mu-tabelle-auftraege tr:first-child,
	.mu-tabelle-logs tr:first-child,
	.mu-tabelle-stats tr:first-child {
		background-color: #444444;
		color: #efefef;
	}

	.mu-tabelle-auftraege tr th,
	.mu-tabelle-auftraege tr td,
	.mu-tabelle-logs tr th,
	.mu-tabelle-logs tr td,
	.mu-tabelle-stats tr th,
	.mu-tabelle-stats tr td {
		padding: 0 5px;
	}

	.mu-tabelle-auftraege hr {
		font-size: 10px !important;
		line-height: 11px !important;
		margin: 0px;
		padding: 0px;
	}
	
	.mu-tabelle-auftraege .td-strasse {
		min-width: 220px;
	}
	
	.mu-tabelle-auftraege .td-name,
	.mu-tabelle-auftraege .td-telefon {
		width: 150px;
	}

	.mu-tabelle-auftraege .td-wekomplett,
	.mu-tabelle-auftraege .td-planung,
	.mu-tabelle-auftraege .td-lieferung,
	.mu-tabelle-auftraege .td-uhrzeit,
	.mu-tabelle-auftraege .td-abgerechnet {
		width: 100px;
	}

	.mu-tabelle-auftraege .td-gesamt {
		width: 90px;
	}

	.mu-tabelle-auftraege .td-auftrnr,
	.mu-tabelle-auftraege .td-kv {
		width: 75px;
	}

	.mu-tabelle-auftraege .td-tour {
		width: 55px;
	}

	.mu-tabelle-auftraege .td-neumarker {
		width: 50px;
	}

	.mu-tabelle-auftraege .td-bestaetigt {
		width: 25px;
	}

	.mu-tabelle-auftraege tr:nth-child(odd):not(:first-child) td:not(:first-child),
	.mu-tabelle-stats tr:nth-child(odd):not(:first-child) td:not(:first-child) {
		background-color: #eeeeee;
	}
	
	.mu-tabelle-auftraege tr:nth-child(even) td:not(:first-child),
	.mu-tabelle-stats tr:nth-child(even) td:not(:first-child) {
		background-color: #e9e9e9;
	}
	
	.mu-tabelle-auftraege tr.mu-datensatz-offen:nth-child(odd) td:not(:first-child) {
		background-color: #ee8888;
	}
	
	.mu-tabelle-auftraege tr.mu-datensatz-offen:nth-child(even) td:not(:first-child) {
		background-color: #dd7777;
	}

	.mu-tabelle-auftraege tr.mu-datensatz-geplant:nth-child(odd) td:not(:first-child) {
		background-color: #dddd77;
		color: #000000;
	}

	.mu-tabelle-auftraege tr.mu-datensatz-geplant:nth-child(even) td:not(:first-child) {
		background-color: #cccc55;
		color: #000000;
	}
	
	td.mu-geaendert {
		animation-name: blink2;
		animation-duration: 6s;
		animation-iteration-count: infinite;
	/*	background-color: #9999AF; */
	}	
	
	td.mu-ungelesen {
		animation-name: blink;
		animation-duration: 6s;
		animation-iteration-count: infinite;
	}
	
	.mu-tabelle-auftraege tr.mu-datensatz-offen:hover td:not(:first-child),
	.mu-tabelle-auftraege tr.mu-datensatz-geplant:hover td:not(:first-child) {
		background-color: #343434;
		color: #fefefe;
	}
	
	.mu-tabelle-auftraege tr.mu-datensatz-offen:hover td:not(:first-child),
	.mu-tabelle-auftraege tr.mu-datensatz-geplant:hover td:not(:first-child),
	.mu-tabelle-auftraege tr:hover:not(:first-child, .hint) td:not(:first-child),
	.mu-tabelle-stats tr:hover:not(:first-child) {
		background-color: #414141;
		color: #efefef;
		box-shadow: 0px -1px 4px #000000 inset, 0px 1px 4px #fefefe inset;
		cursor: pointer;
	}	
	
	.mu-tabelle-auftraege tr td:first-child,
	.mu-tabelle-auftraege tr:hover td.mu-ungelesen,
	.mu-tabelle-auftraege tr:hover td.mu-geaendert	{
		background-color: #EFEFEF;
		
	}

	#item-new,
	#item-changed {
		text-transform: capitalize;
		font-size: 12px;
	}

	#item-new {
		color: rgba(255,0,0,1);
	}

	#item-changed {
		color: #9999AF;
	}

	.logfilterform {
		width: 350px;
		margin: 5px auto;
	}

	.logfilterform span {
		font-size: 0.9em;
	}

	#logtime {
		width: 25px;
	}
	
	.telelink:hover {
		color: #ff6666;
	}
	
	.minipic {
		width: 25px;
		-webkit-filter: invert(1);
		filter: invert(1);
	}
	
	/* logs farben ändern */
	.mu-tabelle-logs tr:nth-child(even) {
		background-color: #efefef;
	}
	
	.mu-tabelle-logs tr:nth-child(odd):not(:first-child) {
		background-color: #9a9a9a;
	}
	
	.mu-tabelle-logs tr:hover:not(:first-child) {
		background-color: #343434;
		color: #efefef;
	}	
	
	@keyframes blink {
		0%, 100% {
			background-color: #FFAFAF;
		}
		50% {
			background-color: rgba(255,0,0,1);
		}
	}

	@keyframes blink2 {
		0%, 100% {
			background-color: #9999AF;
		}
		50% {
			background-color: rgba(0,0,0,0);
		}
	}
	.mu-tabelle-auftraege tr th,
	.mu-tabelle-auftraege tr td,
	.mu-tabelle-stats tr th,
	.mu-tabelle-stats tr td {
		min-width: 50px;
		max-width: 175px;
		border: 1px solid black;
		word-wrap: break-word;
	}

	.mu-tabelle-auftraege tr td,
	.mu-tabelle-stats tr td {
		padding: 0 3px;
	}

	/*
	table tr td.mu-ungelesen {
		background-color: #dd4444 !important;
	}
	*/
	.mu-auftr-head {
		width: 100%;
	}

	.mu-auftr-head h3 {
		margin-left: 10px;
		margin-right: 10px;
	}

	.mu-auftr-head span {
		font-size: 1.1em;
	}

	.mu-daten-wrapper {
		float: left;
		width: 33%;
	}

	.mu-daten-wrapper fieldset table {
		font-size: 0.9em;
		line-height: 1.2em;
		border-spacing: 15px 5px;
	}

	.mu-uebersicht-set {
		box-shadow: 3px 3px 3px;
		min-height: 300px;
		border: 1px solid black;
	}

	.mu-uebersicht-legend {
		font-size: 1.3em;
		font-weight: bold;
	}

	#mu-name-kunde,
	#mu-name-liefer {
		font-size: 1.0em;
	}

	#mu-gesamtbetrag span {
		font-size: 1.1em;
		border-bottom: double black;
	}

	.mu-anhang-link,
	.mu-anhang-list,
	.mu-bilder-link,
	.mu-bilder-list {
		text-decoration: none;
		margin: -8px 0;
	}

	.mu-anhang-link:first-child,
	.mu-bilder-link:first-child {
		margin-top: 8px;
	}

	a .mu-anhang-list:hover,
	a .mu-bilder-list:hover {
		background-color: black;
		color: white;
	}

	#mu-montage-wrapper {
		width: 100%;
		clear: both;
	}

	#auftraege-form {
		display: inline;
	}

	#mu-montage-input {
		font-size: 1.1em;
	}

	#mu-montage-input,
	#mu-uhrzeit {
		width: 100%;
	}

	#mu-kommentar {
		font-size: 1.1em;
		height: 114px;
		width: 350px;
		margin: 0;
	}

	.mu-wareneingang {
		margin-top: 0;
		font-weight: 500;
	}

	.anhang-table tr td li,
	.bilder-table tr td li {
		line-height: 2.5em;
		padding-right: 5px;
	}

	.fixed-date {
		color: #666666;
	}

	.speichern-btn {
		font-size: 1.1em;
		height: 45px;
		width: 120px;
	}

	.faqhint {
		vertical-align: bottom;
	}

	.outside-picloader {

	}

	#progress_bar {
		margin: 10px 0;
		padding: 3px;
		border: 1px solid #000;
		font-size: 14px;
		clear: both;
		opacity: 0;
		-moz-transition: opacity 1s linear;
		-o-transition: opacity 1s linear;
		-webkit-transition: opacity 1s linear;
		transition: opacity 1s linear;
	}
	#progress_bar.loading {
		opacity: 1.0;
	}
	#progress_bar.percent {
		background-color: #99ccff;
		height: auto;
		width: 0;
	}

	.mu-montageform {
		float:left;
	}

	#piclist ul  {
		list-style: none;
	}

	.kleingedrucktes {
		font-size: 0.6em;
	}

	.version_nr {
		padding: 0 5px;
	}
		
	.version_upd {
		padding: 0 5px;
	}

	.bottom-border th {
		border-bottom: 2px solid #000000;
	}

	.bottom-border td {
		border-bottom: 1px solid #000000;
	}

	.pagination li {
		width: 90px;
		background-color: #dadada;
		list-style: none !important;
		display: inline-block;
		border: 1px solid black;
		text-align: center;
		line-height: 2.0em;
		padding: 5px 10px;
		box-shadow: 4px 4px 3px #000000;
		cursor: pointer;
	}
	.pagination a {
		text-decoration: none;
	}
	.pagination .pagination-enabled:hover {
		background-color: #ee4444;
		box-shadow: none;
	}

	.pagination  .pagination-disabled {
		background-color: bababa;
		box-shadow: none;
	}

	.pagination-disabled:hover,
	.pagination-disabled a:hover {
		cursor: default;
	}

	.clearfix2 {
		clear: both;
	}
	
	.no-screen {
		display: none;
	}
}

/* Smart Phones und Tablets mit mittlerer Auflösung */

@media only screen and (min-width: 35em) {
	header img {
		margin-right: 50px;
	}
	nav ul {
		flex-direction: row;
	}
	nav li {
		margin: 0 10px;
		flex: 1 1 0%;
	}
	article {
		order: 2;
	}
	#news {
		order: 3;
	}
	aside {
		/* durch auto werden die beiden asides in eine Zeile gesetzt */
		
		flex: 1 1 auto;
		order: 4;
	}
	footer {
		order: 5;
	}
}
/* Large screens */

@media only screen and (min-width: 50em) {
	article {
		/* Der Article wird 2.5x so breit wie die beiden asides! */
		
		order: 3;
		flex: 5 1 0%;
	}
	aside {
		flex: 2 1 0%;
	}
	#news {
		order: 2;
		align-self: center;
		height: 120px;
	}
}

@media only screen and (max-width: 600px) {
	.no-mobile {
		display: none;
	}
	.mu-tabelle-auftraege {
		width: 600px;
		font-size: 16px;
	}
	.mu-tabelle-auftraege .neumarker {
		width: 25px !important;
	}	
}

@media only print {
	* {
		margin: 0;
		padding: 0;
	}
	
	table,
	tr,
	th,
	td,
	p, 
	a {
		font-size: 10pt;
	}
	
	h1 {
		font-size: 24pt;
	}
	
	h2 {
		font-size: 18pt;
	}
	
	h3 {
		font-size: 14pt;
		font-weight: bold;
		text-decoration: underline;
	}
	
	article {
		border: none;
		background-color: none;
	}
	
	th, td {
		padding: 2pt 4pt;
	}
	
	.mu-touren-content {
		width: 100%;
		margin: 0 auto;
		margin-top: -10pt;
	}
	
	.mu-auftr-head h2,
	.mu-auftr-head h3,
	.mu-auftr-head h5 {
		font-weight: normal;
		margin-bottom: 0pt;
		margin-right: 10pt;
		text-decoration: none;
	}
	
	.mu-auftr-head h2,
	.mu-auftr-head span {
		font-size: 14pt;
		font-weight: bold;
	}

	.mu-auftr-head h3,
	.mu-auftr-head h5 {
		font-size: 12pt;
	}
	
	.mu-wareneingang {
		display: block;
	}

	.mu-auftr-head span {
		position: absolute;
		right: 0;
		margin-top: 10pt;
		text-align: right;
	}
	
	.mu-daten-wrapper {
		max-width: 31%;
		height: 100%;
	/*	padding: 10pt 10pt 0 10pt; */
		float: left;		
	}
	.mu-daten-wrapper fieldset {
		width: 100%;
		height: 100%;
		border: none;
/*		border-top: 1pt solid black; */
		border-right: 1pt solid black;
		box-shadow: none;
	}

	.mu-daten-wrapper fieldset legend {
		font-size: 14pt;
		font-weight: bold;
		padding: 0 5pt;
	}
	
	.mu-daten-wrapper fieldset {
	}
	
	.mu-daten-wrapper table tr td {
		vertical-align: top;
	}
	
	.mu-table-wrapper {
		max-width: 100%;
	}
	.mu-tabelle-auftraege {
		width: 100%;
/*		table-layout: fixed; */
		box-shadow: none;
	}

	.mu-tabelle-auftraege * {
		white-space: word-wrap;
	}

	.mu-tabelle-auftraege th {
		width: 100%;
	}
	
	.mu-tabelle-auftraege th,
	.mu-tabelle-auftraege td,
	.mu-tabelle-auftraege a	{
		font-size: 8pt !important;
		padding: 2pt 4pt;
	}

	.mu-tabelle-auftraege td a,
	.mu-tabelle-auftraege td a:hover {
		text-decoration: none;
	}

	.mu-tabelle-auftraege,
	.mu-tabelle-auftraege tr,
	.mu-tabelle-auftraege tr th,
	.mu-tabelle-auftraege tr td	{
		border-collapse: collapse;
		border: 1pt solid black;
	}
	
	tr,
	fieldset {
		page-break-inside: avoid !important;
	}

	.no-print {
		display: none;
	}
}
.mu-tabelle-auftraege tr:not(.hint) td {
	padding-top: 1.3rem !important;
	padding-bottom: 1.3rem !important;
}

@page {
	size: landscape;
	padding: 1.0cm 1.0cm 1.3cm 1.0cm;
}
