/* ----------------------------------------------------------- */
/* Copyright 2000-2009 (Non-)verbaal, http://www.nonverbaal.nl */
/* ----------------------------------------------------------- */

@import url("/www/css/reset.css");
@import url("/www/css/form.css");
@import url("/www/css/clearfix.css");

/* Elements -------------------------------------------------- */
/* ----------------------------------------------------------- */

body {
	color: #000;
	font: 62.5% Arial, Helvetica, sans-serif;
}

a {
	font-weight: 700;
	text-decoration: none;
	color: #000;
}

a:hover,
a:active { text-decoration: underline; }

h1 {
	font-size: 2.7em;
	font-weight: 700;
	margin-bottom: 1em;
}

h2 {
	font-size: 1.3em;
	font-weight: 400;
	margin-bottom: .5em;
	color: #000;
}

h3 {
	font-size: 1.2em;
	font-weight: 700;
	margin-bottom: .5em;
}

h4 {
	font-weight: 700;
	margin-bottom: .5em;
}

/* Basic structure ------------------------------------------- */
/* ----------------------------------------------------------- */

#container {
	position: relative;
	width: 100%;
}

#canvas {
	float: left;
	width: 100%;
	margin-top: 177px;
}

#main {
	float: left;
	position: relative;
	width: 100%;
	background-position: left top;
	background-repeat: repeat-x;
	background-image: url(../images/main/bg-top.png);
}

body.home #main { background: none; }

#main-inner {
	position: relative;
	overflow: hidden;
	width: 100%;
	background: url(../images/main/bg-bottom.png) repeat-x left bottom;
}

#content {
	float: right;
	position: relative;
	width: 650px;
	height: auto !important;
	height: 200px;
	min-height: 200px;	
	font-size: 1.2em;
}

#sidebar {
	float: left;
	position: relative;
	width: 235px;
	font-size: 1.4em;
}

#header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 177px;
	background: url(../images/header/bg.png) repeat-x;
}

#footer {
	clear: both;
	float: left;
	width: 100%;
	margin: 1em 0;
}

/* Basic elements -------------------------------------------- */
/* ----------------------------------------------------------- */

#main em { font-style: italic; }

#main strong { font-weight: 700; }

#content ul { list-style: disc; }

#content ol { list-style: decimal; }

#content ul,
#content ol { margin: 1em 2em; }

#content p { margin-bottom: 2em; }

#content p,
#content ul,
#content ol { line-height: 1.5em; }

/* Classes --------------------------------------------------- */
/* ----------------------------------------------------------- */

div.wrap {
	position: relative;
	width: 920px;
	margin: 0 auto;
}

div.block {
	float: left;
	width: 100%;
	padding: 50px 0;
}

.indent {
	text-indent: -9999em;
	outline: none;
	overflow: hidden;
}

.more { font-size: 1.3em; }

.date { margin: 0 !important; }

.float-left {
	float: left;
	margin-right: 1em;
}

.float-right {
	float: right;
	margin-left: 1em;
}

.border {
	border: 1px solid #EBEBEB;	
}

/* Sidebar --------------------------------------------------- */
/* ----------------------------------------------------------- */

#sidebar {
	padding-bottom: 150px;
	background-position: left bottom;
	background-repeat: no-repeat;
	background-image: url(../images/icon/over-consensus.png);
}

#sub-nav { margin-top: 60px; }

#sub-nav a {
	color: #000;
	font-weight: 700;
	text-decoration: none;
}

#sub-nav ul ul { margin-left: 1em; }

#sub-nav li a {
	display: block;
	height: 16px;
	padding: 15px 20px;
	background: url(../images/sidebar/a.png) no-repeat;
}

#sub-nav a:hover,
#sub-nav li.selected a { color: #807E7F; }

/* Header ---------------------------------------------------- */
/* ----------------------------------------------------------- */

#header-inner {
	height: 177px;
	background: url(../images/header/bg-inner.png) no-repeat center bottom;
}

#header a {
	text-decoration: none;
	font-weight: 700;
}

#logo {
	position: absolute;
	top: 67px;
	left: 0;
}

#logo a {
	display: block;
	width: 213px;
	height: 50px;
	background: url(../images/logo.png) no-repeat;
}

#extra-nav {
	position: absolute;
	top: 12px;
	left: 0;
	text-transform: uppercase;
}

#extra-nav ul li {
	display: inline;
	margin-right: 1em;
}

#extra-nav a {
	color: #000;
	font-weight: 400;
}

#extra-nav li.selected a { font-weight: 700; }

#nav {
	position: absolute;
	top: 117px;
	right: 0;
	text-transform: uppercase;
}

#nav ul li {
	float: left;
	position: relative;
	margin-right: 5px;
}

#nav a {
	color: #000000;
	font-weight: 700;
}

#nav ul li a,
#nav ul li var {
	float: left;
	background-repeat: no-repeat;
	cursor: pointer;
}

#nav ul li a {
	padding-right: 7px;
	background-position: right 0px;
	background-image: url(../images/header/nav.png);
}

#nav ul li var.outer {
	background-position: 0 0;
	background-image: url(../images/header/nav.png);
	height: 55px;
	padding-left: 7px;
}

#nav ul li var.inner {
	display: block;
	height: 40px;
	background: url(../images/header/nav-shine.png) no-repeat center 0px;
	padding: 15px 7px 0px;
}

#nav ul li.selected a {
	background-position: right -76px;
	color: #FFF;
}

#nav ul li.selected var.outer {
	height: 60px;
	background-position: 0px -76px;
}

#nav strong {
	font-size: 1.2em;
	font-weight: 700;
}

#nav sub {
	display: block;
	font-weight: 400;
	font-size: 10px;
}

#nav .vastgoed-beheer sub { color: #6CB33E; }

#nav .advies-en-bemiddeling sub { color: #009AC7; }

#nav .facility-services sub { color: #C4122F; }

#nav .over-consensus sub { color: #000000; }

#info {
	position: absolute;
	top: 60px;
	right: 0;
	font-size: 1.6em;
	color: #666;
	text-align:right;
}

#info p {
	margin-bottom: .3em;
}

#info a { color: #C1112E; }

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

#footer { text-align: right; }

/* Carrousel ------------------------------------------------- */
/* ----------------------------------------------------------- */

#carrousel {
	position: relative;
	top: 0;
	left: 0;
	background-image: url(../images/carrousel/bg.png);
	background-repeat: repeat-x;
	height: 300px;
	overflow: hidden;
	z-index: 1000;
}

#carrousel div.slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 300px;
}

#carrousel div.bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 300px;
}

#carrousel .showcase {
	position: relative;
	width: 100%;
	height: 300px;
}

/* Shortcuts ------------------------------------------------- */
/* ----------------------------------------------------------- */

#shortcuts { font-size: 1.2em; }

#shortcuts.items div {
	float: left;
	position: relative;
	width: 214px;
	margin-right: 20px;
}

#shortcuts.items div.last { margin-right: 0; }

#shortcuts img {
	float: right;
	border: 1px solid #EBEBEB;
}

#shortcuts .eq { margin-bottom: 1em; }

#shortcuts p { line-height: 1.5em; }

#shortcuts a.more { text-transform: lowercase; }

#shortcuts h2 { color: #000; }

#shortcuts a { color: #000; }

/* Gallery --------------------------------------------------- */
/* ----------------------------------------------------------- */

div.pagination {
	height: 30px;
	clear: both;
}

div.pagination span.current {
	background-color:#000;
	color: #FFF;
	font-weight: 700;
}

div.pagination a,
div.pagination span.current {
	border: 1px solid #000;
	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 7px 2px;
}

div.navigation a {
	color: #777777;
	text-decoration:none;
}

#thumbs {
	float: left;
	width: 100%;
}

#thumbs ul {
	margin: 0;
	list-style: none;
}

#thumbs li {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
}

#thumbs ul.thumbs a {
	display: block;
	width: 64px;
	height: 64px;
}

#gallery {
	float: left;
	width: 100%;
}


/* Pages ----------------------------------------------------- */
/* ----------------------------------------------------------- */

div.pages {
	margin: 1em 0;
	font-size: .9em;
}

div.pages ul {
	list-style: none !important;
	margin: 0 !important;
}

div.pages li {
	display: inline;
	padding: 4px 7px 2px;
	border: 1px solid #000;
	margin-right: 2px;
}

div.pages li.selected {
	background-color: #000;
	color: #FFF;
	font-weight: 700;
}

div.pages a {
	color: #777777;
	text-decoration:none;
}
