Untitled

<!DOCTYPE html>
<html>
<head>
<style>
	body {
		background-color: #e6e6e6;
	}
	h1 {
		font-size: 4.5em;
	}

	button {
		font-size: 30px;
		width: 140px;
		height: 60px;
		border-radius: 5px;
	}

    #startPause {
    	background-color: green;
    	border-color: green;
    }

    #reset {
    	background-color: gray;
    	border-color: gray;
    }

	.container {
		margin: auto;
		margin-top: 200px;
		width: 400px;
		height: 400px;
	}
	#controls {
		margin-left: 7px;
		width: 310px;
		height:70px;
	}
</style>
</head>
<body>
<script>
	var time = 0;
var running = 0;
function startPause(){
	if(running == 0){
		running = 1;
		increment();
	document.getElementById("start").innerHTML = "Pause";
	document.getElementById("startPause").style.backgroundColor = "red";
	document.getElementById("startPause").style.borderColor = "red";
	}
	else{
		running = 0;
	document.getElementById("start").innerHTML = "Resume";
	document.getElementById("startPause").style.backgroundColor = "green";
	document.getElementById("startPause").style.borderColor = "green";
	}
}
function reset(){
	running = 0;
	time = 0;
	document.getElementById("start").innerHTML = "Start";
	document.getElementById("output").innerHTML = "0:00:00:00";
	document.getElementById("startPause").style.backgroundColor = "green";
	document.getElementById("startPause").style.borderColor = "green";
}
function increment(){
	if(running == 1){
		setTimeout(function(){
			time++;
			var mins = Math.floor(time/10/60);
			var secs = Math.floor(time/10 % 60);
			var hours = Math.floor(time/10/60/60);
			var tenths = time % 10;
			if(mins < 10){
				mins = "0" + mins;
			}
			if(secs < 10){
				secs = "0" + secs;
			}
			document.getElementById("output").innerHTML = hours + ":" + mins + ":" + secs + ":" + tenths + "0";
			increment();
		},100)
	}
}
</script>
<div class="container">
<h1><p id="output"><b>0:00:00:00</b></p></h1>
<div id="controls" align="center">
	<button id= "startPause" onclick="startPause()"><b id="start">Start</b></button>
	<button onclick="reset()" id="reset"><b id="reset">Reset</b></button>
</div>
</div>
</body>
</html>