/*
	KLEUREN
	blauw (magazine) 	: #0065a6
	rood (nieuws)		: #cc071e; #e42d3f
*/


/* layout */
html {height:100%;}
body {font-family: tahoma, arial, sans-serif;font-size:100%; background: #fff; margin: 0px; min-width: 1000px; background: url(../images/zb_logo_bg.gif) repeat-x top left; text-align: left;}

/* typografie headings */	
h1 {font-family: Georgia; font-weight: normal; font-size: 2em; color: #555; margin: 0 0 7px 0;}
h2 {font-family: Georgia; font-weight: normal; font-size: 1.5em; color: #555; margin: 0 0 4px 0;}
h3 {font-family: tahoma, helvetica, arial; font-weight: normal; font-size: 0.85em; text-transform: lowercase;
	color: #555; margin-bottom: 2px; margin-top: 5px; text-align: left;}

.nieuws h3 {border-top: 1px solid #aaa;}

hr {
color: none;
border: none;
background-color: #ccc;
height: 1px;
}


h1.legend, 
h2.legend,
h3.legend {
font-family: tahoma, helvetica, arial; 
background-color: #0c5196;
color: #fff;
display: inline;
float: left;
text-transform: uppercase;
}

h1.legend {
font-size: 1.1em;
padding: 7px 15px 4px 7px;
}
h2.legend {
font-size: 0.9em;
padding: 5px 11px 3px 5px;
}
h3.legend {
font-size: 0.75em;
padding: 4px 6px 2px 4px;
margin: 0 0 7px 0;
border: none;
}
h3.ad {
background-color: #e3e3e9;
}

#footer h3 {font-family: Georgia; font-weight: normal; font-size: 1.2em; color: #aaa; margin-bottom: 0px; padding: 0px;}

.onecolumn h1 {font-size: 1.4em; margin: 0 0 3px 0;}

div.partners p,
div.partners ul li {
	font-size: 0.8em;
}	

div.profiel {
	margin: 3px;
	float: left;
	text-align: center;
	font-size: 0.8em;
	width: 105px;
	height: 140px;
}

div.poll p,
div.poll form, 
div.poll input {
	font-size: 0.8em;
}	

div.poll form {
	line-height: 2;
}


div.ondernemersagenda,
div.profielen,
div.autos {
	/* margin-bottom: 15px; */
}


div.hotlist,
div.nieuws {
	background: url(../images/gradient_content_top.png) repeat-x top left;
}

div.partners {
	/* background: url(../images/gradient_content_top.png) repeat-x top left; */
	background: #fff;
}

div.ondernemersagenda,
div.profielen,
div.poll {
	background: #e6f0ff;
	padding-bottom: 5px;
}

div.coverstory:hover,
div.autos:hover,
div.evenementen:hover,
div.podium:hover,
div.lifestyle:hover,
div.hotlist:hover,
div.nieuws:hover {
	background: #e6f0ff;
	/* padding: 5px;
	margin: -5px; */
}

div.nieuws li:hover,
div.ondernemersagenda li:hover,
div.hotlist li:hover {
	background: #fff;
}

div.relevant {
	background: #4f92d6;  /* 3e81c4*/
}

div.relevant ul {
	list-style-type: disc;
	list-style-position: inside;
}

div.relevant ul li,
div.relevant ul li a {
	color: #fff;
}
	


/* datum & tijd */
.date,
.shortdate,
.longdate {color: #999; }

.indent {position: relative; display: block;  margin-left: 105px;}

.shortdate {position: relative; display: block; float: left; width: 40px;}
.shortindent {position: relative; display: inline;}

.cat {position: relative; display: block; float: left; width: 65px; color: #000; font-weight: bold;}
.longdate {position: relative; display: block; float: left; width: 130px;}
.evenement_longdate {position: relative; display: block; float: left; width: 115px; text-align: center; font-size: 90%; color: #fff; background-color:#f60; padding: 3px 6px 1px 6px; margin-right: 5px;}
.longindent {position: relative; display: block; margin-left: 150px;}


p, 
li,
div {font-size: 0.95em;}

ul{margin: 0; padding: 0; line-height: 1;}

p, 
ul{
line-height: 1.5; margin-top: 0; margin-bottom: 8px; /* clear: both; */ /* overflow: auto; */
}	

p.author,
p.tags {color: #777; font-size: 80%;}

p.ins {position: relative;  margin-left: 70px;}

div.hotlist li {cursor: pointer;}
div.hotlist li:hover {cursor: pointer; text-decoration: underline;}

.nieuws ul {margin-left: 15px; list-style-type: square; line-height: 1.3; }
#footer ul {list-style: none;}

#footer ul li:before {
  content: '> ';
}

.directlinks li:before {content: "> " ;}

/* kleuren verschillende soorten nieuws*/
.n2  {color: #81c0ff;}
.n73 {color: green;}
.n74 {color: orange;}
.n75 {color: #2482a3;}

.n2square,
.n73square,
.n74square, 
.n75square {width: 6px; height: 6px; float: left; margin-right: 5px; margin-top: 2px;}

.n2square {background: #81c0ff;}
.n73square {background: green;}
.n74square {background: orange;}
.n75square {background: #2482a3;}

a img {border: none;}
a {text-decoration: none; color: #0c5196; outline: none; } 
a:hover {text-decoration: underline;}

.klik {cursor: pointer;}

#footer a {color: #888; font-weight: normal;}
#footer a:hover {color: #ccc; text-decoration: none;}

/* header */
#header {margin-top: 31px; height: 122px; width: 990px; clear: both;}
#header p,
#header p a {color:#fff; font-size: 0.85em;}
#header input {margin-top: 0px;}
#header img {vertical-align: bottom;}
#header p {padding: 0px; margin-top: 0px;}

/* footer */
#footer {
	clear:both;
	background: #000 url(../images/bg_footer.jpg) top left repeat-x;
	color: #666;
	padding: 10px;
}


/* Alle plaatjes op hetzelfde formaat */
.clipwrapper {position: relative; display: block; margin-bottom: 7px;}
.clipwrapper .clip {position: absolute;} 

.twocolumn .clipwrapper {width: 387px; height: 235px;}
.twocolumn .clipwrapper .clip {clip: rect(0px 387px 235px 0px);}
/* .twocolumn .clipwrapper img {min-width: 387px; min-height: 235px;} */

.onecolumn .clipwrapper {width: 186px; height: 128px; margin-bottom: 7px;}
.onecolumn .clipwrapper .clip {clip: rect(0px 186px 128px 0px);}
/* .onecolumn .clipwrapper .clip img {min-width: 186px; min-height: 128px;} */

.aanbevolen img {margin: 10px; /* max-width: 85px; max-height: 65px; */ vertical-align: middle;}

.profielen .profiel .clipwrapper {
	width: 80px; height: 80px;
	background: #fff; 
	margin: auto;
	margin-bottom: 7px;
	/* display: table-cell; vertical-align: middle; // verticaal uitlijnen // */
	display: block;
}
/* .profielen .profiel .clipwrapper img {max-width: 80px; max-height: 80px; min-width: 0px; min-height: 0px;} */

.pagewrapper {
left: 50%;
margin-left: -495px;
position: relative;
width: 992px;
}

.onecolumn
{
	width: 186px;
	margin-bottom: 10px;
	float: left;
}
.twocolumn
{
	width: 387px;
	margin-bottom: 10px;
	float: left;
}
.threecolumn
{
	width: 588px;
	float: left;
	margin-bottom: 10px;
}
.fourcolumn
{
	width: 789px;
	float: left;
	margin-bottom: 10px;
}
.fivecolumn
{
	width: 990px;
	float: left;
	margin-bottom: 10px;
}

.notify {display: block; margin-top: 4px; font-size: 85%; color: #666;}

.highlight, 
.highlight1 {background-color: yellow;}
.highlight2 {background-color: lime;}
.highlight3 {background-color: pink;}

.content {font-family: font-family: tahoma,arial,verdana; /* font-size: 0.9em; */ margin: 5px; clear: both;}

.gallery {margin-bottom: 10px;}

/* ### COLORBOX STYLE ### */
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
#cboxOverlay{background:#0C5196;}

#colorbox{}
#cboxContent{background:#000; margin-top:20px;}
#cboxLoadedContent{background:#000; padding:5px;}
#cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
#cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
#cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
#cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(../images/controls.png) top left no-repeat; width:28px; height:65px; text-indent:-9999px;}
#cboxPrevious.hover{background-position:bottom left;}
#cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(../images/controls.png) top right no-repeat; width:28px; height:65px; text-indent:-9999px;}
#cboxNext.hover{background-position:bottom right;}
#cboxLoadingOverlay{background:#000;}
#cboxLoadingGraphic{background:url(../images/loading.gif) center center no-repeat;}
#cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(../images/controls.png) top center no-repeat; width:38px; height:19px; text-indent:-9999px;}
#cboxClose.hover{background-position:bottom center;}
/* ### END OF COLORBOX STYLE ### */

.datumtab {
	font-weight: bold;
	color: #fff;
	background: #555;
	width: 170px;
	padding: 8px;
	text-align: left;
	/* margin-top: -11px; */
	margin-bottom: 10px;
}	

div#twittertab {
	position: absolute; 
	top: 210px; 
	right: -55px;
	background: url(../images/takje.png) top right;	
	clip: rect(0px 55px 120px 0px);
	width: 110px; 
	height: 69px; 
	z-index: 1000; 
	/* cursor: pointer; */
}
div#twittertab:hover {
	right: 61px;
	clip: rect(0px 171px 120px 0px);
}


/* formulier */ 

.contactformulier legend {
padding: 1px 0;
font-size: 1.4em;
font-family:Georgia;
color:#555555;
}

.contactformulier fieldset {
border: none;
}

.contactformulier input:hover, 
.contactformulier textarea:hover {
background-color: #ddd;
}

.contactformulier label, 
.contactformulier dd {
cursor: pointer;
padding: 0 5px 0 0;
font-size: 0.9em;
}

.contactformulier label input {
vertical-align: middle;
}

.kruimelpad {
font-size: 0.75em;
}

img.navi {margin-top: -3px;}

img.navi:hover {background: #ff0;}

/*  MENU  */
#menu {
position: absolute;
top: 58px;
left: 220px;
width: 770px;
}

#menu ul {
list-style: none;
margin: 0;
padding: 0;
float: left;
display: inline; 
}

#menu ul li {}

#menu a {
display: block;
margin: 0;
padding: 5px 10px 8px 10px;
}


#menu a {
color: #ccc;
text-decoration: none;
}

#menu a:hover {
color: #fff;
background: url("../images/tab_active_grijs.jpg") top left no-repeat;
}

#menu li {float: left; 	list-style: none;}

#menu ul ul {
position: absolute;
z-index: 500;
}

#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

#menu ul ul,
#menu ul li:hover ul ul,
#menu ul ul li:hover ul ul
{display: none;}

#menu ul li:hover ul,
#menu ul ul li:hover ul,
#menu ul ul ul li:hover ul
{display: block;}


#menu ul li.active a  {background: #fff url("../images/tab_active.jpg") top left no-repeat; color: #000;} 

#menu ul li ul li a  {background: #333; color: #ccc;} 
#menu ul li ul li.active a  {background: #fff; color: #000;}