/* menu-knoppen-plat.css */	
/* Algemene instellingen */
body
{
	padding: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 110%;
	color: #000;
	background: #ff9;
}

div#header-l-2, div#header-l-3
{
	float: left;
	width: 11em;
	height: 4.8em;
	margin: 0 3px 0 10px;
	border: solid black 1px;
	z-index: 1001;
	background: white;
	color: black;
	text-align: center;
	line-height: 2.4em;
}

div#header-r-2, div#header-r-3, div#header-r-4
{
	float: right;
	width: 11em;
	height: 4.8em;
	margin: 0 10px 0 3px;
	border: solid black 1px;
	z-index: 1000;
	background: white;
	color: black;
	text-align: center;
	line-height: 2.4em;
}

div#header-l-3 {line-height: 1.6em;}

div#header-r-3 {line-height: 1.4em;}

div#header-r-4 {line-height: 1em;}

div#header-l-2 p, div#header-l-3 p, div#header-r-2 p {margin: 0;}

div#header-r-3 p {margin: 0 0 0.35em 0;}

div#header-r-4 p {margin: 0 0 0.3em 0;}

/* Afwijkende instellingen voor aparte pagina's */
body#a-019 div#header-l-2, body#a-019 div#header-r-2, body#a-022 div#header-l-2, body#a-022 div#header-r-2, body#a-023 div#header-l-2, body#a-023 div#header-r-2, body#a-027 div#header-l-2, body#a-027 div#header-r-2, body#a-028 div#header-l-2, body#a-028 div#header-r-2 {margin-top: 10px;}

body#a-019 p#content, body#a-022 p#content, body#a-023 p#content, body#a-027 p#content, body#a-028 p#content
{
	clear: both;
	text-align: center;
	font-size: 150%;
}

body#b-019 h1, body#b-022 h1, body#b-023 h1, body#b-027 h1, body#b-028 h1
{
	margin: 10px 0;
	font-size: 1.2em;
	text-align: center;
}

body#b-019 ul
{
	float: left;
	width: 180px;
	padding: 25px;
	list-style: none;
}

body#b-019 li
{
	height: 161px;	
	margin-top: 14px;
	background: white;
}

body#b-019 li a
{
	display: block;
	overflow: hidden;
	width: 180px;
	height: 161px;
	text-decoration: none;
	color: black;
}

body#b-019 span.img
{
	position: absolute;
	left: -8000px;
	top: 90px;
	visibility: hidden;
	z-index: 1002;
}

body#b-019 span.img-header
{
	display: block;
	height: 34px;
	background: white;
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
}

body#b-019 span.groot
{
	display: block;
	height: 444px;
	background: url(../menu/knoppen/plat/019-pics/019-menu.jpg);
}

body#b-019 .vinkje
{
	display: block;
	width: 180px;
	padding: 10px 0 0 60px;
	color: white;
	font-size: 40px;
}

body#b-019 a:visited .vinkje {color: green;}

body#b-019 .vraagteken
{
	display: block;
	width: 180px;
	margin-top: -60px;
	padding-left: 85px;
	font-size: 50px;
	color: black;
}

body#b-019 a:visited .vraagteken {color: white;}

body#b-019 .onderdeel
{
	display: block;
	text-align: center;
	font-size: 25px;
}

body#b-019 a:hover span.onderdeel, body#b-019 a:hover span.vraagteken, body#b-019 a:hover span.vinkje {visibility: hidden;}

body#b-019 a:hover {cursor: pointer;}

body#b-019 a:hover span.img
{
	visibility: visible;
	left: 201px;
	width: 546px;
	height: 367px;
	border: #fc3 ridge 13px;
	overflow: auto;
}

body#b-022 a#skippy
{
	position: absolute;
	left: -2000px;
	top: 20px;
	z-index: 50;
	width: 10em;
	height: 5em;
	background: white;
	line-height: 5em;
	text-align: center;
}

body#b-022 a#skippy:focus, body#b-022 a#skippy:active
{
	left: 20px;
	border: red solid 3px;
}

body#b-022 div#content
{
	clear: both;
	width: 770px;
	margin: 0 auto;
}

body#b-022 ul#knoppen
{
	margin: 0;
	padding: 0;
	list-style: none;
}

body#b-022 ul#knoppen li
{
	float: left;
	margin: 20px 35px;
	text-align: center;
}

body#b-022 ul#knoppen a
{
	display: block;
	width: 180px;
	height: 161px;
}

body#b-022 ul#knoppen a img
{
	border: 0;
	background: red;
}

body#b-022 ul#knoppen a:visited img {background: green;}

body#b-022 ul#knoppen a:hover img {background: white;}

body#b-022 ul#knoppen a:focus {outline: black dotted 3px;}

body#b-022 p#tekst {clear: both;}

body#b-023 ul#knoppen
{
	clear: both;
	width: 600px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

body#b-023 ul#knoppen li
{
	float: left;
	margin: 20px 0;
}

body#b-023 ul#knoppen li + li {float: right;}

body#b-023 ul#knoppen a
{
	position: relative;
	display: block;
	text-decoration: none;
	color: black;
}

body#b-023 img {border: 0;}

body#b-023 .vinkje, body#b-023 .vraagteken
{
	position: absolute;
	top: 30px;
	left: 70px;
	width: 20px;
	height: 1em;
	color: white;
	background: white;
	font-size: 25px;
	text-align: center;
}

body#b-023 .vraagteken
{
	left: 90px;
	color: black;
}

body#b-023 ul#knoppen a:visited .vraagteken {color: white;}

body#b-023 ul#knoppen a:hover .vinkje, body#b-023 ul#knoppen a:hover .vraagteken {display: none;}

body#b-023 ul#knoppen a span.tekst
{
	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 180px;
	font-size: 14px;
	background: white;
	text-align: center;
}

body#b-023 ul#knoppen a:hover span.tekst {display: block;}

body#b-023 ul#knoppen a span.onder {color: red;}

body#b-023 ul#knoppen a:visited span.onder, body#b-023 ul#knoppen a span.onder span {color: white;}

body#b-023 ul#knoppen a:visited .vinkje, body#b-023 ul#knoppen a:visited span.onder span {color: green;}

body#b-023 ul#knoppen a:focus {outline: black dotted 3px;}

body#b-027 ul
{
	clear: both;
	width: 770px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

body#b-027 ul#knoppen li
{
	float: left;
	margin: 20px 80px;
}

body#b-027 img {border: 0;}

body#b-027 ul#knoppen a
{
	display: block;
	width: 180px;
	height: 161px;
}

body#b-027 a#nr-001:hover img {display: none;}

body#b-027 a#nr-001:hover {background: url(../menu/knoppen/plat/027-pics/006-t.gif);}

body#b-027 a#nr-002:hover img {display: none;}

body#b-027 a#nr-002:hover {background: url(../menu/knoppen/plat/027-pics/007-t.gif);}

body#b-028 div#content ul
{
	clear: both;
	width: 600px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

body#b-028 div#content li
{
	float: left;
	margin: 80px 0;
}

body#b-028 div#content li + li {float: right;}

body#b-028 div#content a
{
	position: relative;
	display: block;
	width: 200px;
	height: 207px;
	border: black solid 1px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	text-decoration: none;
	color: black;
	background: white;
}

body#b-028 div#content img
{
	position: relative;
	top: -1px;
	left: -1px;
	z-index: 10;
	border: black solid 1px;
	padding: 10px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	background: white;
	-moz-transition: top 0.4s ease-out, left 0.6s ease-out 0.2s, -moz-box-shadow 0.4s 0.1s;
	-webkit-transition: top 0.4s ease-out, left 0.6s ease-out 0.2s, -webkit-box-shadow 0.4s 0.1s;
	-o-transition: top 0.4s ease-out, left 0.6s ease-out 0.2s, box-shadow 0.2s 0.1s;
	-ms-transition: top 0.4s ease-out, left 0.6s ease-out 0.2s, box-shadow 0.2s 0.1s;
	transition: top 0.4s ease-out, left 0.6s ease-out 0.2s, box-shadow 0.2s 0.1s;
}

body#b-028 div#content a span
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 200px;
	font-size: 1.9em;
	text-align: center;
}

body#b-028 div#content a:hover img, body#b-028 div#content a:focus img, body#b-028 div#content a:active img
{
	top: -40px;
	left: -15px;
	-moz-box-shadow: 9px 15px rgba(200, 200, 200, 0.8);
	-webkit-box-shadow: 9px 15px rgba(200, 200, 200, 0.8);
	box-shadow: 9px 15px rgba(200, 200, 200, 0.8);
}
