@charset "utf-8";
@import "reset.css";

/* source-sans-pro-regular - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-pro-v11-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
       url('../fonts/source-sans-pro-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v11-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-600 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/source-sans-pro-v11-latin-600.eot'); /* IE9 Compat Modes */
  src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
       url('../fonts/source-sans-pro-v11-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v11-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v11-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v11-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v11-latin-600.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* architects-daughter-regular - latin */
@font-face {
  font-family: 'Architects Daughter';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/architects-daughter-v8-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Architects Daughter Regular'), local('ArchitectsDaughter-Regular'),
       url('../fonts/architects-daughter-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/architects-daughter-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/architects-daughter-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/architects-daughter-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/architects-daughter-v8-latin-regular.svg#ArchitectsDaughter') format('svg'); /* Legacy iOS */
}


/* older browser html5 workaround */
header, section, footer, aside, nav, article, figure{
	display: block;
}
html{
	height:100%;
	color: #3F3F3F;
	font-family: 'Source Sans Pro',arial, sans-serif;
	letter-spacing:0.02em;
	word-spacing:0.2em;
	font-size:17px;
	background:#FFCC00;
}
body{
	font-size: 1em;
	font-weight:normal;
	line-height:1.5em;
}
:focus,:visited{
	outline: none;
}
a,a:link,a:visited {
	cursor:pointer;
	outline:none;
	text-decoration:none;
	color: gray;
}
a:active, a:hover {
	color: gray;
	text-decoration:underline;
}
/* Überschriften */
h1,h2,h3,h4,h5,h6{
	font-size: 1.6em;
	font-weight:100;
	letter-spacing:0.03em;
	line-height: normal;
	margin:0;
}
#outwrapper{
	margin:0 auto;
	padding:10px;
	box-sizing: border-box;
	display:block;
}
#wrapper{
}
/* header */
header{
	border-bottom:1px solid silver;
	box-shadow: 0 4px 2px -2px #f5f5f5;
}
header #logo a ,header #logo a:link , header #logo a:hover{
	font-family: 'Architects Daughter', cursive;
	text-transform:uppercase;
	text-decoration:none;
	color:#ff0000;
	font-size:2em;
}
header span{
	display:block;
	font-size:1.25em;
	line-height:2em;
	color:#808080;
}
/* nav */
nav{
	float:left;
	display:block;
	position:relative;
	margin:20px 0 0 0;
	border-radius:5px;
}
	nav button{
		background:#FF3300 url(../pics/hamburger.png) no-repeat 95% center;
		display:none;
		color:white;
		padding:0.75em;
		width:100%;
		text-align:left;
		border:0;
		border-radius:10px;
		box-sizing: border-box;
		box-shadow: 0 4px 2px -2px #f5f5f5;
	}
	nav ul{
		display:block;
		list-style-type: none;
		margin:5px 0 0 0;
	}
	nav ul:first-child{
		padding-bottom:15px;
		border-bottom:1px solid silver;
		box-shadow: 0 4px 2px -2px #f5f5f5;
	}
		nav ul ul{
			margin:5px 0 0 25px;
		}
		nav ul li{
			display: block;
			clear:both;
			margin:0;
			padding:0 ;
		}
			ul li a{
				text-decoration:none;
				word-wrap: break-word;
				font-size: 1em;
			}
			ul li:hover a{
				text-decoration:underline;
			}
			ul li.active a{
				color:#ff0000;
			}
				ul li.active li a{
					color: gray;
					text-decoration:none;
				}
				ul li.active li:hover a{
					color: gray;
					text-decoration:underline;
				}
				ul li.active li.active a{
					color:#ff0000;
				}
					ul li.active li.active li a{
						color: gray;
						text-decoration:none;
					}
					ul li.active li.active li:hover a{
						text-decoration:underline;
					}
					ul li.active li.active li.active a{
						color:#ff0000;
					}

/* #infonavi */
#infonavi{
	list-style-type: none;
	padding:0;
	margin:0 10px 10px 0;
}

/* #content. */
#content{
	float:left;
	display:block;

}
/* article */
article{
	width:100%;
	line-height:1.25em;
	margin-top:10px;
}
article hr{
	height:1px !important;
	border:none;
	padding:0;
	margin:5px 0;
	background:silver;
}
article a:link{
	font-weight:normal;
}
article h2{
	font-weight:normal;
	font-size:1.3em;
	line-height:2em;
	display:block;
}
article h1{
	color:#FF0000;
	display:inline;
	line-height:2em;
}
article ul{
	list-style-type: disc;
	margin: 0;
}
	article ul li{
		margin:5px 0 5px 15px;
	}
article img{
	max-width:100%;
}
#pdf, #links{
	display:block;
	margin:15px 0 0 0;
}
	#pdf a img{
		margin:5px 5px -5px -2px;
	}

/* forms */
form{
	border:0;
	max-width:500px;
}
fieldset{
	border:0;
	width:100%;
}
label{
	display:block;
	margin:5px 0;
}
input.text,textarea{
	width:98%;
	font:inherit;
}
textarea{
	height:150px;
}
fieldset button,input.button{

}
.searchform fieldset button{
	display:block;
	float:right;
}
.searchform fieldset input.init{
	color:silver;
}
#googlemap{
	display:block;
	width: 100%;
	height: 500px;
}
:focus {
    outline: 0px solid transparent !important;
}

.sitemap {
	list-style-type:circle;
	margin: 10px 10px 10px 5px;
}
.sitemap li{
	margin:0 0 0 15px;
}
.clearfix{
	clear:both !important;
}

div.start{
	width:50%;
	float:left;
	padding:0 2%;
	box-sizing: border-box;
}
div.start img{
	border: 1px solid silver;
	width:100%;
	max-height:100%;
	display:block;
	border-radius:10px;
	box-shadow: #f5f5f5 0px 0px 15px;
	box-sizing: border-box;
}
div.start img:hover{
	opacity:0.85;
}
div.list{
	border-bottom: 1px solid silver;
	box-shadow: 0 4px 2px -2px #f5f5f5;
	width:100%;
	margin:0 0 10px 0;
	padding:0 0 10px 0;
	display:block;
	clear:both;
	position:relative;
}
div.list div.img{
	float:left;
	display:block;
	padding:10px 10px 0 0;
	max-width:100%;
	box-sizing: border-box;
}
div.list img, img.preview{
	border-radius:5px;
	max-width:100%;
	box-sizing: border-box;
}
div.list img:hover{
	opacity:0.85;
}

div.preview{
	border-bottom:none;
	box-shadow:none;
}

/* start media queries */

@media screen and (max-width: 479px) {
	/* iPhone Portrait width: 320px */
	nav button{display:block;}
	nav{width:100%;padding:0;margin:10px 0;}
	nav ul{display:none;margin-left:10px;}
	#infonavi{margin-left:10px;}
	div.preview div.img {width:100%;padding:0;}
	div.preview div.img img{width:340px;}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
	/* iPhone Landscape width: 480px */
	nav{width:33%;}
	#content{width:66%;margin-top:10px;}
	div.start{width:33%;}
	div.list div.img{width:50%;padding:5px 10px 0 0;}
	div.preview div.img img{width:auto;}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	/* iPad [Portrait + landscape] */
	nav{width:25%;}
	#content{width:75%;margin-top:10px;}
	div.start{width:33%;}
	div.list div.img{width:50%;}
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
	/* iPad [landscape] */
	nav{width:25%;}
	#content{width:75%;margin-top:10px;}
	article{line-height:1.5em;}
	div.start{width:33%;}
	div.list div.img{width:50%;}
}
@media screen and (min-width: 1025px) {
	/* >ipad portait ,netbooks,  macbook */
	#outwrapper{
		position:relative;
		margin: 0 0 0 40px;
		padding:0;
		width:1044px;
	}
	#wrapper{
		position:relative;
		margin: 0 auto;
		width:1024px;
		min-height:650px;
	}
	header{
		width:100%;
	}
	header #logo{
		width:100%;
		padding:50px 0 5px 0;
		font-size:2em;
	}
	nav{
		padding:0;
		width:200px;
	}
	#content{
		float:left;
		width:780px;
		height:100%;
		padding:15px 0 0 20px;
		margin:0;
	}
	div.start{
		width:260px;
		height:260px;
		padding:0 40px 40px 0;
	}
	div.start img{
		width:220px;
		height:220px;
		margin:5px 0 0 0;
	}
	article{line-height:1.5em;}
	div.list div.img{width:auto;max-width:auto;padding-bottom:5px;}
	div.list span{position:absolute;bottom:15px;}
}
@media screen and (min-width: 1500px) {
	/* desktop, imac */
}