styles.css

body {
	margin: 0;
	background-image: linear-gradient(to bottom left, #001433, #003380); /* Creates the background gradient */
}

.splash{
	margin: 0;
	height: 100vh; /* 100vh will take the entire monitor height */
}

.about{
	height: 200vh;	
}

.splash-content{
	text-align: center;
	height: 40vh;
	padding: 30vh 30vw; /* Will pad items into a smaller box */
}

.splash-content img {
	width: 25vmin;
	height: 25vmin;
	filter: sepia(100%) hue-rotate(180deg) saturate(4) brightness(110%); /* Modifying how the picture looks to match the background */
}

h1, h2, p {
	color: white;
	font-family: 'Montserrat', sans-serif;
	letter-spacing: 3px; /* Spread letters out a bit more */
	text-align: center;
}

td {
	padding: 1em;
	width: 33%; /* Will force the cells to take 1/3 of the space. This will make them equal width if there are 3 cells */
}

canvas {
	display: block;
	margin: 0 auto;
	background-color: #000; /* Background colour for the canvas */ 
}

.about-content {
	text-align: center;
	padding: 10vh 5vw;
}