#coin-flip-cont {
	width: 200px;
	height: 200px;
	position: absolute;
	top: calc(50% - 100px);
	left: calc(50% - 100px);
}

.VertAlignMid {
	margin: 80px 0;
}

.fontDesign {
	font-size: 1rem;
	font-weight: bolder;
}

#coin {
	position: relative;
	width: 200px;
	transform-style: preserve-3d;
}

.TeamImage {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

#coin .front,
#coin .back {
	position: absolute;
	width: 200px;
	height: 200px;
}

#coin .front {
	transform: translateZ(1px);
	border-radius: 50%;
	background-color: white;
}

#coin .back {
	transform: translateZ(-1px) rotateY(180deg);
	border-radius: 50%;
	background-color: white;
}

#coin.animation1980 {
	-webkit-animation: rotate1980 2s linear forwards;
	animation: rotate1980 2s linear forwards;
}

#coin.animation2160 {
	-webkit-animation: rotate2160 2s linear forwards;
	animation: rotate2160 2s linear forwards;
}

@-webkit-keyframes rotate1980 {
	from {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	to {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
}

@keyframes rotate1980 {
	from {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	to {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
}

@-webkit-keyframes rotate2160 {
	from {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	to {
		-webkit-transform: rotateY(2160deg);
		-moz-transform: rotateY(2160deg);
		transform: rotateY(2160deg);
	}
}

@keyframes rotate2160 {
	from {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	to {
		-webkit-transform: rotateY(2160deg);
		-moz-transform: rotateY(2160deg);
		transform: rotateY(2160deg);
	}
}

/* Chris Troll */
#coin.animationtroll {
	-webkit-animation: rotatetroll 9s linear forwards;
	animation: rotatetroll 9s linear forwards;
}

@-webkit-keyframes rotatetroll {
	0% {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	25% {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
	50% {
		-webkit-transform: rotateY(1260deg);
		-moz-transform: rotateY(1260deg);
		transform: rotateY(1260deg);
	}
	75% {
		-webkit-transform: rotateY(90deg);
		-moz-transform: rotateY(90deg);
		transform: rotateY(90deg);
	}
	100% {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
}

@keyframes rotatetroll {
	0% {
		-webkit-transform: rotateY(0);
		-moz-transform: rotateY(0);
		transform: rotateY(0);
	}
	25% {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
	50% {
		-webkit-transform: rotateY(1260deg);
		-moz-transform: rotateY(1260deg);
		transform: rotateY(1260deg);
	}
	75% {
		-webkit-transform: rotateY(90deg);
		-moz-transform: rotateY(90deg);
		transform: rotateY(90deg);
	}
	100% {
		-webkit-transform: rotateY(1980deg);
		-moz-transform: rotateY(1980deg);
		transform: rotateY(1980deg);
	}
	/*from {
        -webkit-transform: rotateY(0);
        -moz-transform: rotateY(0);
        transform: rotateY(0);
    }
    to {
        -webkit-transform: rotateY(1980deg);
        -moz-transform: rotateY(1980deg);
        transform: rotateY(1980deg);
    }
    to {
        -webkit-transform: rotateY(1260deg);
        -moz-transform: rotateY(1260deg);
        transform: rotateY(1260deg);
    }
	to {
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        transform: rotateY(90deg);
    }*/
}
/*Chris Troll End*/
