@charset "UTF-8";
/* 
*
* CSS file for Stichting Borger-Odoorn
*
* Copyright (c) 2010 WHG Design
* @link		http://www.whgdesign.nl/
*
*/

/* HTML elements  */
	
	h1, h2, h3, h4, h5, h6{font-weight:normal; margin:0; line-height:1em;}	
	h1{font-size:2em; margin-bottom:.5em;}
	h2{font-size:1.75em; margin-bottom:.5142em; padding-top:.2em;}
	h3{font-size:1.5em; margin-bottom:.7em; padding-top:.3em;}
	h4{font-size:1.25em; margin-bottom:.6em;}
	h5,h6{font-size:1em; margin-bottom:.5em; font-weight:bold;}
	
	p, blockquote, ul, ol, dl, form, table, pre{line-height:inherit; margin:0 0 1.5em 0;}
	ul, ol, dl{padding:0;}
	ul ul, ul ol, ol ol, ol ul, dd{margin:0;}
	li{margin:0 0 0 2em; display:list-item; list-style-position:outside;}
	blockquote, dd{padding:0 0 0 2em;}
	pre, code, samp, kbd, var{font:100% mono-space,monospace;}
	pre{overflow:auto;}
	abbr, acronym{text-transform:uppercase; border-bottom:1px dotted #000; letter-spacing:1px;}
	abbr[title], acronym[title]{cursor:help;}
	small{font-size:.9em;}
	sup, sub{font-size:.8em;}
	em, cite, q{font-style:italic;}
	img{border:none;}
	hr{display:none;}
	table{width:100%;border-collapse:collapse;}
	th,caption{text-align:left;}
	form div{margin:.5em 0;clear:both;}
	label{display:block;}
	fieldset{margin:0;padding:0;border:none;}
	legend{font-weight:bold;}
	input[type="radio"],input[type="checkbox"], .radio, .checkbox{margin:0 .25em 0 0;}

/* //  HTML elements */	

/* common */		
	
	.left{float:left;margin-right:1em;}
	.right{float:right;margin-left:1em;}
	.center{text-align:center;}
	
	.clear{clear:both;}
	.first{margin-left:0 !important;}
	.last{margin-right:0 !important;}
	.top{margin-top:0 !important;}
	.bottom{margin-bottom:0 !important;}
	.hidden, .print{display:none;}
	.graphic{margin:0; padding:0; display:block; overflow:hidden; text-indent:-8000px;}

/* // common */			

/* base */
	
	html {background:#f6f4e7 url(../images/body_bkg.jpg) repeat-x 0 0;}
	body, table, input, textarea, select, li, button{font:1em "Trebuchet MS", Arial, Sans-Serif; line-height:1.6em; letter-spacing:0.01em; color:#3d301c;}		
	body{font-size:13px; background:url(../images/bkg_glow.png) no-repeat -35px top; margin:0; padding:1px 0 0; text-align:center;}	
	a, a:visited{text-decoration:none; color:#8d1000; outline:none;}
	a:hover{color:#3d301c;}
	ins{text-decoration:none; color:#900; font-style:italic;}
	code{color:#555;}
	pre{	margin-left:2em; padding-left:2em; border-left:1px solid #ccc;}
	address {margin:1em 0;}
	blockquote{margin-left:2em; border-left:1px solid #ccc; font-style:italic;}	
	dt{font-weight:bold;}
	th, td{padding:.5em 1em;line-height:1.5em;}
	th{background:#eee;}
	td{border-bottom:1px solid #eee;}
	caption{font-style:italic;color:#777;margin:.5em 0;}	
	fieldset{margin:0 0 1.5em 0;}
	legend{padding:2px 5px;}	
	form div.col{clear:none;}form div.first{clear:both;}
	form div{overflow:hidden;}
	
	form.style input{width:180px; height:14px; font-size:11.5px;}
	form.style div.topspace{margin-top:20px;}
	
	input[type="text"], input[type="password"], textarea, .field, .area, select{border:1px solid #aaa; padding:5px; background:#fff; width:300px; line-height:1em; margin:0;}
	select{width:312px;}
	textarea, .area{overflow:auto; height:150px; width:400px;}
	input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus, .focus{background:#f5f5f5;outline:none;}
	.submit{}
	button{border:none; background:#555; color:#fff; padding:0 2.5em; height:2em; line-height:2em; cursor:pointer;}
		
	.note, .success, .error{display:block;}
	.error{color:#900;}
	.success{color:#060;}
	.note{font-weight:bold;}
	
	.pullquote{width:20%; float:left; margin-right:2em; padding-right:2em; border-right:1px solid #ccc; text-align:right; font-size:1.1em; font-style:italic; color:#777; margin-bottom:.5em;}
	.boxout{width:20%; float:right; margin-left:2em; padding:1em 2em; border:1px solid #ccc; margin-bottom:.5em;}
	#easy_tooltip{border:1px solid #e1e1e1; padding:2px 10px; background:#f5f5f5;}

/* base */

/* layout */

	#bkg_dots {position:absolute; width:100%; height:100%; background:url(../images/bkg_dots.png) no-repeat 0 0;}
	#container{margin:0 auto; width:940px; text-align:left; position:relative;}
	.inner{position:relative;}
	#header{position:relative; margin-bottom:13em;}	
	#footer{position:relative; clear:both;}	
		
	.content{clear:both; padding:1em 0;}
	.main, .secondary, .tertiary, .quaternary{float:left; display:inline-block;}
	.main{width:600px;}
	.secondary{width:280px; margin-left:60px;}
	.tertiary{clear:both; margin-top:2.5em; width:100%;}
	.quaternary{}
	
	/* grid */
		
		.cols{} /* main column container class */
		.col{float:left; display:inline; width:48%; margin-left:4%;} /* 2 equal width columns layout - default */
		.cols3 .col{width:30%; margin-left:5%;} /* 3 equal width columns layout */
		.cols4 .col{width:22%; margin-left:4%;} /* 4 equal width columns layout */
		
		/* use following classes to build custom grid (add as many as you want) */
		
		.col1, .col2, .col3{float:left;display:inline;}
		.col1{}
		.col2{}
		.col3{}
		
		.indent1{}
		.indent2{}
		.indent3{}
		
	/* grid */	

/* // layout */

/* navigation */

	#navigation_header{clear:both; width:100%; overflow:inherit;}
	#nav {clear:left; float:left; position:relative; left:50%; height:56px; margin:80px 0 0 0; padding:0; list-style:none;}
	#nav li{float:left; display:inline-block; position:relative; right:50%; height:56px; line-height:52px; padding:0 0 0 15px; margin:0 .3em; background:url(../images/nav_buttons_left_bkg.png) no-repeat 0 0;}	

	#nav a{display:inline-block; padding:0 17px 10px 0; background:url(../images/nav_buttons_right_bkg.png) no-repeat top right; font-size:1.25em; font-weight:400; text-transform:uppercase; color:#f6f4e1; outline:none; cursor:pointer;}
	#nav a span{display:inline-block; padding:0 0 10px 0; background:url(../images/nav_buttons_bkg.png) no-repeat top center;}
	#nav a:hover span {background:url(../images/nav_buttons_bkg.png) no-repeat center -68px;}
	#nav a.active span {background:url(../images/nav_buttons_bkg.png) no-repeat center -68px;}
	
	
	#nav ul{position:absolute; left:0; top:57px; padding:0; margin:0 auto; background:none; display:none; z-index:1000;}
	#nav ul li{display:block; position:relative; right:0; margin:1px auto; clear:both;}
	
/* //navigation */

/* header */

	#header h1{margin:36px 0 0 -5%;}
	#header h1 a{display:block; width:456px; height:124px; background:url(../images/logo.png) no-repeat 0 0; text-indent:-9999px;}		

/* // header */

/* slider */
	
	.slideContainer {width:380px; height:160px; margin:0 0 20px; overflow:hidden; position:relative; cursor:pointer; color:#000; padding:0; margin:0;}
	div.slides {position:absolute; top:0; left:0; padding:0; margin:0;}
	ul.slides {position:absolute; top:0; left:0; list-style:none; padding:0; margin:0;}
	div.slides > div,ul.slides li {position:absolute; top:0; left:0; width:380px; display:none; padding:0; margin:10px 0 0 0;}
	div.slides > div img,ul.slides li img {width:380px; height:150px;}
	
	div.slides .description {position:absolute; top:120px; left:0; width:350px; height:2em; padding:.3em 1em; background:#000; /* for IE */ filter:alpha(opacity=0); opacity:0; font:400 1.2em "Trebuchet MS", Arial, Sans-Serif; color:#fff;}
	div.slides:hover .description {/* for IE */ filter:alpha(opacity=65); opacity:0.65;}
	
	#loopedSlider {position:absolute; top:0; right:0; width:477px; height:181px; padding:0 0 0 49px; margin:0 -100px 0 0; background:url(../images/border_slides.png) no-repeat 0 0;}
	
	a.previous {display:block; position:absolute; top:70.5px; left:-2px; width:30px; height:29px; background:url(../images/button_left.png) no-repeat 0 0; text-indent:-9999px; outline:none;}
	a.next {display:block; position:absolute; top:70.5px; right:44px; width:30px; height:29px; background:url(../images/button_right.png) no-repeat 0 0; text-indent:-9999px; outline:none;}
	
	ul.pagination {position:absolute; top:10px; left:49px; list-style:none; padding:0; margin:0;}
	ul.pagination li  {float:left; margin:0;}
	ul.pagination li a {background:#333; opacity:0.8; padding:1px 5px; margin:0 2px; outline:none; color:#fff;}
	ul.pagination li a:hover {background:#ad1400; opacity:0.8;}
	ul.pagination li.active a {background:#ad1400; opacity:0.8;}
	
/* slider */
	
/* content */

	.content a, .content a:visited{text-decoration:none; font-style:italic;}
	.content h1 {font-size:1.75em; margin-bottom:.5142em; padding-top:.2em;}
	.content img {padding:.3em; margin:.5em .5em .5em 0; border:1px solid #999;}
	.content img.nostyle {padding:.3em; margin:.5em .5em .5em 0; border:none;}
	.col1 h3 {line-height:28px; padding:0.3em 0 0 42px; margin:0 0 .4em; background:url(../images/monitor.png) no-repeat 0 0;}
	.col2 h3 {line-height:28px; padding:0.3em 0 0 42px; margin:0 0 .4em; background:url(../images/discussion.png) no-repeat 0 0;}
	.col3 h3 {line-height:28px; padding:0.3em 0 0 42px; margin:0 0 .4em; background:url(../images/presentation.png) no-repeat 0 0;}
	.icons p {padding:0 0 0 42px;}
	
	.slogan {margin:1em 0; font:400 2em "Trebuchet MS", Arial, Sans-Serif; color:#bea989; text-align:center;}
	.slogan em {font-style:normal; color:#836a45;}
	
	#agendafixed{position:relative; z-index:999;}
	
	.agenda img {margin:0; padding:0; border:none;}
	.agenda .readmore {padding-left:20px; background:url(../images/readmore.png) no-repeat 0 0; font-size:11px; line-height:16px; color:#8d1000; text-indent:-9999px;}
	
	.agenda .month {float:right; display:block; width:283px; height:113px; padding:10px 0 0 0; background:url(../images/agenda_maand_bkg.png) no-repeat 0 0;}
	.agenda .inner_month {float:left; text-align:center; width:223px; height:100%; margin-left:30px;}
	.agenda .month h2 {margin:0 1em; line-height:.7em; padding:0;}
	.agenda .month .arrowleft {float:left; dislpay:inline-block; margin:0; paddin:0;}
	.agenda .month .arrowright {float:right; dislpay:inline-block; margin:-1.2em 0 0; paddin:0;}
	
	#agendarotate{margin:50px 0 0 -20px;}
	#agendarotate img{}
	
	.agenda .date {line-height:32px; padding-left:46px; margin:0 0 1em; background:url(../images/event.png) no-repeat 0 0;}
	.agenda ul {padding:0; margin:0; list-style:none;}
	.agenda ul li.agendaitem {padding:0; margin:0;}
	.agenda ul li.agendaitem h4 {padding:0; margin:0 0 1em; font-style:normal;}
	.agenda ul li.agendaitem a {cursor:pointer; display:block; padding:15px 10px; margin:15px 0; color:#3d301c; background:url(../images/agendaitem_bkg.png) repeat-x; -webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; border-top-left-radius:10px; border-top-right-radius:10px;}
	.agenda ul li.agendaitem a:hover {background:#e4dfb4;}
	
	#popup {background:#ebe7ba;}
	
	.agendapopup {background:#ebe7ba;}
	
	.agendapopup .month {float:right; display:block; height:100%;}
	.agendapopup .month h2 {float:left; margin:0 1em; line-height:.7em; padding:0;}
	.agendapopup .month .arrowleft {float:left; dislpay:inline-block; margin:0; paddin:0;}
	.agendapopup .month .arrowright {float:left; dislpay:inline-block; margin:0; paddin:0;}
	
	.agendapopup .date {line-height:32px; padding-left:46px; margin:0 0 1em; background:url(../images/event.png) no-repeat 0 0;}
	.agendapopup .agendaitem {padding:20px; margin:0;}
	.agendapopup .agendaitem h4 {margin:0 0 1em;}
	
/* // content */

/* sidebar */

	#sidebar {width:353px; height:100%; padding-top:10px; background:url(../images/sidebar_top.png) no-repeat 0 0;}
	#sidebar .middle {padding:0 0 0; margin-bottom:0; background:url(../images/sidebar_middle.png) repeat-y 0 0;}
	#sidebar .middle .toptext {margin:0 0 1em; padding:0; text-align:center; font-size:.9em;}
	#sidebar .bottom {height:36px; background:url(../images/sidebar_bottom.png) repeat-y left bottom;}
	#sidebar .item {margin:0 20px; padding:0 20px 10px 30px;}
	#sidebar .item .label {display:inline-block; line-height:42px; padding:0 0 0 7px; margin:0 0 0 -32px; background:url(../images/label_left.png) no-repeat 0 0;}
	#sidebar .item .label a {display:inline-block; padding:0 24px 0 0; background:url(../images/label_right.jpg) no-repeat top right;}
	#sidebar .item .label a span {display:inline-block; height:42px; margin:0; padding:.5em 10px 0 13px; background:url(../images/label_middle.png) repeat-x 0 0; font:700 1.1em "Trebuchet MS", Arial, Sans-Serif; text-transform:uppercase; color:#e9e5c0;}
	#sidebar .item .label a span em {font-size:1.3em;}
	#sidebar .item .label a span i {font:italic 400 1em "Trebuchet MS", Arial, Sans-Serif; text-transform:lowercase; color:#92c841;}
	#sidebar h3 {display:block; width:11.5em; height:32px; line-height:.8em; padding:.3em 0 0 0; margin:0 auto; background:url(../images/events.png) no-repeat top right; text-align:left; font:italic 700 1.3em "Trebuchet MS", Arial, Sans-Serif;}
	#sidebar h4 {font:italic 700 1.1em "Trebuchet MS", Arial, Sans-Serif;}

/* sidebar */

/* footer */
	
	#footer {clear:both; width:100%; padding-bottom:20px; margin-bottom:0; border-top:1px solid #fff; border-bottom:1px solid #fff; background:#eeebd0; overflow:hidden;}
	#footer .columns {float:left; width:100%;}
	#footer .columns ul.column {float:left; position:relative; left:50%;}
	#footer .columns ul.column li {float:left; position:relative; right:50%; margin:0 2em;}
	
	#footer .columns ul.subnav {text-align:center; width:100%;}
	#footer .columns ul.subnav li {clear:both; width:100%; margin:0; position:static;}
		
	#footer ul {list-style:none; padding:0; margin:5px 0 0;}
	#footer ul li {list-style:none; padding:0; margin:2px 0;}
	#footer ul li a {font:700 1.1em "Trebuchet MS", Arial, Sans-Serif; text-transform:uppercase; color:#8d1000;}
	#footer ul li ul li {margin:0;}
	#footer ul li ul li a {font:400 1em "Trebuchet MS", Arial, Sans-Serif; text-transform:none; color:#6ba218;}
	
	#copyright {padding-top:1.5em; background:url(../images/footer.png) no-repeat center -16px;}
	#copyright p {clear:both; font-size:.9em;}
	#copyright p a.whgdesign {display:inline-block; line-height:23px; width:86px; background:url(../images/logo_web_lightbg.png) no-repeat 0 0; text-indent:-9999px;}
	#copyright a, #copyright a:visited{text-decoration:none;}
	
/* // footer */

/* clearfix */

	.inner:after, .content:after, .cols:after, .fixed:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
	.inner, .content, .cols, .fixed{display:block; min-height:1%;}
	* html .inner, * html .content, * html .cols, * html .fixed{height:1%;}

/* // clearfix */