html {
	text-align: center;
	background: rgba(10,44,117,1);
	font-size: 25px;
}

a {
	text-decoration: none;
	color: inherit;
}
a:hover {
	text-decoration: none;
	opacity: 1;
	color: #0A2C75;
	text-shadow: 0 0 10px #0a2c75;
	transition: all ease .4s;
}

#progressbar {
	width: 100%;
	height: 2px;
	display: none;

	position: fixed;
	top: 0;
	left: 0;

	background: red;
	box-shadow: 1px 2px 3px red;
}

.logo {
	position: fixed;
	bottom: 1em;
	right: 1em;
	width: 200px;
}
.logo img {
	width: 100%;
}


#clock {
	text-align: left;
	display: inline-block;
	padding: 2em 2em 2em 2em ;
	margin: 3em 3em 3em 3em ;
	background: rgba(2,8,23,.8);
	color: grey;
	border: 1px solid #333;
	border-radius: .5em;
	font-family: 'Courier New', monospace;
	word-spacing: -1.1em;
	letter-spacing: .5em;
	white-space: nowrap;
}
#clock > .word {
	text-transform: uppercase;
	font-size: 2em;
	word-spacing: 0em;
	opacity: .1;
	transition: all 3s;
}

#clock > .word.on {
	opacity: 1;
	color: #6c80ac;
	text-shadow: 0 0 5px #6bf;
}