html {
	font-size: 100%;  								/* bugfix für IE, der ansonsten fontsize em nicht richtig berechnen kann */
	height: 100%;									/* zusammen mit min-height body immer volle Höhe */
	padding: 0 1rem;
	}
body {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;
	font-size: 0.9rem;								/* vielfaches der aktuell eingestellten Schriftgroesse des Browsers, standard 16px */
	color: #66666f;
	max-width: 1200px;
	min-height: 100%;								/* immer volle Höhe, nicht darüber hinaus jedoch, wie bei height */	
	margin: 0 auto;
	background-color: #fff;
	position: relative;								/* für footer width und bottom */
	}
body, footer {
	width: 100%;
	}
h1 {
	color: #BF2E6C;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	}
h2 {
	color: #00A686;
	font-size: 1.2rem;
	margin: 1rem 0 0.8rem 0;
	}
h1, h2 {
	line-height: 1.3;
	}
a		{color: #00A686; text-decoration: none;}
a:hover	{text-decoration: underline;}

#counter {
	top: 19rem;
	right: 0;
	}

header {
	height: calc(7rem + 28vw);
	}
#topsection {
	max-height: 7rem;
	height: 8vw;
	padding-top: 1vw;
	}
.topslide {
	background: #00A686;
	margin: -1rem 0rem 0rem 0rem;
	height: calc(22vw + 1.4rem);
	max-height: 18.3rem;
	position: relative;
	z-index: 1;
	border-style: solid;
	border-color: #fff;
	border-width: 2px 0 0 0;
	-moz-box-shadow: 0 41px 22px -27px rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0 41px 22px -27px rgba(0, 0, 0, 0.4);
	box-shadow: 0 41px 22px -27px rgba(0, 0, 0, 0.4);
	}

/* Dreier-Sektion im topslidecontainer */
/* kann direkt beeinflußt werden ohne in die phtml zu müssen, allerdings gelegentlich mit !important */
#atop, #logc, #film {
	display: inline-block;
	height: 100%;
	width: 31%;
	padding: 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 30%;
	}

#atop {
	padding: 1rem 0 1rem 1rem;
	}
#logc {
	background: #fff;
	border-style: solid;
	border-color: #00A686;
	border-width: 1rem 0 1rem 0.8rem;
	padding: 1rem;
	}
#film {
	width: 40%;
	height: calc(22vw - 0.6rem);
	max-height: 16.3rem;
	position: absolute;
	top: 1rem;
	right: 1rem;
	background: #bbb;
	overflow: hidden;
	border-style: solid;
	border-color: #00A686;
	border-width: 0 0 0 1rem;
	}

#logc a {
	background: url(../../ima/indi/logo.png);
	background-position: center center;
	background-repeat: no-repeat;
		-webkit-background-size: contain;
		-moz-background-size: contain;
		background-size: contain;
	display: table;
	height: 100%;
	width: 100%;
	}
#topfilm .eigenvideo {
	border: none;
	border-radius: 0;
	background: none;
	padding: 0;
	}
	
/* Topnavi als Table */
header nav {
	clear: both;
	font-size: 1rem;
	position: relative;
	}
header nav ul {
	display: table;
	width: 100%;
	margin-bottom: 0.5rem;							/* in content.css wird ein margin angegeben, das hier überschrieben wird */
	}
header nav li {
	display: table-cell;
	text-align: center;
	white-space: nowrap;
	}
header nav li a {
	color: #fff;
	border-style: solid;
	border-color: #fff;
	border-width: 0px 2px 0 0;
	text-decoration: none;
	padding: 0.3em 0.4rem 0.2rem 1.3rem;
	display: block;									/* macht inline-element hyperlink (was nur den eigentlichen platz einnimmet) zum blockelement und verbreitert ihn */
	background: #00A686;
	}
header nav li:last-child a {
	border-color: #00A686;
	}
header nav li a:hover, header nav li a.topact {
	text-decoration: none;
	}

/* Leistnavi als Liste */
#leist {
	position: absolute;								/* Unternav wird hier aus dem Listenverbund herausgetrennt */
	top: calc(6rem + 24vw);
	left: 0.9rem;
	font-size: 0.9em;								/* Größe hängt durch em von topnav ab */
	width: calc(14% + 5rem);
	overflow: hidden;
	}
#leist ul li {
	display: list-item;
	text-align: left;
	}
#leist ul li a {
	color: #66666f;
	margin: 0 0 -1px 0px;
	padding: 6px 2px 3px 25px;
	background: none;
	border-style: dotted;
	border-color: #aaa;
	border-width: 0 0 1px 0;
	}
#leist ul li:first-child a {
	border-width: 1px 0;
	}
#leist a:hover, #leist a.leistact {
	box-shadow: none;
	color: #BF2E6C;
	text-decoration: none;
	}
#leist a:hover:before, #leist a.leistact:before, header nav li a:hover:before, header nav li a.topact:before, #leist ul li a:before {
	content: ">>";
    font-family: cursive;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: -5px;
    margin: 0 10px 0 -22px;
    vertical-align: 0;
	line-height: 0;
	}
	
/* Innernav */
#leist #innernav {
	margin: 2px 0px 0px 48px;
	font-size: 0.9em;								/* Größe hängt durch em von topnav ab */
	}
#leist #innernav li a {
	padding: 5px 0 3px 14px;
	}
#leist #innernav li a {
	border-width: 0 0 1px 0;
	}
#leist #innernav li a:before {
	content: "";
	}
	
/* main */
main {
	clear: both;
    padding: 1rem 2rem 1rem 0;
	margin-left: calc(23% + 3rem);
	min-height: 22rem;
	}
	
#topzusnav {
	position: absolute;
	right: 0;
	margin-top: 1.7rem;
	}
#topzusnav a {
	color: #66666f;
	border-style: solid;
	border-color: #00A686;
	border-width: 0 0 0 1px;
	padding: 0 0.5rem;
	display: inline-block;
	height: 1.8rem;
	line-height: 1.9rem;
	}
#topzusnav a:hover {
	color: #00A686;
	}
#topzusnav a:first-child {
	border-width: 0;
	}
	

#ticker {
	float: left;
	font-size: 0.8rem;
	line-height: 1rem;
	margin: 2rem 0 0 0;
	overflow: hidden;
	width: 70%;
	height: 3rem;
	}
#ticker a {
	color: #66666f;
	}
#ticker a:hover {
	color: #00A686;
	}
#ticker b {
	text-transform: uppercase;
	text-decoration: underline;
	color: #66666f;
	}

	
/* adressblock */
#adressblock {
	display: flex;
	}
#adressblock ul li {
	height: 1.1rem;
	}
#adressblock em, .team em {
	margin-left: 0rem;
	}
.adrname {
	font-weight: bold;
	}
.adrort {
	margin-bottom: 0.8rem;
	}
	
/* spezielles */
#startcontainer {
	float: left;
	width: calc(95% - 19rem);
	}
aside {
	float: right;									/* setzt leiste an rechte seite */
	margin: 1rem 0 2rem 1rem;
	width: 17rem;
	}
aside ul {
	list-style-type: none;
	}
aside ul li em {
	margin: -1px 8px -5px 0 !important;
	}
aside .adrname {
	border-style: solid;
	border-color: #00A686;
	border-width: 0 0 1px 0;
	margin-bottom: 10px;
	}
aside a {
	color: #66666f;
	}
aside a:hover {
	text-decoration: none;
	color: #00A686;
	}

/* Spezial */
.team {
	margin-top: 2rem;
	}
	
#oeff {
	padding: 5px;
	width: 100%;
	margin: 0.5rem 0 1.5rem;
	border-spacing: 1px;
    border-collapse: separate;
	}
#oeff td {
	padding: 2px 9px;
	background: #DFDFDF;
	}
#job b
{
color: #00A686;
}


/*
##########################################################################################################################################
*/
@media (min-width: 1250px) {

header {
    height: calc(28rem + 2vw);
	}
#leist {
	top: 25rem;
	}


} /*--- Schlußklammer ---*/

/* Anmeldung */

#anmeld {
	position: absolute;
	left: 0;
	margin-top: 9rem;
	max-width: 21vw;
	opacity: 0.8;
	-webkit-transition: opacity 0.2s ease;
	-moz-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
	}
#anmeld:hover {
	opacity: 1;
	}
	
@media (max-width: 800px)
{
#anmeld {
	left: initial;
	right: 0;
	margin-top: 24rem;
	max-width: 21rem;
	width: 14rem;
	}
}
@media (max-width: 640px)
{
#anmeld {
	right: initial;
	bottom: -15rem;
	}
}

.tuev
{
width: 30%;
max-width: 15rem;
min-width: 9rem;
border: none;
padding: 0;
}

#tuevsiegel
{
display: inline-block;
width: 6rem;
height: 43px;
margin: 6px 0 0 12px;
}

#tuevsiegel img
{
margin-bottom: -15px;
}

#vema_serviceapp
{
width: 100%;
min-height: 61rem;
border: none;
}