@font-face {
  font-family: 'XXXLutz';
  src: 	url('../fonts/XXXLutzSans-Bold.woff') format('woff'),
  		url('../fonts/XXXLutzSans-Bold.woff2') format('woff2');
  font-weight: 600;
}
@font-face {
  font-family: 'XXXLutz';
  src: 	url('../fonts/XXXLutzSans-Heavy.woff') format('woff'),
  		url('../fonts/XXXLutzSans-Heavy.woff2') format('woff2');
  font-weight: 800;
}
@font-face {
  font-family: 'XXXLutz';
  src: 	url('../fonts/XXXLutzSans-Medium.woff') format('woff'),
  		url('../fonts/XXXLutzSans-Medium.woff2') format('woff2');
  font-weight: 500;
}
@font-face {
  font-family: 'XXXLutz';
  src: 	url('../fonts/XXXLutzSans-Medium.woff') format('woff'),
  		url('../fonts/XXXLutzSans-Medium.woff2') format('woff2');
  font-weight: 500;
}
@font-face {
  font-family: 'XXXLutz';
  src: 	url('../fonts/XXXLutzSans-Regular.woff') format('woff'),
  		url('../fonts/XXXLutzSans-Regular.woff2') format('woff2');
  font-weight: 400;
}
*, ::after, ::before {
	box-sizing: border-box;
}
body {
	margin: 0px;
	padding: 0px;
	background-color: #fff;
	color: #000;
	font-family: 'XXXLutz', sans-serif;
	font-weight: 400;
}
#canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	pointer-events: none;
	z-index: 1;	
}
.menu-birthyear {
	color: #BC9B5A !important; 
	font-weight: 600;
}
.image-as-background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
.image-as-background img {
	width: 100% !important;
	height: 100% !important;
	-o-object-fit: cover;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}
#logo {
	width: 150px;
	position: fixed;
	left: 28px;
	top: 28px;
	z-index: 1003;
	cursor: pointer;
}
#logo img {
	width: 100%;
}
#jubidubilaeum {
	width:200px;
}

.section {
	height: 100vh;
	width: 100%;
	position: relative;
}
.section.bg-start {
	height:100%;
}
.section__content-img img {
	max-width: 100%;
	position: relative;
}
.section__content-img {
	display:block;
	height:auto;
	overflow: hidden;
}

.section__background {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: -1;
}
.section__content, .section__content-content {
	max-width: 1100px;
	width: 100%;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	-ms-flex-align: center!important;
	align-items: center!important;
	z-index: 2;
	position: relative;
}
.section__content-left, .section__content-right {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	position: relative;
	width: 100%;
	display: block;
}
.section__content-p {
	position: absolute;
}

.intro .section__content-left .intro__content {
	background-color: #BC9B5A;
	color: #fff;
	padding: 20px;
}
.intro .section__content-left .intro__content .intro__content-header {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	width: 100%;
	-ms-flex-align: end!important;
	align-items: flex-end!important;
}
.intro .section__content-left .intro__content .intro__content-header .intro__content-header-left {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	position: relative;
	width: 100%;
	display: block;
}
.intro .section__content-left .intro__content .intro__content-header .intro__content-header-left img {
	margin-top: -120px;
	margin-left: -10px;
}
.intro .section__content-left .intro__content .intro__content-header .intro__content-header-right {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	position: relative;
	width: 100%;
	display: block;
}
.intro .section__content-left .intro__content .intro__content-header .intro__content-header-right h1 {
	font-size: 50px;
	line-height: 55px;
	text-align: right;
	font-weight: 600;
	margin-top: 0px;
	margin-bottom: 20px;
}
.intro .section__content-left .intro__content .intro__content-text {
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 19px;
	text-align: right;
}
.intro .section__content-right .intro__content {
	padding: 20px;
	background-color: #D02F27;
	color: #fff;
}
.intro .section__content-right .intro__content .intro__content-header .intro__content-header-left {
	font-size: 21px;
	line-height: 25px;
	margin-bottom: 10px;
}
.intro .section__content-right .intro__content .intro__content-header .intro__content-header-right {
	font-size: 50px;
	line-height: 40px;
	font-weight: 600;
	padding-bottom: 20px;
	position: relative;
}
.intro .section__content-right .intro__content .intro__content-header .intro__content-header-right:after {
	content: '';
	width: calc(100% + 40px);
	height: 1px;
	opacity: 0.5;
	background-color: #fff;
	display: block;
	position: absolute;
	left: -20px;
	bottom: 0px;
}
.intro .section__content-right .intro__content .intro__content-text {
	margin-top: 20px;
}
.intro .section__content-right {
	margin-top: 420px
}
.template-1 .section__content-left h2 {
	font-size: 75px;
	line-height: 75px;
	text-align: right;
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 0px;
	margin-bottom: 0px;
}
.template-1 .section__content-right {
	padding-top: 70px;
}
.bg-1:after {
	content: '';
	width: 50%;
	height: 100%;
	position: absolute;
	background-color: #fff;
	top: 0px;
	left: 0px;
	opacity: 0.75;
	z-index: 1;
}
.template-1 .section__content-right h2 {
	font-size: 75px;
	line-height: 75px;
	text-align: left;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 10px;
	margin-top: 0px;
}
.template-1 .section__content-right p {
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	padding-left: 20px;
}
.template-1 .section__content-p {
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	padding-top: 20px;
	padding-right: 20px;
	text-align:right;
	padding-left:100px;
}
.template-1 .section__content-left{
	text-align:right;
}
.bg-2:after {
	content: '';
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 50%;
	z-index: 1;
	background: #D02F27;
}
.template-2 .section__content-left h2 {
	font-size: 55px;
	line-height: 55px;
	text-align: right;
	font-weight: 400;
	text-transform: uppercase;
	padding-right: 20px;
}
.template-2 .section__content-left p {
	padding-right: 20px;
	font-size: 16px;
	line-height: 24px;
	text-align: right;
}
.fun-fact {
	margin-top: 85px;
}
.fun-fact .fun-fact-wrapper {
	background-color: #E6E6E6;
	display: table;
	width: 100%;
	max-height: 153px;
	height: 100%;
}
.fun-fact .fun-fact-wrapper .fun-fact-img {
	float: left;
	width: 153px;
	height: 153px;
	position: relative;
	text-align: right;
}
.fun-fact .fun-fact-wrapper .fun-fact-img img {
	display: block;
	width: 100%;
}
.fun-fact .fun-fact-wrapper .fun-fact-img:after {
	content: '';
	width: 1px;
	height: 100%;
	background-color: #fff;
	position: absolute;
	right: 0px;
	top: 0px;
}
.fun-fact .fun-fact-wrapper .fun-fact-img .fun-fact-img-text {
	text-transform: uppercase;
	width: min-intrinsic;
	width: -webkit-min-content;
	width: -moz-min-content;
	width: min-content;
	display: table-caption;
	display: -ms-grid;
	-ms-grid-columns: min-content;
	font-size: 24px;
	line-height: 27px;
	text-align: right;
	letter-spacing: 0.05em;
	font-weight: 600;
	padding: 20px;
	display: inline-block;
}
.fun-fact .fun-fact-wrapper .fun-fact-img .fun-fact-img-text:after {
	content: '';
	display: block;
	width: 69px;
	height: 69px;
	background-image: url('../img/bulb.png');
	position: absolute;
	left: -34px;
	top: 15px;
}
.fun-fact .fun-fact-wrapper .fun-fact-img .fun-fact-img-text span {
	color: #D02F27;
}
.fun-fact .fun-fact-wrapper .fun-fact-text {
	padding: 15px;
	float: left;
	width: calc(100% - 153px);
	font-size: 16px;
	line-height: 24px;
}
.fun-fact .fun-fact-share {
	padding: 30px;
	text-align: right;
}
.fun-fact .fun-fact-share a {
	font-size: 14px;
	line-height: 17px;
	text-align: right;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	color: #000;
	text-decoration: none;
	position: relative;
	padding-right: 50px;
	display: inline-block;
}
.fun-fact .fun-fact-share a:after {
	content: '';
	width: 34px;
	height: 27px;
	background-image: url('../img/share.svg');
	display: block;
	position: absolute;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	right: 0px;
	top: -5px;
}
.bg-3:after {
	content: '';
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1;
	background: #F7F7F7;
}
.template-3 .section__content-right h2 {
	font-size: 55px;
	line-height: 55px;
	text-align: left;
	font-weight: 400;
	text-transform: uppercase;
	padding-left: 20px;
}
.template-3 .section__content-right p {
	padding-left: 20px;
	font-size: 16px;
	line-height: 24px;
	text-align: left;
}
.bg-4:after {
	content: '';
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 50%;
	z-index: 1;
	background: #F7F7F7;
}
.template-4 .section__content-right h2 {
	font-size: 55px;
	line-height: 55px;
	text-align: left;
	font-weight: 400;
	text-transform: uppercase;
	padding-left: 20px;
}
.template-4 .section__content-right p {
	padding-left: 20px;
	font-size: 16px;
	line-height: 24px;
	text-align: left;
	margin-bottom: 0px;
}
.template-4 .section__content-right .section__content-img {
	margin-top: 80px;
}

#overlay {
	display: block;
	background-color:#D02F27;
	font-size:30px;
	width:100%;
	height:100%;
	z-index:1005;
	padding:30px;
	position: absolute;
	top:0px;
	text-align: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: none;
    color:white;
    font-weight:600;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;

    align-items: center;

}
#overlay a {text-decoration: none; color:white;}
.mobmenu-item { margin-bottom:20px; display: block;}
#overlayContent{
	width:100%;
}
#overlay #close {
	position: absolute;
	top:15px;
	right:15px;
	width:30px;
}
#menu {
	position: absolute;
	top:15px;
	right:15px;
	width:30px;
	display:none;
}
#menu img {

	width:30px;
}

/* Timeline */
#timeline  {
	position: fixed;
	z-index: 1000;
	left: 0px;
	top: 50%;
	transform: translate(0,-50%);
}


/* Navigation */ 
#nav {
	width:200px;
}
#nav, #nav ul {
	padding: 0;
	list-style-type: none;
	padding-left: 28px;
}
.nav-item, .nav-cat {
	padding-bottom:6px;
	padding-top:6px;
	overflow:hidden;
}
#navcontainer {
	top:20px;
	position: relative;
}
#navarrow {
	position: absolute;
	top:0px;
	left:0px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 13px 0 13px 15px;
	border-color: transparent transparent transparent #D02F27;
}
.nav-item:hover {
	font-weight:bold;	
}
.nav-item {
	position: relative;
	letter-spacing: 2px;
	font-size: 14px;
	font-weight: 400;
}
.nav-cat .nav-link{
	font-weight:500;
	font-size:18px;
	letter-spacing:2px;
}
.nav-cat a, .nav-item a {
	text-decoration: none;
	color: inherit;
}
.hover {
	text-align: center;
	margin: 0 auto;
	padding: 0;
	transition: all 0.2s ease-in-out;
	position: relative;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.hover:before, .hover:after {
	content: "";
	position: absolute;
	bottom: -5px;
	width: 0px;
	height: 2px;
	margin: 5px 0 0;
	transition: all 0.2s ease-in-out;
	transition-duration: 0.5s;
	opacity: 0;
	background-color: #D02F27;
}
.hover.hover-1:before, .hover.hover-1:after {
	left: 0;
}
.nav-link:hover {
	cursor: default;
}
#nav li:hover .hover:before, .nav-link:hover .hover:after {
	width: 100%;
	opacity: 1;
}
.year-wrapper {
	height:auto;
	overflow:hidden;
}
.intro:after {
	content: '';
	display: block;
	position: absolute;
	width: 30px;
	height: 30px;
	background-image: url('../img/arrow.svg');
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	left: 50%;
	bottom: 20px;
	transform: translate(-50%,0);
}
.section__content-birthyear {
	display: none;
}
.section__content-wrapper {
	width: 100%;
}
.birthyear .section__content-birthyear {
	display: block;
}
.birthyear-wrapper {
	width: 100%;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: auto;
	margin-right: auto;
	-ms-flex-align: center!important;
	align-items: center!important;
}
.birthyear-left {
	text-align: right;
}
.birthyear-left, .birthyear-right {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	position: relative;
	width: 100%;
	display: block;
	margin-bottom: -70px;
}
.birthyear-right {
	text-align: left;
}
.birthyear-right h2 {
	margin-left: 20px;
	font-weight: 400;
	font-size: 55px;
	line-height: 100%;
	text-transform: uppercase;
}
.birthyear .section__content-img {
	/*max-height:200px;*/
} 

/* Date Display */ 
#dateDisplay {
	opacity: 0;
	position: fixed;
	z-index: 1000;
	left: 50%;
	transform: translate(-52px,0px);
	top: 28px;
}
.number img, .numbers_divider img {
	position: relative;
	padding:0;
	margin:0;
}
.number, .numbers_divider {
	display: inline-block;
	vertical-align: top;
	padding:0;
	margin:0;
}
#date {
	background-color:black;
	height:100px;
	width:1000px;
	vertical-align: top;
	overflow:hidden;
}
#dateWrapper {
	width:420px;
	overflow: hidden;
}
#dateContainer {
	transform:scale(0.5);
	left:300px;
	top:50px;
	text-align:left;
	transform-origin: 0% 0%;
}
#dateArrow {
	width:60px;
	height:35px;
	left:73px;
	background-color:black;
	position:relative;
	clip-path: polygon(50% 100%, 0 0, 100% 0);
	-webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
}

/* Input */ 
.input {
	display: inline-block;
	margin-right: 5px;
}
.input input[type="text"] {
	border: none;
	background-color: #fff;
	border-radius: 5px;
	width: 50px;
	text-align: center;
	font-family: 'XXXLutz', sans-serif;
	font-weight: 500;
	font-size: 55px;
	text-align: center;
	width: 250px;
	margin-left:45px;
}
.button {
	display: inline-block;
	cursor: pointer;
}
.button.chooseYear {
	opacity:0.5;
}
.button.chooseYear img{
	width:40px;

}
.nav-headline {
	font-weight:300;
	font-size:14px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.nav-cat .nav-link {
	font-weight:500;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
#balloons {
	width:100%;
	top:0px;
	z-index:1000;


}
#balloon1, #balloon2, #balloon3, #balloon4 {
	position: absolute;
	top:120%;
	z-index:1000;
}
#balloon1 {
	left:10%;
	width:100%;
}
#balloon2 {
	left:30%;
	width:100%;
}
#balloon3 {
	left:50%;
	width:100%;
}
#balloon4 {
	left:70%;
	width:100%;
}
#balloons img {
	width:20%;
	max-height:500px;
}
.fun-fact-share {display:none;}

#cat-id-15 .section__content-right h2,
#cat-id-23 .section__content-right h2 {
	margin-top:120px;
}
#cat-id-36 .section__content-right h2 {
	margin-top:195px;
}

#footer {
	z-index:1001; position:absolute; left:0px; bottom:0px; display:block; z-index:1000;
	font-family: 'XXXLutz', sans-serif;
	font-weight: 300;
	width:100%;
	padding:5px 30px 5px 30px;
	opacity:0.8;
}
#footer a {
	color:black;
	text-decoration: none;
	font-size:11px;
	display:inline;
}



@media (max-width:1450px){
	.section__content-wrapper {
		padding-left:160px;
	}
	#dateDisplay {
		/*margin-left:5%;	*/
	}
	.fun-fact .fun-fact-wrapper .fun-fact-text, .section__content-right p, .section__content-left p {
		font-size:14px !important;
		line-height:20px !important;
	}
	.bg-3:after, .bg-1:after {
		width:calc(50% + 80px);
	}
	.bg-2:after, .bg-4:after {
		left: calc(50% + 80px);
	}
	.section__content-right p {
		padding-right:10px;
	}
	.nav-headline {
		font-size:12px;
	}
	.template-1 .section__content {
		padding-left:160px;
	}
	.template-1 .section__content-p {
		padding-left:0px;
	}
	#dateContainer {
		margin-left:91px;
		transform:scale(0.4)
	}
	.section__content.intro {
		padding-left:160px;
	}
}

@media (max-width:1024px){
	.template-1 .section__content-left h2, .template-2 .section__content-left h2, .template-3 .section__content-left h2, .template-4 .section__content-left h2, 
	.template-1 .section__content-right h2, .template-2 .section__content-right h2, .template-3 .section__content-right h2, .template-4 .section__content-right h2 {
		font-size:44px;
		line-height:44px;
	}
	.fun-fact .fun-fact-wrapper .fun-fact-img {
		width:100px;
		height:100%;
		background-color: #b69c62;
	}
	.fun-fact .fun-fact-wrapper .fun-fact-img img {
		margin-top:3px;
	}
	.fun-fact .fun-fact-wrapper .fun-fact-img:after {
		width:0px;
	}
	.fun-fact .fun-fact-wrapper .fun-fact-text {
		width: calc(100% - 100px);
	}
	.template-4 .section__content-right .section__content-img, .fun-fact {
		margin-top:60px;
	}
}

@media (max-width:830px){
	.template-1 .section__content-left h2, .template-1 .section__content-right h2{
		font-size:60px;
		line-height:60px;
	}
	 .template-2 .section__content-left h2, .template-3 .section__content-left h2, .template-4 .section__content-left h2, 
	 .template-2 .section__content-right h2, .template-3 .section__content-right h2, .template-4 .section__content-right h2 {
		font-size:36px;
		line-height:36px;
	}
}

@media (max-height: 820px){
	.nav-item {
		font-size:11px;
		padding-top: 4px;
		padding-bottom: 0px;
	}
	#navarrow {margin-top:-7px;}
	.nav-headline {
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

@media (max-height: 700px){
	.nav-item {
		font-size:10px;
		padding-top: 3px;
		padding-bottom: 0px;
	}
	#navarrow {margin-top:-7px;}
	.nav-headline {
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

@media (max-height: 650px){
	.nav-item {
		font-size:10px;
		padding-top: 3px;
		padding-bottom: 0px;
	}
	#navarrow {margin-top:-7px;}
	.nav-headline {
		padding-top: 0px;
		padding-bottom: 0px;
	}
	.nav-cat {padding-bottom:3px}
}

@media (max-height: 820px) and (min-width: 740px){
	.section__content-img {
		/*max-height:200px;*/
	}
	.fun-fact {
		margin-top: 30px;
	}
	.template-4 .birthyear-left, .birthyear-right {
		margin-bottom: 0px;
	}
	.birthyear .template-4 .fun-fact {
		display: none;
	}
	.birthyear-left, .birthyear-right {
		margin-bottom: -20px;
	}
}

@media (min-width: 740px){
	.template-4 .birthyear-left, .birthyear-right {
		margin-bottom: 0px;
	}
	.birthyear .template-4 .fun-fact {
		margin-top: 25px;
	}
}


.section__start .bg-1:after {
	content: '';
	width: 50%;
	height: 100%;
	position: absolute;
	background-color: #fff;
	top: 0px;
	left: 0px;
	opacity: 0.75;
	z-index: 1;
}

.start {
	background-color:#D02F27;
	padding:30px 30px 80px 30px;
	bottom:0px;
	color:white;
	text-align:center;
	position: absolute;
	width:100%;
	min-height:50%;
	  border-top:10px solid white;
}

#campaigntitle {
	position:absolute;
	margin-top:-370px;
	margin-left:-150px;
}
#campaignlogo {
	position:absolute;
	margin-top:-154px;
	margin-left:560px;	
}
.start h2 {
	font-size: 2.5em;
}
.start p {
	font-size:18px;
}
.start__content-text {
	max-width:600px;
	margin-left:auto;
	margin-right:auto;
}
.start__content-wrapper
{
	margin: 0;
  position: relatie;
  /*top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);*/
}
#scroll_arrow {position: absolute; bottom:7px; width:100%; text-align: center;}
.intro__content-wrapper .intro__content h1 {
	font-size:60px !important;
}

.header-image-container {
	height:60%;
}

.img-2020-2025 {object-position: right;}


.header-image-1 {background-image:url('../img/header-1.jpg'); transform-origin: "50% 50%"; background-position: center 20%;}
.header-image-2 {background-image:url('../img/header-2.jpg'); transform-origin: "50% 50%"; background-position: 40% 70%;}
.header-image-3 {background-image:url('../img/header-3.jpg'); transform-origin: "30% 50%"; background-position: 20% 100%;}
/*.header-image-4 {background-image:url('../img/header-4.jpg');}
.header-image-5 {background-image:url('../img/header-5.jpg');}
.header-image-6 {background-image:url('../img/header-6.jpg');}
.header-image-7 {background-image:url('../img/header-7.jpg');}
*/
.header-image-container{
  position:relative;
  width:100%;
  height:calc(60% + 20px);
}
.header-image-box {position: absolute; background-size: cover; border:6px solid white;}

.header-image-1 {width:50%;height:100%; left: 0%; top: 0%; border-left:none; border-top:none;}
.header-image-2 {width:50%;height:50%; left: 50%; top: 0%; border-top:none;border-right:none;}
.header-image-3 {width:50%;height:50%; left: 50%; top: 50%; border-right:none;}


@media (max-width: 500px){
	.header-image-1 {width:50%;height:100%; left: 0%; top: 0%; border-left:none; border-top:none;}
	.header-image-2 {width:50%;height:35%; left: 50%; top: 0%; border-top:none;border-right:none;}
	.header-image-3 {width:50%;height:50%; left: 50%; top: 35%; border-right:none;}
}
@media (max-height:800px) and (min-width:400px){
	.header-image-container{
  position:relative;
  width:100%;
  height:50%;
}
}
@media (max-width: 850px) and (min-aspect-ratio: 4/5){
	.header-image-1 {width:50%;height:100%; left: 0%; top: 0%; border-left:none; border-top:none;}
	.header-image-2 {width:50%;height:40%; left: 50%; top: 0%; border-top:none;border-right:none; display:none;}
	.header-image-3 {width:50%;height:100%; left: 50%; top: 0%; border-right:none; border-top: none;}
}
@media (min-aspect-ratio: 4/3){
	.header-image-1 {width:40%;height:100%; left: 0%; top: 0%; border-left:none; border-top:none;}
	.header-image-2 {width:30%;height:100%; left: 40%; top: 0%; border-top:none; border-right:6px solid white;}
	.header-image-3 {width:30%;height:100%; left: 70%; top: 0%; border-right:none; border-top:none;}
}
@media (min-aspect-ratio: 5/3){
	.header-image-1 {width:35%;height:100%; left: 0%; top: 0%; border-left:none; border-top:none;}
	.header-image-2 {width:30%;height:100%; left: 35%; top: 0%; border-top:none;border-right:none;border-right:6px solid white;}
	.header-image-3 {width:35%;height:100%; left: 65%; top: 0%; border-right:none;}
}


/*@media (max-width: 600px){
	.header-image-1 {width:50%;height:50%; left: 0%; top: 0%;}
	.header-image-2 {width:50%;height:50%; left: 50%; top: 0%;}
	.header-image-3 {width:33%;height:20; left: 0%; top: 50%; border-left:none; border-top:6px solid white;}
	.header-image-4 {width:33%;height:20%; left: 33%; top: 50%;}
	.header-image-5 {width:33%;height:20%; left: 66%; top: 50%;}
	.header-image-6 {width:50%;height:30%; left: 0%; top: 70%; border-left:none;}
	.header-image-7 {width:50%;height:30%; left: 50%; top: 70%;}
}

@media (max-height: 800px) {
	.header-image-container{
	    height:40%;
	}
	.start {
		height: 60%;
	}
	.header-image-1 {width:50%;height:60%; left: 0%; top: 0%; border:6px solid white; border-left:0px; border-top:0px;}
	.header-image-2 {width:50%;height:60%; left: 50%; top: 0%; border:6px solid white; border-right:0px; border-top:0px;}
	.header-image-3 {width:33.3%;height:40%; left: 0%; top: 60%; border:6px solid white; border-bottom:0px; border-left:0px;}
	.header-image-4 {width:33.3%;height:40%; left: 33%; top: 60%; border:6px solid white;border-bottom:0px; border-right:0px;}
	.header-image-5 {width:33.3%;height:40%; left: 67%; top: 60%; border:6px solid white;border-bottom:0px; border-right:0px;}
	.header-image-6 {display:none;}
	.header-image-7 {display:none;)
}*/