p.choice {
	margin-top: 6em;
	
}

button {
	position: relative;
	margin: 2em;
	padding: .5em 1em;
	width: 300px;
	background: transparent;
	color:darkblue;
	border: 1px solid white;
	border-radius: 3px;
	cursor: pointer;
	transition: all ease 2s;
	font-family: fantasy;
	font-size:large;
	color:red;
}

	button:hover, button:active {
		outline: none;
		background: white;
		color: darkblue;
		font-family: Copperplate, Papyrus, fantasy;
	}

	button::before, button::after {
		position: absolute;
		width: 100%;
		height: 150px;
		left: 0;
		color: maroon;
	}

	button::before {
		content: " ";
		top: -120px;
		background: none center no-repeat transparent;
		background-size: 30px 30px;
		transition: all ease 1s;
		transform: rotate(0deg);
	}

	button:hover::before {
		background-size: 80px 80px;
		transform: rotate(360deg);
	}

	button::after {
		bottom: -520%;
		transition: transform ease-in .5s, opacity ease-out 1s;
	}




#Start::after {
	content: "HFT STUTTGART";
	transform: matrix3d(-200%);
	opacity: 0;
}

#Start:hover::after {
	transform: matrix3d(0);
	opacity: 1;
}

.credit {
    width: 100px;
    height: 100px;
    position: absolute;
    background: url(../Images/HFT_logo.svg);
    background-size: 110px;
    bottom: 50px;
    left: 30px;
    border-radius: 5px;
    box-shadow: 0 0 10px 1px rgb(8, 8, 0);
}