/* - - - - - - - - - - - - - - - - - - - - -
 ______ _       _     _     __  __          _ _       
|  ____(_)     | |   | |   |  \/  |        | (_)      
| |__   _  __ _| |__ | |_  | \  / | ___  __| |_  __ _ 
|  __| | |/ _` | '_ \| __| | |\/| |/ _ \/ _` | |/ _` |
| |____| | (_| | | | | |_  | |  | |  __/ (_| | | (_| |
|______|_|\__, |_| |_|\__| |_|  |_|\___|\__,_|_|\__,_|
           __/ |                                      
          |___/

Title : 		GLOBAL.CSS style sheet: copy default.css styles and update!
Author : 		$Author$
URL : 			http://www.OURPROJECT.NL
Modified : 		$LastChangedDate$ - SVN: $Revision$
- - - - - - - - - - - - - - - - - - - - - */

/*

COLORS:

sky: 		#CDDE47
veronica: 	#00BDF4
classic:	#8F529F
tmf:		#E452A6

*/

/* -----------------------------------------
	1: RESET [start from scratch]
----------------------------------------- */

/* 
	Latest version of the Eric Meyer Reset:
	http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/
	
	Updates -> see EIGHTMEDIA UPDATE's:
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	_font-size: 100.01%;
	vertical-align: baseline;
	background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none; background: #FFFFCC;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
hr{ 
	display: block;
	width: 100%; 
	height: 20px; 
	clear: both;
	border: none; 
	background: transparent url('/static/img/bg_news_item.png') repeat-x bottom left;
}



/* -----------------------------------------
	1.1: GENERIC FIXES [fixes clearing issues with floats]
	http://www.positioniseverything.net/easyclearing.html
----------------------------------------- */
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {display:inline-block;}

/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */


/* -----------------------------------------
	2: GENERICS [Generic type, .classes, etc]
----------------------------------------- */
body{
	background: #FFF;
	font-size: 62.5%;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	text-align: center;
	color: #596792;
}

/* -----------------------------------------
	TYPOGRAPHY
----------------------------------------- */
div{font-size: 1em;} /* = 10px */

p, dl, td, th, li, pre, code, kbd, samp, pre, tt, input{
	font-size: 1.6em; /* 13px */
}
p{
	line-height: 1.6em;
	margin-bottom: 1em;
}

strong{font-weight: bold;}
em{font-style: italic;}
cite{font-style: italic;}
abbr, acronym { cursor: help; text-transform: uppercase; font-size: 85%; letter-spacing: .1em; border-bottom: 1px dotted #000;}
pre { white-space: pre; }
pre * { font-size: 1.3em; line-height: 1.5em; white-space: pre; }
blockquote { border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; color: #666; }
blockquote > *:before { content: "\201C"; }
blockquote > *:after { content: "\201D"; }
q { quotes: "\201C" "\201D" "\2018" "\2019"; }

address,
blockquote{margin: 1.5em 0;font-size: 1.3em;line-height: 1.5em;}
blockquote p{margin: 1.0em;}

hr { display: block; background: #ccc; color: #ccc; width: 100%; height: 1px; border: none; }

/* Cascading font size should remain same! */
/* TODO: Check this out? Necessary?! */
td td,li ul li,li ol li,td p,blockquote p,dd p, li p,ul li ul li,ul li ul li p,ol li ol li,ol li ol li p{
	font-size: 1.0em!important;
	line-height: 1.5em!important; /* TODO: Check this out? Necessary?! */
}

#footer p{
	color: #37434b;
	font-size: 1.1em;
	
}


/* -----------------------------------------
	GENERIC CLASSES
----------------------------------------- */
.alignRight{text-align: right;}
.alignLeft{text-align: left;}
.alignCenter{text-align: center;}
.floatRight{float: right;}
.floatLeft{float: left;}
.error{
	background: transparent;
	color: red;
}
.success{
	background: transparent;
	color: green;
}

.message{ 
	background-color: #261F1A; 
	border: 1px solid #000000; 
	padding:5px; 
	font-size: 1.3em;
}

.introduction{font-weight: bold;}
/* -----------------------------------------
	HEADERS
----------------------------------------- */
h1, h2, h3, h4, h5, h6{
	font-family: Arial, verdana, sans-serif;
	font-weight: normal;
	margin: 0.5em 0 0.5em 0;
}
h1{font-size: 2.0em;color: #596792; margin: 0 0 1em 0; font-weight: bold; text-transform: uppercase;}
h1 span{ color: #bac2da; }
h2{font-size: 1.4em;color: #596792; font-weight: bold; margin: 0 0 0.5em 0; text-transform: uppercase;}
	h2 a:link,
	h2 a:visited,
	h2 a:hover,
	h2 a:active{
		color: #596792;
	}
	h2 a:hover{		text-decoration: none; 	}
	.information #column3 h2{
		margin-left: 10px; 
		padding-top: 4px;
	}
	.itemLead h2{line-height: 1.5em;margin-top: -0.3em;}
	
	.sitemap h2{
		padding-left: 18px;
		background: url('/static/img/ico_readmore.gif') no-repeat 0 0;
	}
	

h3{font-size: 1.6em;color: #000;}
h4{font-size: 1.4em;color: #000;font-weight: bold;}
h5{font-size: 1.3em; color: #000;font-weight: bold; font-style: italic;}
h6{font-size: 1.3em; color: #000;font-weight: bold;}


/* -----------------------------------------
	LINKS
----------------------------------------- */
a:link,
a:visited,
a:hover,
a:active{
	color: #596792;
	text-decoration: underline;
}

a.readmore:link,
a.readmore:visited,
a.readmore:hover, 
a.readmore:active{
	text-decoration: none;
	padding-left: 18px !important;
	color: #596792;
	background: url('../img/ico_readmore.gif') no-repeat left center;
}

a.readmore:hover{text-decoration: underline;}
	.overviewItem a.readmore{
		display: block;
		margin: 2em 0;
	}

a:link img,
a:visited img,
a:hover img,
a:active img{
	border: none;
	text-decoration: none;
	color: white;
}


/* -----------------------------------------
	LISTS
----------------------------------------- */
ul, ol{ 
	list-style-type: disc; 
	list-style-position: inside; 
	margin: 2em 0;
	margin-left: 1.5em;
}
ol{list-style-type: decimal;}
	ul li, ol li{margin: 0.5em 0;}
	
#content ul{
	list-style-type: circle;
	margin: 1em 0;
}
	#content ul li ul,
	#content ol li ol{
		margin: 5px 0 0 30px;
	}

	#content ul li ul li,
	#content ol li ol li{
		margin: 0;
	}


	/* SITEMAP */
	#content ul.sitemapList{margin: 0;}
	#content ul.radioStation{
		float: left;
		margin: 1em 0;
	}
	#content ul.radioStation li.stationName a:link,
	#content ul.radioStation li.stationName a:visited,
	#content ul.radioStation li.stationName a:hover,
	#content ul.radioStation li.stationName a:active{
		font-weight: bold;
		text-decoration: underline;
	}
	.sitemapList li{
		margin: 0 0 0 19px;
		padding: 4px 0;
		list-style-type: none;
	}
	.sitemapList li a:link,
	.sitemapList li a:visited,
	.sitemapList li a:hover,
	.sitemapList li a:active{text-decoration: none;}
	.sitemapList li a:hover{text-decoration: underline;}
	.sitemapList li img{margin-right: 3px;}
	/* END SITEMAP */


/* Definition list */
dl{margin: 0.5em 0;line-height: 2em;}
	dl dt{font-weight: bold;}
	dl dd{margin-left: 1.0em;}

	/* overview lists: such as on the 'vacatures' overview page */
	#content ul.overview{
		list-style-type: none; 
		list-style-position: inside; 
		margin: 2em 0;
		padding: 0;
		border-top: 1px solid #D7DBE9;
		background: transparent;
		color: #646490;
	}
		#content ul.overview li{
			margin: 0;
		}
			#content ul.overview li a:link,
			#content ul.overview li a:visited,
			#content ul.overview li a:hover,
			#content ul.overview li a:active{
				text-decoration: none;
				color: #646490;
				background: #FEFEFF url('../img/ico_readmore.gif') no-repeat 0.5em center;
				border-bottom: 1px solid #D7DBE9;
				padding: 0.5em 2em;
				display: block;
			}
			#content ul.overview li a:hover,
			#content ul.overview li a:active{
				background: #f5f6fa url('../img/ico_readmore.gif') no-repeat 0.5em center;
			}

/* horizontal lists */
ul.horizontal,
ol.horizontal{
	list-style-position: inside;
	list-style-type: none;
	margin: 0;
}
	ul.horizontal li,
	ol.horizontal li{
		display: inline;
		float: left;
		margin: 0;
	}
				/* HIDE the tabcontent (JS Off scenario), show with JS */
				.tabcontent{display: none;}

/* definition lists */
dl{
	margin: 0.5em 0;
	line-height: 2em;
}
	dl dt{font-weight: bold;}
	dl dd{margin-left: 1.0em;}

	#radioLinks{
		margin: 0;
		list-style: none;
	}
		#radioLinks li{
			float: left;
			margin: 0;
		}	

/* -----------------------------------------
	IMAGES
----------------------------------------- */
img.left{float: left;margin: 0 1em 0 0;}
img.right{float: right;margin: 0 0 0 1em;}


/* -----------------------------------------
	BASE STRUCTURE (Div frame)
----------------------------------------- */

	.innerWrapper{
		width: 920px;
		margin: 0 auto;
		text-align: left;
	}
	
	#header{
		background: transparent url('../img/bg_header.gif') repeat-x top left;
		height: 120px;
		margin-bottom: 10px;
	}
	
	.home #header{
		margin-bottom: 20px;
	}
	
	#header .innerWrapper{
		padding-top: 40px;
		background: transparent url('../img/header_swirls.gif') no-repeat top center;
	}
	#content{
		background: transparent url('../img/bg_body.jpg') no-repeat bottom center;
		/* min-height incl. hack: http://www.dustindiaz.com/min-height-fast-hack/ */
		min-height: 500px;
		height: auto !important;
		height: 500px;	
		/* END min-height incl. hack */
		padding-bottom: 100px;
	}
	#content.home{
		background: transparent url('../img/bg_body_home.jpg') no-repeat bottom center;
		padding-bottom: 0;
	}
		#nieuws li{
			background: white;
			border-right: 1px solid #e1e1e1;
			border-left: 1px solid #e1e1e1;
			padding: 4px 8px 0 8px;
			font-size: 1.2em;
			line-height: 1.6em;
		}
		
		#nieuws li.last{border-bottom: 1px solid #cccccc;}
		
			#nieuws li h4{
				padding: 0;
				margin: 0;
				font-size: 1.1em;
				color: #38444c;
			}
		
			#nieuws li p{
/*				margin: 0 0 0 140px;*/
				margin: 0;
				color: #38444c;
				font-weight: normal;
			}
			
			#nieuws li p.readmoreWrapper{
				padding-bottom: 5px;
				text-align: right;
			}
			
			#nieuws li a:link,
			#nieuws li a:visited,
			#nieuws li a:hover,
			#nieuws li a:active{
				margin: 0;
				float: none;
				width: auto;
				display: inline;
				padding: 0;
			}

			#nieuws li img{
				float: left;
				margin: 4px 10px 10px 0;
			}
		
			#nieuws li hr{
				clear: left;
				margin: 0;
			}
				
			#nieuws li a:link.btn_readmore,
			#nieuws li a:visited.btn_readmore,
			#nieuws li a:hover.btn_readmore,
			#nieuws li a:active.btn_readmore{
				background: url('/static/img/button_readmore.gif') no-repeat top left;
				font-size: .9em;
				padding: 3px 5px 5px 5px;
				line-height: 26px;
				position: relative;
			}
			
				#nieuws li a:link.btn_readmore span,
				#nieuws li a:visited.btn_readmore span,
				#nieuws li a:hover.btn_readmore span,
				#nieuws li a:active.btn_readmore span{
					width: 5px;
					position: absolute;
					right: 0;
					top: 0;
					background: url('/static/img/button_readmore.gif') no-repeat top right;
					height: 100%;
				}
				
		#smoelen a:link,
		#smoelen a:visited,
		#smoelen a:hover,
		#smoelen a:active{
			padding: 0;
			margin: 0 20px 0 0;
			height: auto;
			width: auto;
			display: block;
			float: left;
		}
				
			#smoelen a:link img,
			#smoelen a:visited img,
			#smoelen a:hover img,
			#smoelen a:active img{
				border: 1px solid #b6c72f;
			}
		
			#smoelen a:hover img{
				border: 1px solid #92a021;
			}
		
		/* tools list */

		#tools li{	
			font-size: 1.2em;
			background-color: white;
		}
		
		#tools li.skyradio{margin-top: 10px;}
		
		#tools li.tmfradio{margin-bottom: 10px;}
		
		#tools li.skyradio,
		#tools li.veronica,
		#tools li.classicfm,
		#tools li.tmfradio{margin-left: 18px;}
		
		#tools li.skyradio a,
		#tools li.veronica a,
		#tools li.classicfm a,
		#tools li.tmfradio a{
			background: white url('../img/station_blocks.gif') no-repeat top left;
			height: 14px;
			padding: 0 0 0 17px;
			margin: 0 0 4px 0;
			display: block;
		}
		
		#tools li.skyradio a{ background-position: 0 0px; color: #CDDE47;} 
		#tools li.veronica a{ background-position: 0 -14px; color: #00BDF4;} 
		#tools li.classicfm a{ background-position: 0 -28px; color: #8F529F;} 	
		#tools li.tmfradio a{ background-position: 0 -42px; color: #E452A6;} 
		
		#tools li ul,
		#tools li p{
			margin: 10px 0 10px 18px;
			color: #38444c;
			font-weight: normal;
		}
				
		/* -----------------------------------------
			news AND press columns
		----------------------------------------- */
		.news #column2,
		.press #column2{
			width: 430px;
			padding-right: 5px;
			margin-right: 0;
		}
		
		.news #column3,
		.press #column3{
			padding-left: 15px;
		}
		
			.newsArticle,
			.overviewItem{
				background: transparent url('../img/bg_news_item.png') repeat-x bottom left;
				margin-bottom: 15px;
			}
			
			.detail{
				background: none;
				margin-bottom: 0;
			}
			
/*			.newsArticle{background-image: none;}*/
			
				.itemLead{
/*					padding-bottom: 35px;*/
					width: 310px;
					padding-right: 10px;
					float: right;
					position: relative;
				}
				.itemLead.press{width: auto; float: none;}
				
				p.date{
					color: #a7a7a7;
					font-style: italic;
					font-size: 1em;
				}
				.press p.date{
					width: auto;
					text-align:left;
				}
				
				.newsArticle p.date{
					text-align: left;
				}

			.newsImg{float: right; margin: 0 0 5px 10px;}
		
		a.mailingButton:link,
		a.mailingButton:visited,
		a.mailingButton:hover,
		a.mailingButton:active{
			background: transparent url('/static/img/but_press_mailing.png') no-repeat top left;
			height: 50px;
			width: 216px;
			display: block;
			text-indent: -9999px;
		}
		a.mailingButton:hover,
		a.mailingButton:active{
			background: transparent url('/static/img/but_press_mailing.png') no-repeat 0 -51px;
		}
		
		/* Used on nieuws en vacature detail pages */
		.backToOverview{
			background: transparent url('../img/bg_news_item.png') repeat-x bottom left;
			padding: 0 0 15px 0;
			margin: -10px 0 1em 0;
		}
		.backToOverview a:link,
		.backToOverview a:visited,
		.backToOverview a:hover,
		.backToOverview a:active{
			background: url('../img/ico_back.gif') no-repeat left 4px;
			text-indent: 17px;
			display: block;
			width: 100%;
			padding: 0 0 7px 0;
			text-decoration: none;
		}
		
		.backToOverview a:hover{
			text-decoration: underline;
		}
	
	/* -----------------------------------------
		ACTIE OVERVIEW
	----------------------------------------- */
	.action{
		background: transparent url('../img/bg_news_item.png') repeat-x bottom left;
		width: 100%;
		padding-bottom: 35px;
		margin-bottom: 15px;
	}
	
		.action .item{
			width: 430px;
			float: left;
			padding-right: 40px;
		}
		
		.action.last{
			border: none;
			background: none;
		}
	
	
	/* -----------------------------------------
		SMOELENBOEK
	----------------------------------------- */
	#content .pictureList{
		border: 1px solid #eceef3;
		margin: 0 0 2px 0;
		padding: 0 1px 0 0;
		width: 661px;
		list-style-type: none;
		background: #fdfdfe;
	}
	
		.pictureList li{
			margin: 0;
			padding: 0;
			float: left;
			width: 132px;
			list-style-type: none;
			line-height: 1.3em;
			font-size: 1.1em;
			text-align: center;
			word-wrap: break-word;
			border-bottom: 2px solid white;
		}
		
			.pictureList li a:link,
			.pictureList li a:visited,
			.pictureList li a:hover,
			.pictureList li a:active{
				display: block;
				padding: 16px 16px 5px 16px;
				text-decoration: none;
				text-transform: uppercase;
				border: 1px solid transparent;
				background: #fdfdfe url('../img/smoelenboek_frame.gif') no-repeat top left;
			}
			
			.pictureList li a:link img,
			.pictureList li a:visited img,
			.pictureList li a:hover img,
			.pictureList li a:active img{
			}
			
			.pictureList li a:hover{
				color: #444;
				background: #fdfdfe url('../img/smoelenboek_frame.gif') no-repeat  -132px 0;
			}
			
				.pictureList li a:hover img{
					
				}
			
				.pictureList li a img{
					margin-bottom: 20px;
				}
	

	

/* -----------------------------------------
	TABLES
----------------------------------------- */
table{
	margin: 2em 0;
	width: 100%;
	border: 1px solid #000;
	text-align: left;
}
	table caption{
		margin-bottom: -1em; /* table top-margin/2 reversed! */
		margin-top: 2em; /* table top-margin/2 reversed! */
		font-size: 1.2em;
		font-style: italic;
		color:#666;
		text-align: right;
	}
	table tr{}
	table thead{}
		table thead tr{background: #000; color: #FFF;}
			table thead tr th,
			table tfoot tr th{
				border-bottom: 1px solid #000;
				padding: 0.2em 0.5em;
				font-weight: bold;
			}
			table thead tr td,
			table tfoot tr td,
			table tfoot tr th{
				padding: 0.2em 0.5em;
				border-bottom: 1px solid #000;
				border-right: 1px solid #000;
			}
	table tbody{}
		table tbody tr{}
			table tbody tr th{
				border-bottom: 1px solid #000;
				border-right: 1px solid #000;
				padding: 0.2em 0.5em;
				font-weight: bold;
			}
			table tbody tr td{
				padding: 0.2em 0.5em;
				border-bottom: 1px solid #000;
				border-right: 1px solid #000;
			}
	
	








#column1, #column3, #footerNav, #footer,.paging, ul#breadcrumb, #searchForm{display: none;}