* { margin: 0; padding: 0; }

html { background: #e8f9ff; font-family: arial, helvetica, sans-serif; font-size: 62.5%; overflow-y: scroll; }

#body { width: 760px; position: absolute; left: 50%; margin-left: -380px; background: #fff; }

#top { height: 110px; padding: 10px; }
#top form { width: 165px; position: absolute; right: 10px; top: 10px; }
#top form div { width: 130px; float: right; }
#top label { color: #33ccff; position: relative; top: 2px; font-size: 1.2em; }
#query { width: 113px; height: 19px; border: none; background: url(zoeken.png) no-repeat; position: absolute; top: 0; }
#top input.image { position: absolute; top: 0; right: 0; }

#utils { position: absolute; top: 3px; right: 210px; text-align: right; font-size: 1.2em; }
#utils a { color: #33ccff; text-decoration: none; }
#utils a.home { margin-left: 30px; }
#utils a.normal { font-size: 1em; }
#utils a.large  { font-size: 1.5em; }
#utils a.xlarge { font-size: 2em; }

#top a.logo { position: relative; left: 10px; top: 10px; z-index: 1; }
#top a.logo img { border: none; }

#navigation { width: 780px; height: 60px; }
#navigation ul { list-style-type: none; }
#navigation li { float: left; margin-right: 3px; }
#navigation a { display: table-cell; color: #fff; text-decoration: none; font-size: 1.4em; width: 100px; height: 60px; padding: 0px 25px; text-align: center; background: #09d6ff; vertical-align: middle; margin: 0; }
#navigation li.active a { background: #7d6250; }
#navigation li:first-child a { width: 98px; }

#subNavigation { background: #cdf4ff url(navigationBottom.png) left bottom no-repeat; min-height: 485px; width: 118px; float: left; padding: 16px; }
#subNavigation ul { list-style-type: none; }
#subNavigation a { font-size: 12px; color: #00aad7; text-decoration: none; margin-bottom: 10px; display: block; }
#subNavigation li.active a, #subNavigation li.active ul li.active a, #subNavigation li.active ul li.active ul li.active a { font-weight: bold; color: #797979; }
#subNavigation li ul { position: absolute; left: 130px; display: none; width: 150px; margin-top: -26px; background: #C6F1FF url(submenu.png) 0 5px no-repeat; z-index: 2;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
    -o-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
}
#subNavigation li.active ul li a, #subNavigation li.active ul li.active ul li a { font-weight: normal; color: #00aad7; }
#subNavigation li ul a { padding: 2px 10px; margin-bottom: 6px; }


/*
#navigation { float: left; width: 119px; position: relative; z-index: 2; min-height: 610px;  }
#navigation ul { list-style-type: none; }
#navigation .top ul, #navigation .bottom ul { margin-left: 10px; }

#navigation .top { background: #695547; margin-bottom: 3px; height: 119px; width: 119px; }
#navigation .bottom { background: #33ccff url(navigationBottom.png) left bottom no-repeat; min-height: 485px; }
#navigation a { display: block; color: #fff; text-decoration: none; font-size: 1.2em; padding: 4px 8px; }
#navigation .top a, #navigation .bottom a { text-indent: -10px; }
#navigation .top a { color: #8c8787; }
#navigation .top li.active a { color: #fff; font-weight: bold; }
#navigation .bottom li.active a { font-weight: bold;  }
#navigation .bottom li.active li.active a { font-weight: bold; }
#navigation .bottom ul { padding-bottom: 140px; }
#navigation .bottom li ul { padding: 0; margin: 0; }
#navigation .bottom li.active li a { background: none; padding-left: 20px; font-weight: normal; }
#navigation .bottom ul ul { position: absolute; width: 150px; left: 119px; margin-top: -23px; background: #C6F1FF url(submenu.png) 0 5px no-repeat; display: none;
	-moz-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
}
#navigation .bottom ul ul ul { left: 150px; }
#navigation .bottom ul ul a, #navigation .bottom ul li.active ul a { color: #006486; padding-left: 20px; }
#navigation .home ul {}
#navigation .home li { display: block; height: 119px; background: #33ccff; margin-bottom: 3px; }
#navigation .home a { display: block; margin-bottom: 3px; height: 99px; font-size: 1.6em; padding: 10px; }
*/

#content { width: 610px; float: right; padding: 0px; position: relative; z-index: 1; }
#content p, #content ol, #content ul, #content table, #content dl { font-size: 1.2em; color: #666; margin-bottom: 1em; line-height: 1.6em; }
#content ol, #content ul { margin-left: 2em; font-size: 12px; }
#content h1 { font-size: 2.2em; margin-bottom: 0.5em; font-weight: bold; color: #00aad7; }
#content h2 { font-size: 1.6em; font-weight: normal; color: #333; border-bottom: 1px dotted #ccc; }
#content h2.cursus { margin-bottom: 10px; font-weight: bold; border-bottom: none; color: #006486; font-size: 1.4em; }
#content h3 { color: #333; font-size: 1.2em; }
#content table { border-collapse: collapse; }
#content td, #content th { text-align: left; vertical-align: top; padding: 3px; border: 1px solid #ccc; }
#content th { color: #333; background: #eee; }
#content a { color: #00AADF; }
#content a:hover { color: #fff; background: #00AADF; text-decoration: none; }
#content dt { color: #333; }
#content dd { margin-left: 1em; }
#content table.news td, #content table.news th { background: none; padding: 2px 0; border: none; }
#content table.news tr { font-weight: bold; background: #e8f9ff; }
#content table.news tr.read { font-weight: normal; background: none; }
#content table.news th.date { width: 80px; }
#content table.news th.lock { width: 30px; }
#content table.news span.locked { cursor: pointer; }

#lockedMessage { background: #08d5ff; color: #fff; font-size: 12px; padding: 10px; width: 280px; display: none; position: absolute; left: 140px; cursor: pointer; }
#lockedMessage a { color: #fff; font-weight: bold; text-decoration: none; }

/*#outerMap { width: 428px; height: 350px; margin-bottom: 20px; position: relative; }*/
#map { width: 428px; height: 350px; position: relative; }
#ha_info, #ha_list { display: none; }
#ha_nav a { font-size: 12px; text-decoration: none; }

.innerContent { padding: 16px; width: 428px; float: left; }

#sidebar { float: right; width: 130px; padding: 10px; background: #c6f1ff; min-height: 497px; }
#sidebar h3 { margin-bottom: 5px; }
#sidebar label { font-size: 1.2em; }
#sidebar input.text { width: 124px; border: 1px solid #33CCFF; padding: 3px; }
#sidebar form { margin-bottom: 2em; }

#footer { clear: both; padding: 10px; color: #666; }
#footer span { float: right; }
#footer a { color: #666; text-decoration: none; }
#footer a:hover { text-decoration: underline; color: #000; }

.pdfDownload { background: url(pdf.jpg) no-repeat; margin-bottom: 1em; height: 30px; }

/* Berichten: */
#content ul.tabs { list-style-type: none; height: 35px; margin: 0; padding: 0; }
ul.tabs li { float: left; margin: 0; padding: 0; }
ul.tabs li a { display: block; height: 14px; font-weight: bold; color: #888; text-decoration: none; padding: 10px; margin-right: 5px; border: 1px outset #ccc; border-bottom: 1px solid #fff; position: relative; z-index: 1; }
ul.tabs li a:active { outline: none; }
#content ul.tabs li a.active { color: #000; z-index: 3; outline: none; }
#content ul.tabs li a.active:hover { color: #fff; }
div.tab { border: 1px outset #ccc; position: relative; z-index: 2; display: none; padding: 10px; }
div.tab.active { display: block; }
div.tab table { width: 100%; font-size: 1.2em; border-collapse: collapse; border: 1px solid #ccc; margin: 0; }
div.tab td, div.tab th { vertical-align: top; text-align: left; border: 1px solid #ccc; padding: 3px; }
div.tab td.noResults { width: 100%; height: 378px; text-align: center; vertical-align: middle; background: #eee; font-style: italic; }

#newMessage div { margin-bottom: 3px; }
#newMessage label { font-size: 1.2em; display: block; float: left; width: 120px; }
#newMessage textarea { width: 270px; border: 1px inset #999; font-family: sans-serif; }
#newMessage textarea#bericht { height: 260px; }
#newMessage .submit { margin-left: 120px; }
#newMessage select { width: 195px; }

#ontvangersVisual { /* width: 355px; height: 60px; border: 1px solid #ccc; float: left; overflow: auto; */ width: 280px; /* float: right; */ margin-left: 120px; }
#ontvangersVisual ul { margin: 0; }
#ontvangersLijst { margin-left: 10px; float: left; }
#suggestie { width: 200px; height: 20px; border: 1px solid #ccc; margin-top: 3px; }
#newMessage div.ontvangers { /* height: 65px; */ }

li.ontvanger { border: 1px solid #ccc; background: #eee; padding: 3px; font-size: 1.2em; display: block; margin: 3px; }
li.ontvanger a { text-decoration: none; font-weight: bold; color: #000; outline: none; float: right; }

tr.notRead { background: #eee; font-weight: bold; }

.messageBox { display: none; }
.messageBox textarea { width: 380px; height: 260px; border: 1px solid #ccc; font-family: sans-serif; }

table.message .ontvangers { display: none; }
table.message .ontvangerSelector { display: none; }
#ontvangersVisual.small { width: 250px; }

.saveGroup, .saveGroup .step2 { display: none; }

/* Cursussen: */
#cursussen .cursus { border-bottom: 1px dotted #ccc; padding: 5px 5px 10px 5px; margin-bottom: 10px; background: url(cursus.jpg) no-repeat; }
#cursussen .cursus var { display: none; }
#cursussen .cursus h2 a { text-decoration: none; }
#cursussen .footer { height: 1em; }
#cursussen p.intro { border-bottom: 1px solid #ccc; padding-bottom: 5px;}
#cursussen p.left { color: #888; float: left; font-size: 1em;  }
#cursussen p.left span { color: #000; font-weight: bold; }
#cursussen p.right { float: right; font-size: 1em; }

/* Categorieën: */
#categorien .categorie { border-bottom: 1px dotted #ccc; padding: 5px 5px 10px 5px; margin-bottom: 10px; background: url(cursus.jpg) no-repeat; }
#categorien .categorie h2 a { text-decoration: none; }
#categorien .footer { height: 1em; }
#categorien p.intro { border-bottom: 1px solid #ccc; margin: 0; padding: 5px 0; }
#categorien p.right { text-align: right; font-size: 1em; }

div.info, #inschrijven { background: url(cursus.jpg) no-repeat; padding: 5px; }
#inschrijven p.ja { font-size: 1.6em; color: #333; }
#inschrijven p.ja strong { font-size: 2em; font-weight: bold; color: #33ccff; }

#content table.info th, #content table.info td { border: none; font-weight: normal; color: #666; background: none; padding: 0; }
#content table.info th { width: 210px; color: #333; }

/* Popup: */
#popup {
	padding: 10px; border: 3px double #ccc; width: 350px; position: absolute; left: 50%; margin-left: -175px; background: #fff; z-index: 11; display: none;
	-moz-box-shadow: 5px 5px 15px #000;
	-webkit-box-shadow: 5px 5px 15px #000;
	box-shadow: 5px 5px 15px #000;
}
#popup p { margin-bottom: 1em; font-size: 1.2em; }
#popup div.buttons { text-align: center; }
#popup div.buttons input { margin: 0 20px; }
#black { position: absolute; width: 100%; height: 100%; background: #000; z-index: 10; display: none; }
#popup h3 { margin-bottom: 5px; }
#popup table { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
#popup td, #popup th { font-size: 1.2em; text-align: left; vertical-align: top; border: 1px solid #ccc; padding: 3px; }
#popup tr.disabled td { color: #ccc; }
#popup label { display: block; font-size: 1.2em; margin-bottom: 2px; }
#popup .betaalwijzes { margin-bottom: 10px; }
#popup p.hide { display: none; }
#popup label span { display: block; float: left; width: 120px; }

/* Breadcrumbs: */
span.B_crumbBox { display: block; margin-bottom: 1em; font-size: 1.1em; border-bottom: 1px dotted #ccc; padding-bottom: 5px; color: #999; }
span.B_crumbBox a { color: #a6a3a1; text-decoration: none; }
span.B_crumbBox a:hover { color: #000; }

/* Formulieren: */
#content table.form th, #content table.form td { padding: 3px 0; font-weight: normal; background: none; border: none; }
#content table.form th { color: #333; margin-right: 1em; width: 130px; }
input.text { border: 1px solid #33CCFF; padding: 3px; }
input.alignRight { float: right; }
textarea { border: 1px solid #33CCFF; padding: 3px; width: 287px; font-family: sans-serif; font-size: 1.2em; }

div.message { background: #cfc; border: 1px solid #aca; padding: 5px; margin-bottom: 1em; }
#content div.message p { margin: 0; padding: 0; color: #333; }

/* Nieuws: */
.news { margin-bottom: 3em; }
span.date { float: right; color: #666; }
.news h2 a { text-decoration: none; }
.news h2.new { padding-left: 50px; background: url(new.png) left 5px no-repeat; }
.news p.left { float: left; }
.innerContent .news p.readmore { text-align: right; border-top: 1px dotted #ccc; background: #eee; border-bottom: 1px dotted #ccc; }
.paginator { border-top: 1px dotted #ccc; text-align: center; }
#sidebar .news { padding-bottom: 5px; margin-bottom: 5px; }
#sidebar .news h3 { margin: 0; }
#sidebar .news a { text-decoration: none; }
#sidebar .news p { margin-bottom: 0; line-height: 1.2em; }
#sidebar .news p.readmore { text-align: right; }
#sidebar .news { margin-bottom: 1em; border-bottom: 1px dotted #fff; }

#sidebar h3 { color: #006486; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; }
#sidebar label { color: #00aae4; font-size: 1em; }
#sidebar input.text { border: 1px inset #ccc; padding: 2px; font-size: 1em; }
#sidebar input.submit { background: url(button.png) no-repeat; border: none; width: 80px; height: 19px; font-size: 1em; color: #006486; padding: 0 0 10px 0; cursor: pointer; /* float: right; */ clear: both; outline: none; }
#sidebar form.extern { margin-bottom: 5px; }
#sidebar form.extern input.submit { float: none; width: 140px; position: relative; left: -5px; background: url(buttonwide.png) no-repeat; outline: none; font-size: 10px; }
#sidebar div.remember { height: 22px; }
#sidebar div.remember label { width: auto; margin-right: 10px; }
#sidebar div.remember input { position: relative; top: 3px; }
#sidebar div.button { height: 19px; }
#login a { font-size: 1em; }
#login a.register { display: block; }

#sidebar table { border: none; border-collapse: collapse; font-size: 10px; margin: 0; }
#sidebar table td { padding: 0; border: none; }

/* Zoekresultaten: */
ol.searchResults li { border-bottom: 1px dotted #ccc; margin-bottom: 1em; }
ol.searchResults a { text-decoration: none; }
#content ol.searchResults p { margin-bottom: 0; }

form.weblogin { margin-top: 3px; }
form.weblogin label { font-size: 1.2em; display: block; float: left; width: 120px; padding: 3px 0px; color: #666; }
form.weblogin input { margin-bottom: 3px; }
form.weblogin a { font-size: 1.2em; }
.welkom { border-bottom: 1px solid #ccc; margin-bottom: 1em; }
.welkom a.logout { font-size: 1.2em; }

#signup span { color: #800; font-weight: bold; }
#signup td, #signup th { padding: 3px 0; border: none; background: none; color: #666; }
#signup th { font-weight: normal; width: 140px; }
#signup input.inputBox { border: 1px solid #33CCFF; padding: 3px; width: 200px; }

form.default fieldset { border: none; border-bottom: 1px solid #ccc; padding: 1em 0; }
form.default legend { font-size: 1.6em; font-weight: bold; display: block; color: #006486; padding: 5px 0; }
form.default label { font-size: 1.2em; display: block; margin-bottom: 1px; }
form.default input { border: 1px inset #666; width: 200px; margin-bottom: 15px; padding: 3px; color: #666; }
form.default input#nr { width: 50px; }
form.default input#postcode, form.default input#geboortedatum { width: 100px; }
form.default input.radio { width: auto; margin-right: 1em; }
form.default input.submit { border: 1px outset #666; cursor: pointer; width: auto; color: #000; font-weight: bold; }
form.default div.floater { margin-bottom: 5px; }
form.default label span { font-weight: bold; color: #c00; }

div.error { font-size: 1.2em; padding: 1em; border: 1px solid #800; background: #fcc; font-weight: bold; margin-bottom: 10px; }
div.message { font-size: 1.2em; padding: 1em; border: 1px solid #080; background: #cfc; font-weight: bold; margin-bottom: 10px; }

table.adresgegevens { cursor: default; width: 100%; }
table.adresgegevens tr.info { display: none; cursor: text;}
table.adresgegevens tr.hover { background: #eee; cursor: pointer; }
table.adresgegevens tr.active { background: #ddf; }
table.adresgegevens div.column { width: 200px; float: left; }
table.adresgegevens td.last { background: url(arrow-down1.png) right 10px no-repeat; }
table.adresgegevens tr.hover td.last { background: url(arrow-down2.png) right 10px no-repeat; }
table.adresgegevens tr.active td.last { background: url(arrow-up.png) right 10px no-repeat; }
#content table.adresgegevens dl { font-size: 1em; }

/* Kalender: */
#kalender table { font-size: 1em; width: 100%; cursor: default; }
#kalender td, #kalender th { text-align: center; vertical-align: middle; padding: 0; border-color: #94dff8; color: #0d6d8e; }
#kalender td { padding: 2px 0; }
#kalender th { width: 23px; }
#kalender tr.top td { border: none; color: #0d6d8e; }
#kalender tr.top a { color: #0d6d8e; text-decoration: none; padding: 3px 8px; }
#kalender tr.top a:hover { background: none; color: #fff; }
#kalender td div { display: none; }
#kalender td.highlight { color: #fff; background: #33ccff; cursor: pointer; }
#kalender td.highlight.hover { background: #006486; }

#kalenderPopup { font-size: 1em; background: #fff; padding: 5px; border: 1px solid #e9e9e9; position: absolute; width: 151px; display: none;  
	-moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
	-webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
	box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
}
#kalenderPopup ul { font-size: 1em; }
#kalenderPopup li { line-height: 1.2em; margin-bottom: 0.4em; }

/* Cursusfilter: */
#cursusFilter { padding-bottom: 10px; clear: both; float: left; }
#cursusFilter label { width: 210px; float: left; font-size: 1.2em; margin-bottom: 8px; cursor: pointer; }

form.login label { font-size: 1.2em; display: block; color: #666; margin-bottom: 5px; }
form.login input[type=text], form.login input[type=password] { width: 320px; background: url("input.png") no-repeat; border: none; height: 19px; padding: 0; margin-bottom: 10px; }
form.login input[type=submit] { position: relative; left: 100px; top: -25px; padding: 2px; }

#content p.mijn-rhz { color: #00aad7; font-size: 12px; }
#content p.mijn-rhz strong { color: #007aab; font-weight: bold; font-size: 18px; }
#content div.welkom ul { color: #00aad7; margin-left: 20px; }
#content div.welkom ul a { text-decoration: none; }

#top a.terug { position: absolute; top: 12px; right: 350px; z-index: 2; display: block; width: 200px; text-align: right; font-size: 12px; font-weight: bold; color: #3CF; text-decoration: none; }
#top a.logged-in { color: #c00; }

#sidebar ul.links { list-style-type: none; margin-left: 0; border-top: 1px solid #ccc; padding-top: 10px; }