body,html {
	margin: 0px;
	padding: 0px;
	background-color: #140808;
	font-family: 'Open Sans', sans-serif;
}

a {
	color: white;
}

header {
	height: 100vh;
	width: 100%;
	background-color: #180a07;
	background-image: url('/images/kevin4.jpg');
	background-position: right bottom;
	background-size: cover;
	position: fixed;
	z-index: 0;
}

header .logo {
	margin: 60px;
	width: 400px;
}

header .welcome {
	width: 50%;
	max-width: 600px;
	color: white;
	margin: 100px 60px 60px;
}

header .welcome h1 {
	font-weight: 400;
	font-size: 19pt;
	margin-bottom: 10px;
}

header .welcome p {
	font-weight: 300;
	margin: 0px;
}

@media screen and (max-width: 1000px) {
	
	header .welcome {
		width: 45%;
	}
	
	header .welcome h1 {
		font-size: 13pt;
		font-weight: 700;	
	}
	
	header .welcome p {
		font-weight: 300;
		font-size: 10pt;
	}
	
}

@media screen and (max-width: 800px) {
	
	header .welcome {
		width: auto;
		position: absolute;
		bottom: 0px;
	}
	
	header .welcome h1 {
		background-color: rgba(21, 8, 8, 0.66);
		padding: 5px 10px;
		float: left;
	}
	
	header .welcome p {
		background-color: rgba(21, 8, 8, 0.66);
		padding: 5px 10px;
		float: left;
		clear: left;
	}
	
	footer {
		background-color: rgba(21, 8, 8, 1) !important;
	}
	
}

.push {
	height: 100vh;
}

footer {
	position: relative;
	z-index: 1;
	background-color: rgba(21, 8, 8, 0.66);
	color: white;
	padding: 10px 60px 10px;
}

footer p {
	font-size: 15px;
	font-weight: 300;
}

@media screen and (max-width: 500px) {
	
	header {
		height: 90vh; /* Fix for ios */
	}
	
	header .welcome {
		margin: 0px 30px 30px;
	}
	
	header .welcome h1 {
		font-size: 10pt;	
	}
	
	header .logo {
		margin: 60px auto;
		display: block;
		width: 80%;
	}
	
	footer {
		background-color: rgba(21, 8, 8, 1);
		padding: 10px 30px 10px;
	}
	
}

@media screen and (max-height: 400px) {
	
	header .logo {
		max-width: 50%;
	}
	
	footer {
		background-color: rgba(21, 8, 8, 1);
		padding: 10px 30px 10px;
	}
	
}
