/*
Title	: Screen
Author	: Vincent Kessels, vincent@roquin.nl
Version	: 1.0
--------------------------------------------------------*/
html, body {
	height: 100%;
	}

#container {
	min-height: 100%;
	}

#layout-header {
	background: url(../images/css/sprite-header.png) repeat-x 0 0;
	}
	
.container-960 {
	margin: 0 auto;
	position: relative;
	width: 960px;
	}
	
#header {
	height: 160px;
	}

#logo {
	position: absolute;
	top: 35px;
	}
	
#print-footer {
	display: none;
	}
	
#home #header,
#layout-basisinfo #header {
	background: url(../images/css/beeld-basisinfo.png) no-repeat 0 0;
	}

#layout-mens #header {
	background: url(../images/css/beeld-mens.png) no-repeat 0 0;
	}

#layout-dier #header {
	background: url(../images/css/beeld-dier.png) no-repeat 0 0;
	}

#layout-plant #header {
	background: url(../images/css/beeld-plant.png) no-repeat 0 0;
	}

#layout-milieu #header {
	background: url(../images/css/beeld-milieu.png) no-repeat 0 0;
	}
	
#layout-onderwijs #header {
	background: url(../images/css/beeld-onderwijs.png) no-repeat 0 0;
	}

#layout-dnalabs #header {
	background: url(../images/css/beeld-dnalabs.png) no-repeat 0 0;
	}
	
/* Homepage
--------------------------------------------------------*/
.home #header {
	height: 230px;
	}
	
.home #navigation {
	margin-top: -25px;
	
	overflow: hidden;
	}
	
.home #navigation a {
	padding-top: 50px;
	}
	
/* Nav images */
.home #basisinfo a,
.home #basisinfo.visible a {
	background-position: 0 -110px;
	}
.home #mens a,
.home #mens.visible a {
	background-position: -160px -110px;
	}
.home #dier a,
.home #dier.visible a {
	background-position: -320px -110px;
	}
.home #plant a,
.home #plant.visible a {
	background-position: -480px -110px;
	}
.home #milieu a,
.home #milieu.visible a {
	background-position: -640px -110px;
	}
.home #onderwijs a,
.home #onderwijs.visible a {
	background-position: -800px -110px;
	}
	
.home #container-content {
	padding-top: 3em;
	}
	
/* Navigation info */

#nav-info {
	position: absolute;
	top: 100px;
	width: 480px;
	}

#nav-info p {
	color: #fff;
	font-size: 1.2em;
	margin-bottom: 0;
	}
	
#nav-info a {
	color: #fff;
	font-weight: bold;
	}

.nav-info-item {
	background: url(../images/css/nav-info-icons.gif) no-repeat 0 0;
	padding-left: 80px;
	}
	
#nav-info .basisinfo {
	background-position: 20px 0;
	}
	
#nav-info .mens {
	background-position: -480px 0;
	}

#nav-info .dier {
	background-position: -990px 0;
	}
	
#nav-info .plant {
	background-position: -1480px 0;
	}
	
#nav-info .milieu {
	background-position: -1980px 0;
	}
	
#nav-info .onderwijs {
	background-position: -2480px 0;
	}

/* Subhome
--------------------------------------------------------*/
.subhome #header {
	height: 190px;
	}

.subhome #container-content {
	padding-top: 4em;
	}

.subhome #column-main {
	padding-right: 10px;
	}

.home #column-right,
.subhome #column-right {
	padding: 0 0 0 10px;
	width: 470px;
	}
	
.home #column-right-1,
.subhome #column-right-1 {
	float: left;
	margin: 0 20px 0 0;
	width: 220px;
	}

.home #column-right-2,
.subhome #column-right-2 {
	float: left;
	width: 230px;
	}

.subhome #column-main .csc-textpic {
	margin-bottom: 2em;
	overflow: hidden;
	width: 100%;
	}
	
#column-right-1 div.csc-textpic div.csc-textpic-imagewrap .csc-textpic-image {
	margin-bottom: 0;
	}
	
#column-right-1 .csc-textpic {
	margin-bottom: 2em;
	overflow: hidden;
	width: 100%;
	}

/* Dossiers slide */
#dossiers-slide-container {
	background: #000000 url(../images/css/dossiers-slides.gif) no-repeat right -32px;
	height: 180px;
	margin-bottom: 2em;
	overflow: hidden;
	padding-right: 7px;
	position: relative;
	width: 463px;
	}
	
.dossier-item h1,
.dossier-item p {
	color: #ffffff !important;
	margin-bottom: 0;
	}
	
.dossier-item p {
	font-size: 1.2em;
	}
	
.dossier-item-image {
	float: left;
	height: 180px;
	overflow: hidden;
	width: 220px;
	}
	
.dossier-item-text {
	float: left;
	height: 150px;
	overflow: hidden;
	padding: 20px 10px 10px 10px;
	width: 223px;
	}
	
#dossier-slide-nav {
	bottom: 5px;
	position: absolute;
	right: 5px;
	z-index: 9999;
	}

#dossier-slide-nav a {
	background: url(../images/css/dossiers-slides.gif) no-repeat 0 0;
	display: block;
	float: left;
	height: 16px;
	margin-right: 5px;
	text-indent: -9999px;
	width: 6px;
	}
	#dossier-slide-nav a:hover,
	#dossier-slide-nav .activeSlide {
		background-position: 0 -16px;
		}
		
/* Dictionairy
--------------------------------------------------------*/
#dictionairy-wrap {
	background: url(../images/css/box-white-bottom-dict.gif) no-repeat 0 100%;
	padding-bottom: 55px;
	}

#dictionairy {
	background: url(../images/css/box-white-top.gif) no-repeat 0 0;
	padding: 15px;
	}
	
#dictionairy-article {
	margin-bottom: 2em;
	padding-top: 7px;
	}

/* Servicelinks
--------------------------------------------------------*/
#servicelinks {
	float: right;
	}
	
#servicelinks ul {
	font-size: 1.1em;
	}

#servicelinks li {
	background: url(../images/css/bg-servicelinks.png) no-repeat center 0;
	float: left;
	line-height: 1.2em;
	padding: 5px 10px;
	}
	#servicelinks li.first {
		background-position: 0 0;
		}
	#servicelinks li.last {
		background-position: right 0;
		}
	
#servicelinks a {
	color: #ffffff;
	}
	#servicelinks .last a {
		margin-right: 0;
		}
	#servicelinks a:hover {
		text-decoration: underline;
		}
		
/* Search
--------------------------------------------------------*/
#search {
	position: absolute;
	right: 0;
	top: 46px;
	width: 320px;
	}

#search fieldset {
	margin: 0;
	padding: 0;
	position: relative;
	}

#search label {
	display: none;
	}
	
#search #search-field {
	background: #ffffff;
	border: none;
	color: #999999;
	font-size: 1.6em;
	font-weight: bold;
	padding: 5px;
	width: 310px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	}
	
#search button {
	background: url(../images/css/btn-search.gif) no-repeat left top;
	border: none;
	cursor: pointer;
	height: 26px;
	margin: 0;
	position: absolute;
	right: 2px;
	top: 2px;
	width: 26px;
	}
	#search button span {
		display: none;
		}
	
/* Navigation
--------------------------------------------------------*/
#navigation {
	margin-top: -60px;
	width: 100%;
	}
	
#navigation ul {
	width: 960px;
	margin: 0 auto;
	position: relative;
	}

#navigation li {
	background: none;
	float: left;
	padding-left: 0;
	z-index: 5;
	}
	
#navigation a {
	background-image: url(../images/css/sprite-navigation.png);
	background-repeat: no-repeat;
	display: block;
	height: 0;
	overflow: hidden;
	padding-top: 60px;
	width: 160px;
	}

#navigation .level2 {
	display: none;
	left: 0;
	overflow: auto;
	padding: 0 5px;
	position: absolute;
	width: 940px;
	}
		
#navigation li:hover {
	z-index: 10;
	}
	
#navigation li.active .level2 {
	display: block;
	}
	
#navigation .level2 li {
	margin-right: 10px;
	}
	
#navigation .level2 a {
	background: none;
	color: #ffffff;
	font-size: 0.6em;
	height: auto;
	padding-top: 2px;
	width: auto;
	}
	#navigation .level2 a:hover {
		text-decoration: underline;
		}
	#navigation .level2 .active a {
		font-weight: bold;
		}
		
/* Navigation bottom
--------------------------------------------------------*/
#navigation-bottom {
	clear: both;
	border-bottom-style: solid;
	border-bottom-width: 3px;
	line-height: normal;
	width: 100%;
	}
	
/* Nav images */
#basisinfo a {
	background-position: 0 10px;
	}
#mens a {
	background-position: -160px 10px;
	}
#dier a {
	background-position: -320px 10px;
	}
#plant a {
	background-position: -480px 10px;
	}
#milieu a {
	background-position: -640px 10px;
	}
#onderwijs a {
	background-position: -800px 10px;
	}
	
#dier .level2 a {
	color: #996600;
	}
	
#basisinfo.visible a,
#basisinfo.active a {
	background-position: 0 -50px;
	}
#mens.visible a,
#mens.active a {
	background-position: -160px -50px;
	}
#dier.visible a,
#dier.active a {
	background-position: -320px -50px;
	}

#plant.visible a,
#plant.active a {
	background-position: -480px -50px;
	}
#milieu.visible a,
#milieu.active a {
	background-position: -640px -50px;
	}
#onderwijs.visible a,
#onderwijs.active a {
	background-position: -800px -50px;
	}

/* Mouseover */
.basisinfo #navigation-bottom {
	background: #9636a2 !important;
	border-bottom-color: #7b2c85 !important;
	}
.mens #navigation-bottom {
	background: #d83b18 !important;
	border-bottom-color: #b13014 !important;
	}
.dier #navigation-bottom {
	background: #fdd526 !important;
	border-bottom-color: #cfaf1f !important;
	}
.plant #navigation-bottom {
	background: #a5d328 !important;
	border-bottom-color: #87ad21 !important;
	}
.milieu #navigation-bottom {
	background: #3f79a9 !important;
	border-bottom-color: #34638b !important;
	}
.onderwijs #navigation-bottom {
	background: #87888a !important;
	border-bottom-color: #6f6f71 !important;
	}

/* Default */
#layout-basisinfo #navigation-bottom {
	background: #9636a2;
	border-bottom-color: #7b2c85;
	}
#layout-mens #navigation-bottom {
	background: #d83b18;
	border-bottom-color: #b13014;
	}
#layout-dier #navigation-bottom {
	background: #fdd526;
	border-bottom-color: #cfaf1f;
	}
#layout-plant #navigation-bottom {
	background: #a5d328;
	border-bottom-color: #87ad21;
	}
#layout-milieu #navigation-bottom {
	background: #3f79a9;
	border-bottom-color: #34638b;
	}
#layout-onderwijs #navigation-bottom,
#layout-dnalabs #navigation-bottom {
	background: #87888a;
	border-bottom-color: #6f6f71;
	}

/* Subsubnavigation
--------------------------------------------------------*/	
#subsubnavigation {
	margin-bottom: 2em;
	}

#subsubnavigation .active a {
	font-weight: bold;
	}

#subsubnavigation .active .level2 a {
	font-weight: normal;
	}

#subsubnavigation .active .level2 .active a {
	font-weight: bold;
	}
	
/* Content
--------------------------------------------------------*/
#container-content {
	margin: 0 auto;
	overflow: auto;
	padding: 1em 0 9em;
	width: 960px;
	}
	
#home #container-content,
.subhome #container-content {
	padding-bottom: 12em;
	}

#column-main {
	float: left;
	overflow: hidden;
	width: 470px;
	}
	
#column-middle {
	float: left;
/*	overflow: hidden; /*Uitgezet voor woordenboek description */
	padding: 0 20px 20px 20px;
	width: 140px;
	}
	
#column-right {
	float: right;
/*	overflow: hidden; /*Uitgezet voor woordenboek description */
	padding-bottom: 20px;
	width: 310px;
	}
	
.columns2 #column-right {
	width: 450px;
	}
	
.columns1 #column-main {
	width: 100%;
}
	
.sidebar {
	padding-top: 0.3em !important;
	}
	
#page-options {
	border-top: 1px solid #eee;
	margin-top: 1em;
	overflow: auto;
	padding-top: 1em;
	width: 100%;
	}

#social-bookmarks {
	float: left;
	}
	
.tipafriend-tiplink {
	float: right;
	}
	
.tipafriend-tiplink p {
	margin-bottom: 0;
	}

/* Navpath
--------------------------------------------------------*/
#container-content #navpath {
	color: #a3a3a3;
	font-size: 1.1em;
	list-style: none;
	margin: 0;
	overflow: auto;
	padding: 10px 0;
	width: 100%;
	}

#navpath li {
	background: url(../images/css/navpath-split.gif) no-repeat right 7px;
	float: left;
	margin-right: 7px;
	padding-right: 10px;
	}
	#navpath li.last {
		background: none;
		margin-right: 0;
		padding-right: 0;
		}
	
#navpath a:hover {
	text-decoration: underline;
	}

/* Footer
--------------------------------------------------------*/
#container-footer {
	background: #888888 url(../images/css/bg-footer.gif) repeat-x left top;
	height: 50px;
	margin-top: -80px;
	padding-top: 30px;
	width: 100%;
	}
	
#container-footer p {
	color: #ffffff;
	float: left;
	font-size: 1.2em;
	}
	
/* Facts
--------------------------------------------------------*/
#container-facts {
	background: #fff url(../images/css/facts-bg.gif) no-repeat 0 0;
	height: 28px;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: -44px;
	width: 960px;
	}
	
#container-facts h4 {
	color: #fff;
	float: left;
	margin-right: 20px;
	padding: 0 10px 0 14px;
	line-height: 2.2em;
	}
	
#container-facts ul {
	font-size: 1.2em;
	line-height: 2.2em;
	margin-bottom: 0;
	}

#container-facts li {
	background: none;
	padding-left: 0;
	}
	
#container-facts a {
	color: #333;
	}
	
/* Footerlinks
--------------------------------------------------------*/
#footerlinks {
	float: right;
	font-size: 1.1em;
	}

#footerlinks li {
	background: none;
	float: left;
	line-height: 1.2em;
	margin-right: 10px;
	padding-left: 0;
	}
	#footerlinks li.last {
		margin-right: 0;
		}
	
#footerlinks span {
	display: block;
	background: url(../images/css/bg-footerlinks.gif) no-repeat right -23px;
	padding: 5px 12px 5px 2px;
	}

#footerlinks a {
	background: url(../images/css/bg-footerlinks.gif) no-repeat 0 0;
	color: #ffffff;
	display: block;
	float: left;
	height: 23px;
	padding-left: 10px;
	}
	#footerlinks a:hover {
		text-decoration: underline;
		}
		
#footerlinks .rss a {
	background-position: -10px 0;
	padding-left: 27px;
	}
	
/* DNA-Labs Subhome - Accordeon
--------------------------------------------------------*/

#dnalabs-accordion {
	margin-bottom: 2em;
	}
	
#dnalabs-accordion h3 {
	background: url(../images/css/accordeon-header.gif) no-repeat 0 0;
	cursor: pointer;
	margin-bottom: 1px;
	padding: 7px 5px;
	}
	
#dnalabs-accordion h3 a {
	background: url(../images/css/accordeon-arrow-right.gif) no-repeat 0 1px;
	color: #fff !important;
	font-weight: normal;
	padding-left: 20px;
	}
	
#dnalabs-accordion h3.ui-state-active a {
	background-image: url(../images/css/accordeon-arrow-down.gif);
	font-weight: bold;
	}
	
.dnalab-item {
	padding: 5px;
	}
	
.dnalab-item img {
	float: right;
	margin: 0 0 5px 10px;
	}
	
.dnalab-item p,
.dnalab-item ul,
.dnalab-item ol {
	font-size: 1.2em;
	margin-bottom: 0;
	}
	
.dnalab-item li {
	background-position: 0 7px;
	}
	

/* Iframe
--------------------------------------------------------*/

iframe {
	border: 0;
	overflow: scroll;
	overflow-x: hidden;
}
