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

body,td,th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
}
body {
	background-color: #FFFFFF;
	margin: 0px;
}
a:link, a:visited, a:active {
	color: #70a032;
}
a:hover {
	color: #007fb9;
}
h1,h2,h3,h4,h5,h6 {
	font-family: Trebuchet, Arial, Helvetica, sans-serif;
}
h1 {
	font-size: 1.5em;
	color: #007fb9;
	margin: 0 0 20px;
}
h2 {
	font-size: 1.3em;
	color: #007fb9;
}
h3 {
	font-size: 1.3em;
	color: #70a032;
}
.clear {
	clear: both;
	height: 1px;
	display: block;
}

/* Layout components ----------------------------------------------------------------- */
#container {
	width: 910px;
	margin: 0 auto;
	background: url(../images/zorg/bg_container.gif) repeat-y 50% 0;
}
#header {
	width: 894px;
	border-color: #fff;
	border-style: solid;
	border-width: 0 3px;
	height: 130px;
	background-color: #f5f5f5;
	margin: 0 5px;
}
.menu {
	width: 895px;
	height: 40px;
	background-color: #00adef;
	border-color: #fff;
	border-style: solid;
	border-width: 1px 2px 1px 3px;
	margin: 0 0 0 5px;
	color: #fff;
	font-weight: bold;
	position: relative;
}
*html .menu {
	width: 898px;
}
#main {
	width: 900px;
	margin: 0 5px;
	clear: both;
}
#footer {
	background: url(../images/zorg/bg_footer.gif) no-repeat 50% 0;
	height: 46px;
	width: 900px;
	padding: 4px 5px;
	color: #909090;
	font-family: Trebuchet, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	clear: both;
}

/* Header styles --------------------------------------------------------------------- */
#header .logo {
	width: 260px;
	height: 130px;
	background: url(../images/zorg/zorg_logo.jpg) no-repeat 0 0;
	display: block;
	float: left;
}
#header .imageholder {
	width: 460px;
	height: 130px;
	border-right: 1px solid #e2e2e2;
	float: left;
}
#header .tools {
	width: 170px;
	height: 130px;
	border-left: 1px solid #fff;
	float: left;
}
#header .search {
	margin: 25px 0 0 15px;
}
#header .searchfield {
	border: none;
	width: 110px;
	padding: 2px 6px;
	background: url(../images/zorg/searchfield.gif) no-repeat 0 0;
	height: 16px;
	line-height: 16px;
	float: left;
	margin: 0;
	color: #333;
}
#header .searchbutton {
	width: 20px;
	height: 20px;
	border: none;
	cursor: pointer;
	margin-left: 5px;
}
#header .size {
	color: #898989;
	font-size: 0.9em;
	font-family: Trebuchet, Arial, Helvetica, sans-serif;
	margin: 45px 0 0 15px;
	text-align: right;
}
#header .size label {
	padding: 7px 10px 0 0;
	float: left;
}

/* Menu styles --------------------------------------------------------------------------------------- */
/* menu behaviour */

/*	Override list item html predefinitions
---------------------------------------------------------------------------------
	Help: With vertical menu, this is the right place to define borders, background
	color, positioning and internal padding. For horizontal menus, class '.menu' will
	probably be the right one for margins and borders for menu, if you need the sub
	menus to go over the top menu border. */
.menu ul {
	z-index:99;
	padding: 0;
	margin: 0;
	list-style: none;
	position: relative;
}
/*	Redefine main menu items: height, cursor, margins, etc
---------------------------------------------------------------------------------
	Help: Some hacks need to be included here if you want the menu to look exactly in
	IE and FF, because margins and paddings somehow appear in IE even if they are not
	declared. Height hack is also A MUST in IE for vertical menu. */
.menu ul li {
	position: relative;
	cursor: pointer;
	padding: 0;
	margin: 0;
	display: inline;
	float: left;
	width: 111px;
	display: block;
	border-right: 1px solid #fff;
}
.menu ul li.last {
	border-right: none;
}
/*	Menu item link: defines background image (left), position, color, decoration, weight
---------------------------------------------------------------------------------
	Help: The right place to define the look and feel of the link. You should define
	only the padding for the link, and not the height, except if you are about to use
	horizontal menu. For vertical, padding should be used, not height. */
.menu ul li a {
	color: #fff !important;
	font-weight: bold;
	text-decoration: none;
	display: block;
	width: 111px;
	height: 40px;
	line-height: 40px;
	margin: 0;
	background-color: #00adef;
	text-align: center;
}
.menu ul li a:hover, .menu ul li a.on {
	text-decoration: none;
	background-color: #007fb9;
}
/*	Menu hover and show options for Firefox and Opera
---------------------------------------------------------------------------------
	Help: This is not to be touched :) The classes define hovering and hiding
	options for four menu sub levels. You can expand the elements (ul and li) if
	you need more than 4 sub levels. */
.menu ul li:hover ul ul, .menu ul li:hover ul ul ul, .menu ul li:hover ul ul ul ul, .menu ul li:hover ul ul ul ul ul {
	display:none;  
}
.menu ul li:hover ul, .menu ul ul li:hover ul, .menu ul ul ul li:hover ul, .menu ul ul ul ul li:hover ul, .menu ul ul ul ul ul li:hover ul {
	display:block;
}

/*	Section III:
	SECOND LEVEL menu list item definitions
---------------------------------------------------------------------------------
	Help: You can define borders, background color, positioning and internal
	padding for submenu. Either, you will inherit the top level definitions or you
	will redefine the new look here. */
.menu ul ul {
	display: none;
	position: absolute;
	margin: 0;
	padding: 0 0 10px;
	left: 0;
	top: 40px;
	height: auto;
	width: 111px;
	background-color: #007fb9;
	border-top: 1px solid #fff;
}
.menu ul ul li {
	height: auto;
	display: block;
	border: none;
	width: auto;
	float: none;
	margin: 0;
	padding: 0;
}

/*	Redefine submenu links
---------------------------------------------------------------------------------
	Help: You can also inherit some of the look and feel from the parent classes,
	or you can redefine them here. */
.menu ul li ul li a {
	width: 101px;
	line-height: 16px;
	height: auto;
	font-size: 0.85em;
	border: none;
	padding: 5px;
	margin: 0;
	text-align: left;
	background-color: #007fb9;
}
.menu ul li ul li a:hover {
	text-decoration: none;
	background-color: #00adef;
}
/* Main area styles ---------------------------------------------------------------------------------- */
#main .breadcrumb {
	color: #70a032;
	background-color: #f2f2f2;
	width: 864px;
	height: 35px;
	font-size: 0.75em;
	font-weight: bold;
	line-height: 35px;
	padding: 0 15px;
	border-color: #fff;
	border-style: solid;
	border-width: 0 3px;
}
#main .breadcrumb a {
	text-decoration: none;
	padding: 0 5px;
}
#main .breadcrumb span {
	padding: 0 5px;
}
#main .wrapper {
	padding: 15px;
	width: 870px;
}
#main .wrapper.twocolumn {
	padding: 15px 15px 15px 285px;
	width: 600px;
}
#main .leftcolumn {
	margin-left: -270px;
	width: 225px;
	display: block;
	float: left;
	padding-bottom: 20px;
}
*html #main .leftcolumn {
	margin-left: -135px;
}
.leftcolumn .submenu {
	margin: 0 0 20px;
	padding: 0;
	color: #007fb9;
	list-style: none;
	min-height: 240px;
	width: 225px;
}
*html .leftcolumn .submenu {
	height: 240px;
}
.leftcolumn .submenu li {
	margin: 0;
	padding: 0;
}
.leftcolumn .submenu li a {
	color: #007fb9;
	font-size: 0.95em;
	font-weight: bold;
	text-decoration: none;
	width: 215px;
	display: block;
	padding: 8px 5px;
}
.leftcolumn .submenu li a:hover, .leftcolumn .submenu li.on a {
	color: #FFF;
	background-color: #007fb9;
}
/*#main .wrapper.twocolumn .maincolumn {
	height: 530px !important;
	overflow: auto;
}
#main .wrapper .maincolumn {
	height: 406px;
	overflow: auto;
}*/
.maincolumn .accent {
	font-weight: bold;
	font-style: italic;
}
.maincolumn img.right {
	float: right;
	margin: 0 0 15px 30px;
}
.maincolumn img.left {
	float: left;
	margin: 0 30px 15px 0;
}

/* Home page specific styles ------------------------------------------------------------------------- */
.homebanners {
	width: 870px;
	margin: 10px 0 20px;
	float: left;
}
.homebanners .banner {
	width: 185px;
	min-height: 85px;
	display: block;
	float: left;
	margin-right: 18px;
	border: 2px solid #8ac1da;
	padding: 10px 5px 10px 10px;
}
*html .homebanners .banner {
	height: 85px;
}
.homebanners .last {
	margin-right: 0;
}
.homebanners .banner img {
	float: left;
	border: 1px solid #8ac1da;
	margin: 0 5px 0 0;
	width: 80px;
	height: 80px;
}
.homebanners .banner a {
	color: #007fb9;
	font-size: 17px;
	font-weight: bold;
	text-decoration: none;
	letter-spacing: 0.1px;
}
.homebanners .banner a:hover {
	color: #70a032;
}
.homebanners .banner a:hover img {
	border-color: #70a032;
}

/* Ons Team page specific styles ------------------------------------------------------------------------- */
.maincolumn .boxrow {
	float: left;
	width: 600px;
	display: block;
	margin-bottom: 5px;
}
.maincolumn .teambox {
	width: 144px;
	min-height: 135px;
	float: left;
	display: block;
	margin: 0 8px 0 0;
}
*html .maincolumn .teambox {
	height: 135px;
}
.maincolumn .teambox.last {
	margin: 0;
}
.maincolumn .teambox a {
	color: #000;
	font-size: 0.9em;
	text-decoration: none;
}
.maincolumn .teambox a span {
	color: #007fb9;
	font-size: 0.85em;
}
.maincolumn .teambox img {
	width: 90px;
}
.maincolumn .teambox a img {
	border: none;
}
.maincolumn .teambox a:hover {
	color: #70a032;
}

/* News page specific styles ------------------------------------------------------------------------- */
.maincolumn .newsbox {
	width: 570px;
	border: 2px solid #8ac1da;
	padding: 10px;
	margin-bottom: 10px;
}
.maincolumn .newsbox p {
	margin: 10px 0 0;
}
.maincolumn p.date {
	color: #00adef;
	margin: 0;
}
.maincolumn p.title {
	color: #007fb9;
	margin: 0;
	font-weight: bold;
}
.newsbox p.more {
	text-align: right;
	margin: 0;
}
.newsbox .more a {
	color: #70a032;
	font-weight: bold;
	text-decoration: none;
	background: url(../images/zorg/arrow_r.gif) no-repeat 100% 4px;
	padding-right: 15px;
}
.newsbox .more a:hover {
	color: #00adef;
}
.scanholder {
	width: 600px;
	height: auto;
	overflow: auto;
}
.pagetools {
	width: 600px;
	display: block;
	height: 30px;
}
.pagetools .left {
	float: left;
}
.pagetools .right {
	float: right;
}
.pagetools .right a {
	color: #70a032;
	font-weight: bold;
	text-decoration: none;
	background: url(../images/zorg/arrow_r.gif) no-repeat 100% 4px;
	padding-right: 15px;
}
.pagetools .right a:hover {
	color: #00adef;
}
.pagetools .left a {
	color: #70a032;
	font-weight: bold;
	text-decoration: none;
	background: url(../images/zorg/arrow_l.gif) no-repeat 0 4px;
	padding-left: 15px;
}
.pagetools .left a:hover {
	color: #00adef;
}
/* Form specific styles -------------------------------------------------------------------------------- */
.maincolumn p.note {
	color: #70a032;
}
.maincolumn form p {
	line-height: 20px;
	margin: 10px 0;
}
.maincolumn form p.full {
	width: 94%;
	float: left;
	margin: 5px 0;
}
.maincolumn form p.half {
	width: 47%;
	float: left;
	margin: 5px 0;
}
.maincolumn form p.buttonsrow {
	text-align: center;
}
.maincolumn form label {
	width: 130px;
	padding: 2px 5px 2px 0;
	float: left;
}
.maincolumn form label.radiolabel {
	padding-right: 10px;
	float: none;
}
.maincolumn form label.checklabel {
	padding-right: 10px;
	float: none;
}
.maincolumn form label.longlabel {
	width: auto;
	padding: 0 10px 2px 0;
}
.maincolumn form .inputfield {
	width: 220px;
	border: 2px solid #8ac1da;
	background-color: #fff;
}
.maincolumn form .textbox {
	width: 420px;
	height: 110px;
	overflow: auto;
	border: 2px solid #8ac1da;
	background-color: #fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
}
.maincolumn form .required span {
	color: #70a032;
	font-weight: bold;
	font-size: 1.2em;
	margin-right: 10px;
}
.maincolumn form .required .inputfield {
	border: 2px solid #70a032;
}
.maincolumn form .button {
	background-color: #007fb9;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	border: none;
	padding: 5px 10px;
	margin: 15px 0;
}
.maincolumn form .button.alternate {
	background-color: #00adef;
}
.maincolumn form span.footnote {
    font-size: 0.8em;
    color: #909090;
    float: right;
    width:230px;
}

/* Footer styles --------------------------------------------------------------------------------------- */
#footer .info {
	width: 715px;
	height: 26px;
	line-height: 26px;
	border-right: 1px solid #909090;
	float: left;
	margin: 10px 0 10px 20px;
}
#footer .info span {
	font-weight: bold;
	color: #0078b0;
}
#footer a {
	color: #007fb9;
	text-decoration: none;
	font-weight: bold;
}
#footer a:hover {
	color: #70a032;
	text-decoration: underline;
}
#footer .links {
	height: 26px;
	line-height: 26px;
	margin: 10px 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
}
#footer .links a {
	margin: 0 8px;
}

/* Lightbox styles ----------------------------------------------------------------------------------------- */
.leightbox {
	z-index:1001;
	display: none;
	width: 100%;
	text-align: center;
	position: absolute;
	top: 150px;
	left: 0;
}
.leightbox .holder {
	color: #000;
	width: 400px;
	height: 400px;
	padding: 25px;
	margin: auto;
	border: 2px solid #017fb9;
	background-color: #fff;
	text-align: left;
	overflow: auto;	
}
.leightbox .close {
	float: right;
	font-weight: bold;
	font-size: 1.2em;
}
.leightbox .close a {
	text-decoration: none;
	color: #017fb9;
}
.leightbox .close a:hover {
	color: #70A032;
}
.leightbox img {
	float: left;
	margin: 0 15px 15px 0;
	width: 180px;
	display: block;
}
.leightbox .function {
	color: #007fb9;
	font-size: 0.7em;
}
#overlay{
	display:none;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:1000;
	background-color:#333;
	-moz-opacity: 0.9;
	opacity:.90;
	filter: alpha(opacity=90);
}

.lightbox[id]{ /* IE6 and below Can't See This */    position:fixed;    }#overlay[id]{ /* IE6 and below Can't See This */    position:fixed;    }

