﻿body { background: url(../images/bg.jpg) #5ba4d7; background-repeat: repeat-x; margin: 0; padding:0; font-family: Verdana; font-size: 12px;}

#container { width: 960px; overflow: hidden; margin: 0 auto; background-color: #55a0d4; background-image: url(../images/bg_container.jpg); background-repeat: no-repeat; }

#utilities { background: url(../images/bg_util.jpg); width: 960px; height: 30px; background-repeat: no-repeat; color: #fff; height: 30px;}
#utilities span { float: right; margin: 4px 0 0 0;}
#utilities a { text-indent: -9999px; width: 25px; height: 26px; margin: 0; padding: 0; display: block; float: right;}
#utilities a.home { background: url(../images/util_home.png); background-repeat: no-repeat; background-position: top; margin: 4px 9px 0 9px;}
#utilities a:hover.home { background-position: bottom;}
#utilities a.print { background: url(../images/util_print.png); background-repeat: no-repeat; background-position: top; margin: 4px 9px 0 9px;}
#utilities a:hover.print { background-position: bottom;}
#utilities a.contact { background: url(../images/util_contact.png); background-repeat: no-repeat; background-position: top; margin: 4px 20px 0 9px;}
#utilities a:hover.contact { background-position: bottom;}

#header { width: 920px; height: 240px; margin: 0 0 20px 20px; overflow: hidden;}
#header .menu { background: url(../images/bg_menu.png) no-repeat; width: 928px; height: 35px; margin: 20px 0 0 0; padding: 13px 0 0 0; text-align: left;}
#header .menu ul { margin: 0 0 0 10px; padding: 0; text-transform: uppercase; font-size: 10px; font-weight: bold;}
#header .menu ul li { margin: 0; padding: 0; list-style: none; display: inline; border-right: 1px solid #fff;}
#header .menu ul li.last { border: 0;}
#header .menu ul li a { text-decoration: none; color: #fff;  margin: 0 10px 0 10px; padding: 5px 0 0 0;}
#header .menu ul li a:hover { color: #013e69;}
#header .menu ul li a.active { color: #013e69;}

#header .foto_header { background-image: url(../images/foto_header.png); width: 596px; height: 160px; padding: 0; margin: 12px 0 0 0; float: left;}
#header table.adres { color: #fff; text-align: left; text-transform: uppercase; font-size: 10px; font-weight: bold; margin: 15px 0 0 16px; padding: 0; width: 220px; float: left;}
#header table.adres a { color: #fff; text-decoration: none;}
#header table.adres td { height: 5px; padding: 0;}
#header table.adres tr td.informatie { width: 18px;}
#header table.adres a.info { background: url(../images/info_btn.png) no-repeat; width: 18; height: 18px; text-indent: -9999px; display: block;}

#header .logo {width: 305px; height: 144px; float: left; margin: 16px 0 0 19px; padding: 0; background-image: url(../images/logo_xillion.png);}
#header .logo img { display: none;}

/*
#doelgroepen { width: 920px; height: 261px; margin: 0 0 0 20px; padding: 0; overflow: hidden;}
#doelgroepen .foto { margin: 67px 0 0 0;}
#doelgroepen p.tekst { padding: 0; margin: 0; color: #fff; margin: 5px 16px 10px 16px; height: 70px; overflow: hidden;}
#doelgroepen a.btn_lees1 { background: url(../images/btn_lees1.png) no-repeat; width: 74px; height: 18px; margin: 0; padding: 4px 0 0 9px; display: block; text-decoration: none; color: #fff; font-size: 11px; font-weight: bold; cursor: pointer; position: absolute; bottom: 10px; right: 16px;}
#doelgroepen a.btn_lees2 { background: url(../images/btn_lees2.png) no-repeat; width: 74px; height: 18px; margin: 0; padding: 4px 0 0 9px; display: block; text-decoration: none; color: #fff; font-size: 11px; font-weight: bold; cursor: pointer; position: absolute; bottom: 10px; right: 16px;}
#doelgroepen .netwerk { background: url(../images/bg_netwerk.png) no-repeat; width: 224px; height: 261px; float: left; margin: 0 8px 0 0; position: relative;}
#doelgroepen .consult { background: url(../images/bg_consult.png) no-repeat; width: 224px; height: 261px; float: left; margin: 0 8px 0 0; position: relative;}
#doelgroepen .applicatie { background: url(../images/bg_applicatie.png) no-repeat; width: 224px; height: 261px; float: left; margin: 0 8px 0 0; position: relative;}
#doelgroepen .internet { background: url(../images/bg_internet.png) no-repeat; width: 224px; height: 261px; float: left; margin: 0; position: relative;}
*/

#submenu {  width: 224px;  margin: 0 0 0 20px; padding: 0; overflow: hidden; float: left;}
#submenu .top { background: url(../images/bg_submenu_top.png) no-repeat; width: 224px; height: 7px; padding: 0; margin: 0; overflow: hidden;}
#submenu h1 { font-size: 23px; text-transform: uppercase; color: #fff; font-weight: normal; padding: 5px 16px 5px 16px; margin: 0; display: block; width: 192px; background-color: #56a1d5; overflow: hidden; }
#submenu h1 a {color: #fff; text-decoration: none;}
#submenu h1 a:hover { color: #013e69;}
#submenu .bottom { background: url(../images/bg_submenu_bottom.png) no-repeat; width: 224px; height: 20px; padding: 0; margin: 0;} 
*html #submenu .bottom {background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='lib/images/bg_submenu_bottom.png',sizingMethod='image');}


#submenu ul { margin: 0; padding: 5px 0 5px 0; background-color: #56a1d5;}
#submenu ul li { list-style: none; line-height: 22px; }
#submenu ul li a { color: #fff; text-decoration: none; font-weight: bold; display: block; width: 224px; padding: 0 0 0 16px; margin: 0;}
#submenu ul li a.active { color: #013e69; background-color: #accfeb;}
#submenu ul li a:hover { color: #013e69; background-color: #accfeb;}
#submenu ul ul { margin: 0; padding: 0;}
#submenu li li { margin: 0; padding: 0;}
#submenu li li a { color: #fff; text-decoration: none; font-weight: normal; display: block; width: 224px; padding: 0 0 0 36px; margin: 0;}
#submenu ul li ul li a:hover { color: #013e69; background-color: #fff;}
#submenu ul li ul li a.active { color: #013e69; background-color: #fff;}

#content {width: 688px; float: left; margin: 0 0 0 8px; padding: 0; color: #013e69; font-size: 11px;}
#content h3 { display: block; background-color: #deebf7; margin: 16px 0 10px 0; padding: 0 0 0 19px; font-size: 13px; font-weight: bold;}
#content h4 { margin: 0 0 10px 0; padding: 0; font-size: 14px; color: #56a1d5;}
#content h5 { margin: 0 0 10px 0; padding: 0; font-size: 14px; color: #e72d24;}
#content .top { background: url(../images/bg_content_titel.png) no-repeat; width: 688px; height: 47px; overflow: hidden; margin: 0; padding: 0;}
#content .top h2 { font-size: 14px; color: #013e69; text-transform: uppercase; margin: 15px 16px 0 16px; padding: 0 0 0 0;}
#content .wrapper { padding: 5px 16px 0 16px; margin: 0; background-color: #fff; width: 656px;}
#content .tekst {  margin: 0; padding: 10px 0 0 0; overflow: hidden;}
#content .tekst p { margin: 0; padding: 5px 0 5px 0;}
#content .tekst p.datum { font-style: italic;}
#content .tekst img { float: right; margin: 0 0 16px 16px; border: 0;}
#content .tekst a { text-decoration: none; color: #ea2e24;}
#content .tekst a:hover { text-decoration: underline;}
#content .tekst p a { text-decoration: none; color: #ea2e24;}
#content .tekst p a:hover { text-decoration: underline;}
#content .tekst ul { margin: 0; padding: 10px 16px 10px 50px;}
#content .tekst ul li { margin: 0 0 5px 0; padding: 0; list-style-image: url(../images/bullet.png);}
#content .tekst ul li a { text-decoration: none; color: #ea2e24;}
#content .tekst ul li a:hover { text-decoration: underline;}
#content .omvang { background-color: #fff; width: 688px; height: 22px; margin: 0; padding: 10px 0 0 0;}
#content .omvang a.btn_top { background: url(../images/btn_top.png) no-repeat; width: 33px; height: 18px; display: block; color: #fff; font-weight: bold; text-decoration: none; padding: 4px 0 0 12px; margin: 0 16px 0 0; clear: both; float: right;}
#content .bottom { background: url(../images/bg_content_bottom.png) no-repeat; width: 688px; height: 10px;}
*html #content .bottom {background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='lib/images/bg_content_bottom.png',sizingMethod='image');}

#content a.btn_toon { background: url(../images/btn_toon.png) no-repeat; width: 90px; height: 18px; margin: 0; padding: 4px 0 0 9px; display: block; text-decoration: none !important; color: #fff !important; font-size: 11px; font-weight: bold; cursor: pointer;}
#content a.btn_vac{ background: url(../images/btn_vac.png) no-repeat; width: 112px; height: 18px; margin: 0; padding: 4px 0 0 9px; display: block; text-decoration: none !important; color: #fff !important; font-size: 11px; font-weight: bold; cursor: pointer;}
#content a.btn_terug{ background: url(../images/btn_terug.png) no-repeat; width: 150px; height: 18px; margin: 0 0 0 16px; padding: 4px 0 0 9px; display: block; text-decoration: none !important; color: #fff !important; font-size: 11px; font-weight: bold; cursor: pointer;}
#content a.btn_nieuws{ background: url(../images/btn_nieuws.png) no-repeat; width: 150px; height: 18px; margin: 0 0 0 16px; padding: 4px 0 0 9px; display: block; text-decoration: none !important; color: #fff !important; font-size: 11px; font-weight: bold; cursor: pointer;}

#nieuws { width: 920px; margin: 20px 0 0 20px; overflow: hidden; float: left;}
#nieuws .nieuwsitem1 { background: url(../images/bg_nieuwsitem.png) no-repeat; width: 456px; height: 100px; float: left; margin: 0 8px 8px 0; }
#nieuws .nieuwsitem2 { background: url(../images/bg_nieuwsitem.png) no-repeat; width: 456px; height: 100px; float: left; margin: 0 0 8px 0; }
#nieuws .titel { color: #013e69; text-align: left; text-transform: uppercase; font-weight: bold; margin: 10px 16px 5px 16px; width: 424px; height: 15px; overflow: hidden;}
#nieuws p { padding: 0; margin: 0; font-size: 12px; color: #000; margin: 5px 16px 10px 16px; height: 30px; overflow: hidden;}
#nieuws a.btn_toon { background: url(../images/btn_toon.png) no-repeat; width: 90px; height: 18px; margin: 0 0 0 16px; padding: 4px 0 0 9px; display: block; text-decoration: none; color: #fff; font-size: 11px; font-weight: bold; cursor: pointer;}

#footer { z-index: 100; background-image: url(../images/footer.png); background-repeat: no-repeat; clear: both; float: left; overflow: hidden; width: 928px; height: 78px; margin: 20px 0 0 20px; padding: 1px 0 0 0;}
*html #footer {background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='lib/images/footer.png',sizingMethod='image');}
#footer a.nexwork { z-index: 10; background: url(../images/img_nexwork.png) no-repeat; width: 143px; height: 32px; background-position: top; display: block; text-indent: -9999px; margin: 19px 0 0 20px;}
#footer a:hover.nexwork { background-position: bottom;}
#footer a.cis { z-index: 10; background: url(../images/cis.png) no-repeat; width: 162px; height: 64px; background-position: top; display: block; text-indent: -9999px; margin: 2px 0 0 20px;}
#footer a:hover.cis { background-position: bottom;}


#disclaimer { color: #fff; font-size: 11px; display: block; height: 20px; width: 170px; margin: 10px 20px 16px 0; padding: 0; float: right;}
#disclaimer a { color: #fff; text-decoration: none;}
#disclaimer a:hover { color: #013e69;}

.blauw #header .foto_header { background-image: url(../images/onderwerp_header.png);}
.overig #header .foto_header { background-image: url(../images/header_consult2.png);}
.netwerk #header .foto_header { background-image: url(../images/onderwerp_header_1.png);}
.consult #header .foto_header { background-image: url(../images/onderwerp_header_2.png);}
.applicatie #header .foto_header { background-image: url(../images/onderwerp_header_3.png);}
.internet #header .foto_header { background-image: url(../images/onderwerp_header_4.png);}

form { background-color: #fff; overflow: hidden; margin: 0 0 0 0; padding: 10px 0 10px 16px;}
form input{ font-size: 11px; width: 180px;}
form input.radio{ font-size: 11px; width: 50px;}
form input.submit { width: auto; float: left;}
form legend{ display: none;}
form fieldset { border: 0; padding: 0; margin: 0;}
form label { float: left; width: 120px;}
form label.geslacht { margin: 0 0 10px 120px; width: 90px;}
form div { margin-bottom: 3px; clear: both;}
form div.submit input { background-color: #56a1d5; color: #fff; text-decoration: none; padding: 3px 10px 3px 10px; border: 0; font-size: 10px;}

.home_wrapper { margin: 0 0 8px 20px; overflow: hidden;}
#paragraaf_home_top { width: 922px; height: 8px; background: url(/lib/images/paragraaf_home_top.png);}
#paragraaf_home_bottom { width: 922px; height: 8px; background: url(/lib/images/paragraaf_home_bottom.png);}
.home_wrapper .tekst { width: 882px; background: #deebf7; padding: 10px 20px 10px 20px;}
.home_wrapper h4 { margin: 0; padding: 0; text-transform: uppercase;}
.home_wrapper p { margin: 0; padding: 0;}

/*ONDERWERPEN HOME*/
#onderwerpen { width: 920px; margin: 0 0 0 20px;}
#onderwerpen a.item { width: 225px; height: 146px; float: left; margin: 0 6px 0 0; display: block; text-indent: -9999px;}

#onderwerpen a.eerste { background: url(/lib/images/onderwerp_1.png) top;}
#onderwerpen a.tweede { background: url(/lib/images/onderwerp_2.png) top;}
#onderwerpen a.derde { background: url(/lib/images/onderwerp_3.png) top;}
#onderwerpen a.vierde { background: url(/lib/images/onderwerp_4.png) top; margin: 0;}

#onderwerpen a:hover.eerste { background-position: bottom;}
#onderwerpen a:hover.tweede { background-position: bottom;}
#onderwerpen a:hover.derde { background-position: bottom;}
#onderwerpen a:hover.vierde { background-position: bottom;}
