/*RESET*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
 body {line-height: 1;}
 ol, ul{list-style:none;}
 blockquote, q{quotes:none;}
 blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
 :focus{outline:0;}
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
 table{border-collapse:collapse; border-spacing:0;}


/*MAIN*/

body {
	font-size: 1.05em;
	line-height: 1.25em;
	font-family: Helvetica Neue, Helvetica, Arial;
	/*background: #fff;*/
	color: #555;
}

a {
	color: #E30613;
	text-decoration: none;
	font-weight: bold;}

a:hover {
	text-decoration: underline;}

img {
	max-width:100%;
	height:auto;
}

header {
	background: #f5f5f5;
	width: 100%;
	height: 76px;
	position: fixed;
	top: 0;
	left: 0;
	border-bottom: 4px solid #E30613;
	z-index: 100;}

#logo {
	margin: 20px;
	float: left;
	width: 200px;
	height: 40px;
	background: url(../img/logo.png) no-repeat center;
	display: block;}

nav {
	float: right;
	padding: 20px;}

#menu-icon {
	display: hidden;
	width: 40px;
	height: 40px;
	background: #ababab url(../img/menu-icon.png) center;}

a:hover#menu-icon {
	background-color: #E30613;
	border-radius: 4px 4px 0 0;}

nav ul {
	list-style: none}

nav li {
	display: inline-block;
	float: left;
	padding: 10px}

.current {
	color: #2262AD;}

section {
	margin: 76px auto 40px;
	max-width: 980px;
	position: relative;
	padding: 20px;
	}

h1 {
	font-size: 2em;
	color: #E30613;
	line-height: 1.15em;
	text-align: center;
	margin: 20px 0 ;}

h2 {
	font-size: 1.3em;
	color: #000;
	line-height: 1.15em;
	text-align: center;
	margin: 20px 0 ;}

p {
	line-height: 1.45em;
	margin-bottom: 20px;
	text-align: justify;}

section ol {
	list-style-type: decimal;
	list-style-position: inside;
        padding-left: 20px;
	}

section ul {
	list-style-type: disc;
	list-style-position: inside;
        padding-left: 20px;
	}

//section ul li:before { content: '✓';}
//ul.symbol { list-style: url(apfel.svg) }

section li {
	/*display: block;*/
	/*float: left;*/
	padding: 15px;
	text-indent: -40px; /* Rücksetzung des Einzugs */
	padding-left: 20px; /* Einzug für den restlichen Text */}

section ul li::marker  {
	content: '✓ ';
	font-size: 36px;
	font-weight: 900;
	color:#E30613; 
	}

td	{
	margin:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:0px;
	padding-top:10px}

input[type="submit"] {
	font-size: large;
	/*font-weight: bold;*/
	text-align: center;
	padding: 5px 12px; 
	/*font-family: Roboto, sans-serif;
	font-weight: 300;
	color: teal;
	border: 1px solid silver;
	background-image: linear-gradient(to top, gainsboro 0%, white 90%)*/}

footer {
	background: #f5f5f5;
	/*margin: 80px auto 40px;*/
	/*max-width: 980px;*/
	/*position: relative;*/
	/*vertical-align:middle;*/
	text-align:center;
	//padding-left:200px;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:40px;

	/*background-color: #f9f9f9*/
	/*width: 100%;*/
	/*height: 76px;*/
	/*position: fixed;*/
	/*bottom: 0;*/
	/*left: 0;*/
	}
 
sub {
	vertical-align:middle;
	margin: 40px auto 200px;
	max-width: 980px;
	/*position: relative;*/
	/*text-align: center;*/
	//padding: 20px;
	font-size: small;
	text-align: left;
	}

sub li {
	padding: 15px;
	text-indent: -15px; /* Rücksetzung des Einzugs */
	padding-left: 5px; /* Einzug für den restlichen Text */
	padding-top: 0px;
	padding-bottom: 0px;}

#etghcookie {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background: #eee;
	padding: 20px;
	font-size: 14px;
	font-family: verdana}

#etghcookie a.button {
	cursor: pointer;
	background: #ccc;
	padding: 8px 20px;
	margin-left: 10px;
	border-radius: 5px;
	font-weight: bold;
	float: right}

#etghcookie a.button:hover {
	background-color: #aaa}

#etghcookie p.cookiemessage {
	display: block;
	padding: 0;
	margin: 0}


/*MEDIA QUERY*/

@media only screen and (max-width : 1000px) {

	header {
		background-color: #f9f9f9
		/*position: absolute;*/}

	#menu-icon {
		display:inline-block}

	nav ul, nav:active ul {
		display: none;
		position: absolute;
		padding: 20px;
		/*background: #fff;*/
		background: #f9f9f9;
		border: 5px solid #444;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px}

	nav li {
		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0}

	nav:hover ul {
		display: block}

	.button {
		font-family:Verdana,sans-serif;
		font-size:12px;
		font-weight:700;
		background-color:#E30613;
		color:#fff;
		border:none;
		cursor:pointer;
		padding:10px}
}

.video-section,
.image-section {
  margin-top: 76px;
  margin-bottom: -76px;
  display: flex;
  justify-content: center;
  background: linear-gradient(to right, #FFD0A3 0%, #ffffff 25%, #ffffff 75%, #FFD0A3 100%);
}

.video-section-grey,
.image-section-grey {
  margin-top: 76px;
  margin-bottom: -76px;
  display: flex;
  justify-content: center;
  /*background: linear-gradient(to right, #f5f5f5 0%, #ffffff 25%, #ffffff 75%, #f5f5f5 100%);*/
  background: linear-gradient(to right, #F98089 0%, #ffffff 25%, #ffffff 75%, #F98089 100%);
}

.video-container {
  position: relative;
  max-width: 980px;
  margin: 0 auto;
  width: 100%;
}

.video-container video,
.video-container img {
  width: 100%;
  height: auto;
  display: block;
}

.video-poster {
  position: relative;
  cursor: pointer;
}

.video-poster img {
  width: 100%;
  display: block;
}

.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  color: white;
  background: rgba(0,0,0,0.5);
  border-radius: 50%;
  width: 80px;
  height: 80px;
  text-align: center;
  line-height: 80px;
}