* {
	outline: none;
	}
html {
	height: 100%;
	width: 100%;
}
body {
	padding: 0;
	font-family: Arial;
	background: #DDD url(../img/sky.gif) repeat-x;
	overflow:hidden;
	font-family: "Trebuchet MS";
	font-size: 13px;
	line-height: 18px;
}
ul, li, h4, h3, h2, h1, p {
	padding:0;
	margin:0;
	list-style:none;
}

a {
color: #ee8100;
text-decoration: none;
}
a:visited {
color: #ee8100;
text-decoration: none;
}
a:hover {
color: #333;
text-decoration: none;
}

h1 {
font-size: 16px;
padding-bottom: 5px;
}
img {
outline: none;
border: 0;
}
.next, .prev {
	cursor:pointer;
}
#bird-sounds {
position:absolute;
right: 10px;
bottom: 10px;
z-index:900;
}
#screen {
	height:100%;
	width:2200px;
	overflow:hidden;
	position: absolute;
	left: 50%;
	margin-left: -1100px;
	bottom: 0;
}
#screen .next, #screen .prev {
	position:absolute;
	top:200px;
}
#screen .prev {
	left:10px;
}
#screen .next {
	right:10px;
}
#navigation {
	width:810px;
	height: 110px;
	text-align:center;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -375px;
	z-index: 30;
	background:none;
}
#navigation ul {
	margin-left:0px !important;
	margin-left:0px;
}
#navigation li {
	float:left;
	margin:0;
	padding:0;
	outline: none;
}
#navigation li img{
outline: none;
border: 0;
}
#navigation a {
	color:#933;
	font-weight:bolder;
	text-decoration:none;
}
#sections {
	overflow:hidden;
	width:2200px;
	height:100%;
	clear:left;
	left: 50%;
	position: relative;
	margin-left: -1100px;
	top: 0;
	/* margin-top: -600px; */
	z-index: 25;
}
#sections ul {
	width:20000px;
	height:100%;
}
#sections li {
height: 100%;
	float:left;
	width:2200px;
	padding:0;
}
#sections p {
	width:800px;
	margin:0 auto;
	font-size:13px;
	line-height:1.4em;
	padding: 10px;
	position: relative;
	top: 100%;
	margin-top: -500px;
	height: 100%;
}
#sections h2 {
	color:#993333;
	margin:20px 0pt;
}
#sections a {
	color:#777;
	font-weight:bolder;
	text-decoration:none;
}
#footer {
width: 2000px;
height: 390px;
position: absolute;
left: 50%;
margin-left: -1000px;
bottom: 0;
z-index: 5;
overflow: hidden;
}
#footer-bar {
background: url(../img/footer-bar-bg.jpg) repeat-x;
width: 2000px;
height: 47px;
position: absolute;
left: 50%;
margin-left: -1000px;
bottom: 0;
z-index: 35;
}
.footer-bar-content {
width: 850px;
margin: 0 auto;
font-family: Arial;
color: #f7f7f7;
font-size: 11px;
}
.footer-bar-content-info2 a{
color: #fff;
text-decoration: none;
}
.footer-bar-content-info2 a:visited{
color: #fff;
text-decoration: none;
}
.footer-bar-content-info2 a:hover{
color: #ee8100;
text-decoration: none;
}
.footer-bar-content-logo {
padding-top: 6px;
width: 90px;
padding-left: 60px;
float: left;
}
.footer-bar-content-info1 {
float: left;
border-right: 1px #f4f4f4 solid;
margin-top: 6px;
padding: 0 20px 0 20px;
}
.footer-bar-content-info2 {
float: left;
border-right: 1px #f4f4f4 solid;
margin-top: 6px;
padding: 0 20px 0 20px;
}
.footer-bar-content-info3 {
float: left;
margin-top: 6px;
padding: 0 20px 0 20px;
}

.footer-bar-content-info3 a, a:visited{
	color: #fff;
	text-decoration: none;
}
.footer-bar-content-info3 a:hover{
	color: #ee8100;
	text-decoration: none;
}
.footer-bar-content-socialmedia {
float: right;
padding-top: 12px;
}

.nav0 {
width: 60px;
height: 48px;
display: block;
}
.nav0 a{
display: block;
width: 60px;
height: 48px;
background: url(../img/nav_home.png) no-repeat;
outline: none;
}
.nav0 a:hover{
display: block;
width: 60px;
height: 48px;
/* ackground: url(../img/nav_home_rollover.png) no-repeat; */
}
.nav1 {
width: 127px;
height: 48px;
display: block;
}
.nav1 a{
display: block;
width: 127px;
height: 48px;
background: url(../img/nav_03.png) no-repeat;
outline: none;
}
.nav1 a:hover{
display: block;
width: 127px;
height: 48px;
/* background: url(../img/nav-rollover_03.png) no-repeat; */
}
.nav2 {
width: 134px;
height: 48px;
display: block;
}
.nav2 a{
display: block;
width: 134px;
height: 48px;
background: url(../img/nav_04.png) no-repeat;
outline: none;
}
.nav2 a:hover{
display: block;
width: 134px;
height: 48px;
/* background: url(../img/nav-rollover_04.png) no-repeat; */
}
.nav3 {
width: 115px;
height: 48px;
display: block;
}
.nav3 a{
display: block;
width: 115px;
height: 48px;
background: url(../img/nav_05.png) no-repeat;
outline: none;
}
.nav3 a:hover{
display: block;
width: 115px;
height: 48px;
/* background: url(../img/nav-rollover_05.png) no-repeat; */
}
.nav4 {
width: 135px;
height: 48px;
display: block;
}
.nav4 a{
display: block;
width: 135px;
height: 48px;
background: url(../img/nav_06.png) no-repeat;
outline: none;
}
.nav4 a:hover{
display: block;
width: 135px;
height: 48px;
/* background: url(../img/nav-rollover_06.png) no-repeat; */
}
.nav5 {
width: 110px;
height: 48px;
display: block;
}
.nav5 a{
display: block;
width: 110px;
height: 48px;
background: url(../img/nav_07.png) no-repeat;
outline: none;
}
.nav5 a:hover{
display: block;
width: 110px;
height: 48px;
/* background: url(../img/nav-rollover_07.png) no-repeat; */
}
.nav6 {
width: 126px;
height: 48px;
display: block;
}
.nav6 a{
display: block;
width: 126px;
height: 48px;
background: url(../img/nav_08.png) no-repeat;
outline: none;
}
.nav6 a:hover{
display: block;
width: 126px;
height: 48px;
/* background: url(../img/nav-rollover_08.png) no-repeat; */
}

.watdoenwe {
background:url(../img/watdoenwe.png) no-repeat;
}
.cases {
background:url(../img/cases.png) no-repeat;
}
.diensten {
background:url(../img/diensten.png) no-repeat;
}
.wiezijnze {
background:url(../img/wiezijnze.png) no-repeat;
}
.meerweten {
background:url(../img/meerweten.png) no-repeat;
}

#background {
	background: url(../img/clouds2.png) repeat 5% 5%;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	margin-top: -100px;
	z-index: 3;
}

#foreground {
	background: url(../img/clouds1.png) repeat 20% 80%;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	margin-top: -100px;
	z-index: 4;
}
#tree {
background:url(../img/empty-tree.png) no-repeat;
position: absolute;
width: 318px;
height: 325px;
left: 50%;
margin-left: -168px;
top: 100%;
margin-top: -450px;
z-index: 20;
}

#sun {
background:url(../img/sun.png) no-repeat;
position: absolute;
left: 50%;
top: 0;
width: 657px;
height: 364px;
z-index: 2;
margin-left: -600px;
}

#slider {
	width: 2200px;
	height: 100%;
	margin: 0;
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -1100px;
	background: none;
}
.scroll {
	width: 2200px;
	left: 50%;
	margin-left: -1100px;
	height: 100%;
	top: 0;
	position: absolute;
	z-index: 22;
	background:none;
}
.scrollContainer {
width: 2200px;
height: 100%;
overflow: hidden;
background:none;
}
.panel {
width: 2200px;
height: 1500px;
background:none;
}
#whitelabel {
height: 1500px;
}
.home-content {
width: 318px;
height: 325px;
position: absolute;
left: 50%;
margin-left: -168px;
top: 100%;
margin-top: -450px;
background:url(../img/empty-tree.png) no-repeat;
}

.cases-content {
background: url(../img/cases-bg.png) no-repeat;
width: 1004px;
height: 570px;
position: absolute;
left: 50%;
margin-left: -502px;
top: 100%;
margin-top: -570px;
padding: 0;
}
.diensten-content {
background: url(../img/bg-diensten.png) no-repeat;
width: 1143px;
height: 576px;
position: absolute;
left: 50%;
margin-left: -572px;
top: 100%;
margin-top: -595px;
padding: 0;
}
.diensten-content2 {
width: 500px;
margin-left: 270px;
margin-top: 150px;
}
.watdoenwe-content {
background: url(../img/bg-watdoenwe.png) no-repeat;
width: 1059px;
height: 571px;
position: absolute;
left: 50%;
margin-left: -529px;
top: 100%;
margin-top: -600px;
padding: 0;
}
.watdoenwe-content2 {
width: 370px;
margin-left: 330px;
margin-top: 120px;
}

.whitelabel-content {
width: 2200px;
height: 1500px;
position: absolute;
left: 50%;
margin-left: -1100px;
top: 100%;
margin-top: -1500px;
background: #fff url(../img/whitelabel.png) 400px 500px no-repeat;
}
.whitelabel-content2 {
width: 500px;
height: 1500px;
margin-left: 920px;
margin-top: 905px;
}

.meerweten-content {
background: url(../img/bg-meerweten.png) no-repeat;
width: 419px;
height: 297px;
position: absolute;
left: 50%;
margin-left: -100px;
top: 100%;
margin-top: -475px;
padding: 0;
}
.meerweten-content2 {
width: 250px;
margin-left: 80px;
margin-top: 100px;
}

.wiezijnze-content {
background: url(../img/bg-wiezijnze.png) no-repeat;
width: 1074px;
height: 491px;
position: absolute;
left: 50%;
margin-left: -537px;
top: 100%;
margin-top: -610px;
padding: 0;
}
.wiezijnze-content2 {
width: 450px;
margin-left: 350px;
margin-top: 120px;
}

#bg-top {
background: #fff;
width: 100%;
height: 100%;
position:absolute;
left: 0;
top: 0;
z-index: 200;
}
.bird {
position: absolute;
margin-left: 252px;
margin-top: 122px;
z-index: 50;
}
.rocket {
position: absolute;
left: 150px;
top: 10px;
z-index: 60;
}
.label {
position: absolute;
left: 0px;
top: 0px;
margin-left: -63px;
margin-top: -13px;
z-index: 70;
}
.gieter {
position: absolute;
margin-left: 185px;
margin-top: 197px;
z-index: 80;
}
.leaf {
position: absolute;
margin-left: 57px;
margin-top: 106px;
z-index: 90;
}
.twitterwolk {
background:url(../img/tweet-talk.png) 3px 10px no-repeat;
position: absolute;
width:178px;
left: 305px;
top: 110px;
z-index: 50;
}

.tweet {
  line-height: 17px;
font-size: 11px;
color: #222; 
width: 165px;
padding-left: 30px;
}


.tweet .tweet_list, .tweet_list {
    list-style-type: none;
    border: 0;
    margin: 0;
    padding: 0 0 0 0;
}
.tweet_avatar img{
border: 1px #444 solid;
position: relative;
left: 0;
top: 3px;
}

.tweet_avatar img a{

}

.tweet_avatar img:hover{
border: 1px #ee8100 solid;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

.tweet a {
text-align: right;
line-height: 17px;
font-size: 11px;
color: #ee8100;
text-decoration: none;
font-weight: bold;
}

.tweet_avatar {
float: left;
width: 62px;
text-align: left;
padding: 5px;
min-height: 65px;
background: none;
border-right: 1px #111 solid;
margin-right: 5px;
display: none;
}

.tweet_text {
padding: 0;
margin: 0;
border: 0;
line-height: 17px;
font-size: 11px;
color: #222;
}
.tweet_text a{
color: #ee8100;
padding: 0;
margin: 0;
text-align: left;
padding-bottom: 8px;
line-height: 15px;
font-size: 11px;
color: #222;
}
.tweet_text a:visited{
color: #222;
}
.tweet_text a:hover{
color: #ccc;
}
.tweet_even {
background: none;
}
.tweet_odd {
background: none;
}
.tweet_intro {
}

.loading {
padding: 20px 0 0 160px;
}

.tweetdate {
text-align: left;
float: left;
padding: 0;
padding: 3px 0 0 0;
}

.tweetspace {
width: 300px;
height: 5px;
}

.tweet-middle {
background:url(../img/twitterwolk_04.png) repeat-y;
width: 230px;
padding-bottom: 5px;
}

.panels {
width: 2200px;
  border: 0px solid #DFDFDF;
  border-top: 0;
  /*
  border-bottom: 10px solid ##393737;
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-bottomright: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  */
  bottom: 0;
  left: 50%;
  margin-left: -1100px;
  position:absolute;
  z-index: 29;
}



/** 
 * Slideshow style rules.
 */
#slideshow {
	margin:0 auto;
	width:1004px;
	height:570px;
	position:relative;
}
#slideshow #slidesContainer {
  margin:0 auto;
  width:690px;
  height:390px;
  overflow:auto; /* allow scrollbar */
  position:relative;
}
#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:670px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
  height:390px;
  margin-top: 45px;
}

/** 
 * Slideshow controls style rules.
 */
.control {
  display:block;
  width:86px;
  height:17px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:425px;
  left:150px;
  background: url(../img/TG_case_button_vorige.png) no-repeat 0 0;
}
#rightControl {
  top:425px;
  right:105px;
  background: url(../img/TG_case_button_volgende.png) no-repeat 0 0;
}
/* Scroll */
#dienstenscroll {
width: 500px;
height: 310px;
overflow: auto;
position: relative;
float: right;
}
#customscrollcase {
width: 420px;
height: 345px;
overflow: auto;
position: relative;
float: right;
}

.scrollgeneric {line-height: 1px;font-size: 1px;position: absolute;top: 0; left: 0;}

.vscrollerbar {width: 18px; background: url(../img/scroll_handle.png) 12px 0px repeat-y;}

.vscrollerbase {width: 19px;background: url(../img/scroll_bg.png) 4px 10px repeat-y; margin-top: 10px;}

.vscrollerbasebeg {width: 18px;height: 28px !important;background: url(../img/scrollbar.png) -66px -47px no-repeat; cursor: pointer;}

.vscrollerbaseend {height: 19px;width: 18px;background: url(../img/scrollbar.png)  -66px -0px no-repeat; cursor: pointer;}

.hscrollerbase {height: 16px; background-color: white;}

.hscrollerbar {height: 16px; background-color: black;}

.vscrollerbar, .hscrollerbar {padding-top: 10px; padding-bottom: 20px; z-index: 2;}

.scrollerjogbox {width: 36px;height: 16px;top: auto; left: auto;bottom: 0px; right: 0px;}

/* End Scroll */
/* position and dimensions of the navigator */
.navi {
	width:100px;
	height:20px;
	float: left;
	overflow: hidden;
	margin-left: 150px;
}


/* items inside navigator */
.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(../img/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
.navi a.active {
	background-position:0 -16px;     
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	display:block;
	width:86px;
	height:17px;
	float:left;
	cursor:pointer;
	font-size:1px;
}

.prevcase a{
background: url(../img/TG_case_button_vorige.png) no-repeat; 
width: 200px;
float: left;
margin-left: 165px;
margin-top: 3px;
display:block;
}
.nextcase a{
background: url(../img/TG_case_button_volgende.png) no-repeat; 
width: 200px;
float: right;
margin-top: 3px;
display:block;
}

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {
	position:relative;
	overflow:hidden;
	width: 700px;
	height:390px;
	margin-left: 160px;
	margin-top: 35px;
}

.scrollable .items {
	width:20000em;
	position:absolute;
	clear:both;
}

/* SLIDESHOW CASES */
.style6 {
font-weight: bold;
margin: 0;
padding: 0;
font-size: 13px;
}
#case {
float: left;
width: 700px;
height: 365px;
}
.case-left {
width: 454px;
float: left;
height: 365px;
overflow: hidden;
}
.case-left-title {
color: #ee8100;
margin-bottom: 5px;
font-weight: bold;
font-size: 15px;
}
.case-left-klant {
margin-bottom: 5px;
}
.case-left-doelstelling {
margin-bottom: 5px;
}
.case-left-doelgroep {
margin-bottom: 5px;
}
.case-left-strategie {
margin-bottom: 5px;
}
.case-left-resultaat {
}
.case-right {
text-align: right;
width: 245px;
height: 390px;
float: left;
overflow: hidden;
}
.case-right img{
padding-bottom: 5px;
}
.soundcontrol {
width: 25px;
height: 22px;
padding: 0;
margin: 0;
float: right;
}
.socmed {
float: right;
padding: 0;
margin: 0;
height: 22px;
}