/*basic reset*/

* {margin: 0; padding: 0;}

/*adding a black bg to the body to make things clearer*/

body {
	background: black;
	margin:0;
	padding:0;
}
/* dieser Style setzt alle canvas-Elemente in den Hintergrund*/

canvas {
	display: block;
	position:absolute;
	left:0;
	top:0;
	z-index:-1;
}

/* Buttons */
button {
	position: absolute;
	margin: 0 2em;
	padding: .2em .5em;
	border: transparent;
	cursor: pointer;
	background: transparent;
}

#btn img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}

#btn1 img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}
#btn2 img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}
#btn3 img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}
#btn4 img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}
#btn5 img {
	margin-right: .0em;
	height: 80px;
	width: 80px;
}
}
/*Rotate*/

section {
	height: 50px;
	margin: 50px 0 0 0;
}

aside {
	height: 80px;
	float: center;
	margin: 20px 20px 0 0;
	padding: 10px;
	width: 80px;
	-webkit-transition: all 2s;
	/* für Safari 5.1, Android 2.3 bis 4.3 */
	
	transition: all 2s;
}

aside.rotate {
	background: transparent;
}

section:hover .zwei {
	-webkit-transform: rotate(360deg);
	/* Chrome, Safari, Opera */
	
	-ms-transform: rotate(360deg);
	/* IE 9 */
	
	transform: rotate(360deg);
}

/* Ueberschrift */
h1 {
	font-family: Arial;
	color: white;
	text-align: center;
	cursor:pointer;
}

/* Schatten fuer Neonleuchtschrift */
#text1 {
	text-shadow: 0 0 1px #0f0, 0 0 2px #0f0, 0 0 3px #0f0, 0 0 4px greenyellow, 0 0 7px greenyellow, 0 0 8px lime, 0 0 10px lime, 0 0 15px lime; text-decoration: none;
}

/* Flackern einzelner Buchstaben der Neonleuchtschrift*/
#text1 span {
	-webkit-animation: neon 4s ease-in-out infinite alternate;
	animation: neon 4s ease-in-out infinite alternate;
}

@-webkit-keyframes neon {
	0% {
		opacity: 1;
	}
	30% {
		opacity: 0;
	}
	31% {
		opacity: 1;
	}
	48% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

@keyframes neon {
	0% {
		opacity: 1;
	}
	30% {
		opacity: 0;
	}
	31% {
		opacity: 1;
	}
	48% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

/* Kommentarfeld Button */
.transparent_btn {
	display: inline-block;
	padding: 10px 14px;
	color: #fff;
	border: 1px solid #00ff00;
	font-family: Arial;
	font-weight:bold;
	cursor:pointer;
	float:right;
	background-color: rgba(255,255,255, 0);
	/* -webkit-border-radius: 4px; */
	/* -moz-border-radius: 4px; */
	/* border-radius: 4px; */
	-webkit-transition: background-color 300ms ease;
	-moz-transition: background-color 300ms ease;
	transition: background-color 300ms ease;
	cursor: pointer;
}

/* Kommentarfeld Button */
.transparent_btn.green {
	color: #00ff00;
	border-color: #00ff00;
}
.transparent_btn.green:hover {
	background-color: rgba(134, 236, 147, 0.3);
}