/* You may adapt and learn from the elements of this CSS to use in 
your own projects, but you may not copy the design (the unique 
combination of images, colors, sizes, typography, and positioning) 
since this is copyright of Telenet E-Services and may not be reproduced. 
--------------------------------------------------------------------------*/

/* Telenet E-Services' Main stylesheet
--------------------------------------------------------------------------*/

/* Wide browser windows
--------------------------------------------------------------------------*/
#wrap {
	position:relative;
	width:1140px;
	text-align:left;
	margin: 0 auto;
	/*background: #FFF url(../images/bgDetailBottom.jpg) no-repeat scroll center bottom;*/
	}
body.detail #wrap {
	background:#FFF url(../images/bgDetailBottom.jpg) no-repeat scroll center bottom;
	}

/* Global
--------------------------------------------------------------------------*/
html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {
	margin:0;
	padding:0;
	}
ul,li {
	list-style-type:none;
	}
body {
	/* text-align:center; */
	color:#333;
	font:76%/140% Verdana,Arial,Helvetica,sans-serif;
	background-color: #ffffff;
	}
hr {
	clear:both;
	visibility:hidden;
	}
hr.showhr {
	clear:both;
	visibility: visible;
	}
.clear {
	clear:both;
	}
.centered, p.centered {
	text-align:center;
	}
.right {
	text-align:right;
	}		
img {
	border:0;
	}	

/* Links
------------------------------------------------------------------*/
a:link,
a:visited {
	color:#333;
	text-decoration:none;
	}	
a:hover,
a:focus {
	color:#ffa200;
	text-decoration:underline;
	}
	
/* Header
------------------------------------------------------------------*/  
#header {
	float: left;
	padding: 0 75px;
	width: 990px;
	}
#logo {
	float:left;
	width:276px;
	height:80px;
	}
#tagline {
	display:none;
	}
#searchform {
	float: right;
	width: 160px;
	height: 80px;
	}
#searchform label {
	display:block;
	margin:24px 0 6px;
	text-transform:uppercase;
	}
#searchform #keywords {
	float:left;
	padding:1px 8px 0;
	width: 93px;
	height:14px;
	font-size:9px;
	line-height:15px;
	background:#FFF url(../images/bgSearchfield.gif) no-repeat scroll 0 0;
	border:0;
	}
#searchform #searchbutton {
	float:left;
	margin-left:1px;
	padding:0;
	width: 50px;
	color:#ffa200;
	background:none;
	border:0;
	cursor:pointer;
	}

/* Main navigation - Vertical
------------------------------------------------------------------*/
#VerticalNavigation {
	float:left;
	margin-top:24px;
	width:152px;
	}
#VerticalNavigation ul li {
	text-align:right;
	}
#HorizontalNavigation {
	float: left;
	padding: 10px 75px 0;
	width: 990px;
	}
#HorizontalNavigation ul li {
	float:left;
	margin-right:10px;
	}
.navigatie ul li a {
	padding-right:12px;
	color:#222;
	font-size:18px;
	text-transform:uppercase;
	letter-spacing:-1px;
	}
.navigatie ul li a:hover,
.navigatie ul li a:focus {
	color:#ffa200;
	}
.navigatie ul ul {display: none;}
.navigatie ul li.selected ,
.navigatie ul li.selected a {
	color:#ffa200;
	}
.navigatie ul li.selected {
	background:#FFF url(../images/navArrowActive.gif) no-repeat 100% 51%;
	}

/* Flash Container
------------------------------------------------------------------*/
#flashContainer {
	height:355px;
	background:#FFF url(../images/tmpFlash.jpg) no-repeat 50% 50%;
	}
#flashContainer.cloudtag {
	height:100px;
	background:#FFF url(../images/tmpCloudtag.jpg) no-repeat 44px 10px;
	padding: 10px 130px 0;
	}

/* Headers
------------------------------------------------------------------*/
h1 {
	text-transform:uppercase;
	font-size:24px;
	font-weight:normal;
	letter-spacing:-1px;
	}
h1 strong {
	color:#111;
	font-weight:normal;
	}
h1 em {
	display:block;
	margin:6px 0 36px;
	color:#ffa200;
	font-style:normal;
	font-size:16px;
	text-transform:none;
	x-letter-spacing:0;
	}
h2 {
	margin-top:24px;
	color:#ffa200;
	font-weight:normal;
	font-size:16px;
	}
h2 a:link, h2 a:visited {
	color:#ffa200;
	}
h3 {
	margin-bottom:8px;
	color:#ffa200;
	font-weight:normal;
	}
h4 {font-family: Trebuchet MS; font-size: 18px; font-weight: bold; color: #77797a;}
/* Content
------------------------------------------------------------------*/	
#content {
	float:left;
	padding:0 75px;
	width: 880px;
	}
#content p {
	line-height:150%;
	margin-bottom:16px;
	}
#content .box-outer {
	margin-top:12px;
	width:322px;
	background:transparent url(../images/bgBoxTop.gif) no-repeat 0 0;
	}
#content .box-inner {
	padding:12px;	
	background:transparent url(../images/bgBoxBottom.gif) no-repeat 0 100%;
	}
#content .box-inner li {
	padding:0 12px 8px;
	background:transparent url(../images/bgListCross.gif) no-repeat 0 6px;
	}
	
#content-primary {
	float:left;
	margin:0 10px;
	width:386px;
	}
#content-primary ul, 
#content-primary-detail ul {
	margin-bottom:20px;
	}
#content-secondary-detail ul {
	margin-top:10px;
	}
#content-primary li, 
#content-primary-detail li,
#content-secondary-detail li {
	padding:0 24px 8px;
	background:transparent url(../images/bgListCross.gif) no-repeat 10px 6px;
	}
	
#content-secondary {
	float:left;
	width:322px;
	}

#content-secondary dl {
	margin-top:12px;
	padding-left:24px;
	}
#content-secondary-detail dl {
	margin-top:12px;
	padding-left:0;
	}
#content-secondary dt,
#content-secondary-detail dt {
	padding-left:12px;
	background:transparent url(../images/bgListCross.gif) no-repeat 0 6px;
	}
#content-secondary dd,
#content-secondary-detail dd {
	margin-left:12px;
	font-size:10px;
	}
#content-secondary p a {
	color:#ffa200;
	}
#content-secondary #toolbar {
	float:left;
	margin-left:30px;
	padding:0 32px;
	width:151px;
	height:23px;
	margin-top:12px;
	background:#FFF url(../images/bgToolbar.gif) no-repeat 50% 50%;
	}
#content-secondary #toolbar li {
	float:left;
	width:60px;
	text-align:center;
	}
#content-secondary #toolbar li.prev {
	width:53px;
	text-align:left;
	}
#content-secondary #toolbar li.next {
	width:30px;
	text-align:right;
	}
#content-secondary #toolbar a {
	display:block;
	line-height:23px;
	font-size:10px;
	}
/* Pagination
------------------------------------------------------------------*/
#pagination {
	margin:30px 0;
	text-align:center;
	}
#pagination a.prev {
	display:inline-block;
	width:90px;
	background:transparent url(../images/bgPaginationPrev.png) no-repeat 0 0;
	}
#pagination a.next {
	width:75px;
	background:transparent url(../images/bgPaginationNext.png) no-repeat 0 0;
	}
#pagination a {
	display:inline-block;
	width:16px;
	height:33px;
	line-height:22px;
	font-size:10px;
	background:transparent url(../images/bgPagination.png) no-repeat 50% 0;
	}
#pagination a.active {
	color:#ffa200;
	}
#pagination a:hover {
	text-decoration:none;
	}
#pagination a span {
	display:none;
	}

/* Footer
------------------------------------------------------------------*/
#footer {
	float:left;
	margin:60px 0 0 162px;
	padding:0 130px;
	font-size:9px;
	}

#footer a {
	color:#333;
	}
	
/* Detail pages
------------------------------------------------------------------*/
.detail #content {
	padding-right:0;
	width:1010px;
	background:transparent url(../images/bgDetailTop.jpg) no-repeat center top;
	}
#content-primary-detail {
	float:left;
	margin-top:20px;
	padding:20px 30px 20px 20px;
	width:600px;
	}
#content-secondary-detail {
	float:left;
	margin-top:60px;
	padding-left:10px;
	width:320px;
	}
.detail #footer {
	margin-left:0;
	}
/* Portfolio pages
------------------------------------------------------------------*/
body.portfolio {
	background:#FFF url(../images/bgPortfolioBottom.jpg) no-repeat center bottom;
	}
.portfolio #content {
	padding-right:0;
	width:1010px;
	}
.portfolio #footer {
	margin-left:0;
	margin-top: 26px;
	}

/* Search page
------------------------------------------------------------------*/
#search-page #content-primary-detail h2 {
	text-transform:uppercase;
	font-size:12px;
	font-weight:bold;
	}
#search-page #content-primary-detail input.txt {
	padding:2px 4px;
	width:380px;
	border:1px solid #CCC;
	}
#search-page #content-primary-detail dt {
	margin-top:20px;
	}
#search-page #content-primary-detail dd {
	margin:0;
	font-size:10px;
	color:#666;
	}
#search-page #content-primary-detail dd.link a {
	display:inline-block;
	margin-top:6px;
	color:#AAA;
	}
#search-page #content-primary-detail #searchbutton {
	margin-left:1px;
	padding:0;
	color:#ffa200;
	background:none;
	border:0;
	cursor:pointer;
	}

p.ajaxSearch_resultsInfo {
	margin:24px 0 12px;
	color:#ffa200;
	font-size:12px;
	font-weight:bold;
	text-transform:uppercase;
	}
span.ajaxSearch_paging {
	display:block;
	margin:8px 0;
	}
a.ajaxSearch_resultLink {
	display:block;
	color:#ffa200;
	}

/* Portfolio page
------------------------------------------------------------------*/
#portfolio-page #content {
	/*background:#FFF url(../images/bgPortfolio.gif) repeat-y 0 0;*/
	}
#portfolio-page #wrap div.casestudy {
	background:transparent url(../images/bgDetailTop.jpg) no-repeat left top;
	}
div.case-image-large {
	margin-bottom:20px;
	}
div.case-description {
	float:left;
	width:400px;
	}
div.case-toolbar {
	float:right;
	margin-top: 0;
	width:200px;
	}
div.case-toolbar a {
	display:block;
	margin:0 0 6px 6px;
	padding-left:20px;
	width:190px;
	height:25px;
	line-height:25px;
	font-size:9px;
	text-transform:uppercase;
	background:transparent url(../images/btnCaseToolbar.png) no-repeat 0 0;
	}	
	
dl.project {
	float:left;
	margin:20px 20px 20px 0;
	padding:102px 10px 10px;
	width:260px;
	height:111px;
	background:transparent url(../images/bgProj_inkijker.jpg) no-repeat 0 0;
	}
dl.project dt {
	text-transform:uppercase;
	}
dl.project em {
	display:block;
	margin-bottom:4px;
	color:#ffa200;
	font-style:normal;
	text-transform:none;
	}
dl.project dd {
	margin:0;
	font-size:10px;
	}	
dl.project dd.tags {
	float:left;
	margin-top:6px;
	width:150px;
	}
dl.project dd.more {
	float:right;
	width:103px;
	height:23px;
	line-height:23px;
	background:#FFF url(../images/btnMoreDetails.gif) no-repeat 0 0;
	}
dl.project dd.more a {
	display:block;
	text-align:center;
	}
#project-C {
	margin-right:0;
	}
#portfolio-page div.portfolio {
	clear:both;
	height:284px;
	background:#FFF url(../images/tmpPortfolio.jpg) no-repeat 68px 0;
	}
#portfolio-page #footer {
	margin-left:0;
	}
	

.tabel {
    display:table;
	border-collapse:separate;
	margin-top: 10px;
}
.rij {
    display:table-row;
}
.rij div {
    display:table-cell;
}
.blokske {
		background: transparent url(../images/bgProj_inkijker.png) no-repeat scroll 0 0;
	width: 314px;
	padding-right: 25px;
}
.onderaan {background-position: left bottom; overflow: hidden;}
#content p.capsfont {
	text-transform:uppercase;
	margin: 0; padding: 0 10px;
	}
#content p.capsfont em {
	display:block;
	margin-bottom:4px;
	color:#ffa200;
	font-style:normal;
	text-transform:none;
	}
#content p.smallfont {
	margin: 0; padding: 0 10px;
	font-size: 10px;
	}	
#content p.tags {
	float:left;
	margin:6px 5px 10px 10px;
	width:180px;
	padding: 0;
	}
#content p.more {
	float:right;
	width:103px;
	height:23px;
	line-height:23px;
	background:#FFF url(../images/btnMoreDetails.gif) no-repeat 0 0;
	padding: 0;
	margin: 0 10px 10px 0;
	}
#content p.more a {
	display:block;
	text-align:center;
	}
/* IE6 en IE7 hack op projectindekijker.css */

#overzichtprojecten {
	background: url(../images/bgOverzicht_projecten.png) no-repeat;
	width: 993px;
	height: 225px;
	padding: 20px 0 0 5px;
	}
/* Form
------------------------------------------------------------------*/
form.contact span.captcha {
	display:block;
	height:50px;
	}

#content div.inputdiv {
	background: url(../images/bgInputFieldLeft.png) no-repeat top left;
	height: 30px;
	padding-left: 3px;
	}
#content div.inputdiv input {
	width:214px;
	border: none;
	background: url(../images/bgInputFieldRight.png) no-repeat top right;
	height: 22px;
	line-height: 20px;
	vertical-align: bottom;
	padding: 3px 0;
	}
#content div.textdiv {
	background: url(../images/bgTextareaTop.png) no-repeat top left;
	margin: 0;
	padding-top: 5px;
	padding-bottom: 10px;
	padding-right: 5px;
	}
#content div.textdiv p {
	background: url(../images/bgTextareaBottom.png) no-repeat bottom left;
	}
#content div.textdiv textarea {
	font-size:11px;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	border: none;
	width: 447px;
	background: #f7f6f6;
	margin: 0 10px 10px 10px;
	}
#content p.inputbutton {
	background: url(../images/bgSubmitLeft.png) no-repeat top left;
	height: 20px;
	padding-left: 3px;
	width: 105px;
	margin: 10px 0;
	}
#content p.inputbutton input {
	background: url(../images/bgSubmitRight.png) top left no-repeat;
	height: 20px;
	line-height: 18px;
	width: 105px;
	border: none;
	color: #fff;
	}
#content .formdivtop {
	vertical-align: top;
	}
	
/* Jot Snippet
------------------------------------------------------------------*/


#commentsAnchor h2 { margin-bottom:8px; }
.jot-list li { padding:0 0 8px; background:none; }
.jot-list a { text-decoration:underline; }
.jot-form {margin-bottom: 10px;}
.jot-form fieldset {border: 0px;}
.jot-comment { padding:8px; }
.jot-comment hr {border: 0px; border-bottom: 1px solid #cccccc;}
.jot-user { float: left; width:140px; }
.jot-content { margin-left:140px; }
.jot-posticon { padding-top:0; }
.jot-extra { margin-top:12px; text-align: right; }
.jot-err {border: 1px solid red;font-weight: bold;color: red;padding: 5px;margin-bottom: 10px;}
.jot-cfm {border: 1px solid green;font-weight: bold;color: green;padding: 5px;margin-bottom: 10px;}
.jot-row-author {
	background-color: #ffa200;
	border: 5px solid #000000;
	}
.jot-row-me {
	background-color: #ffa200;
	border: 5px solid #ffa200;
	}
.jot-row-up {border: 1px dotted red;}
.jot-row-new {border: 1px dotted green;}
.jot-posticon {float: right;width: 20px;height: 20px;padding-top: 8px;padding-right: 3px;}
.jot-posticon img {border: 0px;}
.jot-mod {float: right;width: 100px;text-align: right;color: #666666;font-weight: bold;}
.jot-mod img {border: 0px;}
.jot-mod a {float: right;padding: 1px;padding-left: 2px;padding-right: 2px;}
.jot-mod a:hover {background-color: #666666;color: #666666;}
.jot-poster {padding: 0px;text-align: left;font-size: 10px;}
.jot-nav {padding: 0px;text-align: center;margin: 10px;}
.jot-list ul {padding: 0px;text-align: left;margin-bottom: 10px;list-style-position: inside;}
.jot-subscribe {margin-bottom: 10px;}
.jot-editby {font-size: 10px;color: #666666;font-style: italic;}
p.editnomargin {margin: 0!important}
.BlogBericht {color: #9a9c9b; padding: 10px; margin-bottom: 10px;}
.BlogBerichtUser {color: #363636;}
#commentsAnchor {margin-top: 15px;}

/* Blog */
.BlogItem {width: 100%; overflow: hidden;}
*html .BlogItem {width: 600px; background:  url(../images/bgBlogItem.gif) no-repeat right bottom;}
.BlogItem .BlogDatum {width: 60px; float: left;}
.BlogItem .BlogDatumDag {text-align: center; font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 36px; line-height: 36px; font-weight: bold; color: #FFA200;}
.BlogItem .BlogDatumMaand {text-align: center; font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #dadad7;}
.BlogItem .BlogDatumJaar {text-align: center; font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #dadad7;}
.BlogItem .BlogDatumJaar:last-letter {color: #77797a;}
.BlogItem .BlogTekst {width: 520px; float: left; padding: 0 10px 40px 10px;}
.BlogItem .BlogTekst h3 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #77797a;}
code {border: 1px solid rgb(221, 221, 221); padding: 8px; display: block; background-color: rgb(242, 242, 242); font-family: arial; font-size: 90%; line-height: 140%;}

/* News */

.NewsItem {width: 100%; overflow: hidden; }
.NewsItem .NewsDatum {
	background: url(../images/bgNewsItem.png) no-repeat left bottom;
	padding-bottom: 16px;
	}
.NewsItem .NewsDatumDag {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 36px; line-height: 36px; font-weight: bold; color: #FFA200;}
.NewsItem .NewsDatumMaand {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #dadad7;}
.NewsItem .NewsDatumJaar {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #dadad7;}
.NewsItem .NewsDatumJaar:last-letter {color: #77797a;}
.NewsItem .NewsTekst {padding: 0 10px 40px 10px;}
.NewsItem .NewsTekst h3 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #77797a;}
.NewsItem .NewsTekst h3 a {font-size: 11px;}
.NewsItemIntern{
	background: url(../images/bgNewsBottom.png) no-repeat left bottom;
	width: 570px;
	padding: 16px;
	}
.NewsItemIntern h3 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: normal; color: #424242;}
#content p.NieuwsLeesMeer{
	background: url(../images/navArrowActive.gif) no-repeat scroll left center;
	padding-left: 15px;
	margin: 10px 0 0 0;
	line-height: 100%;
	
	}
	

/* Rechterkolom */
#content .RC_ArchiveNews {
	width: 160px;
	}
#content .RC_ArchiveNews ul {
	border-bottom: 1px solid #d8d8d6;
	}
#content .RC_ArchiveNews ul li {
	border-top: 1px solid #d8d8d6;
	padding:0 15px 0px;
	background:transparent url(../images/bgListCross.gif) no-repeat 6px 5px;
	font-family: Arial, Helvetica, sans-serif;
	}
	

/* IE 6 Issues*/

*html #searchform #searchbutton {
	width:33px;
	font-size:10px;
	display:inline;
	}
*html #footer {
	display:inline;
	}
*html #searchform #keywords {
	background-attachment:fixed;
	}
*html form.jot-form input {
	width:500px;
	border: 5px solid #e5e5e3;
	background-color: #e5e5e3;
	float: left;
	}
*html .NewsItemIntern{background: url(../images/bgNewsBottom.gif) no-repeat left bottom;}
*html .BlogItem {width: 600px; background:  url(../images/bgBlogItem.gif) no-repeat right bottom;}