@import url('debug.css');

/* ALGEMEEN */

html, body {
	margin: 0;
	padding: 0;
	background: #FFF url('../images/body_bg.gif') repeat-x;
	font-family: Trebuchet MS, Lucida Sans Unicode, Lucida Grande, Lucida Sans, Arial, sans-serif;
	font-size: 14px;	
	color: #848484;
}

a, div, img {
	outline: none;
}

img {
	border: 0;
}

/* TEKST STIJLEN */

a:link,
a:visited,
a:hover,
a:active {
	color: #00A9E0;
	text-decoration: underline;
}

h1 {
	margin: 0 0 10px 0;
	color: #00A9E0;
	font-size: 20px;
}

h2 {
	margin: 0 0 10px 0;
	color: #00A9E0;
	font-size: 18px;
}

p {
	margin: 0 0 10px 0;
	line-height: 22px;
	width: 100%;
}

.blue {
	color: #00A9DD;
}

/* HEADER */

#header {
	margin: 0 auto;
	width: 966px;
	height: 80px;
	background: url('../images/header_bg.gif') no-repeat;
}

#logo {
	display: block;
	width: 215px;
	height: 0;
	overflow: hidden;
	padding-top: 52px;
	background: url('../images/logo.gif') no-repeat;
	float: left;
	margin: 19px 0 0 18px;
}

#header ul {
	margin: 21px 20px 0 0;
	padding: 0;
	float: right;
	list-style-type: none;
}

#header ul li {
	float: left;
	padding: 0 5px;	
	height: 54px;
}

#header ul li.active {
	background: url('../images/menu_arrow.gif') no-repeat bottom center;
}

#header ul li a {
	float: left;
	display: block;
	text-decoration: none;
	color: #FFF;	
	font-size: 16px;
	padding: 3px 10px;	
	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;	
}

#header ul li.active a,
#header ul li a:hover,
#header ul li a:active {
	background: #4F4F4F;	
}

a#button_15 {
	background: #1A1A1A url('../images/rss_off.gif') no-repeat 67px 6px !important;
	padding-right: 28px !important;	
}

a#button_15_active,
a#button_15:hover,
a#button_15:active {
	background: #4F4F4F url('../images/rss.gif') no-repeat 67px 6px !important;
	padding-right: 28px !important;
}

/* SUBNAVIGATIE */

#menu_1_2_show {
	margin: 0 0 20px 0 !important;
	padding: 10px 0 0 0 !important;
	list-style-type: none;
	width: 320px;
	float: left;
	background: url('../images/list_item_bg.gif') no-repeat;
}
/*\*/ * html #menu_1_2_show { overflow: hidden; } /**/

#menu_1_2_show li {
	padding: 0 0 0 11px;
}

#menu_1_2_show li.last {
	background: url('../images/list_item_bg_bottom.gif') no-repeat bottom left;	
	padding-bottom: 10px;	
}

#menu_1_2_show li.first a {
	padding-top: 10px;	
}

#menu_1_2_show li.last a {
	padding-bottom: 10px;	
}

#menu_1_2_show li a {
	display: block;
	width: 274px;
	text-decoration: none;
	overflow: hidden;
	padding: 3px 30px 5px 15px;
}

#menu_1_2_show li.active a,
#menu_1_2_show li a:hover, 
#menu_1_2_show li a:active{
	background: url('../images/submenu_active_bg.gif') no-repeat center right;
}

#menu_1_2_show li a span.submenu_title {
	float: left;
	clear: both;
	font-size: 18px;
	color: #00A9DD;	
}

#menu_1_2_show li a span.submenu_subtitle {
	clear: both;	
	float: left;
	color: #848484;
	width: 100%;
}

/* CONTENT */

#content {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

#plain {
	width: 590px;
	float: right;
	background: url('../images/content_bg.gif') no-repeat;
	padding: 25px 25px 20px 25px;
	margin-bottom: 20px;
	overflow: hidden;
	display: inline;
/*	min-height: 550px;
	height: auto !important;
	height: 550px;*/
}

#plain #content_footer {
	clear: both;
	width: 640px;
	height: 24px;
	background: url('../images/content_bg_bottom.gif') no-repeat;
	margin: 0 -25px -25px -25px;
}

#plain img {
	border: 1px solid #CDCDCD;
}

#plain ul {
	margin: 0 10px 0 0;
	padding: 0 0 0 20px;
}

#plain ul li {
	margin-bottom: 10px;		
}

#plain ul li ul {
	margin: 10px 0 0 0;
	padding: auto;
	list-style-type: disc;
}

/* PAYOFF */

#payoff_outer_container {
	height: 110px;
	padding: 30px 0 15px 0;
}

#payoff_container {
	height: 110px;
	overflow: hidden;
	position: relative;
}

#payoff {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	color: #FFF;
}

#payoff_shadow {
	position: absolute;
	top: 1px;
	left: 2px;
	color: #1BA1CC;
	z-index: 1;
}

.payoff_line_1 {
	font-size: 22px;
	line-height: 24px;
}

.payoff_line_2 {
	font-size: 25px;
	line-height: 27px;
}

.payoff_line_3 {
	font-size: 28px;
	line-height: 33px;
	float: left;
	margin-top: -5px;
}

/* payoff 404 */

#four_oh_four #payoff_container .payoff_line_1 {
	margin-left: 120px;	
}

#four_oh_four #payoff_container .payoff_line_2 {
	margin-left: 60px;	
}

#four_oh_four #payoff_container .payoff_line_3 {
	margin-left: 190px;		
}

/* payoff home */
#home #payoff_container .payoff_line_1 {
	margin-left: 120px;	
}

#home #payoff_container .payoff_line_2 {
	margin-left: 60px;	
}

#home #payoff_container .payoff_line_3 {
	margin-left: 190px;	
}

/* payoff nieuws */
#nieuws #payoff_container .payoff_line_1 {
	margin-left: 35px;	
}

#nieuws #payoff_container .payoff_line_2 {
	margin-left: 195px;	
}

#nieuws #payoff_container .payoff_line_3 {
	margin-left: 360px;	
}

/* payoff portfolio */
#portfolio #payoff_container .payoff_line_1 {
	margin-left: 35px;	
}

#portfolio #payoff_container .payoff_line_2 {
	margin-left: 65px;	
}

#portfolio #payoff_container .payoff_line_3 {
	margin-left: 330px;	
}

/* payoff diensten */
#diensten #payoff_container .payoff_line_1 {
	margin-left: 35px;	
}

#diensten #payoff_container .payoff_line_2 {
	margin-left: 165px;	
}

#diensten #payoff_container .payoff_line_3 {
	margin-left: 330px;	
}

/* payoff producten */
#producten #payoff_container .payoff_line_1 {
	margin-left: 35px;	
}

#producten #payoff_container .payoff_line_2 {
	margin-left: 165px;	
}

#producten #payoff_container .payoff_line_3 {
	margin-left: 330px;	
}

/* payoff contact */
#contact #payoff_container .payoff_line_1 {
	margin-left: 35px;	
}

#contact #payoff_container .payoff_line_2 {
	margin-left: 120px;	
}

#contact #payoff_container .payoff_line_3 {
	margin-left: 250px;	
}

/* payoff email instellen */
#email #payoff_container .payoff_line_1 {
	margin-left: 60px;	
}

#email #payoff_container .payoff_line_2 {
	margin-left: 145px;	
}

#email #payoff_container .payoff_line_3 {
	margin-left: 250px;	
}

/* payoff algemene voorwaarden */
#algemene-voorwaarden #payoff_container .payoff_line_1 {
	margin-left: 60px;	
}

#algemene-voorwaarden #payoff_container .payoff_line_2 {
	margin-left: 145px;	
}

#algemene-voorwaarden #payoff_container .payoff_line_3 {
	margin-left: 250px;	
}

/* HOMEPAGE */

#home #plain {
	display: none;
}

#home .home_content_block {
	width: 270px;
	float: left;
	background: url('../images/home_item_bg.gif') no-repeat;
	margin: 60px 0 20px 0;
	height: 357px;
	padding: 25px;
	position: relative;
}

#home .home_content_block_footer {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 24px;
	width: 320px;
	background: url('../images/list_item_bg_bottom.gif') no-repeat;
}

#home .home_content_block h1 {
	margin-top: 0 !important;
	letter-spacing: -1px;
}

/* links */
#block_15 {
	padding-top: 180px !important;
	height: 202px !important;
}

#block_15 img {
	border: 0;
}

#random_image_0 {
	position: absolute;
	z-index: 1;
	top: -4px;
	left: 6px;
}

#random_image_0_clone {
	position: absolute;
	z-index: 0;
	top: -4px;
	left: 6px;
}

#random_image_1 {
	position: absolute;
	z-index: 3;
	top: -13px;
	left: 125px;
}

#random_image_1_clone {
	position: absolute;
	z-index: 2;
	top: -13px;
	left: 125px;
}

#random_image_2 {
	position: absolute;
	z-index: 5;
	left: 59px;
	top: 44px;
}

#random_image_2_clone {
	position: absolute;
	z-index: 4;
	left: 59px;
	top: 44px;
}

#random_portfolio_overlay {
	top: -18px;
	left: 1px;
	position: absolute;
	z-index: 6;
}

/* midden */
#block_17 {
	padding-top: 170px !important;
	height: 212px !important;
}

#block_17 img {
	position: absolute;
	z-index: 7;
	top: -71px;
	left: -10px;
}

/* twitter */
#block_19 {
	position: absolute;
	width: 175px;
	height: 160px;
	background: url('../images/twitter_bg.jpg') no-repeat;
	top: 16px;
	right: -10px;
	z-index: 999;
	overflow: hidden;
	padding: 25px 40px 25px 25px;
	font-size: 11px;
}

#twitter_page_fold {
	width: 80px;
	height: 76px;
	position: absolute;
	z-index: 2;
	top: 12px;
	right: 18px;
	background: url('../images/twitter_page_fold.png') no-repeat;
}

#follow_us {
	display: block;
	padding: 2px 0 0 30px;
	height: 24px;
	background: url('../images/twitter_bird.gif') no-repeat;
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
	text-decoration: none;
	color: #00A9E0;
}

#block_19 ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#block_19 ul li {
	margin-bottom: 10px;	
}

#block_19 ul li a { 
	color: #00A9E0;
}

/* rechts */

#latest_article {
	margin: 0;
	padding: 0;
	list-style: none;
}

#latest_article li h1 {
	height: 52px;	
	display: block;
	margin: 0 0 10px 0;
	clear: both;
}

#latest_article li .meta {
	clear: both;
	color: #CDCDCD;
	float: right;
	margin: -8px 0 4px 0;
	font-size: 12px;
}

#latest_article li img {
	border: 1px solid #CDCDCD;
	margin-bottom: 9px;
	float: left;
}

/* NIEUWS */

#news_list_container {
	width: 960px;
	overflow: hidden;
	margin-bottom: 20px;
}

#news_list_container ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	width: 1920px;
	overflow: hidden;
}

#news_list_container ul li {
	width: 269px;
	float: left;	
	background: url('../images/list_item_bg.gif') no-repeat;
	padding: 20px 25px 0 26px;
}	

#news_list_container ul li h1 {
	height: 52px;	
	display: block;
	margin: 0 0 10px 0;
}

#news_list_container ul li .meta {
	color: #000;
	float: right;
	margin-top: -30px;
}

#news_list_container ul li img {
	border: 1px solid #CDCDCD;
	margin-bottom: 10px;
	float: left;
}

#news_list_container ul li .message {
	margin: 0 -25px 0 -26px;
	background: url('../images/list_item_bg_bottom.gif') no-repeat bottom left;
	padding: 0 25px 10px 26px;
	overflow: hidden;
	clear: both;
}

#news_list_container ul li .message p {
	color: #848484;
}

/* PORTFOLIO */

#portfolio_list_outer_container {
	width: 960px;
	overflow: hidden;
	margin-bottom: 20px;
}

#portfolio_list_container {
	width: 1920px;
	overflow: hidden;
}
	
#portfolio_list_container ul {
	list-style-type: none;
	width: 960px;
	margin: 0;
	padding: 0;	
	overflow: hidden;
	float: left;
}	

#portfolio_list_container ul li,
#portfolio_related li,
#portfolio_news {
	width: 269px;
	height: 285px;
	float: left;	
	background: url('../images/list_item_bg_row_2_plus.gif') no-repeat;	
	padding: 25px 25px 0 26px;	
	margin-bottom: 6px;
	overflow: hidden;
	cursor: pointer;
}

#portfolio_related li {
	height: auto !important;	
}

.more_projects,
.latest_news {
	display: block;
	margin: 0 0 10px 0;
	color: #00A9E0;
	font-size: 20px;	
}

#portfolio_related li h2 {
	font-size: 20px;	
}

#portfolio_list_container ul li h1 a,
#portfolio_related li h2 a {
	text-decoration: none;	
	color: #00A9E0;
}

#portfolio_list_container ul li img,
#portfolio_related li img {
	border: 1px solid #CDCDCD;
	margin-bottom: 10px;
}

#portfolio_list_container ul li a img,
#portfolio_related li a img {
	border: 1px solid #CDCDCD;
	margin-bottom: 10px;
}

#portfolio_list_container ul li .message,
#portfolio_related li .message,
#portfolio_news #message {
	margin: 0 -25px 0 -26px;
	background: url('../images/list_item_bg_bottom.gif') no-repeat bottom left;
	padding : 0 25px 10px 26px;
	height: 60px;
	overflow: hidden;
}

#portfolio_list_container ul li .message p,
#portfolio_related li .message p {
	color: #848484;
}

#portfolio_list_container ul li.first_row {
	background: url('../images/list_item_bg.gif') no-repeat;	
}

#portfolio_details_container {
	float: left;
	overflow: hidden;
	width: 960px;
	background: url('../images/detail_item_bg.gif') no-repeat;
}

#portfolio_details_container a {
	color: #848484;
}

.portfolio_details {
	width: 911px;
	overflow: hidden;
	background: url('../images/detail_item_bg_bottom.gif') no-repeat bottom left;
	padding: 25px 23px 26px 26px;
}

#portfolio_details_left {
	float: left;
	color: #848484;
	width: 294px;
	overflow: hidden;
	padding-right: 25px;
}

#portfolio_details_right {
	float: right;
	width: 590px;
	height: 290px;
	overflow: hidden;
	position: relative;
	background: url('../images/spinner.gif') no-repeat center 133px;
}

#portfolio_details_right img {
	border: 1px solid #CDCDCD;
	position: absolute;
	top: 0;
	left: 0;	
}

#portfolio_details_right img#image_1 {
	z-index: 900;
}

.portfolio_details h1 {
	margin-top: -5px;	
}

#portfolio_footer {
	background: #FFF;
	color: #000;
	overflow: hidden;
}

#image_nav {
	position: absolute;
	margin: 0;
	padding: 0;
	list-style-type: none;
	bottom: 0;
	right: 0;
	width: auto !important;
}

/* #portfolio_list_container ul li herstellen */
#image_nav li {
	width: auto !important;
	height: auto !important;
	float: left !important;	
	background: none !important;	
	padding: 0 0 0 0 !important;	
	margin: 0 0 0 5px !important;
}

#image_nav li a {
	display: block;
	height: 20px;
	width: 15px;
	text-align: center;
}

#image_nav li a:link,
#image_nav li a:visited,
#image_nav li a:hover,
#image_nav li a:active {
	display: block;
	text-decoration: none;
	padding: 17px 0 0 0 !important;
}

#image_nav li a.active {
	display: block;
	text-decoration: none;
	font-size: 20px;
	font-weight: bold;
	color: #00A9DD;
	padding: 11px 0 0 0 !important;
}

#portfolio_testimonials {
	float: right;
	padding: 26px 26px 0 26px;
	text-align: center;
	
}

#portfolio_footer .wide {
	width: 580px;
}

#portfolio_footer .narrow {
	width: 268px;
}

#portfolio_testimonials span.quote {
	font-size: 40px;
	color: #00A9E2;
	vertical-align: middle;
	margin: 0 5px;
	zoom: 1;
}

#portfolio_testimonials p {
	font-size: 15px;
	line-height: 30px;
	font-style: italic;
	color: #848484;
}

#portfolio_testimonials p.author {
	color: #00A9E2;
	text-align: right;
}

#portfolio_news {
	width: 268px;
	float: right;
	padding: 26px 26px 40px 26px;
	cursor: default !important;
}

#portfolio_news .latest_news {
	padding-left: 22px;
	background: url('../images/rss_white.gif') no-repeat 0 5px;	
}

#portfolio_news ul li {
	width: 268px;
	margin: 0;
	padding: 0;	
	background: none;
	height: auto;
	float: none;
	white-space: normal;
	font-size: 12px;
	color: #848484;
	cursor: default !important;
}

#portfolio_news ul li a {
	color: #00A8DF;
	font-size: 13px;
	text-decoration: none;
	float: left;
}

#portfolio_news ul li span,
#portfolio_news ul li p {
	float: left;
	clear: both;	
}

#portfolio_news #message {
	height: 315px;
	overflow: hidden;	
}

#portfolio_related {
	width: 320px;
	float: right;
	padding: 0 0 0 0;
	overflow: hidden;
}

#portfolio_related_container {
	width: 640px;
}

#portfolio_related ul {
	margin: 0;
	padding: 0;
	list-style-type: none;	
	float: left;
	width: 320px;
}

/* CONTACT */

.content_block {
	width: 270px;
	padding: 25px;
	float: right;
	background: url('../images/list_item_bg.gif') no-repeat;
	margin: 0 0 20px 0;
	position: relative;
	min-height:200px;  
	height:auto !important;
	height:200px;
}

.content_block_footer {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 24px;
	width: 320px;
	background: url('../images/list_item_bg_bottom.gif') no-repeat;
}

/* PAGINERING */

.pagination {
	position: relative;
	float: left;
	clear: both;
	width: 960px;
	margin-bottom: 20px;
}

.pagination .off {
	display: none;
}

.pagination #next:link, 
.pagination #next:visited, 
.pagination #next:hover, 
.pagination #next:active { 
	float: right;
	display: block;
	height: 17px;
	padding-right: 20px;
	background: url('../images/next.gif') no-repeat top right;	
	text-decoration: none;
	color: #00A9E2;
}

.pagination #prev:link, 
.pagination #prev:visited, 
.pagination #prev:hover, 
.pagination #prev:active { 
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	height: 17px;
	padding-left: 20px;
	background: url('../images/prev.gif') no-repeat top left;	
	text-decoration: none;
	color: #00A9E2;
}

#back:link, 
#back:visited, 
#back:hover, 
#back:active { 
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	height: 17px;
	padding-left: 20px;
	background: url('../images/prev.gif') no-repeat top left;	
	text-decoration: none;
	color: #00A9E2;
}

/* CONTACT PAGINA */

#contact_left {
	float: left;
	width: 295px;
}

#contact_map {
	float: left;
	width: 295px;
	padding-top: 20px;		
}

#contact_map iframe {
	border: 1px solid #CDCDCD;	
}

/* FOOTER */

#footer {
	width: 960px;
	height: 276px;
	overflow: hidden;
	margin: 0 auto;
	clear: both;
	background: url('../images/footer_bg.gif') repeat-x bottom;
	position: relative;
	color: #000;
}

#footer .column {
	float: left;
	width: 220px;
	height: 250px;
	overflow: hidden;
	padding: 0 10px;
	font-size: 14px;
	color: #FFF;
	text-shadow: 0 1px 1px #848484;
}

#footer .column a {
	color: #FFF;
	text-decoration: none;	
}

#footer .column p {
	margin: 0;
	padding: 0;
	line-height: 20px;
}

#footer .column h2 {
	margin: 0 0 5px -10px;
	padding: 0;
	width: 200px;
	height: 47px;
	padding: 29px 0 0 42px;
	color: #FFF;
	font-size: 17px;
	text-shadow: none;
}

#footer #footer_customers h2 {
	background: url('../images/footer_icon_customers.gif') no-repeat 5px 0;
	padding: 29px 0 0 48px;
}

#footer #footer_services h2 {
	background: url('../images/footer_icon_services.gif') no-repeat top left;
	padding: 29px 0 0 48px;
}

#footer #footer_contact h2 {
	background: url('../images/footer_icon_contact.gif') no-repeat top left;
}

#footer #footer_products h2 {
	background: url('../images/footer_icon_products.gif') no-repeat top left;
}

#footer .column h2 a {
	color: #FFF;
	text-decoration: none;	
}

#footer .column ul {
	margin: 0;
	padding: 0;	
	list-style-type: none;
	line-height: 20px;
}

#footer ul#menu_2_1_show {
	text-align: right;
	margin: 4px 0 0 0;
	padding: 0;	
	list-style-type: none;
}

#footer ul#menu_2_1_show li {
	float: right;
	margin: 0 10px 0 0;
	padding-top: 3px;
}

#footer ul#menu_2_1_show li a {
	color: #FFF;
	text-decoration: none;
}

#footer ul#menu_2_1_show li a:hover,
#footer ul#menu_2_1_show li a:active {
	text-decoration: underline;
}