body, h1, h2, h3 {
	font-family: 'Open Sans'; 
	font-weight: 300;
}

#content {
	margin: auto;
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;

	width: 100%;
	height: 500px;

	text-align: center;
}

h1 {
	font-size: 60px;
	margin: 0;
}

.small {
	font-size: 28px;
}

.gray {
	color: #aaa;
}

.lightgray {
	color: #ddd;
}

.red {
	color: #a00;
}

.power {
	font-size: 65px;
}

.binary {
	font-size: 20.5px;
}

.hex {
	display: inline-block;
	font-size: 20.5px;
	width: 120px;
	text-align: left;
}

sup {
	font-size: 54px;
}

@media (max-width: 550px) {
	h1 {
		font-size: 44px;
	}
	
	.small {
		font-size: 22px;
	}
	
	.power {
		font-size: 48px;
	}
	
	.binary {
		font-size: 15px;
	}
	
	.hex {
		font-size: 15px;
		width: 100px;
	}
	
	sup {
		font-size: 40px;
	}
	
	#content {
		height: 400px;
	}
}

@media (max-width: 320px) {
	h1 {
		font-size: 36px;
	}
	
	.small {
		font-size: 18px;
	}
	
	.power {
		font-size: 44px;
	}
	
	.binary {
		font-size: 13px;
	}
	
	sup {
		font-size: 32px;
	}
	
	#content {
		height: 350px;
	}
}