body, html {
	margin: 0px;
	padding: 0px;
	min-height: 100%;
    width: 100%;
    height: 100%;
    text-align: center;
}

body {
	background: #000 url(/images/background-Plaspop-Aalsmeer-Watertheater-2024.svg);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-attachment: fixed;

	background-size: contain;
	bottom: -100px;
}

a {
	text-decoration: underline;
}
    
a:link, a:visited, a:active {
	color: #FEC900;
}

a:hover {
	color: #CCC;
}


.PageWidth {
	width: 1280px;
	margin: 0px auto;
}

img {
	margin: 0px;
	padding: 0px;
	border: none;
}


.wit {
	color: #FFF;
}

.geel {
	color: #FEC900;
}

.roze {
	color: #DC96C1;
}

.groen {
	color: #C4DB97;
}
.blauw {
	color: #39BBD4;
}`

#Wrapper {
    margin: 0px;
    padding: 0px;
}

#Logo {
	width: 60%;
	margin: 0px auto;
	padding: 15% 15% 10%;
}

#DateSlogan {
	padding: 2.5% 0;
}

#DateSlogan h2 {
	font-size: 11em;
}
#DateSlogan h3 {
	font-size: 3.4em;
}


#Locatie {
	width: 70%;
	margin: 0px auto;
	padding-bottom: 2.5%;
}

#Tijden {
	width: 70%;
	margin: 0px auto;
	padding-bottom: 2.5%;
}

.SocialMedia a {
	width: auto;
	padding: 1.5% 3%;
	vertical-align: top;
	display: inline-block;
	text-align: center;
	color: #FFF;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 1em;
	font-weight: 600;
	margin: 5% 2.5%;
}

.Facebook a {
	background-color: #2F5192;
	background-color: #2F5192;
}

.Twitter a {
	background-color: #4EC1F0;
}

.Facebook a:hover,
.Twitter a:hover {
	opacity: .8;
}


.BigButton a {
	width: auto;
	padding: 1.5% 3%;
	vertical-align: top;
	display: inline-block;
	text-align: center;
	color: #000;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 1em;
	font-weight: 600;
	margin: 5% 2.5%;
	background-color: #C9D304;
}

.BigButton a:hover {
	opacity: .8;
}


#Programma {
	
}

#Programma h1 {
	color: #C9D304;
}

.ProgrammaItem {
	margin: 2.5% 0;
}
				
.ProgrammaItem h3 {
	font-size: 3.0em;
	color: #39BBD4;
	margin: 0;
}

.ProgrammaItem p {
	text-transform: uppercase;
	font-size: 2em;
	font-weight: 400;
}

.Sponsors {
	background-color: #FFF;
    text-align: center;
    padding: 1%;
    margin-bottom: 10%;
}

.Sponsors h6 {
	margin: 1%;
}

.Sponsors > img,
.Sponsors > a  {
	display: inline-block;
	margin: 0 5% 2.5%;
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
	.PageWidth {
		min-width: 769px;
		width: 1024px;
		margin: 0px auto;
	}

	#DateSlogan h2 {
		font-size: 5em;
	}	
	#DateSlogan h3 {
		font-size: 1.6em;
	}
	
		#Sponsors > a  {
		margin: 1px 5% 1%;
	}
	
	.SocialMedia a {
		font-size: 1.0em;
		font-weight: 600;
		display: inline-block;
	}
}


@media screen and (min-width: 375px) and (max-width: 414px) {
	
	.PageWidth {
		min-width: 375px;
		width: 414px;
		margin: 0px auto;
	}

	#DateSlogan h2 {
		font-size: 5em;
	}	
	#DateSlogan h3 {
		font-size: 1.6em;
	}	

	.ProgrammaItem h3{
		font-size: 150%;
	}
	.ProgrammaItem p {
		font-size: 130%;
	}
}

@media screen and (min-width: 321px) and (max-width: 375px) {
	
	.PageWidth {
		min-width: 321px;
		width: 375px;
		margin: 0px auto;
	}	

	img {
		width: 240px !important;
		margin: 0px;
		padding: 0px;
		border: none;
	}

	#DateSlogan h2 {
		font-size: 5em;
	}	
	#DateSlogan h3 {
		font-size: 1.6em;
	}	

	.ProgrammaItem h3{
		font-size: 150%;
	}
	.ProgrammaItem p {
		font-size: 130%;
	}

	.Sponsors {
	    padding-top: 5% !important;
	}
	
	.Sponsors a  {
		display: inline-block;
	}
	
	.SocialMedia a {
		font-size: 1.4em;
		padding: 3%;
	}	

}

@media screen and (max-width: 320px) {
	
	.PageWidth {
		width: 320px;
		margin: 0px auto;
	}
}