@charset "UTF-8";
/* CSS Document */


@import url("reset.css");
/*@import url("diagnostic.css");*/



body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	}


.clearfix {
	clear: both;
	}






/*
------------------------------------------------------- */

#wrapper {
	width: 960px;
	margin: 0 auto;
	}


/*
------------------------------------------------------- */

#header {
	background: url(/img/header.gif);
	width: 960px;
	height: 260px;
	position: relative;
	}


/*
------------------------------------------------------- */

#logo {
	position: absolute;
	left: 166px;
	top: 124px;
	width: 217px;
	height: 130px;
	}
#logo a {
	display: block;
	width: 217px;
	height: 130px;
	text-indent: -9999px;
	}






/* search
------------------------------------------------------- */

#search {
	position: absolute;
	left: 393px;
	top: 141px;
	}
#search input#searchQuery {
	height: 14px;
	padding: 5px 0;
	margin-top: 1px;
	border: 0;
	outline: none;
	width: 409px;
	font-size: 14px;
	float: left;
	}
#search input#searchBttn {
	width: 84px;
	height: 28px;
	border: none;
	outline: none;
	background: url(/img/searchBttn.gif);
	cursor: pointer;
	float: left;
	margin-left: 2px;
	line-height: 80px;
	text-indent: -999999px;
	}
#search p.attention {
	display: block;
	color: RGB(150,150,150);
	font-style: italic;
	font-size: 11px;
	clear: both;
	margin-left: 20px;
	padding-top: 4px;
	}
#search #caption {
	position: absolute;
	top: -20px;
	left: 0px;
	color: RGB(150,150,150);
	}



/*
------------------------------------------------------- */

#poweredby {
	position: absolute;
	right: 80px;
	top: 0;
	width: 257px;
	height: 51px;
	}

a#logo_bibliotheek {
	display: block;
	width: 127px;
	height: 51px;
	background: url(/img/logo_bibliotheek.gif);
	float: left;
	text-indent: -9999px;
	}
a#logo_volkskrant {
	display: block;
	width: 115px;
	height: 51px;
	background: url(/img/logo_volkskrant.gif);
	float: left;
	text-indent: -9999px;
	margin-left: 15px;
	}






/* content
------------------------------------------------------- */

#content {
	padding: 45px 0 45px 70px;
	width: 890px;
	}


#mainContent {
	float: left;
	width: 348px;
	color: RGB(100,100,100);
	background: url(/img/mainContentBottom.gif) left bottom;
	padding-bottom: 94px;
	}
#mainContent .top {
	background: url(/img/mainContentTop.gif);
	height: 21px;
	margin-bottom: 6px;
	}
#mainContent h2,
#mainContent h3,
#mainContent p {
	margin: 0 20px 18px 20px;
	}
#mainContent h3 {
	margin-bottom: 0px;
	}
#mainContent ol {
	margin: 0 20px 18px 20px;
	list-style-type: decimal; 
	padding-left: 17px;
	}
#mainContent ol li {
	margin-bottom: 6px;
	}
#mainContent a:link,
#mainContent a:visited {
	color: RGB(204,7,30);
	}
#mainContent a:hover {
	color: RGB(236,148,34);
	}	

#mainContent h2.winnaars {
	font-size: 28px;
	font-weight: normal;
	margin-bottom: 40px;
	}
#mainContent div.winnaars {
	overflow: hidden;
	margin-bottom: 20px;
	}
#mainContent div.winnaars img {
	float: left;
	margin: 0 20px 0 0;
	}



#sideBar {
	float: left;
	width: 232px;
	margin-left: 20px;
	position:  relative;
	}
#quizBttn a {
	display: block;
	width: 232px;
	height: 70px;
	background: url(/img/quizBttn.gif);
	text-indent: -9999px;
	}
#startQuizBttn a {
	display: block;
	width: 232px;
	height: 70px;
	background: url(/img/startQuizBttn.gif);
	text-indent: -9999px;
	}

#quizIntro {
	width: 233px;
	height: 337px;
	background: url(/img/e-reader.png);
	margin-top: 30px;
	color: RGB(204,7,30);
	}
#quizIntro h2 {
	font-size: 18px;
	margin: 18px 0 8px 0;
	display: none;
	}
#quizIntro p {
	width: 200px;
	display: none;
	}

#prijzen {
	position: absolute;
	left: 250px;
	top: -72px;
	width: 271px;
	height: 216px;
	overflow: hidden;
	}
#prijzen img {
	width: 271px;
	height: 216px;
	}

#winnaars-button a {
	display: block;
	width: 159px;
	height: 48px;
	background: url(/img/winnaarsBttn.gif);
	text-indent: -9999px;
	}



/* voorwaarden
------------------------------------------------------- */

#voorwaarden {
	background: url(/img/voorwaardenBottom.gif) left bottom;
	width: 550px;
	}
#voorwaarden .top {
	background: url(/img/voorwaardenTop.gif);
	height: 16px;
	margin-bottom: 10px;
	}
#voorwaarden iframe {
	margin: 0;
	padding: 0;
	margin-left: 20px;
	width: 506px;
	height: 270px;
	background: white;
	border: 2px solid RGB(190,190,190);
	}
#voorwaarden form#akkoord {
	padding: 20px 0 20px 180px;
	}
#voorwaarden form#akkoord input#nietakkoord {
	}
#voorwaarden form#akkoord input#akkoord {
	}




/* quiz
------------------------------------------------------- */

#quiz {
	position: relative;
	background: url(/img/quizBG.gif) no-repeat 0 60px;
	width: 859px;
	height: 262px;
	}
#quiz h2 {
	position: absolute;
	width: 86px;
	height: 34px;
	top: 14px;
	left: 20px;
	background: url(/img/quiz.gif);
	text-indent: -9999px;
	}
#quiz h3 {
	position: absolute;
	width: 121px;
	height: 22px;
	left: 120px;
	top: 31px;
	text-indent: -9999px;
	}
#quiz h3.question1 {
	background: url(/img/question1.gif);
	}
#quiz h3.question2 {
	background: url(/img/question2.gif);
	}
#quiz h3.question3 {
	background: url(/img/question3.gif);
	}


#quiz #question {
	position: absolute;
	left: 24px;
	top: 86px;
	width: 290px;
	height: 160px;
	color: white;
	font-weight: bold;
	}
#quiz #question p {
	margin-bottom: 18px;
	}

#quiz form {
	position: absolute;
	left: 415px;
	top: 81px;
	width: 400px;
	height: 160px;
	}

#quiz form div#answerBox,
#quiz form div#titleBox {
	position: absolute;
	}
#quiz form div#titleBox {
	top: 89px;
	}

#quiz form label {
	display: block;
	height: 22px;
	text-indent: -9999px;
	}
#quiz form input#title,
#quiz form input#answer {
	height: 14px;
	padding: 5px 0;
	margin-top: 1px;
	border: 0;
	outline: none;
	width: 324px;
	font-size: 14px;
	}
#quiz form input#submitBttn {
	position: absolute;
	right: -44px;
	top: 65px;
	width: 57px;
	height: 28px;
	background: url(/img/okBttn.gif);
	border: none;
	outline: none;
	cursor: pointer;
	line-height: 80px;
	text-indent: -9999px;
	}







/* registratie
------------------------------------------------------- */

form#registratie {
	width: 550px;
	background: url(/img/voorwaardenBottom.gif) left bottom;
	padding-bottom: 20px;
	position: relative;
	}

form#registratie .top {
	background: url(/img/voorwaardenTop.gif);
	height: 16px;
	margin-bottom: 20px;
	}

form#registratie ul {
	padding-left: 20px;
	}
form#registratie ul li {
	margin-bottom: 30px;
	}
form#registratie ul li h2 {
	margin-left: 16px;
	color: RGB(204,7,30);
	font-size: 14px;
	margin-bottom: 4px;
	}
form#registratie ul li h3 {
	margin-left: 16px;
	}
form#registratie ul li input.txt {
	width: 484px;
	background: url(/img/registrationField.gif) no-repeat;
	height: 18px;
	padding: 5px 0;
	border: 0px;
	outline: none;
	border-top-style:none;
	font-size: 14px;
	padding-left: 16px;
	}

form#registratie ul li label.radio {
	margin-left: 16px;
	}

form#registratie input#submit {
	position: absolute;
	bottom: -14px;
	left: 30px;
	width: 95px;
	height: 28px;
	background: url(/img/registratieSubmitBttn.gif);
	border: none;
	outline: none;
	cursor: pointer;
	line-height: 80px;
	}








/* downloads
------------------------------------------------------- */

#downloads h2 {
	font-size: 18px;
	}

#downloads h3 {
	font-size: 13px;
	}

#downloads p {
	margin-bottom: 30px;
	}

#downloads ul {
	margin-bottom: 30px;
	}

#downloads a:link,
#downloads a:visited {
	color: RGB(100,100,100);
	}
#downloads a:hover {
	color: RGB(150,150,150);
	}