* {
	margin: 0;
	padding: 0;
}

html {
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

html, body {
	height: 100%;
	width: 100%;						
}

body {
	height: 72%;
	overflow: hidden;
	background-color: green;
	-moz-will-change: background-color;
	-ms-will-change: background-color;
	-o-will-change: background-color;
	-webkit-will-change: background-color;
	-khtml-will-change: background-color;
	will-change: background-color;
	-moz-animation: fadesSchweinchen 6s linear;
	-ms-animation: fadesSchweinchen 6s linear;
	-o-animation: fadesSchweinchen 6s linear;
	-webkit-animation: fadesSchweinchen 6s linear;
	-khtml-animation: fadesSchweinchen 6s linear;
	animation: fadesSchweinchen 6s linear;
}

@-moz-keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

@-ms-keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

@-o-keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

@-webkit-keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

@-khtml-keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

@keyframes fadesSchweinchen {
	0% {background-color: white;}
	70% {background-color: #666;}
	100% {background-color: green;}
}

#eierschale {
	position: relative;
	margin: 0px auto;
	height: 100%;
	width: 900px;
}

#schriftkondom {
	margin-top: 25%;
	height: 28%;
	width: 100%;
}

#introschrift {
	height: 100%;
	width: 100%;
	font-family: Exotica;
	font-size: 60px;
	color: #AAA;
	background-color: transparent;
	text-align: center;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	-webkit-transform-origin: 50% 50%;
	-khtml-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-khtml-transform: rotate(0deg);
	transform: rotate(0deg);
	zoom: 1;
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	-webkit-transform: scale(0);
	-khtml-transform: scale(0);
	transform: scale(0);
	-moz-will-change: transform;
	-ms-will-change: transform;
	-o-will-change: transform;
	-webkit-will-change: transform;
	-khtml-will-change: transform;
	will-change: transform;
	-moz-animation: vertigo 5s ease-in-out 2s forwards;
	-ms-animation: vertigo 5s ease-in-out 6s forwards;		/* der IE rechnet sich zu Tode und muss entlastet werden */
	-o-animation: vertigo 5s ease-in-out 2s forwards;
	-webkit-animation: vertigo 5s ease-in-out 2s forwards;
	-khtml-animation: vertigo 5s ease-in-out 2s forwards;
	animation: vertigo 5s ease-in-out 2s forwards;
}

@-moz-keyframes vertigo {
	0% { -moz-transform: scale(0) rotate(0deg); }
	80% { -moz-transform: scale(1) rotate(4345deg); }
	90% { -moz-transform: scale(1) rotate(4316deg); }
	100% { -moz-transform: scale(1) rotate(4320deg); }
}

@-ms-keyframes vertigo {
	0% { -ms-transform: scale(0) rotate(0deg); }
	80% { -ms-transform: scale(1) rotate(4345deg); }
	90% { -ms-transform: scale(1) rotate(4316deg); }
	100% { -ms-transform: scale(1) rotate(4320deg); }
}

@-o-keyframes vertigo {
	0% { -o-transform: scale(0) rotate(0deg); }
	80% { -o-transform: scale(1) rotate(4345deg); }
	90% { -o-transform: scale(1) rotate(4316deg); }
	100% { -o-transform: scale(1) rotate(4320deg); }
}

@-webkit-keyframes vertigo {
	0% { -webkit-transform: scale(0) rotate(0deg); }
	80% { -webkit-transform: scale(1) rotate(4345deg); }
	90% { -webkit-transform: scale(1) rotate(4316deg); }
	100% { -webkit-transform: scale(1) rotate(4320deg); }
}

@-khtml-keyframes vertigo {
	0% { -khtml-transform: scale(0) rotate(0deg); }
	80% { -khtml-transform: scale(1) rotate(4345deg); }
	90% { -khtml-transform: scale(1) rotate(4316deg); }
	100% { -khtml-transform: scale(1) rotate(4320deg); }
}

@keyframes vertigo {
	0% { transform: scale(0) rotate(0deg); }
	80% { transform: scale(1) rotate(4345deg); }
	90% { transform: scale(1) rotate(4316deg); }
	100% { transform: scale(1) rotate(4320deg); }
}

.schriftA {
	font-family: Exotica;
}

.wackler {
	position: relative;
	top: 0px;
	-moz-will-change: top;
	-ms-will-change: top;
	-o-will-change: top;
	-webkit-will-change: top;
	-khtml-will-change: top;
	will-change: top;
	-moz-animation: wackler 5s ease-in-out 2.1s forwards;
	-ms-animation: wackler 5s ease-in-out 2.1s forwards;
	-o-animation: wackler 5s ease-in-out 2.1s forwards;
	-webkit-animation: wackler 5s ease-in-out 2.1s forwards;
	-khtml-animation: wackler 5s ease-in-out 2.1s forwards;
	animation: wackler 5s ease-in-out 2.1s forwards;
}

@-moz-keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

@-ms-keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

@-o-keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

@-webkit-keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

@-khtml-keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

@keyframes wackler {
	0% { top: 0px; }
	60% { top: -30px; }
	70% { top: -15px; }
	85% { top: 20px; }
	95% { top: -5px; }
	100% { top: 0px; }
}

.schriftB {
	font-family: Rothenburg;
}

#mus, #nonmus {
	position: absolute;
	top: 0;
	left: 0;	
}

#mus {
	cursor: none;
	height: 100%;
	width: 100%;
	z-index: 10;
	background-color: transparent;
}

#nonmus {
	cursor: default;
	height: 0%;
	width: 0%;
	z-index: 20;
	background-color: transparent;
	-moz-animation: maeuschen 0s 9s forwards;
	-ms-animation: maeuschen 0s 9s forwards;
	-o-animation: maeuschen 0s 9s forwards;
	-webkit-animation: maeuschen 0s 9s forwards;
	-khtml-animation: maeuschen 0s 9s forwards;
	animation: maeuschen 0s 9s forwards;
}

@-moz-keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}

@-ms-keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}

@-o-keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}

@-webkit-keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}

@-khtml-keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}

@keyframes maeuschen {
	0% { height: 0%; width: 0%; }
	100% { height: 100%; width: 100%; }
}