/*
Copyright Soluso e-solutions, 2010. Alle rechten voorbehouden.
version: 1.1

Stylesheet: main.css
Description: positioning for all common sections and selectors.
Author: Soluso e-solutions.
Date: 01-02-2010
*/

body{
	margin: 0 auto;
	text-align: center;
	background: url(../images/bg.jpg) repeat-x #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

/* Begin Container section */

div#container{
	margin: 0 auto;
	text-align: center;
	width: 100%;
	background: url(../images/bg-header.jpg) no-repeat center top;
}

div#wrapper{
	margin: 0 auto 50px;
	text-align: justify;
	width: 960px;
}

/* Begin Header section */

div#header{
	height: 183px;
	width: 100%;
	position: relative;
}

div#logo{
	position: absolute;
	top: 10px;
}

div#payoff{
	position: absolute;
	top: 47px;
	left: 506px;
	width: 454px;
	height: 135px;
}

/* End Header section */

/* Begin Main section */

div#main{
	min-height:500px;
	height:auto !important;
	height:500px;
	padding-top: 40px;
}

div#content{
	width: 100%;
	padding: 0 0 50px;
}

div#left{
	float: left;
	width: 658px;
	padding-right: 50px;
}

div#left-column{
	float: left;
	width: 200px;
	padding-right: 25px;
}

.link-centered
{
    width: 200px;
    text-align: center;
    display: block;
    margin: 10px 0 0;
}

.link-centered:active
{
    position: relative; top: 1px;
}

div#left-column p
{
    margin: 0 0 10px;
}

div#right-column{
	float: right;
	width: 433px;
}

div#right{
	float: right;
	width: 252px;
}

div.box{
	margin: 0 0 50px;
}

.cleardiv{overflow: auto;}

/* Buttons */

a.button{
	width: 252px;
	height: 50px;
	text-indent: -9999px;
	background: url(../images/button-sprite.png) no-repeat 0px 0px;
	display: block;
	margin: 0 0 10px;
}

a.button:active{
	margin-left: 2px;
}

a.meedoen:active, a.bevestig:active{
	margin-top: 2px;
	margin-left: 0px;
}

a.ambassadeurs{background-position: 0px -50px;}
a.video{background-position: 0px -100px;}
a.contact{background-position: 0px -300px;}
a.downloads{background-position: 0px -350px;}
a.sponsoren{background-position: 0px -400px;}

a.inschrijven{background-position: -252px -123px; width: 252px; height: 94px; position: relative; top: -26px;}
a.themas{background-position: -252px -217px; width: 288px; height: 83px; margin-top: 36px;}
a.doneer{background-position: -252px -26px; width: 252px; height: 97px;}
a.meedoen{background-position: -540px 0px; width: 161px; height: 40px;}
a.bevestig{background-position: -540px -40px; width: 161px; height: 40px; float: left; margin-right: 20px;}
a.verzenden{background-position: -540px -80px; width: 161px; height: 40px;}
a.volgende{background-position: -540px -160px; width: 161px; height: 40px; float: left; margin-right: 20px;}
a.afronden{background-position: -540px -120px; width: 161px; height: 40px; float: left; margin-right: 20px;}

.socialmedia_bar
{
    margin: 20px 0 0 27px;
    overflow: hidden;
    height: 32px;
}

.social
{
    width: 32px;
	height: 32px;
	text-indent: -9999px;
	background: url(../images/button-sprite.png) no-repeat -540px -217px;
	display: block;
	float: left;
	margin: 0 10px 10px 0;  
}

.twitter{background-position: -540px -217px;}
.facebook{background-position: -572px -217px;}
.linkedin{background-position: -604px -217px;}
.vimeo{background-position: -636px -217px;}
.hyves{background-position: -668px -217px;}

.social:active
{
    position: relative;
    top: 1px;
}


/* Partners */

div.partner{
	width: 154px;
	height: 76px;
	background: url(../images/logo-sprite.png) no-repeat 0px 0px;
	margin: 0 14px 15px 0;
	display: block;
	text-indent: -9999px;
	float: left;
}

div.lastpartner{margin-right: 0;}

div.anwb{background-position: -154px 0px;}
div.sire{background-position: -308px 0px;}
div.dnb{background-position: -462px 0px;}
div.interfaceflor{background-position: 0px -75px;}
div.bmc{background-position: -154px -75px;}
div.vitae{background-position: -308px -75px;}
div.tendris{background-position: -462px -75px;}
div.vitalinterest{background-position: 0px -150px;}
div.kleineaarde{background-position: -154px -150px;}
div.hdsr{background-position: -308px -150px;}
div.ballastnedam{background-position: -462px -150px;}
div.alliander{background-position: 0px -225px;}
div.radboud{background-position: -154px -225px;}
div.umc{background-position: -308px -225px;}
div.arcadis{background-position: -462px -225px;}
div.han{background-position: 0px -300px;}
div.mei{background-position: -154px -300px;}
div.groenlicht{background-position: -308px -300px;}
div.stenden{background-position: -462px -300px;}
div.sita{background-position: 0px -375px;}
div.tnt{background-position: -154px -375px;}
div.wessanen{background-position: -308px -375px;}
div.goed{background-position: -462px -375px;}
div.coso{background-position: 0 -450px;}
div.colorscan{background-position: -154px -450px;}

a.lnkLogo
{
    display: block;
    width: 154px;
    height: 76px;
}

/* Quote */

div#quote{
	width: 596px;
	background: url(../images/bg-quote.png) no-repeat top;
	position: relative;
	height: 187px;
}

p.text{
	position: absolute;
	top: 25px;
	left: 107px;
	width: 265px;
	height: 144px;
	color: #FFFFFF;
	text-shadow: 0px 1px #6a7e5e;
	font-weight: bold;
	line-height: 24px;	
}

p.author{
	position: absolute;
	top: 187px;
	left: 8px;
	font-weight: bold;
	font-size: 11px;
	color: #8daf4e;
}

span.big{
	text-transform: uppercase;
	font-size: 30px;
}

img.photo{
	position: absolute;
	left: 396px;
	top: 17px;
	width: 182px;
	height: 158px;
}

div.clip{
	position: absolute;
	top: -22px;
	width: 35px;
	height: 43px;
}

div.cl_left{
	left: 418px;
}

div.cl_right{
	left: 528px;
}

/* End Main section */

/* Footer */

div#footer{
	margin: 0 auto;
	text-align: center;
	clear: both;
}

.footer-item{
	margin-right: 30px;
}

/* End Container section */

/* 
	Common used elements 
	DO NOT MODIFY!
*/

.clearfix, .clearfix:after{
	clear: both;
	font-size: 1px;
	line-height: 0;
	margin: 0;
	content:"."; 
	display:block; 
	height:0; 
	visibility:hidden;
	display:inline-block;
}

p.clearfix, p.clearfix:after { content: "."; display: inline-block; line-height: 0; margin: 0; padding: 0; font-size: 1px; height: 0; clear: both; visibility: hidden; } 

/*  \*/
.clearfix{
	min-height:1%;
}

* html .clearfix{
	height:1%;
}

div.left{
	float: left;
}

div.right{
	float: right;
}

/* Begin subnavigation */

#nav
{
    width: 658px;
    height: 51px;
    background: url(../images/bg-nav.png) no-repeat;
    position: relative;
    top: -12px;
    margin: 0 0 25px;
}

#nav li
{
    float:left;
    height: 28px;
    list-style-type: none;
    margin: 16px 0 0 5px;
    padding: 0;
}

#nav a, #nav strong {
    color: #FFFFFF;
    display: block;
    float: left;
    height: auto !important;
    min-height: 28px;
    padding: 0;
    position: relative;
    text-decoration: none;
    text-shadow: 0px -1px 0px #0A2547;
    font-size: 12px;
    cursor: pointer;
}

#nav span {
    display: block;
    float: left;
    height: auto !important;
    min-height: 21px;
    padding: 5px 15px 0;
    position: relative;
    text-decoration: none;
    cursor: pointer;
}

#nav li.active a, #nav li.active strong {
    background: url(../images/sprite-nav.png) no-repeat left 0px;
}

#nav li.active span {
    background: url(../images/sprite-nav.png) no-repeat right 0px;
    margin-left: 4px;
    padding-left: 11px;
}

/* End subnavigation */

/* Downloads */

.buttons-table
{
    width: 100%;
    margin: 20px 0;
}

.buttons-table textarea
{
    overflow-y: hidden;
    resize: none !important;
    height: 115px;
}

.last
{
    padding-bottom: 20px;
}

/* End Downloads*/

/* Fancybox */

/*
 * FancyBox - jQuery Plugin
 * Simple and fancy lightbox alternative
 *
 * Examples and documentation at: http://fancybox.net
 * 
 * Copyright (c) 2008 - 2010 Janis Skarnelis
 *
 * Version: 1.3.1 (05/03/2010)
 * Requires: jQuery v1.3+
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	height: 40px;
	width: 40px;
	margin-top: -20px;
	margin-left: -20px;
	cursor: pointer;
	overflow: hidden;
	z-index: 1104;
	display: none;
}

* html #fancybox-loading {	/* IE6 */
	position: absolute;
	margin-top: 0;
}

#fancybox-loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background-image: url('../images/fancybox/fancybox.png');
}

#fancybox-overlay {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: #000;
	z-index: 1100;
	display: none;
}

* html #fancybox-overlay {	/* IE6 */
	position: absolute;
	width: 100%;
}

#fancybox-tmp {
	padding: 0;
	margin: 0;
	border: 0;
	overflow: auto;
	display: none;
}

#fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 20px;
	z-index: 1101;
	display: none;
}

#fancybox-outer {
	position: relative;
	width: 100%;
	height: 100%;
	background: #FFF;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	border-radius: 8px;
	-moz-box-shadow: 0 0 15px 5px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 0 15px 5px rgba(0,0,0,0.5);
    box-shadow: 0 0 15px 5px rgba(0,0,0,0.5);
}

#fancybox-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: 0;
	outline: none;
	overflow: hidden;
}

#fancybox-hide-sel-frame {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
}

#fancybox-close {
	position: absolute;
	top: -15px;
	right: -15px;
	width: 30px;
	height: 30px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px 0px;
	cursor: pointer;
	z-index: 1103;
	display: none;
}

#fancybox_error {
	color: #444;
	font: normal 12px/20px Arial;
	padding: 7px;
	margin: 0;
}

#fancybox-content {
	height: auto;
	width: auto;
	padding: 0;
	margin: 0;
}

#fancybox-img {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	line-height: 0;
	vertical-align: top;
	-ms-interpolation-mode: bicubic;
}

#fancybox-frame {
	position: relative;
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

#fancybox-title {
	position: absolute;
	bottom: 0;
	left: 0;
	font-family: Arial;
	font-size: 12px;
	z-index: 1102;
}

.fancybox-title-inside {
	padding: 10px 0;
	text-align: center;
	color: #333;
}

.fancybox-title-outside {
	padding-top: 5px;
	color: #FFF;
	text-align: center;
	font-weight: bold;
}

.fancybox-title-over {
	color: #FFF;
	text-align: left;
}

#fancybox-title-over {
	padding: 10px;
	background-image: url('../images/fancybox/fancy_title_over.png');
	display: block;
}

#fancybox-title-wrap {
	display: inline-block;
}

#fancybox-title-wrap span {
	height: 32px;
	float: left;
}

#fancybox-title-left {
	padding-left: 15px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -90px;
	background-repeat: no-repeat;
}

#fancybox-title-main {
	font-weight: bold;
	line-height: 29px;
	background-image: url('../images/fancybox/fancybox-x.png');
	background-position: 0px -40px;
	color: #FFF;
}

#fancybox-title-right {
	padding-left: 15px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -55px -90px;
	background-repeat: no-repeat;
}

#fancybox-left, #fancybox-right {
	position: absolute;
	bottom: 0px;
	height: 100%;
	width: 35%;
	cursor: pointer;
	outline: none;
	background-image: url('../images/fancybox/blank.gif');
	z-index: 1102;
	display: none;
}

#fancybox-left {
	left: 0px;
}

#fancybox-right {
	right: 0px;
}

#fancybox-left-ico, #fancybox-right-ico {
	position: absolute;
	top: 50%;
	left: -9999px;
	width: 30px;
	height: 30px;
	margin-top: -15px;
	cursor: pointer;
	z-index: 1102;
	display: block;
}

#fancybox-left-ico {
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -30px;
}

#fancybox-right-ico {
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -60px;
}

#fancybox-left:hover, #fancybox-right:hover {
	visibility: visible;    /* IE6 */
}

#fancybox-left:hover span {
	left: 20px;
}

#fancybox-right:hover span {
	left: auto;
	right: 20px;
}

.fancy-bg {
	position: absolute;
	padding: 0;
	margin: 0;
	border: 0;
	width: 20px;
	height: 20px;
	z-index: 1001;
}

#fancy-bg-n {
	top: -20px;
	left: 0;
	width: 100%;
	background-image: url('../images/fancybox/fancybox-x.png');
}

#fancy-bg-ne {
	top: -20px;
	right: -20px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -162px;
}

#fancy-bg-e {
	top: 0;
	right: -20px;
	height: 100%;
	background-image: url('../images/fancybox/fancybox-y.png');
	background-position: -20px 0px;
}

#fancy-bg-se {
	bottom: -20px;
	right: -20px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -182px; 
}

#fancy-bg-s {
	bottom: -20px;
	left: 0;
	width: 100%;
	background-image: url('../images/fancybox/fancybox-x.png');
	background-position: 0px -20px;
}

#fancy-bg-sw {
	bottom: -20px;
	left: -20px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -142px;
}

#fancy-bg-w {
	top: 0;
	left: -20px;
	height: 100%;
	background-image: url('../images/fancybox/fancybox-y.png');
}

#fancy-bg-nw {
	top: -20px;
	left: -20px;
	background-image: url('../images/fancybox/fancybox.png');
	background-position: -40px -122px;
}

/* Word vriend van OCF */

#package-tabs
{
    width: 246px;
    overflow: auto;
    position: relative;
    bottom: -1px;
    margin-top: 25px;
}

.package-tab
{
    width: 123px;
    height: 20px;
    background: url(../images/package-tab.png) no-repeat;
    display: block;
    float: left;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    color: #b0b0b0 !important;
    text-align: center;
    padding-top: 11px;
}

.inactive{
    background-position: 0px -31px;
}

.package-options{
 width: 618px;
 background: #FFF;
 border: 1px solid #CCC;
 margin-bottom: 25px;
}

.package{
 border-bottom: 1px solid #CCC;
 overflow: auto;
 background: url(../images/bg-package.png) repeat-y;
}

.last-package{
 border-bottom: none;
}

.package-left{
 float: left;
 width: 105px;
 padding: 20px;
}

.package-right{
 float: right;
 padding: 20px;
 width: 432px;
}

.package-title{
 font-size: 16px;
 color: #719433;
 font-weight: bold;
 margin: 0 0 10px;
}

.package-price{
 font-size: 14px;
 font-weight: bold;
 margin: 0 0 20px;
 color: #777777;
}

.package-button{
 text-indent: -9999px;
 background: url(../images/button-word-vriend.png) no-repeat;
 width: 99px;
 height: 28px;
 display: block;
}

.package-button:hover,.package-button:active{
 background-position: 0px -28px;
}

.package-list-item{
 background: url(../images/package-list-item.png) no-repeat left center;
 list-style-type: none;
 padding-left: 35px;
 line-height: 30px;
}

.bg-top{
 background-position:left 5px;
 line-height:24px;
}

.small{
 font-size: 10px;
 margin: 0 0 0 5px;
}

/* Theme list */

.theme-list {
    overflow: auto;
    width: auto;
    margin: 20px 0;
    padding: 10px 10px 0 10px;
    background: #FFF;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

.theme-list li {
    float: left;
    list-style: none;
    margin: 0 10px 10px 0;
    padding: 0;
}

.theme-list li.last {
    margin-right: 0;
}

.theme-list li a
{
    display: block;
}

.theme-list li a:active
{
    position: relative;
    top: 1px;
}

.tipsy { padding: 5px; font-size: 12px; opacity: 0.9; filter: alpha(opacity=90); background-repeat: no-repeat;  background-image: url(../images/tipsy.png); }
  .tipsy-inner { padding: 5px 10px 5px 10px; background-color: #284073; color: white; max-width: 200px; text-align: center; }
  .tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; }
  .tipsy-north { background-position: top center; }
  .tipsy-south { background-position: bottom center; }
  .tipsy-east { background-position: right center; }
  .tipsy-west { background-position: left center; }

/* New frontpage */

div#counter {
    width: 358px;
    background: url(../images/counter.png) no-repeat;
    position: absolute;
    top: 41px;
	left: 600px;
	padding-top: 98px;
}

div#facebook {
    width: 360px;
    position: absolute;
    top: 52px;
	left: 600px;
}

div#facebook iframe {
    border: 1px solid #ccc;
    background: #fff;
    background: rgba(255,255,255,.75);
    overflow:hidden;
    width:360px;
    height:62px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

div#twitterbox {
    margin: 5px 0 0;
    width: 340px;
    border: 1px solid #ccc;
    background: #fff;
    background: rgba(255,255,255,.75);
    padding: 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

div#twitterbox iframe {
    margin-left: 80px;
    border: none;
    background: none;
    width: 120px;
}

.numbers {
    color: rgb(61, 61, 61);
    font-size: 80px;
    position: absolute;
    top: 3px;
    left: 57px;
    width: 136px;
    height: 85px;
    font-weight: bold;
}

.firstnumber {
    position: absolute;
    top: 0;
    left: -2px;
    width: 67px;
    height: 85px;
    line-height: 85px;
    text-align: center;
}

.secondnumber {
    position: absolute;
    top: 0;
    left: 66px;
    width: 67px;
    height: 85px;
    line-height: 85px;
    text-align: center;
}

.thirdnumber {
    position: absolute;
    top: 0;
    left: 134px;
    text-align: center;
    width: 68px;
    height: 85px;
    line-height: 85px;
}

div#left {
    width: 190px;
    float: left;
    padding: 0;
}

div#middle {
    width: 510px;
    float: left;
    margin: 0 25px;
}

div#right {
    width: 210px;
    float: right;
}

div#middleright {
    width: 745px;
    float: right;
    margin: 0 0 0 25px;
}

.navigation {
    width: 190px;
    margin-bottom: 35px;
}

.navigation li {
    list-style-type: none;
    margin: 0 0 5px;
    padding: 0;
}

.navigation li a{
    width: 175px;
    height: 38px;
    line-height: 37px;
    background: url(../images/navigation-button.png) no-repeat;
    text-decoration: none;
    color: #FFFFFF;
    font-weight: bold;
    display: block;
    padding-left: 15px;
    font-size: 12px;
    text-shadow: 1px 1px 0 #27465e;
}

.navigation li a.active {
    background: url(../images/navigation-button-active.png) no-repeat;
    text-shadow: 1px -1px 0 #27465e;
}

.subnavigation {
    margin: 10px 0;
}

.subnavigation li a {
    background: none;
    color: #25567C;
    text-shadow: none;
    height: auto;
    line-height: 1.5;
}

.subnavigation li a.active {
    background: url(../images/subnavigation-arrow-active.png) no-repeat 15px center;
    text-shadow: none;
    text-indent: 10px;
}
.panel{
    margin: 0 0 35px;
    width: 100%;
    overflow: hidden;
    padding-top: 2px;
}

.panel p {
    padding: 0 0 0 10px;
}

.panel-content{
    background: url(../images/panel-background.png) repeat-y;
}

.panel h2 {
    background: none;
    color: #25567c;
    text-indent: 0;
    font-size: 14px;
    text-align: left;
    margin: 0 0 5px;
    padding: 0;
    height: auto;
    padding-left: 10px;
}

.social-links {
    overflow: hidden;
    padding: 0 13px;
}

.social-links a{
    width: 24px;
    height: 24px;
    display: block;
    float: left;
    background: url(../images/social-icon-sprite.png) no-repeat 0 0;
    text-indent: -9999px;
    margin: 0 10px 10px 0;
}

.social-links a.youtube { background-position: 0 0; }
.social-links a.twitter { background-position: -34px 0; }
.social-links a.facebook { background-position: -71px 0; }
.social-links a.hyves { background-position: -108px 0; }
.social-links a.linkedin { background-position: -142px 0; }
.social-links a.vimeo { background-position: 0 -34px; }
.social-links a.flickr { background-position: -34px -34px; }

.tweet {
    padding: 0 15px;
}

.tweet_list li{
    margin: 0;
    text-align: left;
    color: #666666;
    list-style-type: none;
    border-bottom: 1px solid #e5e5e5;
    padding: 10px 0;
    background: #FFFFFF;
}

a.tweet_user {
    padding: 0 !important;
    margin: 0;
    color: #8DAF4E;
    text-decoration: none;
    font-weight: bold;
}

.tweet_time {
    text-align: left;
    display: block;
    margin: 0 0 10px;
}

.tweet_time a {
    color: #aaaaaa;
    padding: 0;
    font-size: 11px;
    line-height: 12px;
    text-decoration: none;
}

.tweet_first {
    padding-top: 0 !important;
}

.tweet_list li:last-child {
    padding-bottom: 0;
    border: none;
}

.theme-icons {
    overflow: hidden;
}

.theme-icons a{
    width: 39px;
    height: 39px;
    display: block;
    float: left;
    margin: 0 5px 5px;
    background: url(../images/thema-icon-sprite.png) no-repeat 0 0;
}

.theme-icons a.theme-hyves { background-position: 0 0; }
.theme-icons a.theme-afval { background-position: -44px 0; }
.theme-icons a.theme-bestuur { background-position: -87px 0; }
.theme-icons a.theme-duurzaamheid { background-position: -130px 0; }
.theme-icons a.theme-economie { background-position: -173px 0; }
.theme-icons a.theme-energie { background-position: 0 -44px; }
.theme-icons a.theme-leiderschap { background-position: -44px -44px; }
.theme-icons a.theme-leren { background-position: -87px -44px; }
.theme-icons a.theme-maatschappij { background-position: -130px -44px; }
.theme-icons a.theme-mobiliteit { background-position: -173px -44px; }
.theme-icons a.theme-natuur { background-position: 0 -87px; }
.theme-icons a.theme-productie { background-position: -44px -87px; }
.theme-icons a.theme-socialemedia { background-position: -87px -87px; }
.theme-icons a.theme-spiritualiteit { background-position: -130px -87px; }
.theme-icons a.theme-toerisme { background-position: -173px -87px; }
.theme-icons a.theme-voeding { background-position: 0px -130px; }
.theme-icons a.theme-water { background-position: -44px -130px; }
.theme-icons a.theme-werk { background-position: -87px -130px; }
.theme-icons a.theme-wonen { background-position: -130px -130px; }
.theme-icons a.theme-zorg { background-position: -173px -130px; }

.word-vriend-icons {
    margin: 15px 0 5px;
    padding-left: 10px;
}

a.button-action, a.button-action:active  {
    background: url(../images/action-button.png) no-repeat;
    width: 210px;
    height: 38px;
    line-height: 37px;
    text-decoration: none;
    color: #FFFFFF;
    font-weight: bold;
    display: block;
    padding-left: 15px;
    font-size: 12px;
    text-shadow: 1px 1px 0 #658242;
}

a.yellow-button, a.yellow-button:active {
    background: url(../images/action-button-yellow.png) no-repeat;
}

.navigation li a:active, a.button-action:active {
    position: relative;
    left: 1px;
}

.green {
    color: #719433 !important;
}

.yellow {
    color: #eb9801 !important;
}

/* Flickr stream */

#photoslider .container {
    width: 210px;
    height: 87px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    margin: 10px 0 15px;
}
  
#photoslider .slides {
    position: absolute;
    top: 0;
    left: 0;
}
  
#photoslider .slides > div {
    position: absolute;
    top: 0;
    width: 123px;
    display: none;
}

#photoslider .frame {
    border: 1px solid #e6e6e4;
    padding: 5px;
    width: 75px;
    margin-right: 36px;
}

/* Partners */

#partnerslider .container {
    width: 208px;
    height: 95px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    left: 0;
    margin: 10px 0 15px;
    border: 1px solid #e6e6e4;
}
  
#partnerslider .slides {
    position: absolute;
    top: 0;
    left: 0;
}
  
#partnerslider .slides > div {
    position: absolute;
    top: 0;
    width: 210px;
    display: none;
}

#partnerslider .frame {
    padding: 5px;
    width: 198px;
}

/* Weblog */

.blog-post {
    border-bottom: 1px solid #CCCCCC;
    padding: 0 0 20px;
    overflow: hidden;
    margin: 0 0 20px;
}

.blog-header {
    background: none !important;
    text-indent: 0;
    font-size: 18px;
    margin: 0 0 5px;
    color: #25567c;
    height: auto;
    line-height: 1.2;
}

.blog-meta {
    color: #888888;
    display: block;
    margin: 0 0 20px;
}

.blog-meta a{
    color: #888888 !important;
}

.blog-content {
    line-height: 1.5;
}

.blog-link {
    float: right;
}

#featured {
    position: relative;
    width: 745px;
    overflow: hidden;
    margin: 0 0 25px;
    color: #ffffff;
    text-shadow: 0 1px 0 #6a8635;
}

#featured .left, #featured .right {
    float: left;
    width: 320px;
    height: 130px;
    background: url(../images/bg-feature.png) no-repeat;
    padding: 20px;
    position: relative;
    overflow: hidden;
}

#featured .right {
    float: right;
    margin-left: 25px;
}

#featured h2 {
    text-indent: -9999px;
}

#featured .left h2 {
    background: url(../images/header-samenvattingen-deelrapporten.png) no-repeat;
    display: block;
    height: 22px;  
}

#featured .right h2 {
    background: url(../images/header-boek-duurzaam-denken-doen.png) no-repeat;
    display: block;
    height: 22px;  
}

#featured a {
    display: block;
    text-indent: -9999px;
    height: 39px;
    float: right;
    margin: 32px 0 0;
    position: relative;
    left: 8px;
}

#featured a:active {
    left: 10px;
} 

#featured a.downloadreports { background: url(../images/button-download-bestanden.png) no-repeat; width: 189px; }
#featured a.orderbook { background: url(../images/button-bestel-boek.png) no-repeat; width: 161px; margin: 15px 0 0; }

.boek {
    position: absolute;
    top: 43px;
    left: 7px;
}

/* Bookshelf */

#bookshelves {
    width: 633px;
}

.shelf {
    margin: 0 0 10px;
    padding: 0 6px;
    width: 627px;
    height: 165px;
    background: url(../images/shelf.png) no-repeat center bottom;
    position: relative;
}

.shelf li {
   background: url(../images/book-shadow.png) no-repeat bottom;
   width: 257px;
   height: 206px;
   position: absolute;
   margin: 0;
   padding: 0;
   list-style: none;
}

.shelf .b1 { left: -47px; }
.shelf .b2 { left: 71px;}
.shelf .b3 { left: 191px; }
.shelf .b4 { left: 309px; }
.shelf .b5 { left: 427px; }

.shelf a {
    display: block;
    background: url(../images/book.png) no-repeat;
    width: 87px;
    height: 123px;
    position: absolute;
    left: 85px;
    z-index: 2;
    -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.shelf a:hover {
    top: -10px;
}

.shelf a img {
    margin: 22px 0 0 0;
}

.popup {
    width: 400px;
    text-align: left;
    -moz-border-radius: 8px;
	-o-border-radius: 8px;
	border-radius: 8px;
	overflow: hidden;
}

.popup h3 {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    font-size: 14px;
    line-height: 30px;
    padding: 0 15px;
    background: #a6ca66;
    background: -moz-linear-gradient(top, #a6ca66 0%, #8bae4d 50%, #789b3b 51%, #8bae4d 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a6ca66), color-stop(50%,#8bae4d), color-stop(51%,#789b3b), color-stop(100%,#8bae4d));
    background: -webkit-linear-gradient(top, #a6ca66 0%,#8bae4d 50%,#789b3b 51%,#8bae4d 100%);
    background: -o-linear-gradient(top, #a6ca66 0%,#8bae4d 50%,#789b3b 51%,#8bae4d 100%);
    background: -ms-linear-gradient(top, #a6ca66 0%,#8bae4d 50%,#789b3b 51%,#8bae4d 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A6CA66', endColorstr='#8BAE4D',GradientType=0 );
    background: linear-gradient(top, #a6ca66 0%,#8bae4d 50%,#789b3b 51%,#8bae4d 100%);
    -moz-border-radius: 8px 8px 0 0;
	-o-border-radius:  8px 8px 0 0;
	border-radius: 8px 8px 0 0;
	border-bottom: 1px solid #73a100;
}

.popup p {
    padding: 15px;
    margin: 0;
}

a.downloadbutton {
    display: block;
    background: #5a87aa;
    background: -moz-linear-gradient(top, #5a87aa 0%, #265376 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5a87aa), color-stop(100%,#265376));
    background: -webkit-linear-gradient(top, #5a87aa 0%,#265376 100%);
    background: -o-linear-gradient(top, #5a87aa 0%,#265376 100%);
    background: -ms-linear-gradient(top, #5a87aa 0%,#265376 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5A87AA', endColorstr='#265376',GradientType=0 );
    background: linear-gradient(top, #5a87aa 0%,#265376 100%);
    border: 1px solid #25567c;
    color: #ebeff2;
    text-shadow: 0 1px 0 rgba(0,0,0,0.25);
    padding: 10px 15px;
    text-decoration: none;
    -moz-border-radius: 8px;
	-o-border-radius:  8px;
	border-radius: 8px;
	-moz-box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.25);
	-webkit-box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.25);
	box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.25);
	margin: 0 0 20px;
	float: left;
    margin-left: 15px;
}

a.downloadbutton:hover {
    color: #ffffff;
}

.social-container {
    padding: 10px 15px;
    border-top: 1px solid #CCC;
    overflow: hidden;
    width: 370px;
    background: #f0f0f0;
}

.twitter-button {
    float: left;
    width: 180px;
}

.facebook-button {
    float: right;
    width: 180px;
}