header {
    height:100vh;
    width: 100%;
    justify-content: center;
}

.headerbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index: 1;
}

.headerboxtitle {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99;
	display: flex;
}

.headerboxtitlecenter {
	margin: auto;
	width: 60em;
	padding: 2.5%;
}

.headerboxh1left {
	display: flex;
	justify-content: left;
}

.headerboxh1right {
	display: flex;
	flex-direction: row;
	justify-content: right;
	text-align: right;
}

header > div > div > div > h1 > span {
    font-family: "Fira Sans Condensed", "Arial Narrow", Helvetica, Arial, sans-serif;
}

.headerboxh2 {
	display: flex;
	flex-direction: column;
	justify-content: right;
	text-align: right;
}

.headerboxh2 > h2 {
	margin: 0;
}

	.header-bg {
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		
		height: 100%;
		width: 100%;
		position: absolute;
	}
	
	.header-img1 {
		background-image: url("../headerimg/1.jpg");
	}

	.header-img2 {
		background-image: url("../headerimg/2.jpg");
		animation: slide2Anime 20s infinite;
	}

	.header-img3 {
		background-image: url("../headerimg/3.jpg");
		animation: slide3Anime 20s infinite;
	}

	.header-img4 {
	    background-image: url("../headerimg/4.jpg");
	  animation: slide4Anime 20s infinite;
	}

	.header-img5 {
		background-image: url("../headerimg/5.jpg");
		animation: slide5Anime 20s infinite;
	}

	.header-img6 {
		background-image: url("../headerimg/6.jpg");
		animation: slide6Anime 20s infinite;
	}

	.header-img7 {
		background-image: url("../headerimg/7.jpg");
		animation: slide7Anime 20s infinite;
	}

	.header-img8 {
		background-image: url("../headerimg/8.jpg");
		animation: slide8Anime 20s infinite;
	}

	.header-img9 {
		background-image: url("../headerimg/9.jpg");
		animation: slide9Anime 20s infinite;
	}

	header > div > div > div > h1 {
        text-shadow: 4px 4px 8px #515151;
	}
	header > div > div > div > h2 {
        text-shadow: 4px 4px 8px #515151;
	}

	@keyframes slide2Anime {
		0%{opacity:0;}
		4%{opacity:0;}
		7%{opacity:1;}
		19%{opacity:1;}
		22%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide3Anime {
		0%{opacity:0;}
		15%{opacity:0;}
		19%{opacity:1;}
		30%{opacity:1;}
		33%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide4Anime {
		0%{opacity:0;}
		26%{opacity:0;}
		30%{opacity:1;}
		41%{opacity:1;}
		44%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide5Anime {
		0%{opacity:0;}
		37%{opacity:0;}
		41%{opacity:1;}
		52%{opacity:1;}
		56%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide6Anime {
		0%{opacity:0;}
		48%{opacity:0;}
		52%{opacity:1;}
		63%{opacity:1;}
		67%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide7Anime {
		0%{opacity:0;}
		59%{opacity:0;}
		63%{opacity:1;}
		74%{opacity:1;}
		78%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide8Anime {
		0%{opacity:0;}
		70%{opacity:0;}
		74%{opacity:1;}
		85%{opacity:1;}
		89%{opacity:0;}
		100%{opacity:0;}
		}
	@keyframes slide9Anime {
		0%{opacity:0;}
		81%{opacity:0;}
		85%{opacity:1;}
		93%{opacity:1;}
		96%{opacity:0;}
		100%{opacity:0;}
		}