@charset "utf-8"; /* © 2015 eckblick GbR */
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,700,500);	
html, body, #page {width:100%}
html {height:100%; min-height:100vh; min-height:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%}
html, body {background-size:103.33%; background-size:cover; background-repeat:no-repeat; background-position:center; background-attachment:fixed; overflow-x:hidden; }
body, #page {display:block; margin:0}
body {cursor:default; line-height:1.2; position:absolute}
#page {position:relative; display:inline-block;}											
.clear {clear:both; content:""}
header, main, footer, nav, figure, article, aside, details, section, summary {position:relative; float:left; display:block}
header, main, footer, nav {width:100%}
audio, canvas, video {display:inline-block}
nav .container, header .container, main .container, footer .container {display:block; margin:auto}
nav .container { text-align:center;}
figure {background-position:center; background-repeat:no-repeat}
.container {position:relative}
main .container {min-height:480px; min-height:60vh;}
footer .container {min-height:90px; }
p {-moz-hyphens:auto; -o-hyphens:auto; -webkit-hyphens:auto; -ms-hyphens:auto; hyphens:auto; display:block; float:left; line-height:1.25; margin-bottom:32px}
* p:last-child {margin-bottom:8px} 
p:empty {display:none}
hr {-moz-box-sizing:content-box; box-sizing:content-box; height:0px; border-bottom:0.67px solid #d7d7d7; margin-top:-1.67px; margin-bottom:14px}
textarea, textarea:active, textarea:focus, input, input:active, input:focus, button, .button, button:active, button:focus {outline:none; border:none; line-height:1.2}
input, select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {display:block; vertical-align:middle; width:98%; padding:12px 1%; line-height:1.2}
input:focus, select:focus, textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus {line-height:1.2}
input::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder, input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="datetime"]::-webkit-input-placeholder, input[type="date"]::-webkit-input-placeholder, input[type="month"]::-webkit-input-placeholder, input[type="time"]::-webkit-input-placeholder, input[type="week"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="url"]::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="color"]::-webkit-input-placeholder, input:-moz-placeholder, select:-moz-placeholder, textarea:-moz-placeholder, input[type="text"]:-moz-placeholder, input[type="password"]:-moz-placeholder, input[type="datetime"]:-moz-placeholder, input[type="date"]:-moz-placeholder, input[type="month"]:-moz-placeholder, input[type="time"]:-moz-placeholder, input[type="week"]:-moz-placeholder, input[type="number"]:-moz-placeholder, input[type="email"]:-moz-placeholder, input[type="url"]:-moz-placeholder, input[type="search"]:-moz-placeholder, input[type="tel"]:-moz-placeholder, input[type="color"]:-moz-placeholder, input::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="datetime"]::-moz-placeholder, input[type="date"]::-moz-placeholder, input[type="month"]::-moz-placeholder, input[type="time"]::-moz-placeholder, input[type="week"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="url"]::-moz-placeholder, input[type="search"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="color"]::-moz-placeholder, input:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder, input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="datetime"]:-ms-input-placeholder, input[type="date"]:-ms-input-placeholder, input[type="month"]:-ms-input-placeholder, input[type="time"]:-ms-input-placeholder, input[type="week"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="url"]:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="color"]:-ms-input-placeholder {color:rgba(180,180,180,1.00); line-height:1.2}
button, input, select, textarea {font-family:inherit; margin:6px 0; line-height:1.2}
button, select, option, .button {cursor:pointer}
button, .button, input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance:button; cursor:pointer}
button[disabled] {cursor:default; opacity:0.67}
input[type="checkbox"], input[type="radio"] {box-sizing:border-box; padding:0}
input[type="search"] {-webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance:none}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0}
textarea {overflow:auto; vertical-align:top; resize:none}
label {display:block}
table {width:100%; border-collapse:collapse; border-spacing:0}
th, td {padding:4px; text-align:left}
table th:empty, table td:empty {border:none}
p, blockquote, pre, ol, ul, form, table, th, td, caption, hr {margin:0; padding:0}
blockquote, q {quotes:none}
blockquote:after, blockquote:before, q:after, q:before {content:""}
ul, ol, blockquote, p, table, pre {margin-bottom:20px}
ul, ol {list-style: none outside none; margin-left:48px}
li > ul, li > ol {margin-bottom:0}
h1, h2, h3, h4, h5, h6, h7, h8, h9, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h7 a, h8 a, h9 a {display:inline; color:inherit;}
h1 {font-size:200%}	
h2 {font-size:167%}	
h3 {font-size:140%}
h4 {font-size:120%}
h5 {font-size:110%}
h6, h7, h8, h9, h10, h11, h12 {font-size:100%}
a, a:visited, a:focus, a:active, a:hover {text-decoration:none; outline:0}
img {border:0; -ms-interpolation-mode:bicubic; vertical-align:middle; max-width:100%; height:auto; image-rendering: optimizequality}
img[width], img[height] {max-width:100%; height:auto; margin: 0 auto}
* {border:0px; margin:0; padding:0; list-style:none; outline:0 none}
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box}
b, strong {font-weight:bold}
small, .small {font-weight:lighter}
a img {opacity:0.90; border:medium none; vertical-align:middle}
a img:hover	{opacity:1.00}
.desktopOnly {display:block; visibility:visible}

nav 						{width:100%;}
nav ul, footer ul 			{padding:0; margin:0; position:relative}
nav ul li, footer ul li 	{list-style:none;}

nav ul li a, footer ul li a {text-decoration:none;display:block;font-size:1.05em;}

/* Hauptpunkte */
nav .container					{max-width:1280px !important;}
nav .container ul 				{margin:auto; float:none; display:flex; flex-direction:row; flex-wrap:nowrap; 
								 justify-content:center; align-items:center; align-content:center; width:100%}
nav .container ul li 			{display:inline-block; text-align:center} 
nav .container ul li a 			{padding:14px 22px; display:block}




/* Unterpunkte */
nav .container ul li ul 		{visibility:hidden; position:absolute; left:0; width:100%; display:flex; justify-content:center; z-index:999;}
nav .container ul li ul 		{background-image:url(pic/logo-nav.svg); background-position:center left; background-repeat:no-repeat; background-size:11%; }
nav .container ul li ul.actual  {visibility:visible;}
nav .container ul li ul li 		{flex:0 0 0; order:1;}
nav .container ul li ul li a 	{padding:28px 10px 10px 10px;}

footer ul li 				{align-self:auto;display:inline-block;text-align:center;}
footer ul li a 				{padding: 13px 13px;}
footer ul li ul li a 		{padding: 4px 13px;}

ul li ul, ul li ul   { 	-webkit-transition: visibility 100ms ease-out 100ms; 
						-moz-transition: visibility 100ms ease-out 100ms; 
						-o-transition: visibility 100ms ease-out 100ms; 
						transition: visibility 100ms ease-out 100ms;   }


footer ul {text-align:right; float:right}
div#mNav {display:none}

ul.breadcrumb 					{ display:block; float:left; position:relative; margin-top:8px; } 

ul.breadcrumb li  				{ background-image:url(pic/right.svg); 
								  background-repeat:no-repeat; 
								  background-position:right center }
								  
ul.breadcrumb li:first-child 	{ background-image: url(pic/homeright.svg) !important }
ul.breadcrumb li:first-child a 	{ color:rgba(255,255,255,0.00) !important }

ul.breadcrumb li:last-child 	{ background-image:none }
ul.breadcrumb li a 				{ padding: 4px 13px }


nav a 											{ color:inherit }
nav ul li ul li a,
footer ul li ul li a							{ font-size:90% }
footer ul li a, footer a, ul.breadcrumb li a 	{ color:inherit; opacity:0.54; }
footer ul li a:hover, footer a:hover, 
ul.breadcrumb li a:hover,
nav a.actual, footer ul li a.actual	   			{ opacity:0.87; }


div.popup {	text-align:center; display:block !important;
position:fixed !important; 
background:rgba(102,163,23,1) !important;
color:rgba(255,255,255,1.00) !important; 
font-size:200% !important; 
width:0px; 
height:0px; 
left:0px; 
top:0px !important; 
margin:0px;
line-height:100vh; 
z-index:1; 
opacity:0; overflow:hidden;
-webkit-animation-name: mailinfo;
-webkit-animation-duration: 7s;
-webkit-animation-timing-function: linear;
-webkit-animation-delay: 0s;
-webkit-animation-iteration-count: 1;
-webkit-animation-direction: normal;
-webkit-animation-play-state: running;
animation-name: mailinfo;
animation-duration: 7s;
animation-timing-function: linear;
animation-delay: 0s;
animation-iteration-count: 1;
animation-direction: normal;
animation-play-state: running}

@-webkit-keyframes mailinfo { 	0% {opacity:0} 
								10% {opacity:0;z-index:99999;width:100%;height:100vh;} 
								30% {opacity:1} 
								90% {opacity:1;width:100%;height:100vh;left:0px;top:0px;z-index:99999; } 
								100% {opacity:0; width:0px; height:0px; z-index:1;  } } 
@keyframes mailinfo 		{ 	0% {opacity:0} 
								10% {opacity:0;z-index:99999;width:100%;height:100vh;} 
								30% {opacity:1}
								90% {opacity:1;width:100%;height:100vh;left:0px;top:0px;z-index:99999; } 
								100% {opacity:0; width:0px; height:0px; z-index:1; } }

div#googleMapFrame 			{ min-width:256px; min-height:256px; max-width:100%; }

input, textarea, a.button, button  { -webkit-appearance: none; -webkit-border-radius: 0px; border-radius: 0px; } /* Apple FIX */

/* /////////////////////////////////////////////////// */
/* BASIC MIN STYLE DEFAULT SETTING -> PREVENT NO STYLE 	
@font-face 					{ font-family:'Open Sans Condensed'; 
							  src: 	url('font/OpenSans-CondLight-webfont.eot');
							  src: 	url('font/OpenSans-CondLight-webfont.woff') format('woff'), 
									url('font/OpenSans-CondLight-webfont.ttf') format('truetype'), 
									url('font/OpenSans-CondLight-webfont.svg') format('svg') } */
/* /////////////////////////////////////////////////// */


input.button, button, .button  { min-width:112px; width:100%; padding:12px 20px 12px 20px !important; background:rgb(188,188,188); color:inherit;
font-size:100%; font-weight:400 !important; display:block; text-align:center !important;
-webkit-box-shadow: 1px 0px 3px 0px rgba(0,0,0,0.45);
box-shadow: 1px 0px 3px 0px rgba(0,0,0,0.45); }
input.button:hover, button:hover, .button:hover {-webkit-box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.57); box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.57);}



button.speichern, .button.speichern 				{ background: #8bc34a; color:#fff; }			
button.speichern:hover, .button.speichern:hover 	{ background: #33691e; color:#fff; }

button.erase, .button.erase 						{ background: #f44336; color:#fff; }
button.erase:hover, .button.erase:hover				{ background: #b71c1c; color:#fff; }

button.edit, .button.edit 							{ background: #009688; color:#fff; }
button.edit:hover, .button.edit:hover				{ background: #004d40; color:#fff; }
button.new, .button.new 							{ background: #009688; color:#fff; }
button.new:hover, .button.new:hover					{ background: #004d40; color:#fff; }

button.back, .button.back 							{ background: #2196f3; color:#fff; }
button.back:hover, .button.back:hover  				{ background: #424242; color:#fff; }








/* Input Styling - Google Material Design */

div.group { position:relative; margin-bottom:45px; width:95%; margin:0px 2.5% 45px 2.5%; display:block; float:left; }
div.group.half { width:45%; } 
div.group:first-child { margin-top:54px; }
div.group.half:nth-child(2) { margin-top:54px; }

/* Input, Select & Textarea */
div.group input,
div.group textarea   { font-size:18px; padding:10px 10px 10px 5px; display:block; width:100%; border:none; border-bottom:1px solid #bdbdbd; margin:0px 0px 0px 0px;}

div.group select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border:none; border-radius: 0; font-size: 18px; width: 100% } 
div.group select::-ms-expand { display:none; }
.lt-ie10 div.group select { background-image: none; }
div.group select {
  width:100%;
  border: 0px solid #bdbdbd;
  border-bottom:1px solid #bdbdbd;
  padding:10px 10px 7px 5px;
  background: transparent; 
  margin:0px 0px 0px 0px;}
div.group select option { background:white; border:0px solid #fff; outline: 0px none rgba(255,255,255,0.00); line-height:18px; padding-left:18px; }
div.group select option:first-child {  }

div.group textarea { min-height: 192px; }  
div.group input:focus, div.group textarea:focus, div.group select:focus { outline:none; }

/* LABEL */
div.group label  { 	  color:#999; font-size:16px; font-weight:normal; position:absolute;
					  pointer-events:none; /* left:5px; top:10px; */ 
					  left:5px; top:-18px; 
					  transition:0.2s ease all; 
					  -moz-transition:0.2s ease all; 
					  -webkit-transition:0.2s ease all; }
					  
div.group.required label  { font-size:18px; left:5px; top:10px; }

/* active state */
div.group select:focus ~ label,
div.group.required select:valid ~ label,
div.group textarea:focus ~ label, 
div.group.required textarea:valid ~ label,
div.group input:focus ~ label, 
div.group.required input:valid ~ label  {
  top:-20px;
  font-size:14px;
  color: #66a317;  }

div.group textarea ~ label, 
div.group input ~ label,
div.group select ~ label  { color:#999; top:-20px; font-size:14px; }


/* BOTTOM BARS ================================= */
div.group span.bar 	
{ position:relative; display:block; width:100%; }
div.group span.bar:before, 
div.group span.bar:after 	{
  content:'';
  height:2px; 
  width:0;
  bottom:1px; 
  position:absolute;
  background: #66a317; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all; }
div.group span.bar:before { left:50%;  }
div.group span.bar:after  { right:50%; }
/* active state */
div.group input:focus ~ .bar:before, 
div.group input:focus ~ .bar:after,
div.group textarea:focus ~ .bar:before, 
div.group textarea:focus ~ .bar:after {  width:50%; }
/* HIGHLIGHTER ================================== */
div.group span.highlight {
  position:absolute;
  height:60%; 
  width:50%; 
  top:25%; 
  left:0;
  pointer-events:none;
  opacity:0.5; }
/* active state */
div.group input:focus ~ .highlight,
div.group textarea:focus ~ .highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease; }
/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
  from  { background: #66a317; }
  to 	{ width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
  from  { background: #66a317; }
  to 	{ width:0; background:transparent; }
}
@keyframes inputHighlighter {
  from  { background: #66a317; }
  to 	{ width:0; background:transparent; }
}



@media
only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1),
only screen and (max-width: 765px) { div.group.half { width:95%; } div.group.half:nth-child(2) { margin-top:0px; } } /* Einspaltenlayout Umstellung */