@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,500,500italic,700,700italic,900,900italic,100,100italic);

html {
	font-family: 'Roboto', sans-serif;
	height: 100%;
	background: url(../images/bg.jpg) no-repeat center center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

p {
	font-weight: 300;
	line-height: 23px;
}

ul {
	padding-left: 14px;
	margin-top: 30px;
}

h1 {
	font-size: 51px !important;
	text-transform: uppercase;
	font-weight: 900 !important;
	color: #4f4f4f !important;
	padding-bottom: 0px !important;
	margin-bottom: 7px;
	line-height: 26px !important;
}
	
h2 {
	font-size: 36px;
	font-weight: 700;
	color: #f7c60f;
/* 	margin-top: 0px; */

}


body {
	color: #000;
	background-color: transparent;
}

hr {
    border-top: 1px solid #cacaca;
    margin-top: 32px;
    margin-bottom: 32px;
}

.btn {
	width: 100%;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e0b40e+0,edbe0e+50,e0b40e+100 */
	background: #e0b40e; /* Old browsers */
	background: -moz-linear-gradient(top,  #e0b40e 0%, #edbe0e 50%, #e0b40e 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #e0b40e 0%,#edbe0e 50%,#e0b40e 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #e0b40e 0%, 50%,#e0b40e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0b40e', endColorstr='#e0b40e',GradientType=0 ); /* IE6-9 */
	border: 0px;
	color: #fff;
	font-weight: 700;
	font-size: 20px;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
	padding: 8px 12px;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.btn:hover { 
	color: #fff;
	background: -moz-linear-gradient(top,  #4f4f4f 0%, #3a3a3a 50%, #4f4f4f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #4f4f4f 0%,#3a3a3a 50%,#4f4f4f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #4f4f4f 0%,#3a3a3a 50%,#4f4f4f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}


.logo {
	position: absolute;
	bottom: 30px;
	left: 30px;
	width: 282px;	
}

.festival-doeken {
	position: absolute;
	bottom: 5px;
	right: 30px;
}

.tekst-wrapper {
	position: relative;
	max-width: 635px;
	margin: 145px auto 0 auto;
	padding: 37px;
	background-color: #fff;	
	border: 1px solid #a9a9a9;
	-webkit-border-radius: 12px 12px 12px 12px;
	border-radius: 12px 12px 12px 12px;
	-webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,0.3);
	box-shadow: 0 0 30px 0 rgba(0,0,0,0.3);
}

.prijs {
	font-size: 43px;
	color: #4f4f4f;
	font-weight: 900;
	line-height: 40px;
}

.prijs-geel {
	font-size: 60px;
	padding-top:5px;
	color: #f7c60f;
	font-weight: 900;
	line-height: 50px;
}

#prijs-button {
	position: absolute;
	width: 225px;
	padding: 17px 31px 20px 31px;
	right: -40px;
	top: -40px;	
	height: 150px;
	background-color: #4f4f4f;
	-webkit-border-radius: 12px 12px 12px 12px;
	border-radius: 12px 12px 12px 12px;

}

.totaal {
	font-size: 26px;
	color: #9b9b9b;	
	line-height: 28px;
	font-weight: 700;

}

.ex-btw {
	color: #4f4f4f;
	margin-top: -20px;
}

footer {
	position: relative;
	height: 140px;
}

.spandoek {
	display: block;
	height: auto;
	width: 100%;	
}


.formaat {
	color:#fff; 
	font-size: 13px; 
	font-weight: 700; 
	line-height: 39px;
}

@media (max-width: 991px) {
	.ex-btw {
		font-size: 9px;
	}
	
	.btn {
		margin-top: 40px !important;
	}

}

@media (max-width: 767px) {
	.prijs {
		margin-top: 10px !important;
	}
} 

@media (max-width: 829px) {

	.logo {
		position: relative;
		margin: 20px auto 0 auto;
		display: block;
		bottom: auto;
	}
	
	.festival-doeken {
		position: absolute;
		bottom: -25px;
		right: 30px;
	}
	

	#prijs-button {
		position: absolute;
		width: 225px;
		left: 20px;
		top: 20px;	
	}

	.tekst-wrapper {
		margin-top: 50px;
	}
	
	.spandoek {
		margin-top: 60px;
	}

	h1 {
		font-size: 45px !important;
	}
		
	h2 {
		font-size: 36px;	
	}

}

@media (max-width: 700px) {

	.tekst-wrapper {
		margin: 20px;
	}
}



@media (max-width: 520px) {
	h1 {
		font-size: 30px !important;
	}
		
	h2 {
		font-size: 20px;	
	}

	.spandoek {
		margin-top: 60px;
	}
	
	#prijs-button {
		position: absolute;
		width: 150px;
		left: 20px;
		top: 20px;
		width: 150px;
		padding: 17px 21px 20px 21px;
		right: -40px;
		top: -40px;	
		height: 140px;

	}
	
	.prijs-geel {
		font-size: 40px;
		line-height: 50px;
	}

	.formaat {
		font-size: 10px;
	}
}


@media (max-width: 391px) {
	h1 {
		font-size: 20px !important;
		line-height: 22px;
	}
		
	h2 {
		font-size: 20px;
		margin-top: 0px;		
	}

}