@font-face {
    font-family: 'Museo500';
    src: url('museo/museo500-regular-webfont.eot');
    src: url('museo/museo500-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('museo/museo500-regular-webfont.woff') format('woff'),
         url('museo/museo500-regular-webfont.ttf') format('truetype'),
         url('museo/museo500-regular-webfont.svg#Museo500') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Museo700';
    src: url('museo/museo700-regular-webfont.eot');
    src: url('museo/museo700-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('museo/museo700-regular-webfont.woff') format('woff'),
         url('museo/museo700-regular-webfont.ttf') format('truetype'),
         url('museo/museo700-regular-webfont.svg#Museo700') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Museo900';
    src: url('museo/museo900-regular-webfont.eot');
    src: url('museo/museo900-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('museo/museo900-regular-webfont.woff') format('woff'),
         url('museo/museo900-regular-webfont.ttf') format('truetype'),
         url('museo/museo900-regular-webfont.svg#Museo900') format('svg');
    font-weight: normal;
    font-style: normal;
}

body, html {
	margin: 0;
	padding: 0;
	height: 100%;
	background: #447383 url('../img/brick_background_plain.jpg');
}

a {
	color: #fff;
}
a:hover {
	text-decoration: none;
}

body {
	min-width: 955px;
}

ul, li {
	list-style: none;
}
.supercontainer {
	background: #447383 url('../img/brick_background.jpg') repeat-x center top;
	-webkit-background-size: 1919px 1200px;
	min-height: 830px;
}
.container {
	min-width: 955px;
	min-height: 100%;
}

#section {
	height: 500px;
}
#header {
	position: relative;
	z-index: 100;
	height: 133px;
	width: 100%;
	background-color: #ed1c24;
}
#content {
	position: absolute;
	top: 133px;
	bottom: 224px;
	z-index: 90;
	width: 100%;
	min-height: 480px;
	overflow: visible;
}
#subcontent {
	width: 949px;
	margin: 0 auto;
	height: 100%;
	background: url('../img/brandslang/brandslang_stretch.png') no-repeat 110px 307px;
}
#footer {
	margin: 0 auto 0 auto;
	overflow: visible;
	min-width: 949px;
	height: 224px;
	z-index: 50;
	background: url('../img/brandslang/stoep.png') repeat-x 0px 109px;
}

#logo {
	height: 133px;
	text-align: center;
	background: url('../img/header/stripes.png') no-repeat center top;
}
#nav {
	z-index: 200;
	margin-top: -31px;
	text-align: center;
}
.stoep {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 20px;
	background: url('../img/brandslang/stoep.png') repeat-x 0px 0px;
}

#nav ul, #nav li { display: inline; list-style: none;}

#nav li a, #nav li span {
	height: 55px;
	display: inline-block;
	overflow: hidden;
	text-indent: -9999px;
}

/* -- start nav buttons -- */
#nav .butHome {
	width: 192px;
	background: url('../img/header/but_home.png') no-repeat left top;
}
#nav .butBrandweer {
	width: 207px;
	margin-left: -15px;
	background: url('../img/header/but_brandweer.png') no-repeat left top;
}
#nav .butLeerkrachten {
	width: 247px;
	margin-left: -15px;
	background: url('../img/header/but_leerkrachten.png') no-repeat left top;
}
#nav li a:hover {
	position: relative;
	top: -3px;
	background-position: left -55px;
}
/* -- end nav buttons -- */

/* -- start brandslang -- */
	#brandslang {
		position: relative;
		margin-left: 50%;
		width: 909px;
		height: 200px;
		top: -5px;
		left: -365px;
		z-index: 1;
	}
	#content .brandslang {
		position: relative;
		overflow: visible;
		margin: 0 auto;
		width: 1171px;
		height: 1px;
		top: -29px;
		left: -215px;
		z-index: 1;
	}

	#brandslangTop {
		position: relative;
		display: block;
		width: 909px;
		height: 608px;
		z-index: 10;
		background: url('../img/brandslang/brandslang_top.png') no-repeat;
	}
	#brandslangShade {
		display: block;
		width: 1121px;
		height: 717px;
		z-index: 1;
		background: url('../img/brandslang/brandslang_home_shade.png') no-repeat;
	}
	#footer .brandslang {
		position: relative;
		overflow: visible;
		margin: 0 auto;
		width: 445px;
		height: 236px;
		left: -487px;
	}
	#brandslangBend {
		display: block;
		width: 1600px;
		margin-left: -1155px;
		height: 239px;
		z-index: 1;
		background: url('../img/brandslang/brandslang_bend.png') no-repeat 0px 29px;
	}

/* -- end brandslang -- */

/* homepage Buttons */
.buttons {
	position: relative;
	z-index: 2;
	min-height: 100%;
}
.contentButton {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	width: 200px;
	height: 172px;
	position: absolute;
	left: 0px;
	top: 0px;
}
.contentBg {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	width: 200px;
	height: 172px;
	position: absolute;
	left: 0px;
	top: 0px;
}
.contentButton:hover {
	margin-left: 1px;
	margin-top: 1px;
	background-position: left -172px;
}
.contentButton.gameButton:hover {
	background-position: left -157px;
}
.formButton {
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	width: 129px;
	height: 36px;
	position: relative;
	margin-left: 370px;
}
.formButton:hover {
	background-position: left -36px;
}

.butDoemeewin {
	left: -15px;
	top: 22px;
	width: 251px;
	background: url('../img/buttons/doemeewin.png') no-repeat left top;
}
.butGames {
	width: 220px;
	top: 185px;
	left: 25px;
	background: url('../img/buttons/games.png') no-repeat left top;
}
.butDoedecheck {
	width: 276px;
	top: 340px;
	left: 20px;
	background: url('../img/buttons/doedecheck.png') no-repeat left top;
}
.butDoedecheck_15 {
	width: 276px;
	top: 340px;
	left: 20px;
	background: url('../img/buttons/doedecheck_15sept.png') no-repeat left top;
}
.butWatisbrand {
	width: 232px;
	top: 0px;
	left: 395px;
	background: url('../img/buttons/watisbrand.png') no-repeat left top;
}
.butWatdoejijbijbrand {
	width: 242px;
	top: 160px;
	left: 340px;
	background: url('../img/buttons/watdoejijbijbrand.png') no-repeat left top;
}
.butVerhaalnoah {
	width: 251px;
	top: 320px;
	left: 360px;
	background: url('../img/buttons/verhaalnoah.png') no-repeat left top;
}
.butTestjezelf {
	width: 204px;
	left: 665px;
	top: 25px;
	background: url('../img/buttons/testjezelf.png') no-repeat left top;
}
.butMusical {
	width: 220px;
	left: 660px;
	top: 220px;
	background: url('../img/buttons/musical.png') no-repeat left top;
}
.butProfessor {
	height: 157px;
	width: 120px;
	left: 713px;
	top: 400px;
	background: url('../img/buttons/professor.png') no-repeat left top;
}
.butSmokey {
	height: 157px;
	width: 82px;
	left: 632px;
	top: 400px;
	background: url('../img/buttons/smokey.png') no-repeat left top;
}
.butBilly {
	height: 157px;
	width: 97px;
	left: 785px;
	top: 400px;
	background: url('../img/buttons/brandkraan.png') no-repeat left top;
}
.butProfessorBg {
	width: 245px;
	left: 640px;
	top: 440px;
	background: url('../img/buttons/bg_professor.png') no-repeat left top;
}
.butUpload {
	width: 129px;
	height: 36px;
	background: url('../img/buttons/uploaden.png') no-repeat left top;
}
.butVerstuur {
	width: 129px;
	height: 36px;
	background: url('../img/buttons/verstuur.png') no-repeat left top;
}
.butVerstuur.inactive {
	background: url('../img/buttons/verstuur_inactive.png') no-repeat left top;
}
#brandposter {
	position: absolute;
	left: 815px;
	top: 334px;
	width: 100px;
	height: 138px;
	overflow: hidden;
	text-indent: -9999px;
	z-index: 5;
	background: url('../img/page_assets/bel112.png');
}

#rookmelder {
	position: absolute;
	top: 0px;
	left: -360px;
	width: 85px;
	height: 28px;
	background: url('../img/page_assets/rookmelder.png');
}

#brandblusser {
	position: absolute;
	top: 370px;
	left: 1050px;
	width: 82px;
	height: 195px;
	background: url('../img/page_assets/brandblusser.png');
}
#brandmelder {
	position: absolute;
	top: 270px;
	left: -210px;
	width: 59px;
	height: 58px;
	background: url('../img/page_assets/brandmelder.png');
}

/* -- footer begin -- */

#footer .credits {
	width: 573px;
	position: relative;
	margin: 0 auto;
}

#footer ul, #footer li { list-style: none; display: inline; float: left;}

#footer .credits {
	margin-top: -125px;
}

#footer li {
	color: white;
	font-family: Museo700, verdana;
	font-size: 7px;
}
#footer ul li ul {
	margin: 0;
	padding: 0;
	text-indent: 0;
}
#footer ul li ul li {
	position: relative;
	top: 0px;
	text-indent: 0;
	left: 0;
	margin: 0;
	padding: 0;
}

.footerButton {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	height: 43px;
}
.footerButton:hover {
	opacity: 0.7;
	left: 1px;
}
/* -- footer end -- */

.butBrandweer {
	width: 67px;
	background: url('../img/credits/brandweer.png');
}
.butBrandwonden {
	width: 57px;
	background: url('../img/credits/brandwonden.png');
}
.butMinisterie {
	width: 110px;
	background: url('../img/credits/ministerie.png');
}
.butVebon {
	width: 73px;
	background: url('../img/credits/vebon.png');
}
.butFito {
	width: 47px;
	background: url('../img/credits/fito.png');
}
.butHemmink {
	width: 46px;
	background: url('../img/credits/hemmink.png');
}
.butElro {
	width: 55px;
	background: url('../img/credits/elro.png');
}
.butFirstalert {
	width: 78px;
	background: url('../img/credits/firstalert.png');
}

/* --- content stuff -- */

.allblocks {
	margin-top: 50px;
	margin-left: 200px;
}

.block {
	width: 577px;
	-webkit-background-size: auto cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 577px 100%;
    margin: 0 0 10px 0;
}
.blockcontent {
	width: 537px;
	-webkit-background-size: auto cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 577px 100%;
    padding: 1px 15px 10px 25px;
    position: relative;
    top: -5px;
    left: 5px;
}
.blockinner {
	margin: 15px 5px 5px 5px;
}
.block.yellow {
	background-image: url('../img/blocks/block_yellow_shade.png');
}
.block.yellow .blockcontent {
	background-image: url('../img/blocks/block_yellow.png');
}
.block.yellowS {
	background-image: url('../img/blocks/block_yellowS_shade.png');
}
.block.yellowS .blockcontent {
	background-image: url('../img/blocks/block_yellowS.png');
}
.block.pink {
	background-image: url('../img/blocks/block_pink_shade.png');
}
.block.pink .blockcontent {
	background-image: url('../img/blocks/block_pink.png');
}
.block.pinkS {
	background-image: url('../img/blocks/block_pinkS_shade.png');
}
.block.pinkS .blockcontent {
	background-image: url('../img/blocks/block_pinkS.png');
}
.block.red {
	background-image: url('../img/blocks/block_red_shade.png');
}
.block.red .blockcontent {
	background-image: url('../img/blocks/block_red.png');
}
.block.redS {
	background-image: url('../img/blocks/block_redS_shade.png');
}
.block.redS .blockcontent {
	background-image: url('../img/blocks/block_redS.png');
}
.block.purple {
	background-image: url('../img/blocks/block_purple_shade.png');
}
.block.purple .blockcontent {
	padding-top: 10px;
	background-image: url('../img/blocks/block_purple.png');
}
.block.purpleS {
	background-image: url('../img/blocks/block_purpleS_shade.png');
}
.block.purpleS .blockcontent {
	background-image: url('../img/blocks/block_purpleS.png');
}
.block.teal {
	background-image: url('../img/blocks/block_teal_shade.png');
}
.block.teal .blockcontent {
	background-image: url('../img/blocks/block_teal.png');
}
.block.tealS {
	background-image: url('../img/blocks/block_tealS_shade.png');
}
.block.tealS .blockcontent {
	background-image: url('../img/blocks/block_tealS.png');
}
.block.orange {
	background-image: url('../img/blocks/block_orange_shade.png');
}
.block.orange .blockcontent {
	background-image: url('../img/blocks/block_orange.png');
}
.block.orangeS {
	background-image: url('../img/blocks/block_orangeS_shade.png');
}
.block.orangeS .blockcontent {
	background-image: url('../img/blocks/block_orangeS.png');
}
.page #title {
	height: 2px;
}
.page #title img {
	position: relative;
	left: 30px;
	top: 30px;
}
img.contentImage {
	float: right;
	margin-left: 1em;
	margin-bottom: 1em;
}
.page h1 {
	display:none;
}

.page h2, #overlay h2 {
	position: relative;
	font-family: Museo700;
	font-weight: normal;
	font-size: 26px;
	line-height: 32px;
	color: white;
	text-transform: uppercase;
	text-shadow: 2px 3px 0px rgba(0,0,0,0.6);
	margin: 0;
	padding: 0;
}
.page .prijsvraag h2 {
	font-size: 16px;
	line-height: 20px;
	text-shadow: 1px 2px 0px rgba(0,0,0,0.6);
}
.page h3 {
	font-family: Museo500;
	font-weight: normal;
	font-size: 16px;
	line-height: 16px;
	margin: 0;
	padding: 5px 0;
}
.page h3.white {
	color: white;
}
.page h4 {
	font-family: Museo900;
	font-weight: normal;
	font-size: 12px;
	color: white;
	margin: 0;
	padding: 5px 0;
}
.page p, #overlay p {
	margin-top: 0.5em;
}
.page h2.shade, #overlay h2.shade {
	display: none;
}

.page .block, #overlay .block {
	font-family: Museo500;
	font-weight: normal;
	font-size: 12px;
	line-height: 1.5em;
}

.blockinner > ul {
	margin: 0;
	padding: 0 10px;
}
.blockinner > ul > li {
	background: url('../img/bullet.png') no-repeat 0 2px;
	padding-left: 20px;
}
.blockinner > ul li ul, .blockinner > ul li ul li {
	padding: 0 5px;
	margin: 5px;
	list-style-type: circle;
}
.prijsvraag .blockinner > ul {
	margin: 0.5em 0;
	padding: 0;
}
.prijsvraag .blockinner > ul > li {
	background: none;
	margin: 0;
	padding: 0;
	line-height: 2em;
}
.legenda ul, .legenda li {
	margin: 0;
	padding: 0;
}
.legenda li {
	margin-left: 12px;
	margin-bottom: 1em;
}
.legenda li span {
	position: absolute;
	margin-left: -12px;
	display: block;
	width: 12px;
	height: 19px;
	overflow: hidden;
	text-indent: -9990px;
	background: url('../img/page_assets/li_vlammen.png') no-repeat left top;
}
.legenda li.a span {
	background-position: 0 0;
}
.legenda li.b span {
	background-position: -12px 0;
}
.legenda li.c span {
	background-position: -24px 0;
}
.legenda li.d span {
	background-position: -36px 0;
}
.mainLegenda {
	display: block;
	width: 420px;
	height: 110px;
}
.cLeft ul {
	float: left;
	display: block;
	width: 130px;
}
.cRight ul {
	float: left;
	width: 120px;
}
blockquote {
	margin: 1em 0;
	font-weight: normal;
	font-family: Museo700;
	font-size: 20px;
}
/* prijsvraag */

.i3col label, .i2col label, .i1col label {
	float: left;
	display: block;
	width: 65px;
}
.i3col {
	float: left;
	height: 30px;
	width: 100%;
}
.i3col input {
	float: left;
	width: 440px;
}
.i2col {
	float: left;
	height: 30px;
	width: 330px;
}
.i2col input {
	float: left;
	width: 245px;
}
.i1col {
	float: left;
	height: 30px;
	width: 195px;
}
.i1col input {
	float: left;
	width: 110px;
}
.prijsvraag .largeInput {
	width: 440px;
}
.prijsvraag .inputRadio {
	margin-right: 10px;
}
.game h4 a {
	text-decoration: none;
}
.game h4 {
	padding-bottom: 0.3em;
}
.game {
	clear: both;
	margin-bottom: 1em;
}
img.game {
	float: left;
	margin-top: 7px;
	margin-right: 10px;
	-webkit-box-shadow: 2px 2px 6px 1px #000000;
	box-shadow: 2px 2px 6px 1px #000000;
	border: 5px solid white;
}
img.game:hover {
	opacity: 0.7;
}
#overlay {
	display: none;
	z-index: 10000;
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url('../img/lightbox_bg.png');
}

#overlay_content {
	margin: 0 auto;
	margin-top: 250px;
	width: 577px;
}

#loading {
	display: none;
	text-indent: -9999px;
	overflow: hidden;
	width: 129px;
	height: 36px;
	position: relative;
	margin-left: 370px;
}
.errorpanel {
	position: absolute;
	display: none;
	margin-left: 330px;
	margin-top: 40px;
	width: 162px;
	height: 61px;
	padding: 15px;
	text-align: center;
	font-weight: bold;
	background: url('../img/form/error_bg.png') no-repeat;
	color: white;
}