/*
-----------------------------------------------
jorisvantilburg.nl/skinner.nl/webstandaarden.nl
Stylesheet:  style.css
Author:   Joris van Tilburg
----------------------------------------------- */

body {
	background: #141414 url(../_images/bg_top.gif) top left repeat-x;
	font: 85% Arial, Verdana, sans-serif;
	margin: 0px;
	padding: 0px;
	color: #757575;
	text-align: left;
}

ul, ol, p, table, th, td, dl, dt, dd {font-size: 100%;}

#container {
	background: url(../_images/fotografie.gif) no-repeat 0px 195px;
	margin: 0 0 0 30px;
	padding: 0px;
	width: 828px;
	text-align: left;
}

body#intro { background: #141414 url(../_images/bg_top.gif) top left repeat-x; }
#intro #container { background-image: none;}
#home #container { width: 1000px;}
		
#home #container #illu {
	
	width: 1000px;
}

#links #container #illu {
	background: url(../_images/illu_bg_soup.jpg) no-repeat 700px 220px;
	width: 1000px;
}

#header {
	margin: 0px;
	padding: 28px 0 0 0;
	height: 84px;
}

#address {
	position: absolute;
	top: 0;
	right: 0;
	width: 320px;
	height: 84px;
	margin: 0;
	padding: 28px 0 0 0;
	font-size: 85%;
	line-height: 20px;
}

#address ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/*
-----------------------------------------------
Menu
----------------------------------------------- */

#menu {
	margin: 0 0 77px 0;
	padding: 0;
}

#menu ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#menu ul li {
	float: left;
	margin: 0 30px 0 0;
	padding: 0;
}

#menu ul li a {
	display: block;
	margin: 0;
	padding: 6px 0;
	color: #757575;
	font-size: 124%;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

#menu ul li a:hover, #menu ul li a:active {
	color: #fff;
}

#home #menu ul li a#active {color: #fff}
#studiowerk #menu ul li a#active {color: #fff}
#architectuureninterieur #menu ul li a#active {color: #fff}
#ontheroad #menu ul li a#active {color: #fff}
#contact #menu ul li a#active {color: #fff}
#links #menu ul li a#active {color: #fff}



/*
-----------------------------------------------
Admin
----------------------------------------------- */

.admin {
	margin: 0 0 40px 0;
	padding: 0;
}

.admin ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.admin ul li {
	float: left;
	margin: 0 30px 0 0;
	padding: 0;
}

.admin ul li a {
	display: block;
	margin: 0;
	padding: 6px 0;
	color: #757575;
	font-size: 124%;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

.admin ul li a:hover, #menu ul li a:active {
	color: #fff;
}





/*
-----------------------------------------------
Photos
----------------------------------------------- */

#photos {
	margin: 0 0 65px 0;
	padding: 0 0 0 0;
}

#photos img {
	margin: 0;
	padding: 0;
	border: none;
}

#photos a:link, #photos a:visited {
	float: left;
	display: block;
	margin: 0 16px 0 0;
	padding: 0;
	width: 62px;
	height: 62px;
	border: 1px solid #000;
}

#photos a:hover, #photos a:active {
	float: left;
	display: block;
	margin: 0 16px 0 0;
	padding: 0;
	width: 62px;
	height: 62px;
	border: 1px solid #fff;
}

#photos a.active:link,
#photos a.active:visited,
#photos a.active:hover,
#photos a.active:active {
	border: 1px solid #fff;
}

.photo {
	margin: 0;
	padding: 0;
}

#box {
	background: #000;
	width: 306px;
	height: 306px;
	padding: 3px;
}


/*
-----------------------------------------------
Sidebar (right column)
----------------------------------------------- */

#sidebar {
	float: right;
	width: 300px;
	margin: 0;
	padding: 0px;
	line-height: 27px;
}

#home #sidebar {display: visible;}
#links #sidebar {width: 470px; }

#architectuureninterieur #sidebar,
#ontheroad #sidebar,
#studiowerk #sidebar {
	width: 412px;
}

#sidebar ul {
	list-style-type: none;
	margin: 0px 0px 27px 0px;
	padding: 0px;
}

#sidebar ul li {
	margin: 0px;
	padding: 0px;
}


/*
-----------------------------------------------
Content (left column)
----------------------------------------------- */

#content {
	margin: 0 300px 0 0;
	padding: 0 0 50px 69px;
	width: 411px;
	line-height: 27px;
}

#home #content {
	margin: 0;
	width: 580px;
}

#architectuureninterieur #content,
#ontheroad #content,
#studiowerk #content {
	margin: 0 400px 0 0;
	width: 340px;
	xborder: 1px solid red;
}

#content h1 {
	font-weight: bold;
	font-size: 100%;
	color: #fff;
	margin: 0px;
	padding: 0px;
}

#sidebar h2,
#content h2 {
	font-weight: bold;
	font-size: 100%;
	color: #fff;
	margin: 0px;
	padding: 0px;
}

#content h3 {
	font-size: 110%;
	font-weight: normal;
	margin: 0px 0px 20px 0px;
	padding: 0px;
}


/*
-----------------------------------------------
Footer
----------------------------------------------- */

#footer {
	clear: both;
	margin: 0;
	padding: 0 0 0 69px;
	font-size: 90%;
}

#footer ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#footer ul li {
	background: url() no-repeat 0px 17px;
	margin: 0;
	padding: 0 0 0 16px;
}

/*
-----------------------------------------------
Misc
----------------------------------------------- */

p {
	margin: 0px 0px 27px 0px;
	padding: 0px;
}

ul {
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

ul li {
	xbackground: url() no-repeat 0px 6px;
	margin: 0px;
	padding: 0 0 0 12px;
}

a:link, a:visited {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px dashed #fff;
}

a:hover, a:active {
	color: #757575;
	text-decoration: none;
	border-bottom: 1px solid #757575;
}

strong {
	font-weight: bold;
	color: #fff;
}


/*
-----------------------------------------------
Image placement
----------------------------------------------- */

.leftbox {
	display: block;
	float: left;
	margin: 0px 10px 0px 0;
	padding: 0px;

}

.leftbox a {
	display: block;
	margin: 0px;
	padding: 2px;
	width: 100px;
	height: 75px;
	border: 1px solid #9EA38D;
}

.middlebox {
	display: block;
	margin: 6px 0px 6px 0px;
	padding: 0px 0px 0px 50px;
	xborder: 1px solid red;
}

.middlebox a {
	display: block;
	margin: 0px;
	padding: 2px;
	width: 240px;
	height: 180px;
	border: 1px solid #9EA38D;
}

.rightbox {
	display: block;
	float: right;
	margin: 0px 0px 0px 10px;
	padding: 0px;

}

.rightbox a {
	display: block;
	margin: 0px;
	padding: 2px;
	width: 100px;
	height: 75px;
	border: 1px solid #9EA38D;
}

label {
	font-size: 90%;
	float: left;
	width: 150px;
	color: #fff;
	text-align: left;
}

.formall {
	margin: 0 0 0 0;
	padding: 0;
	xborder: 1px solid red;
}

form {
	margin: 16px 0 0 0;
	padding: 0;
}

button {
	xbackground: ;
	xborder-top: 2px solid #fff;
}

.clearer { height: 5px;}
.clearer2 { clear: left; height: 0px;}
.clearer3 { clear: left; height: 0px; xborder: 1px solid pink;}

html > body .clearer3 { height: 50px;}

* html .clearer { xheight: 0px;}

.leftbox {
	background: #fff;
	display: block;
	float: left;
	margin: 4px 0px 30px 0;
	padding: 0px;
}

.links {
	margin: 4px 30px 30px 0;
}

.leftbox a {
	display: block;
	margin: 0px;
	padding: 3px;
	width: 180px;
	height: 120px;
	border: 1px solid #A25C66;
}

.leftbox a:hover {
	background: #D7D8CA;
}