/* STYLESHEET AO-MEDIEN.DE */
body { 	margin: 0 auto;
  		max-width: 1200px; min-width:300px;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		background:#404040;
		font-family:Verdana 10pt #E6E6E6; }

header, footer { flex: 1 100%; }

header { font-size:12pt; color:#C0C0C0;
		border:none;
		display: -webkit-flex;
		-webkit-flex-flow: row wrap;
		display: flex;
		flex-flow: row wrap; }

header img { -webkit-flex: 1 1 200px;
		flex: 1 1 200px;
		margin-right: 1em; }

/* NAVIGATION */

nav,
nav ul,
nav li { font-family:Verdana,Arial,sans-serif; color:#C0C0C0; font-size:12pt;
		font-weight:medium;  white-space:nowrap;
		border: none; }

nav {	max-width:400px;
		padding: 0;
		margin: 1em;
		display: -webkit-flex;
		-webkit-align-items: center;
		display: flex;
		align-items: center;
		justify-content: flex-end; }

nav ul { display: -webkit-flex;
		-webkit-justify-content: space-around;
		-webkit-flex-direction: row;
		display: flex;
		justify-content: space-around;
		flex-direction: row; }

nav li { list-style-type: none;
	     margin: 0 10px; }

nav a { color: #C0C0C0;
		text-decoration: none; }

nav a:hover { text-decoration:none;
		color: #E10000; }


/* FOOTER */

footer { margin: 0 auto;
		font-family:Verdana,Arial,sans-serif; font-size:10pt; color:#C0C0C0;
		text-align:center;
		padding-top:3em; padding-bottom:3em; }

footer a { color: #C0C0C0;
		text-decoration: none; }

footer a:hover { text-decoration:none;
			  color: #E10000; }


/* LINKS */

a:link {text-decoration:none;}

a.link1:link   { text-decoration:underline; color: #101014; }
a.link1:visited { text-decoration:underline; color: #101014; }
a.link1:active { text-decoration:underline; color: #101014; }
a.link1:hover  { text-decoration:none; color: #101014; }

a.link2:link   { text-decoration:none; color: #606060; }
a.link2:visited { text-decoration:none; color: #606060; }
a.link2:active { text-decoration:none; color: #606060; }
a.link2:hover  { text-decoration:none; color: #FFDC00; }

a.link3:link   { text-decoration:none; color: #E6E6E6; }
a.link3:visited { text-decoration:none; color: #E6E6E6; }
a.link3:active { text-decoration:none; color: #E6E6E6; }
a.link3:hover  { text-decoration:none; color: #606060; }

a.cta:link   { text-decoration:none; color: #E10000;
				font-size:10pt; font-weight:bold; }
a.cta:visited { text-decoration:none; color: #E10000;
				font-size:10pt; font-weight:bold; }
a.cta:active { text-decoration:none; color: #E10000;
				font-size:10pt; font-weight:bold; }
a.cta:hover  { text-decoration:none; color: #606060;
				font-size:10pt; font-weight:bold; }


/* INHALTE */

main {  -webkit-flex: 1 100%;
		flex: 1 100%;
		font-family:Verdana,Arial,sans-serif; color:#101014; font-size:10pt;
		background: #E6E6E6;
		margin: 0 auto; }

article { -webkit-flex: 1 1 0%;
		flex: 1 1 0%;
		max-width:800px;
		font:Verdana,Arial,sans-serif; font-size:10pt; color:#101014;
		text-align:left;
		padding:1em; margin:3em auto; }

aside { -webkit-flex: 1 2 0%;
		flex: 1 2 0%;
		max-width:400px;
		padding:1em; margin:3em; }

#usp { display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		min-width: 300px; max-width:800px;
		margin:3em auto; }

#box { font-family:Verdana,Arial,sans-serif; font-size:10pt; color:#101014;
		border-radius: 0.5em;
		box-shadow: 2px 2px 5px #101014;
		border: solid 2px #101014;
		background:#E6E6E6;
		width:200px;
		vertical-align:top; text-align:center;
		padding:1em; margin:10px auto; }

#btx { font-family:Verdana,Arial,sans-serif; font-size:10pt; color:#101014;
		vertical-align:top; text-align:left; }

#ref { display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-align-content: center;
		align-content: center;
		-webkit-justify-content: center;
		justify-content:center;
		background:#E6E6E6;
		min-width: 300px; max-width:800px;
		margin:3em auto; }

#but { -webkit-flex: 1 1 0%;
		flex: 1 1 0%;
		margin:0 auto; }
	

#vidfull { width:100%;
		max-width:800px; max-height:450px;
		margin:3em auto; }


/* ÜBERSCHRIFTEN */

h1 { font-family:Verdana,Arial,sans-serif; font-size:12pt; color:#101014;
	margin-top:5px; margin-left:0px; margin-bottom:5px; }
h2 { font-family:Verdana,Arial,sans-serif; font-size:12pt; color:#101014;
     margin-top:5px; margin-left:0px; margin-bottom:5px; }
h3 { font-family:Verdana,Arial,sans-serif; font-size:12pt; color:#FF8028;
	margin-top:5px; margin-left:0px; margin-bottom:5px; }
h4 { font-family:Verdana,Arial,sans-serif; font-size:10pt; color:#101014;
     margin-top:5px; margin-left:0px; margin-bottom:5px; }
h5 { font-family:Verdana,Arial,sans-serif; font-size:10pt; color:#E6E6E6;
     margin-top:5px; margin-left:0px; margin-bottom:5px; }

hr { color:#606060; border:0,5px solid #606060; margin:10px; }

/* BILDER */
img { border:none;
	margin:0; }

img.head { float:left;
	border:none; margin:1em;
	width:12em; }

img.icon { border:none;
	width:60px;
	margin:15px; }

img.but { border:none;
	width:100%;
	max-width:60px;
	margin:0 auto; }

img.p1 { border:none;
	width:100%; height:auto;
	margin:10px; }

.vid { width: 100%; height: 100%;}


/* SLIDESHOW */
#gal { position: relative;
	width:100%;
	margin-bottom:1em;
	padding: 0;
}

#gallery img {
	width: 100%;
	margin: 0;
	padding: 0;
}

.changer figure {
	/* wird erst per JS aktiviert */

	position: absolute;
	width: 100%;
	margin: 0;
	padding: 0;
	opacity: 0;
}

.changer figcaption {
	position: absolute;
	right: 2em;
	top: 3em;
	font-family:Verdana,Arial,sans-serif; font-size:2em; color:#101014;
	text-align: right;
	background-color:rgba(230,230,230,0.5);
	margin:0; padding:8px; }


/* WECHSELANZEIGE */
.vshow { position:absolute;
		top:0; left:0;
		width: 100%; height: 100%; }

#show {	padding-bottom: 56.25%; /* Default for 16:9 ratio*/
		padding-top: 0;
		margin: 0;
		overflow: hidden; }

#vshow { width:100%;
		max-width:560px; max-height:315px;
		margin:1em auto; }
		
.show figure {
	top: 0;
	left: 0; }

.show figcaption {
	font-size:10pt; color:#101014;
	text-align:center;
	margin:0; padding:0; }

/* FORMULARE */
form { border:none; }

textarea { font-family:Verdana,Arial,sans-serif; font-size:8pt; color:#E6E6E6;
		border-bottom:1px dotted #E6E6E6 ; border-top:none; border-left:none; border-right:none;
		margin:2px;
		background-color:#202020;
		scrollbar-base-color:#202020; scrollbar-face-color:#202020; scrollbar-track-color:#202020; }

input { font-family:Verdana,Arial,sans-serif; font-size:8pt; color:#E6E6E6;
		border-bottom:1px dotted #E6E6E6 ; border-top:none; border-left:none; border-right:none;
		margin:2px;
		background-color:#202020; }

.but { font-family:Verdana,Arial,sans-serif; font-size:8pt; color:#E6E6E6;
		width:80px;
		border:2px outset #E6E6E6;
		background-color:#202020; }