header, navigation, main,
aside, section, 
content, footer,
article,table,info,div		{ display:block; }

/* HTML */
html 						{ font-size:100%; font-family:Arial; background-color:#000000; width:100%; height:100%; padding:0px; margin:0px;}

/* Body*/
body 						{ background-color:#31363d;  padding:0px; margin:0px; left:0px; top:0px; height:100%; overflow-x: hidden;}

/* Hidden */
.hidden						{ display:none; }
a:hover						{ cursor:pointer; }

div#showPicDesc				{ font-size:12px; color:000000; }
a.header1, a.nextPic		{ font-size:16px; text-decoration:none; color:#666666; font-weight:bold; background-color: #000; padding: 10px 15px; border: 2px solid #fff; border-radius: 10px;}
a.header1:hover, a.nextPic:hover
							{ font-size:16px; text-decoration:none; color:#FFFFFF; font-weight:bold; border-color: #b40000;}
table#picNav				{ margin: 2em 0em 0em 2em; }
p#wrong_PW					{ font-size:12px; fonr-weight:bold; color:#ff9000; }
div#header_img				{ position:absolute; z-index:0; top:0px; left:600px; padding:0px; margin:0px; }
div#header_img img			{ position:relative; border:solid 1px #b40000; margin-left:10px; box-shadow:3px 3px 5px #000000; visibility:hidden; opacity:0; }

/* Pictures */
p#Photo_h1					{ font-size:1.2em; font-weight:bold; color:#ffffff; margin:35px 0 0 35px; text-align:left; padding: 10px 15px; border: 2px solid #b40000; border-radius: 10px; max-width:550px; background-color:#000; }
p#Photo_text				{ font-size:1em; color:#ffffff; margin-left:35px; text-align:left; max-width:450px; background-color:#000000; box-shadow:#ffffff 0px 2px 10px; padding:1em; border-radius:10px; }
img.showPic_H,
img.showPic_V				{ -webkit-animation-name: fadeIn; -webkit-animation-duration: 0.5s; -webkit-animation-iteration-count: 1; position:relative; margin: 5em 1em 2em 2em; background-color:#737373; padding:5px; border-radius:5px; box-shadow:5px 5px 5px #b40000; float:left; }
img.showPic_H				{ max-width:100%; }
img.showPic_V				{ max-height:100%; }
table#pic_detail			{ cellspacing:2px; cellpadding:2px; background-color:#000000; width:100%; }
td#pic_detail_header		{ background-color:#494949; color:#ffffff; font-size:12px; width:325px; font-weight:bold; padding-left:5px; }
td#pic_detail_content		{ background-color:#c3c3c3; color:#000000; font-size:12px; text-align:left; width:325px; padding-left:5px; }
a.nextPic					{     margin: 25px 0px 0px 15px; display: inline-block; }

/* Pictures Box */
div#PicturesBox				{ float:left; background-color:#000000; box-shadow:#ffffff 0px 2px 10px; padding:20px; margin: auto 1em auto 2em; -webkit-border-radius: 10px; -webkit-box-shadow: #ffffff 0px 2px 10px;}
div#PicturesBox	a			{ -webkit-transition: opacity .2s ease-out; padding:5px; opacity:1; }
div#PicturesBox	a:hover		{ opacity:0.75; }
div#PicturesBox img 		{ border:solid 1px #ff9000; }

/* Folder */
div#PicSize					{ position:absolute; top:120px; right:50px; color:#ffffff; font-weight:bold; font-size:11px; border:solid 1px #ffffff; padding:5px;}
div#PicSize a				{ padding:5px;}
div#Slideshow				{ margin: 40px 15px 15px 35px; }
div#SlideshowBox			{ position:absolute; top:5em; left:2em; z-index:2; background-color:transparent; width: 100%; }
div#SlideshowBox a#close	{ position:absolute; z-index:3;  color:#ffffff; font-weight:bold; text-decoration:none; top:5em; left:2em; background-color:#b40000; padding: 2px 6px 2px 6px; border-top: 1px solid #CCCCCC; border-right: 1px solid #333333; border-bottom: 1px solid #333333; border-left: 1px solid #CCCCCC; -webkit-border-radius: 5px; }
div#SlideshowBox img		{ -webkit-box-shadow: #ffffff 5px 5px 15px; -webkit-border-radius: 10px; }
div#folder					{ position:relative; font-weight:bold; width:300px; display:inline-block; text-align: center; padding:6px;}
div#folder:hover			{ background-color: #000; border: 1px solid #b40000; border-radius: 15px; opacity: 0.8; padding:5px; }
span#pic1					{ position:relative; top:0px; left:0px; z-index:1; background:transparent; }
span#pic2					{ position:relative; top:-10px; left:-50px; z-index:2; background:transparent; }
span#pic3					{ position:relative; top:-40px; left:50px; z-index:3; background:transparent; }
a#folder					{ font-size:18px; color:#ff9000; text-shadow:none; text-shadow:2px 2px 2px #000000; margin:10px; text-decoration:none;}
a#folder:hover				{ color:#fff; }

/* Neue Picture liste */
div#PictureLane				{ width: 100%; }
div.PictureLaneRow			{ display: block; width: 100%; background: rgba(255,255,255,0.9); float:left; border-top:2px solid #b40000; }
div.PictureLaneRow *		{ display: inline-block; }
div.PictureLaneRow > img	{ margin: 0px; background-color: #000000; padding: 5px; border-radius: 0px; box-shadow: 5px 0px 5px #737373; }
/* Bilddaten */
div.PicData					{ display: inline-block; padding:20px; font-size: 12px;}
div.PicData div				{ display: block; }
div.PicData .header			{ margin: 10px 10px 0px 0px; font-weight: bold;}
div.PicData a				{ margin: 20px 20px 0px 0px; }

/* Kontaktformular Bildkauf */
div#mail					{ position:relative; z-index:1; background-color:#F5F5F5; margin: 5em 0em 2em 2em; min-height:250px; width:80%; max-width:650px; border-radius:8px; box-shadow:4px 4px 4px #585858; padding-left:0px; padding-top:5px; float:left;}
div#mail textarea			{ width:90%; }
div#mail input				{ width:70%; }
div#mail div#mailHeader		{ margin-left:-10px; padding:5px; color:#fff; font-weight:bold; text-shadow:2px 2px 2px #000; font-size:13px; border-radius:3px; background-color:#737373;}
div#mail div#mailValue		{ padding:5px; color:#000; font-size:10px; }
div#mail .submitMail		{ background-color:#585858; color:#F9F9F9; font-weight:bold; margin:5px;}
div#mailError				{ color:#ffffff; font-size:12px; font-weight:bold; text-align:left; padding-left:25px; background-image:url(../images/warning_16.png); background-repeat:no-repeat; min-height:16px;}
div#mailSuccess				{ color:#ffffff; font-size:12px; font-weight:bold; text-align:left; padding-left:25px; background-image:url(../images/accept.png); background-repeat:no-repeat; min-height:16px;}
p#Mail_text					{ font-size:13px; color:#000000; padding:20px; margin: 5px; text-align:left; background:#F5F5F5 url("../images/info.png") no-repeat right top; }
div#MailHeader				{ position:relative;  margin-left:650px; padding:10px; top:50px; width:500px; z-index:0; box-shadow:4px 4px 4px #585858; }

/* Navigation */
div#navigation				{ position:absolute; left:250px; top:54px; font-size:13px; font-weight:bold; padding:0px; z-index:1; }
div#navigation a			{ border-top:solid 1px #b40000; border-left:solid 1px #b40000; border-right:solid 1px #b40000; border-bottom:solid 1px #31363d; margin:0px; }
div#navigation a:link   	{ color:#ffffff; text-decoration:none; background-color:#31363d; padding-left:10px; padding-right:10px; padding-bottom:5px; padding-top:5px;}
div#navigation a:visited	{ color:#ffffff; text-decoration:none; background-color:#31363d; padding-left:10px; padding-right:10px; padding-bottom:5px; padding-top:5px; }
div#navigation a:hover  	{ color:#ffffff; text-decoration:none; background-color:#b40000; border-bottom:solid 1px #b40000; text-shadow:2px 2px 2px #000000;}
div#navigation a:active 	{ color:#ffffff; text-decoration:none;}

div#articleNav				{ }
div#articleNav p			{ background-color:#31363d; display:table-cell; vertical-align:middle; padding:10px 15px; color:#ffffff; font-weight:bold; font-size:16px; -webkit-box-shadow: #999999 2px 2px 10px; -moz-box-shadow: #999999 2px 2px 10px; box-shadow: #999999 2px 2px 10px; border: 3px solid #fff; border-radius: 5px;}
div#articleNav a			{ padding:5px;     display: inline-block; border: 1px solid #fff; border-radius: 20px; min-width: 20px; margin: 0 5px;}
div#articleNav a:hover		{ background-color:#fff; color:#000; }

/* Link default */
a							{ color:#ff9000; text-decoration:none; }
a:hover						{ text-decoration:underline;  }

/* Info */
div#info					{ position:relative; top:0px; width:150px; height:25px; background-color:#b40000; color:#ffffff; font-weight:bold; text-shadow:2px 2px 2px #000000; padding-left:5px; padding-right:5px; padding-top:0px; text-align:center; box-shadow:2px 2px 5px #ffffff; }

/* Page */
div#page					{ position:relative; min-height:100%; width:100%; background-image:url(../images/BG1.jpg); background-size:cover;}

/* Header */
div#header					{ position:relative; left:0px; top:0px; text-align:left; border-bottom:solid 1px #b40000; height:75px; width:100%; font-size:10px; font-weight:bold; background-image: url(../images/bg_top.png); overflow:inherit; }
div#header h1				{ position:absolute; color:#ffffff; padding-left:5px; font-weight:bold; font-size:14px; text-shadow:3px 3px 5px #000000; left:0px; top:42px; }
div#header p				{ position:absolute; color:#000000; right:50px; padding:0px; margin:0px; top:60px; }
div#header a#donate			{ position:absolute; top:12px; right:51px; }
div#header1					{ font-size:18px; color:#FFFFFF; font-weight:bold; padding-top:30px; padding-left:20px; text-shadow:3px 3px 5px #000000; text-shadow:3px 3px 5px #b40000;}

/* Content */
div#content					{ width:100%; min-height:1280px; overflow:auto; background-color:transparent; padding-bottom:70px; }

/* Footer */
div#footer					{ position:absolute; bottom:0px; background-image: linear-gradient(white -80%, black 95%); text-align:left; color:#CFCFCF; border-top:solid 1px #b40000; font-weight:bold; font-size:8pt; width:100%; height:70px;}
div#footer p#update			{ padding-top:0px; text-align:right; color:#ffffff; font-size:10px; padding-right:5px; }
div#footer p				{ padding-top:0px; text-align:right; color:#fff; }
div#footer p:not(#update)	{ float:right; }
div#footer a				{ color:#AFAFAF; text-decoration:none; padding:5px;}
div#footer a:hover			{ color:#FFFFFF; text-shadow:none;}
div#footer img				{ height:20px; border:none;vertical-align:middle; }

/* News and Reporst */
div#section					{ position:relative; margin-left:50px; margin-right:50px; padding:0px; min-height:200px; margin-bottom:15px; background-color:#ffffff; -webkit-box-shadow: #999999 5px 5px 10px; -moz-box-shadow: #999999 5px 5px 10px; box-shadow: #999999 5px 5px 10px; color:#000000; font-size:12px; border-radius: 10px; border: 1px solid #999; }
div#section p#header		{ font-weight:bold; background-color:#666666; color:#ffffff; border:solid 1px #ffffff; padding:5px;}
div#section p#header img	{ height:150px; float:left; margin-right:15px; padding:0px; box-shadow:#000000 0px 2px 10px; }
div#section p#text			{ color:#000000; min-height:150px; padding:10px 20px; text-align:justify;  }
div#section p#news			{ color:#000000; min-height:150px; padding:5px;}
div#section img#news		{ float:left; padding-right:10px; padding-bottom:5px;}
div#section td				{ border:solid 1px #000000; padding:5px; }
div#section p#autor			{ color:#000000; font-size:10px; text-align:left; padding-bottom:10px; color:#666666;}
div#section p#newsAutor		{ color:#000000; font-size:10px; text-align:left; padding-bottom:10px; color:#666666; padding-left:5px;}
div#section li				{ color:#000000; }
div#optionalText			{ padding:5px; text-align:justify; }
div#reportNavList			{ background-color:transparent; padding-bottom:20px; margin-left:10px; min-height: 50px; }
div#reportNavList a			{ color:#ffffff; font-weight:bold; text-decoration:none; background-color:#31363d; padding:5px; box-shadow:#ffffff 0px 2px 10px;  }
div#reportNavList a:link   	{ float:left; }
div#reportNavList a:hover  	{ background-color:#b40000; text-shadow:2px 2px 2px #000000;}
div#reportNavList a#sel		{ background-color:#b40000; text-shadow:2px 2px 2px #000000;}
video						{ width:100%; height:auto; }

/* Expand Collapse */
a#ecswitch					{ position:absolute; right:5px; bottom:5px; }

/* Colors */
span#red					{ color:#e31601; }
span#grey					{ color:#c3c3c3; }
span#blue					{ color:#0070b1; }
span#orange					{ color:#ff9000; }
span#green					{ color:#04df0e; }

/* Sitemap */
ul#sitemap					{ padding-bottom:10px; color:#b40000; }
a#sitemap					{ font-size:18px; color:#666666; font-weight:bold; text-decoration:none; }
a:hover#sitemap				{ color:#ffffff; text-shadow:none; text-shadow:2px 2px 2px #000000;}

/* Impressum */
p#impressum					{ color:#ffffff; font-size:10px; padding-right:5px; text-align:right;}

/* Errors */
.ERROR						{ color:#DF0000; font-family:Helvetica; font-weight:bold; font-size:9pt; }
.WARNING					{ color:#FF7F00; font-family:Helvetica; font-weight:bold; font-size:9pt; }
.SUCCESS					{ color:#00CC00; font-family:Helvetica; font-weight:bold; font-size:9pt; }
.INFO						{ color:#000000; font-family:Helvetica; font-weight:bold; font-size:9pt; }

/* Here are the colorshemes for the Message Handler class */
section h1 						{ font-weight:bold; font-size:12px; text-shadow:2px 2px 2px #737373; background:#000; padding:5px 5px 5px 5px; text-align:center; }
section h2 						{ font-weight:bold; font-size:9px; background:#fff; padding:5px 5px 5px 5px; color:#000; text-align:left; }
section#MESSAGE 				{ position:relative; padding:0px 0px 0px 0px; margin:10px 0px 10px 0px; min-height:100px; border:2px solid #000; border-radius:5px; background:#336699; width:80%; }
section#MESSAGE hr 				{ border:none; border-top:1px solid #000; height:1px;}
section#MESSAGE h2 a:link 		{ color:#FF7F00; }
section#MESSAGE h2 a:visited 	{ color:#FF7F00; }
section#MESSAGE h2 a:hover 		{ color:#336699; }


/* Inputs */
input,textarea 				{ background-color:#CFCFCF; color:#000000; font-family:Helvetica; font-size:11px; font-weight:bold; border-width:1px; border-style::solid; border-color:#000000; }

/* Gallerie Box */
div ul li img 				{ border: none;}
/* Box */
#box 						{ text-align: left; width: 600px; margin: 10px auto 0 auto;	background: #000; overflow: hidden;	border: 10px solid #000; -webkit-box-shadow: #131313 0px 2px 10px; -moz-box-shadow: #131313 0px 3px 10px; box-shadow: #131313 0px 3px 10px;	 }
ul#slider					{ -webkit-border-radius: 10px; margin: 0px;	padding: 0px; list-style: none; position: relative;	width: 600px; height: 400px; overflow: hidden; }
ul#thumb 					{ overflow: none; margin: 0px 0px 0px 0px; padding: 0px; list-style: none; position: relative; background: #000; overflow: auto; width: 600px; } 
ul#thumb a 					{ -webkit-transition: opacity .2s ease-out; border: 1px solid #979797; width: 35px; height: 35px; display: block; overflow: hidden; float: right; margin: 10px 0px 0px 10px; opacity: 0.75; }
ul#thumb a:hover 			{ opacity: 1; } 
ul#slider li 				{ width: 600px; height: 400px; position: absolute;	}
ul#slider li p 				{ position: absolute; bottom: 0; left: 0; z-index: inherit; color: #fff; background: rgba(0, 0, 0, .5);	width: 100%; }
ul#slider li p span 		{ line-height: 1.2em; padding: 10px; display: block; }
ul#slider li:target 		{ -webkit-animation-name: fadeIn; -webkit-animation-duration: 0.5s; -webkit-animation-iteration-count: 1; top:0px; left: 0px; z-index:1;}

/* Globale view classen */
.hidden 					{ display: none; }
.show 						{ display: block; }

/* Animation für Bildeinblendung */
@-webkit-keyframes fadeIn {
	0%   { opacity:0; }
	10%  { opacity:0.1; }
	20%  { opacity:0.2; }
	30%  { opacity:0.3; }
	40%  { opacity:0.4; }
	50%	 { opacity:0.5; }
	60%	 { opacity:0.6; }
	70%	 { opacity:0.7; }
	80%	 { opacity:0.8; }
	90%	 { opacity:0.9; }
	100% { opacity:1;}
}

/* Media Query's */
@media (min-width:1550px){
	div#header_img img#hImg6 { visibility: visible; transition:1s; opacity:1; }
}
@media (min-width:1350px){
	div#header_img img#hImg5 { visibility: visible; transition:1s; opacity:1; }
}
@media (min-width:1250px){
	div#header_img img#hImg4 { visibility: visible; transition:1s; opacity:1; }
}
@media (min-width:1150px){
	div#header_img img#hImg3 { visibility: visible; transition:1s; opacity:1; }
}
@media (min-width:1100px){
	div#header_img img#hImg2 { visibility: visible; transition:1s; opacity:1; }
}
@media (min-width:1000px){
	div#header_img img#hImg1 { visibility: visible; transition:1s; opacity:1; }
}
@media (max-width: 715px){
	div#navigation { left: 190px; top:81px; transition: 1s ease-in-out; }
	div#header a#donate { top:25px; transition: 2s; }
	div#header a#donate input { transform:scale(0.5); transition: 2s; }
}
@media (max-width: 550px){
	div#reportNavList { min-height: 80px;}
}
@media (max-width: 530px){
	div#navigation { left:100px; top:81px; transition: 1s; }
	div#info { width:75px; transition: 1s; font-size: 10px; height: 15px;}
	div#Slideshow { top: 560px;}
}