/* 

Theme Name: Dutch Design Office	
Theme Url: http://www.dutch-design-office.nl
Description: The new them voor 2010.
Author: Dutch Design Office
Author Url: www.Dutch-design-office.nl

Version: 1.0

*/

html, body { 
	height			: 100%;
	padding			: 0; 
	margin			: 0; 
	
}

body {
	font-family		: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color			: #000;
	font-size		: 12px;
	line-height 	: 20px;
	background		: #000 url(images/bg/bg5.jpg) no-repeat;
	
}

#wrapper {
		margin			: 0 auto;
		width			: 100%;
		height			: auto;
		min-height		: 727px;
		min-width		: 100%;
		text-align		: center; 
		z-index			: 999; 
}


			
			
#wrapper #container {
	margin			: 0 auto;
	padding			: 0;
	width			: 998px;
	height			: auto;
	z-index: 999; 
	
}
#logo { 
	float			: left; 
	width			: 250px;
	height			: 168px; 
	margin			: 0 auto; 
	padding			: 16px 0 0 0; 
	text-align		: center;
	background		: #fff;
}

#head-line { 
	
	float: right; 
	width: 650px;
	height: 168px; 
	margin: 0 auto; 
	padding: 16px 0 0 0; 
	font: Arial, Helvetica, sans-serif; 
	font-size: 30px; 
	font-weight: bolder; 
	color: white; 
}
#main-navigation { 
	float: left; 
	height: 46px;
	width: 747px;
	background: #bf1e2e; 
	margin: 26px 0 26px 0; 
	padding: 0; 
} 	
	
#main-navigation-option { 
	float: left; 
	height: 34px;
	width: 236px;
	background: #fff; 
	margin: 26px 0 26px 0; 
	padding-top: 11px;
	padding-right: 15px;
	text-align: right; 
	color: #999;
} 
#main-navigation-option a { 
	color: #ccc; 
	font-size: 11px; 
	text-decoration: none; 
} 
#main-navigation-option a:hover { 
	color: #333; 
	font-size: 11px; 
	text-decoration: none; 
} 

#sidebars { 
	float: right; 
	width: 833px; 
	height: 182px; 
	background: url(images/bg-service-webdesign-huisstijlen.png) no-repeat; 
	margin: 0 auto;
	padding-top: 19px;
	text-align: left;
}
	#sidebars li {
	margin: 0 auto; 
	text-decoration:none; 
	display: block;
	} 

	#sidebars ul{ margin: 0 auto; padding:0;  } 
		
	.widgettitle { 
	color			: #cc3333;
	font-size		: 16px;
	font-weight		: 200;
	margin			: 0 0 5px 0;
	
	}
	.sidebar { 
	float	: right;
	width	: 220px; 
	height	: 180px; 
	margin-top: 0 auto; 
	padding-right: 10px; 
	}
	
	
	.sidebar2 { 
	float	: right;
	width	: 220px; 
	height	: 180px; 
	margin-right: 20px; 
	padding-right: 10px; 
	}
	.sidebar3 { 
	float	: right;
	width	: 160px; 
	height	: 180px; 
	margin-right: 20px; 
	padding-right: 10px; 
	}
	.sidebar3 ul {
	margin: 0 auto; 
	text-decoration:none; 
	display: list;
	list-style:none} 
	
	.read-more { 
	background: url(images/read-more-btn.png) no-repeat; 
	float: right; 
	width: 91px;
	height: 26px;
	margin: 0 7px 0 152px; 
	padding: 2px 0 0 0; 
	color: white; 
	
	}
	
	.read-more a{ color: white; text-decoration: none; text-align: center; } 
	.read-more a:hover{ color: white; text-decoration: underline; text-align: center; } 
	
	.news { 
	float: right; 
	background: url(images/news-bg.jpg) repeat-y left; 
	width: 499px; 
	height: auto; 
	margin-top: 58px; 
	padding: 0; 
	} 
	
	.news p { margin: 0 auto; } 
	
	.read-more-news { 
	float: right; 
	background: url(images/read-more-news.png) no-repeat; 
	width: 23px;
	height: 55px;
	margin-top: 15px;
	display: block;
	padding: 0; }
	
	.headline { 
	float: right; 
	width: 427px; 
	height: auto; 
	margin-top: 15px; 
	text-align: left; 
	padding: 0 31px 0 0; 
	} 
	
	.headline a{ 
	color			: #cc3333;
	font-size		: 14px;
	font-weight		: 600;
	font-style		: bold; 
	margin			: 0 0 5px 0;
	text-decoration	: none; 
	}
	
	.headline a:hover{ 
	color			: #000;
	text-decoration	: none; 
	}
	
	.news .hr {
	float: left; 
	width: 420px;
	height: 2px; 
	background: url(images/hr-line.jpg) no-repeat; 
	margin-top: 15px;
	padding: 0; 
	}
	
	#showcase {
	float: left; 
	width: 403px;
	height: 255px; 
	margin-top: 58px; 
	margin-left: 40px; 
	padding: 0; 
	text-align: center; 
	} 
	
	#showcase-link { 
	background: url(images/screen-showcase-footer.png) no-repeat; 
	float: right; 
	width: 360px;
	height: 25px; 
	margin: 0 auto; 
	padding: 3px 43px 0 0; 
	text-align: right; 
	color: white; 
	
	} 
	
	#showcase-link  a{ color: white; text-decoration: none; text-align: center; } 
	#showcase-link  a:hover{ color: white; text-decoration: underline; text-align: center; } 
	
	#footer { 
	background: url(images/footer-bg-x.png) repeat-x bottom; 
	float			: left; 
	width			: 100%; 
	height			: 360px;
	margin-top		: 30px;
	padding			: 0; 
	text-align		: center; 
	overflow		: visible;
	vertical-align: baseline;
	} 
	#footer-container { 
	margin			: 0 auto;
	padding			: 0;
	width			: 998px;
	height			: auto;
	
	
	
	}
	#fill-color { 
	background-color: #bf1e2e; 
	width: 100%; 
	height: auto; 
	margin: 0 auto;
	} 
	
	.morePrev { 
	float: right; 
	padding-right: 10px; 
	margin: 0 auto; 
	} 
	
	
	#footer-container .hr{
	background		: #cc3333;
	margin			: 5px 0 5px 0;
	padding			: 0;
	width			: 998px;
	height			: 1px;
	}
	
	#flickr { 
	background: url(images/canon-eos-footer.png) no-repeat top right; 
	float: right; 
	width: 481px;
	height: 190px; 
	margin: 0 auto;
	padding-top: 60px;
	text-align: left; 
	} 
	
	#flickr h1{ 
	color			: #fff;
	text-align		: left;
	font-style		: normal;
	line-height		: 24px;} 
	
	#flickr a{ color: white; } 
	
	#sidebar-contact { 
	float: left;
	width: 229px; 
	height: auto;
	margin: 60px 0 0 21px;
	padding: 0; 
	} 
	#sidebar-contact h1{ 
	color			: #fff;
	text-align		: left;
	font-style		: normal;
	line-height		: 24px;} 
	
	#follow-us { 
	background: url(images/follow-us.png) no-repeat; 
	float: left;
	width: 245px;
	height: 118px; 
	margin: 0 auto; 
	padding: 0; 
	} 
	
	#twitter { 
	float: left; 
	width: 116px;
	height: 129px; 
	margin: 0 auto;
	padding: 0; 
	} 
	#facebook { 
	float: left;
	width: 66px; 63px
	height: 129px;
	margin: 0 auto;
	padding: 0; 
	} 
	#RSS { 
	float: left;
	width: 63px; 
	height: 129px;
	margin: 0 auto;
	padding: 0; 
	} 
	
	.footer-link { color: #990000; } 
	.footer-link a{ color: #990000; text-decoration: none; } 
	.footer-link a:hover { color: #fe7582; } 

/*Stijlen*/

	h1 { 
	color			: #cc3333;
	font-size		: 16px;
	font-weight: 200;
	font-style: normal; 
	margin			: 0 0 5px 0;
	
	}
	h2 { 
	color			: #990000;
	font-size		: 16px;
	margin			: 8px 0 5px 0;
	font-weight		: normal; 
	
	}
	
	h3 { 
	color			: #990000;
	font-size		: 16px;
	margin			: 0 0 5px 0;
	font-weight		: bolder; 
	}
	
		h5 { 
	color			: #990000;
	font-size		: 12px;
	margin			: 2px 0 2px 0;
	font-weight		: normal; 
	
	}
	

  	a { 
		color			: #000000;
		text-decoration	: underline;
	}
	a:hover {
		color			: #000;
		text-decoration	: none;
	}
.clear {clear: both;}


/*PAGE*/
	
	#page { 
	float: left; 
	width: 998px;
	height: auto; 
	background: url(images/page-header.png) no-repeat top;
	margin: 0 auto; 
	padding-top: 30px; 
	text-align: left; 
	}
	#page #page-bg { background: #FFF; height: auto; } 
	
	.page-sidebar{ 
	float: right; 
	width: 200px; 
	height: inherit;  
	margin-bottom: 30px;
	padding: 0 29px 0 20px;
	border-left: #bf1e2e dotted thin ; 
	}
	
	#subpage li {
		margin: 0 auto; }
	#subpage li:last-child {
		margin-bottom: 20px;
		border-bottom: 1px dotted #CCC }
		
	#subpage li:first-child { border-bottom: none; } 
	
	
	.page-sidebar li {
	margin: 0 0 20px 0; 
	text-decoration:none; 
	display: block;
	border-bottom: 1px dotted #CCC ;
	} 
	
	.page-sidebar li:last-child {
	border-bottom: none;
	}
	
	.page-sidebar ul li ul li { margin: 0 auto; padding: 0}
	
	.page-sidebar ul { 
	margin: 0 auto;
	display: block;
	
	padding: 0}
	
	
	.page-sidebar a { 
	color: #999; 
	text-decoration: none;}
	
	.page-sidebar p { border-bottom: 1px dotted #CCC ; margin: 0 auto	}
	
	.page-sidebar a:hover { 
	color: #bf1e2e; 
	text-decoration: none;
	font-weight:900; } 
	
	.content { 
	float: left; 
	width: 700px; 
	height: auto; 
	margin: 0 auto;
	padding: 0 0 30px 30px; 
	}

	.content input, textarea { 
	border: 1px solid #EAEAEA;  
	color: #C00; 
	font-size: 12px;
	padding: 4px; 
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	background: #fff;
	z-index: -10; 
	} 
	.content h1 { 
	font-size: 22px;
	font-weight: normal;
	}
	
	.content img{
		border: 1px #ccc solid;
		padding: 4px;
		background: white;
		margin-bottom: 10px;
	}
	.content  a:hover img { 
	border: 1px #999 solid;
	
	}
	

	/**SUCKERFISH MENU**/
#suckerfishnav {
    background:#bf1e2e repeat-x;
    font-size:14px;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-weight:normal;
    width:100%;
    }
#suckerfishnav, #suckerfishnav ul {
    float:left;
    list-style:none;
    line-height:46px;
    padding:0;
    border:0px solid #aaa;
    margin:0;
    width:100%;
    }
#suckerfishnav a {
    display:block;
    color:#FFFFFF;
    text-decoration:none;
    padding:0px 20px;
	font-weight: normal;
    }
#suckerfishnav li {
    float:left;
    padding:0;
    }
#suckerfishnav ul {
    position:absolute;
    left:-999em;
    height:auto;
    width:200px;
    font-weight:normal;
	-moz-opacity:0.85;
    opacity:0.85;
    khtml-opacity:0.85;
	filter:alpha(opacity=85);
    margin:0;
    line-height:1;
    border:0;
    border-top:1px solid #990033;
	text-align: left;
    }
#suckerfishnav li li {
    width:200px;
    border-bottom:1px solid #000;
    border-left:0px solid #666666;
    border-right:0px solid #666666;
    font-weight:bold;
    font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
    }
	
	#suckerfishnav li li:last-child {
		border: none;
	}
#suckerfishnav li li a {
    padding:8px 20px;
    width:160px;
    font-size:12px;
    color:#fff;
    }
#suckerfishnav li ul ul {
    margin:-29px 0 0 200px;
    }
#suckerfishnav li li:hover {
    background:#bf1e2e;
    }
#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {
    color:#fff;
    }
#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {
    color:#fe7582;
	
    }
#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {
    color:#fff;
	
    }
#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {
    left:-999em;
    }
#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {
    left:auto;
    background:#333;
    }
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
    background:#bf1e2e;
    }
#suckerfishnav .current_page_parent {
    background:#bf1e2e;
    }
#suckerfishnav .current_page_item {
    background:#bf1e2e;
	
    }
#suckerfishnav .current_page_parent a:after, #suckerfishnav .current_page_parent li a:after, #suckerfishnav .current_page_parent li li a:after, #suckerfishnav .current_page_parent li li li a:after, #suckerfishnav .current_page_parent li li li li a:after {
    content:"";
    }
#suckerfishnav .current_page_parent a:after, #suckerfishnav li .current_page_parent a:after, #suckerfishnav li li .current_page_parent a:after, #suckerfishnav li li li .current_page_parent a:after {
    color:#000000;
    content:"";
    }
#suckerfishnav .current_page_item a:after, #suckerfishnav li .current_page_item a:after, #suckerfishnav li li .current_page_item a:after, #suckerfishnav li li li .current_page_item a:after, #suckerfishnav li li li li .current_page_item a:after {
    color:#000000;
    content:"";
    }