body {height:400px;}
#timer {border:white 3px solid; width:560px; height:315px; margin:0 auto; text-align:center; background-color: rgba(255, 255, 255, 0.3);}
#timer h1 {font-size:52px; display:inline-block; font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; margin:10px;}

h1 {font-size:52px; display:block; font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; text-align: center; margin:80px auto 0;}
p {font-size:20px; display:block; margin:100px auto; text-align:center; width:650px;}
img {opacity:0.6;}

audio {margin:20px auto; display:block;}

@keyframes bodycolor {
	0%{background-color:#FF4747}
	20%{background-color:#0084FF}
	40%{background-color:#28FF00}
	60%{background-color:#FFAB00}
	80%{background-color:#FF4747}
	90%{background-color:#F54DFF}
	100%{background-color:#FF4747}
}

body {
    animation: bodycolor 5s infinite;}

	@keyframes karl {
		0%{transform:rotate(0deg)}
		50%{transform:rotate(180deg)}
		100%{transform:rotate(360deg)}
	}
	
	img {
		animation: karl 4s infinite;}