/*
---------------------------------------------
Style: Portfolio
Description: Mix Media Art
Author: Paco Krijnen
-------------------------------------------- */

/* Global
--------------------------------------------- */
/*  reset alle margins voor alle objecten */
* {margin:0px;padding:0px;} 
body {font:10px "trebuchet MS", Georgia, serif; color:#6d6c6b; background:#ecebe8; text-transform:uppercase;}
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, a {margin:0; padding:0; outline:0;}
img {border-style:none;}
ul,ol,li {list-style-type:none;}

/* Typography
--------------------------------------------- */
a, a:active, a:visited {color:#6d6c6b; text-decoration:none;}
a:hover {color:#000;}
p {font-size:10px;}

h1, h2, h3, h4, h5 {color:#000000;}
h1 {font:60px "trebuchet MS",Georgia, serif;}
h2 {font:10px "trebuchet MS",Georgia, serif; margin:0; padding:0 0 4px 0; letter-spacing:1px;}
h3 {font:36px "trebuchet MS",Georgia, serif;}
h4 {font:24px "trebuchet MS",Georgia, serif;}
h5 {font:20px "trebuchet MS",Georgia, serif;}

/* Navigation
--------------------------------------------- */
#nav {margin:0 -22px 0 0;}
ul#topnav {width:390px; margin:0; padding:26px 0 0 0px; font-size:11px; text-align:center; list-style:none; float:right; letter-spacing:1px;}
ul#topnav li {margin:0; padding:0; display:inline; text-transform:uppercase;}
ul#topnav li a {margin:0 8px 0 8px; padding:4px; color:#6d6c6b; text-decoration:none;}
ul#topnav li a:hover {color:#000;}
ul#topnav .active {color:#000;}



/*		
//////////////////////////////////////////////////////
		START siteLinkBar
//////////////////////////////////////////////////////
*/ 
#siteLinkBar {
	background-color:		#d2d2d2;
	height:					36px;
	width:					100%;
	float:					left;
}
#siteLinkBar a.strauzz,
#siteLinkBar a.strauzz_in,
#siteLinkBar a.strauzz_fb {
	background: 			transparent url('../images/l_strauzz.png') no-repeat top left;
	width:					220px;
	height:					24px;
	margin:					7px 10px 0 0;
	float:					right;
}
#siteLinkBar a.strauzz:hover {
	background-position:	0 -24px;
}
#siteLinkBar a.strauzz_in {
	background-image: 		url('../images/l_strauzz_in.png');
	width:					25px;
	margin-right:			30px;
}
#siteLinkBar a.strauzz_in:hover {
	background-position:	0 -24px;
}	
#siteLinkBar a.strauzz_fb {
	background: 			url('../images/l_strauzz_fb.png');
	width:					25px;
	margin-right:			7px;
}
#siteLinkBar a.strauzz_fb:hover {
	background-position:	0 -24px;
}
/*		
//////////////////////////////////////////////////////
		END siteLinkBar
//////////////////////////////////////////////////////
*/ 



/* Layout
--------------------------------------------- */
#container {width:858px; margin:0 auto; padding:75px 0 30px 0;}
#work {width:868px; margin:0; padding:50px 0 0 0;}
#workcontent {width:858px;}
#header {height:48px; border-bottom: 1px solid #b6b6b6;}
#logo {width:340px; height:40px; margin:0; padding:0; float:left;}
#mix {padding:11px 0 0 0;}


/* Pages
--------------------------------------------- */
#aboutcol1 {float:left; width:227px; border-right:1px solid #b6b6b6;}
#aboutcol1 p {width:205px; line-height:16px; margin:0 0 14px 0; letter-spacing:1px;}
#aboutcol2 {float:left; width:220px; padding:0 0 0 20px;}
#aboutcol2 p {width:200px; line-height:16px; margin:0 0 14px 0; letter-spacing:1px;}
#aboutcol3 {float:left; padding:0 0 0 5px;}

#contact {}
#contact p {line-height:20px; margin:0 0 18px 0; letter-spacing:1px;}
#contactcol1 {float:left; width:213px; height:392px; border-right:1px solid #b6b6b6;}
#contactcol2 {float:left; width:183px; height:392px; padding:0 0 0 20px; border-right:1px solid #b6b6b6;}
#contactcol3 {float:left; width:183px; height:392px; padding:0 0 0 20px; border-right:1px solid #b6b6b6;}
#contactcol4 {float:left; padding:0 0 0 20px;}

fieldset {border:none; width: 200px;}
legend {color:#000; padding:10px 0 0 0; letter-spacing:1px;}
.invulveld {margin:4px 0 10px 0; background:#ecebe8; color:#6d6c6b; border:#b6b6b6 solid 1px; height:17px; width:170px;}

/* Work
--------------------------------------------- */
.work {margin:0 0 0 -37px;}
.workitem {float:left; margin:0 0 30px 26px; letter-spacing:1px; width:200px; height:286px; display:inline;}
.workitem a {display:block;}
.workitem a:hover {display:block; background:#dcdcdc;}
.workimg {padding:10px 10px 0 10px;}
.workitem h2 {color:#000; font-size: 10px; padding:8px 0 6px 10px;}
.workitem p {color:#807f7e; padding:0px 0 14px 10px; line-height:21px; width:180px;}
.newsitem-thumb {float:left; margin:18px 0 0 44px; padding:0 0 24px 0;}

.work-info {float:left; letter-spacing:1px; width:180px;}
.work-info h2 {color:#000; font-size: 15px; padding:14px 0 8px 0px; font-weight:bold;}
.work-info p {color:#807f7e; padding:0px 0 14px 0px; line-height:21px; letter-spacing:1px;}
.work-info .back {margin:0; padding:14px 0 0 0; color:#807f7e; font-size:10px; border-top:1px solid #c1c1be; width:84px;}
.work-info-large {float:right; margin:18px 0 0 0px; padding:0 0 24px 0;}
.work-info .next {padding:14px 0 0 0;}
.work-info .previous {padding:14px 0 0 0;}

/* News
--------------------------------------------- */
.newsitem {float:left; margin:0 0 20px 0; letter-spacing:1px;}
.newsitem h2 {color:#000; font-size: 15px; padding:14px 0 0 0px; font-weight:bold;}
.newsitem p {color:#807f7e; padding:0px 0 14px 0px; line-height:16px; width:300px;}
.newsitem .date {margin:0; color:#807f7e; font-size:9px; padding:8px 0 8px 0;}
.newsitem .archive {margin:0; padding:14px 0 0 0; color:#807f7e; font-size:10px; border-top:1px solid #c1c1be; width:40px;}
.newsitem-image {float:left; margin:18px 0 0 44px; padding:0 0 24px 0;}

/* News archive
--------------------------------------------- */
#archive h1 {color:#000; font-size: 15px; padding:0 0 14px 0px; letter-spacing:1px; font-weight:bold;}
.archive-item {letter-spacing:1px;}
.archive-item h2 {color:#000; font-size: 10px; padding:14px 0 6px 0px;}
.archive-item p {color:#807f7e; padding:0px 0 14px 0px; line-height:20px; width:300px;}

/* Page nav
--------------------------------------------- */
#pagenav {margin:0 auto; width:88px; font:12px "trebuchet MS",Georgia, serif;}
#pagenav a {display:block; float:left; width:20px; text-align:center;}
#pagenav .active {color:#000;}

/* Footer
--------------------------------------------- */
.section {width:330px; margin:0 auto; padding:0;}
#footer.section {padding:40px 0 0 0; text-transform:uppercase; font-size:8px; letter-spacing:2px;}


/* Clear
--------------------------------------------- */
.clear {clear:both;}
.clr:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clr { display: inline-block; }
/* start commented backslash hack \*/
* html .clr { height: 1%; }
.clr { display: block; }
/* close commented backslash hack */

/* The End */