/* main.css */

html, body {
	margin: 0;
	padding: 0;
}

body {
	font-size: 100%;
	color: #000;
	background: #fff;
	font-family: "Trebuchet MS", sans-serif;
}

.hide	{
	display: none;
	}

/* GENERAL */
h1 {
	font-size: 145%;
	color: #222;
	background: transparent;
	line-height: 120%;
	margin: 0 6% 20px;
	font-weight: normal;
}

h2 {
	color: #6b5121;
	background: transparent;
	margin: 1.4em 6% 0.6em;
	font-size: 120%;
	line-height: 120%;
}

h3 {
	margin: 1.6em 6% 0.5em;
	font-size: 105%;
	line-height: 140%;
	color: #000;
	background: transparent;
}

h4 {
	margin: 1.6em 6% 0.5em;
	font-size: 100%;
	line-height: 140%;
	color: #333;
	background: transparent;
}

p { margin: 0 6% 1em; text-align: left; }

h2.intro, p.intro { font-style: italic; font-weight: normal; font-size: 100%; line-height: 135%; margin-bottom: 0.8em; color: #6b5121; background: transparent; }
.preintro { font-size: 90%; line-height: 130%; border-bottom: 1px solid #ccc; padding-bottom: 1em; font-style: italic; }

ul {
	list-style: none outside;
	margin: 0 6% 1.7em;
	padding: 0;
}

ol {
	list-style-position: outside;
	margin: 0 6% 1.7em; padding: 0 0 0 2.2em;
}

ul li {
	margin: 0; color: #000; background: url("/img/arrow.gif") transparent 2px 0.3em no-repeat;
	padding: 0.1em 0 0.1em 1.5em;
}

#extra ul li {
	background-position: 0 0.3em;
}

ol li { padding: 0.1em 0; margin: 0; }

blockquote, .source {
	margin: 1em 6%;
	font-family: Georgia, serif;
	font-style: italic;
	color: #333;
	background: #e6e6e0;
	padding: 0.7em 4% 1px;
}

li blockquote { margin: 0; }

blockquote p { margin: 0 0 1em; text-align: left; }

hr { margin: 1.6em 0; width: 86%; height: 0; color: #eeeee0; background: #eeeee0; border-bottom: 1px solid #bbbbb5; display: block; }
html>body hr { margin: 1.6em 6%; } 

li h2, li h3, li h4 { margin-left: 0; margin-right: 0; }

li p { margin-left: 0; margin-right: 0; text-align: left; }

.source { font-style: normal; }
.error { border: 3px solid #333330; padding: 6px; }

table.newspage { font-size: 100%; line-height: 100%; margin: 0em 0 0em 0%; border: 0px; }

td.newsitems {
width: 80%;
color: #000;
background: transparent;
border: 0;
padding: 0px 0px;
vertical-align: top;
text-align: left;
}

td.blogitems {
width: 20%;
color: #000;
background: transparent;
border: 0;
padding: 0px 0px;
vertical-align: top;
text-align: left;
}

table.artistspage { font-size: 100%; line-height: 100%; margin: 0em 0 0em 0%; border: 0px; }

td.artistspageitems {
width: 80%;
color: #000;
background: transparent;
border: 0;
padding: 0px 0px;
vertical-align: top;
text-align: left;
}

td.artistspagesidebar {
width: 20%;
color: #000;
background: transparent;
border: 0;
padding: 0px 0px;
vertical-align: top;
text-align: left;
font-size: .85em;
}

td.podcastpagesidebar {
width: 20%;
color: #000;
background: transparent;
border: 0;
padding: 0px 0px;
vertical-align: top;
text-align: left;
font-size: .80em;
}

table { font-size: 80%; line-height: 130%; margin: 2.28em 0 2.5em 6%; border: 0px none #bbbbb5; }
td { color: #000; background: transparent; border: 0px none #bbbbb5; padding: 2px 5px; vertical-align: top; text-align: right; }
th { color: #333330; background: #d0d0c9; border: 1px solid #bbbbb5; padding: 1px 5px; vertical-align: top; text-align: left; }
caption { color: #333330; background: transparent; font-size: 110%; font-weight: bold; padding-bottom: 1em; }
.gallery { border: 0; }
.gallery td, .gallery th { border: 0; color: #000; background: transparent; text-align: center; padding: 2px 3px; font-weight: normal; }

sup {
	line-height: 90%; vertical-align: 0.6em; font-size: 80%;
}

img {
	vertical-align: middle; border: 0;
}

#outerwrap .ext {
	border: 0; display: inline;
	padding: 0;
	vertical-align: middle;
	margin: 1px 1px 2px 2px;
}

.q {
	font-style: italic;
}

a:link {
	color: #cc9933;
	background-color: transparent;
	text-decoration: none;
}

a:visited {
	color: #395284;
	background-color: transparent;
	text-decoration: none;
}

a:hover, a:active {
	color: blue;
	background-color: transparent;
	text-decoration: none;
}

a[name][id]:hover { color: inherit; background: transparent; text-decoration: none; }

a.toplink:link, a.toplink:visited { color: #b06030; background-color: transparent; }
a.toplink:hover, a.toplink:active { color: #b06030; background-color: transparent; }

.img a { display: block; }

.cd_statement {
font-size: 85%;
}

.statement {
	font-size: 85%;
}

abbr, acronym {
	font-style: inherit;
	border: 0;
}

abbr[title], acronym[title] {
	font-style: inherit;
	border-bottom: 1px dotted #a0a0aa;
	cursor: help;
}

code, kbd, samp {
	font-size: 95%;
	line-height: inherit;
	font-family: Monaco, monospace;
	color: #6b5121;
	background: transparent;
}

body.doorsturen code { font-size: 80%; line-height: 100%; }

address { font-style: normal; margin: 0 6% 1em; }
#extra address { margin: 0 0 1.2em; }

.break {
	clear: both;
	line-height: 1px;
	font-size: 1px;
}

.date {
	color: #888884;
	background: transparent;
}

.left {
	float: left;
	margin: 2px 8px 6px 0;
} 

.left img, .right img {
	margin: 0 0 4px;
}

.right {
	float: right;
	margin: 2px 0 6px 8px;
}

.left, .right { line-height: 130%; font-size: 80%; font-style: italic; }

.center { text-align: center; }

p.left, div.left { margin-left: 6%; }
p.right, div.right { margin-right: 6%; }

#innerwrap .free {
	border-width: 0;
}

.chapter { margin: 0 0 24px; border-bottom: 1px dashed #bbbbb5; }

.comment { 
	clear: both;
	font-size: 90%;
	line-height: 140%;
	padding: 5px 0;
	font-style: italic;
} 

td.comment { text-align: left; padding: 0.6em; font-size: 100%; color: #000; background: #eeeee7; }

#quicknav {
	position: absolute;
	top: -100em;
	left: 0;
}

body.faq ol blockquote {
	margin: 0 0 0.4em 0; padding: 0; 
	color: #333330; background: transparent; 
	font-family: sans-serif; font-weight: bold; font-style: normal;
}

body.faq ol p, body.faq ol blockquote p { 
	margin: 0 0 0.4em 0; text-align: left;
}

}

.shortlist { font-size: 85%; line-height: 140%; padding-left: 2.5em; }


/* MAIN BLOCKS */
#outerwrap {
	color: #000; position: absolute;
	background: url("/img/bgs/header5.jpg") #020202 top left no-repeat;
	padding: 0; width: 100%;
}

body.homepage #outerwrap {
	background-image: url("voyager_in_space.jpg");
}

body.bedrijf #outerwrap {
	background-image: url("/img/bgs/header2.jpg");
}

body.portfolio #outerwrap {
	background-image: url("/img/bgs/header3.jpg");
}

body.diensten #outerwrap {
	background-image: url("/img/bgs/header6.jpg");
}

body.nieuws #outerwrap, body.contact #outerwrap {
	background-image: url("/img/bgs/header4.jpg");
}

#logo {
	color: #000;
	background: url("/img/logo_bg.jpg") transparent top right no-repeat;
	margin: 0;
	height: 139px;
	text-align: right;
}

#innerwrap {
	color: #000;
	background: url("/img/innerwrap.jpg") #eeeee7;
	border-bottom: 1px solid #666;
	border-top: 1px solid #fff;
}

#content {
	font-size: 95%;
	line-height: 135%;
	padding: 35px 0 1px;
	color: #222;
	background: url("/img/bgs/body5.jpg") transparent top left no-repeat;
	float: left;
	width: 68%;  
}

body.homepage #content {
	background-image: url("/img/bgs/body1.jpg");
	float: none;
	width: 100%;
}

body.bedrijf #content {
	background-image: url("/img/bgs/body2.jpg");
}

body.portfolio #content {
	background-image: url("/img/bgs/body3.jpg");
}

body.diensten #content {
	background-image: url("/img/bgs/body6.jpg");
}

body.nieuws #content, body.contact #content {
	background-image: url("/img/bgs/body4.jpg");
}

/* homepage */
#focus { 
	margin: 0 5% 20px 4%;
	color: #000; background: url("/img/home/focus_tile.jpg");
}
#bg { color: #000; background: url("focus_bg3.jpg") #f1f1ea bottom right no-repeat; border: none; }
#focus h1 { margin: 0 0 12px; }
#focus .intro { font-size: 95%; line-height: 120%; margin: 0 300px 20px 5%; }
#focusicons { margin: 0 0 12px 5%; }
#focusicons a { display: block; }
#focusicons img { margin: 0 7px 0 0; }

#message { color: #444; background: transparent; padding: 10px 0 0; margin: 0 5% 10px 4%; clear: both; }

#message_2 { color: #444; background: transparent; padding: 10px 0 0; margin: 0 5% 10px 4%; clear: both; }

.artists {
font-size: 100%;
font-weight: normal;
background: transparent;
margin-left: .20in; margin-right: .30in;
color: #000;
font-family: "Trebuchet MS", sans-serif;
}

.standardnews {
font-size: 100%;
font-weight: normal;
background: transparent;
margin-left: .20in; margin-right: .30in;
color: #000;
font-family: "Trebuchet MS", sans-serif;
}

.shortnews {
	font-size: 90%;
	line-height: 140%;
	color: #333;
	background: transparent;
	margin: 30px 0 0;
}

.shortnews h2 { 
	padding: 0;
	font-size: 115%;
	line-height: 130%;
	margin: 0 0 0.5em 0;
	font-weight: bold;
} 

.shortnews p { margin-left: 0; margin-right: 0; text-align: left; }

.more { white-space: nowrap; font-size: 90%; }

.block1 {
	width: 27%;
	float: left;
	margin: 0 3% 10px 2%; 
}

html>body .block1 { margin-left: 4.5%; }

.block2 {
	width: 27%;
	float: left;
	margin: 0 2% 10px; 
}

.block3 {
	width: 27%;
	float: right;
	margin: 0 2.5% 10px 2%; 
}

html>body .block3 { margin-right: 5%; }

.attention {
	clear: both;
	border: 2px solid #ccccc0;
	padding: 0 1em;
	margin: 30px 0 0;
}

.detour {
	clear: both;
	margin: 30px 6%;
	font-size: 85%; line-height: 130%;
}

.detour p, .detour h3, .detour ul { margin-left: 0; margin-right: 0; }

/* FORMS */
form {
	margin: 20px 6%;
}

#extra form { margin: 25px 0 0; }

fieldset { 
	margin: 0; border: 0; 
}

input, textarea { font-family: sans-serif; font-size: 100%; line-height: 130%; }

legend { margin: 0 0 -0.4em; display: block; font-weight: bold; color: #6b5121; background: transparent; }
.addition { font-size: 80%; color: #555550; background: transparent; }

form p {
	clear: both; margin-left: 0; margin-right: 0; text-align: left;
}

textarea { width: 80%; }
te\xtarea { width: 100%; }

input, textarea {
	font-size: 90%;
	line-height: 120%;
	vertical-align: middle;
}

.text, textarea {
	margin: 1px 0 4px; 
}

.lbl { 
	width: 35%;
	float: left;
	padding-top: 0.2em;
}

form p.comment {
	padding-top: 5px;
}

#content input.submit { float: right; margin: 0.3em 0 0.3em 0.4em; } 
#content p.submit { text-align: right; }

.box { margin-top: 20px; margin-bottom: 20px; border: 1px solid #ccc; color: #000; background: #f1f1ea; }

.ne, .nw, .se, .sw { position: relative; }
.nw { left: -1px; top: -1px; color: #000; background: url("/img/box/nw.gif") top left no-repeat; }
.ne { left: 2px; color: #000; background: url("/img/box/ne.gif") top right no-repeat; }
.se { top: 2px; color: #000; background: url("/img/box/se.gif") bottom right no-repeat; }
.sw { left: -2px; padding: 12px 7% 12px; color: #000; background: url("/img/box/sw.gif") bottom left no-repeat; }
#focus .ne { background-image: url("/img/box/ne_h.gif"); }
#focus .se { background-image: url("/img/box/se_h.gif"); }
#focus .sw { padding: 12px 3%; }
#content form .sw { padding: 1.2em 4% 12px; }

.info { color: #444; font-size: 90%; line-height: 130%; margin: 0.4em 6% 0.4em 1.2em; width: 35%; float: right; }
.info .sw { padding: 0 4% 0; }
.info p { padding: 1em 0; margin-top: 0; margin-bottom: 0; text-align: left; }

/* EXTRA */
#extra {
	color: #333330;
	background: transparent;
	float: right;
	width: 26%;
	padding: 0 0 30px 0;
	font-size: 85%;
	line-height: 135%;
	margin: 16px 3% 0 0;	
}

html>body #extra { margin: 16px 5% 0 0; }

body.casestudy #extra { color: #000; background: url("/img/innerwrap.jpg") #eeeee7; margin-right: 0; position: absolute; top: 140px; right: 5%; }

#extra h2, .col1 h2, .col2 h2 { 
	font-size: 110%;
	line-height: 120%;
	margin: 25px 0 8px;
	color: #222; background: transparent;
} 
.col1 h2, .col2 h2 { margin-top: 20px; }
#extra .img, .col1 .img, .col2 .img { border-bottom: 1px solid #ccc; color: #444440; background-color: #e6e6e0; }

#innerwrap .box h2 { margin-top: 4px; } 

#extra h3 {
	margin: 0 0 0.8em;
}

#extra p, #extra ul, #extra ol {
	margin: 0 0 1em;
}

ul ul, #extra ul ul { margin: 0.4em 0; }

div.member { margin: 0 0 2.3em; }
div.member h2 { font-size: 100%; line-height: 120%; padding: 15px 0 0; background-image: none; margin: 4px 0 0; color: #6b5121; background: transparent; }
div.member h3 { font-size: 100%; line-height: 120%; margin: 0 0 0.4em; }
.portrait { float: left; margin: 0 -6px -2px 0; }
.portrait img { position: relative; top: -15px; left: -10px; }
div.member p { clear: both; text-align: left; } 

/* NIEUWS */
body.nieuws li { 
	padding: 0.1em 0; background-image: none;
} 

body.nieuws ul h2 {
	font-size: 100%;
}

/* DIENSTEN */
.col1 {
	font-size: 85%;
	line-height: 135%;
	width: 41%;
	margin: 0 3% 0 3%;
	float: left;
	padding: 0 0 10px 0;
}

html>body .col1 { margin-left: 6%; margin-right: 3%; }

.col2 {
	font-size: 85%;
	line-height: 135%;
	width: 41%;
	margin: 0 3% 0 3%;
	float: right;
	padding: 0 0 10px 0;
}

html>body .col2 { margin-left: 2%; margin-right: 6%; }

.col1 p, .col2 p { margin-left: 0; margin-right: 0; text-align: left; }

body.diensten.waarom #content li {
	margin-bottom: 20px;
}

/* PORTFOLIO */
.pflist { list-style: none outside; margin: 30px 0 0; padding: 0; }
.pflist li {
	font-size: 85%;
	line-height: 130%;
	float: right;
	width: 40%; padding: 0;
	margin: 0 3% 32px 0; 
	text-align: center;
	background-image: none;
}

html>body .pflist li { margin-right: 8%; }

.pflist .first {
	clear: both; float: left; margin-left: 3%; margin-right: 0;
}

html>body .pflist .first { margin-right: 0; margin-left: 6%; }
.pflist li img { display: block; margin: 0 auto 6px; }

#extra h2.cs { 
	background-image: none;
	padding: 0;
	color: #000;
	background: transparent;
} 

#extra h2.cs img {
	display: block;
	margin: 0 0 12px;
}

.clientlist { list-style: none outside; margin: 0.5em 0; padding: 0; }
.clientlist li { padding: 0; background-image: none; }
.clientlist h3 { margin: 0 0 0.8em; font-size: 100%; line-height: 130%; color: #6b5121; background: transparent; }
.branche { font-weight: normal; color: #000; background: transparent; }
.q { font-family: Georgia, serif; font-style: italic; }
#extra .clientlist p { margin-left: 0.7em; line-height: 130%; text-align: left; }
#extra .box h3 { margin: 0 0 0.6em; }

/* NAVIGATION */
#navigation {
	height: 22px;
	width: 100%;
	margin: 0;
	position: absolute;
	top: 139px;
	left: 0;
	border-top: none;
	color: #000;
	background: url("/img/bevel.gif") transparent top left repeat-x;
}

#navigation h2 { visibility: hidden; }

#navigation ul {
	position: absolute;
	top: -24px;
	left: 0;
	margin: 0;
	padding: 0;
	list-style: none outside;
	height: 23px;
	color: #fff;
	background: url("/img/bgs/menu5.jpg") #606066 no-repeat;
	width: 511px;
}

body.homepage #navigation ul {
	background-image: url("/img/bgs/menu1.jpg");
}

body.bedrijf #navigation ul {
	background-image: url("/img/bgs/menu2.jpg");
}

body.portfolio #navigation ul {
	background-image: url("/img/bgs/menu3.jpg");
}

body.diensten #navigation ul {
	background-image: url("/img/bgs/menu6.jpg");
}

body.nieuws #navigation ul, body.contact #navigation ul {
	background-image: url("/img/bgs/menu4.jpg");
}

#navigation li {
	width: 72px;
	float: left;
	margin: 0;
	padding: 0;
	border-top: 1px solid #cccac5;
	border-right: 1px solid #cccac5;
	font-size: 85%;
	text-align: center;
	background-image: none;
}

#navigation li strong {
	display: block;
}

#navigation li a {
	text-decoration: none;
	display: block;
	color: #fff;
	background-color: transparent;
}

#navigation li a:focus {
	color: #fff;
	background-color: #72737d;
}

#navigation li a:hover, #navigation li a:active {
	color: #000;
	background-color: #666;
}

#navigation li strong a:hover {
	color: #b06030;
	background-color: transparent;
}

/* FOOTER */	
#footer {
	clear: both;
	padding: 6px 5% 18px;
	font-size: 80%;
	line-height: 170%;
	margin: 0;
}

td.tabledatalinks {width: 270px; text-align: center}

/*
If you select the "Use my own CSS" option, you must copy and paste these classes into your CSS. Of course you can edit them as you like to customize the look and feel of your feedroll.
*/

/* border table for feed news */
.fd_bordertable { 
	background-color: white; 
	border-style: solid; border-width: 1px; border-color: #CCCCCC; 
	padding: 0; 
	
}

/* maintable table for feed news */
.fd_maintable { border-width: 0; background: transparent }

/* header cell with header text and xml button */
.fd_header { 
	padding: 0px; 
	background: #666666; color: white; 
	font-family: "Trebuchet MS", Times, serif; font-size: 12px; font-weight: bold; 
	text-align: left; vertical-align: top 
}

/* item description area */
.fd_itemcell { 
	padding: 8px; 
	line-height: 16px; 
	background: transparent; color: black; 
	font-family: "Trebuchet MS", Times, serif; font-size: 10px
}

/* item link properties, such as text-decoration and etc */
.fd_itemlink { color: blue; text-decoration: none; }
.fd_itemlink:visited { color: #395284; text-decoration: none }
.fd_itemlink:hover { color: blue; text-decoration: none }

/* For Technorati tags */

.techtag { font-size: 10px; }
.techtags { font-size: 10px; }