@charset "UTF-8";
/* ALLGEMEIN */

* {
	/* Abstände */
	padding: 0;
	margin: 0;
	border: 0;
	
	/* Typografie */
	font-family: 'Asap';
	font-size: 1.0em;
	font-style: normal;
	font-weight: normal;
	color: rgb(76, 68, 74);
	text-decoration: none;
	line-height: 1.4em;
	text-align: left;
	
	/* Silbentrennung */
	-ms-hyphens: auto;
	hyphens: auto;
	
	/* Responsive */
	box-sizing: border-box;
}

body {
	padding-top: 1.0em;
}

/* SEITENAUFBAU */

.header {
	width: 100%;
	margin-top: 5px;
	margin-bottom: 15px;
	padding: 0;
	border-bottom: 1pt dotted grey;
	background-color: white;

	height: 50px; 
}

.content {
	/* Ränder */
	padding-top: 2.5%;
}

div.contentleft, div.contentright {
	width: 95%;
}


.footer {
	width: 100%;
	margin-top: 5px;
	
}

p.footer {
	line-height: 1.0em;

}


.start {
	/* Ausrichtung */
	text-align: center;
	vertical-align: middle;
}

/* Animation Elemente einblenden */	
@keyframes einblenden {
	from {
		transform:scale(0.5); 
		opacity: 0.1; 
		filter: alpha(opacity=10);} /* < IE8 */
	to {
		transform:scale(1.0); 
		opacity: 1.0; 
		filter: alpha(opacity=100);} /* < IE8 */
}

#logo, #timer, .team, .ref-content {
	animation-name: einblenden;
	animation-duration: 1s;
	animation-iteration-count: 1;
}

#timer {
	text-align: center;
	font-weight: 600;
	font-size: 1.2em;
	
	margin-top: 5%;
}


/* Animation Referenzen */	

#contentgrid {
	text-align: center;
 	width: 100%;
}

.ref-content {
    position: relative;
    overflow: hidden;

    -webkit-box-shadow: 0px 0px 5px silver;
    -moz-box-shadow: 0px 0px 5px silver;
	box-shadow: 0px 0px 5px silver;
}
 
.ref-img {
    position: absolute;
    left: 0;
	
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    transition: all 300ms ease-out;

}
 
.ref-content .ref-h4, .ref-content .ref-p {
	
	position: relative;
    left:  330px;
    width: 275px;
	
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
	
    -webkit-transition-delay: 150ms;
    -moz-transition-delay: 150ms;
    -o-transition-delay: 150ms;
    -ms-transition-delay: 150ms;
    transition-delay: 150ms;
}


.ref-content:hover .ref-img {
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
	
	opacity: 0.1; 
	filter: alpha(opacity=10); /* < IE8 */
}

.ref-content:hover .ref-h4,
.ref-content:hover .ref-p {
    -moz-transform: translateX(-305px);
    -o-transform: translateX(-305px);
    -webkit-transform: translateX(-305px);
    transform: translateX(-305px);
}



/* TYPO */

h1 {
	font-family: 'Asap';
	font-size: 2.0em;
	font-style: normal;
	font-weight: 600;
	color: #850830;
	text-decoration: none;
	line-height: 1.0em;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 1.5em;
	
	/* Silbentrennung */
	-ms-hyphens: none;
	hyphens: none;
}


h2 {
	font-family: 'Asap';
	font-size: 1.2em;
	font-style: normal;
	font-weight: 600;
	color: rgb(76, 68, 74);
	text-decoration: none;
	line-height: 1.0em;
	text-align: left;
	margin-top: 2.0em;
	margin-bottom: 0.5em;
	
	/* Silbentrennung */
	-ms-hyphens: none;
	hyphens: none;
}

h3 {
	font-family: 'Asap';
	font-size: 1.0em;
	font-style: normal;
	font-weight: 600;
	color: #850830;
	text-decoration: none;
	line-height: 1.0em;
	text-align: left;
	margin-top: 0.75em;
	margin-bottom: -2.0em;
	
	/* Silbentrennung */
	-ms-hyphens: none;
	hyphens: none;
}

.ref-h4 {
	
	font-family: 'Asap';
	font-size: 1.2em;
	font-style: normal;
	font-weight: 600;
	color: #850830;
	text-decoration: none;
	line-height: 1.0em;
	text-align: left;
	margin-bottom: 0.75em;
	margin-top: 1.2em;
	
	/* Silbentrennung */
	-ms-hyphens: none;
	hyphens: none;
}

.ref-p {
	
	font-size: 0.95em;
}

b {
	font-weight: 600;
}


/* LINKS */

a, a:link, a:visited {
	font-weight: normal;
	color: #850830;
	padding: 1px;
}

div.navi p a, div.navi p a:link, div.navi p a:visited {
	background-color: white; 
}

div.navi p a:hover {
	font-weight: normal;
	padding: 1px;
	background-color: #850830;
	color: white;
}



a:hover {
	font-weight: normal;
	padding: 1px;
	background-color: #850830;
	color: white;
}

a.logo, a.logo:link, a.logo:visited, a.logo:hover {
	padding: 1px;	
	background-color: transparent;
	color: transparent;
}


span {	
	font-weight: normal;
	padding: 1px;
	color: #850830;
	
	border-bottom: #850830 2px solid;
}

div.nav p {	
	color: #850830;
	font-weight: bold;

}

/* IMAGES */

.team {
	box-shadow: 0px 0px 5px silver;
}