/* CSS Document */
/* ############### tales.be css framework v0.5 (by kvd) ###############  */
/* ############### b.01.grids.custom.css ############### */



/* ############### BASIC BUILDING BLOCKS ADDONS ############### */
#outerwrapper{	width: 958px; padding-top: 22px;}
	#IE8 #outerwrapper{	padding-top: 23px;}
	@media screen and (-webkit-min-device-pixel-ratio:0){ /* targetting safari, chrome and other webkit-browsers */
		#outerwrapper{	padding-top: 24px;}
	}	
.splash #outerwrapper{
	padding-top: 51px;
	}	
		.splash #IE8 #outerwrapper{
			/* don't ask:
			IE8 can not address the padding unless the full path is given
			changing background-color however is no problem...
			so: .splash #outerwrapper does not work, .splash #IE8 #outerwrapper will work
			*/
			padding-top: 51px;
			}	
#pagewrapper{
	width: 958px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	overflow: visible;
}

	



#topblock{
	overflow: visible;
}

#header{
	overflow: hidden;
}
#header .col1{
	
	background-image: url(../gfx/basics/background.wrapper.top.gif);
	background-repeat: repeat-x;
	background-position: top;
}
.splash #header .col2{
	border-top: 1px solid #fff;
}
#topnav{
	/*height: 48px; */
	overflow: visible;
	text-align: right;
	
	background-image: url(../gfx/basics/background.wrapper.top.gif);
	background-repeat: repeat-x;
	background-position: top;
	/* relative positioning: pull #topnav up or down, to the left or right, it will layer itself above the header */
	/*position: relative;
	left: 257px;
	top: -38px;*/
}

#contentsection{
 }
 
 #IE6 #contentsection{
 	background-image: none;
	/* geen png backgrounds in IE6 : links werken niet meer... */
 }
 
#footer{
	overflow: hidden;
	padding-top: 20px;
}

#madeby{
	overflow: hidden;
}



/* minimum height system */
/*
First rule is mozilla + IE7
Second rule is IE6 

.oneCol#header .col1 {min-height: 200px;}
*html* .oneCol#header .col1 {height: 200px;}

*/

.threeCols#contentsection{
}

/* ############### 1 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.oneCol#header .col1{	height: 150px;	}
.oneCol#contentsection .col1{	}

/* ############### 2 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.twoCols#header .col1{	height: 55px;	width: 200px;}
.twoCols#header .col2{	/*height: 150px;*/	width: 758px;}

.twoCols#contentsection .col1{	width: 190px;  }
.twoCols#contentsection .col2{	width: 748px; padding: 10px 20px 20px 0; }


.splash .twoCols#contentsection .col2{	width: 741px; padding: 10px 20px 20px 7px; }

/* ############### 3 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.threeCols#header .col1{	height: 150px;	width: 200px;}
.threeCols#header .col2{	height: 150px;	width: 560px;}
.threeCols#header .col3{	height: 150px;	width: 200px;}

.threeCols#contentsection .col1{	width: 200px;}
.threeCols#contentsection .col2{	width: 558px;}
.threeCols#contentsection .col3{	width: 200px;}


/* ############### 4 COLUMN LAYOUT ADDONS ############### */
.fourCols#header .col1{	height: 150px;	width: 240px;}
.fourCols#header .col2{	height: 150px;	width: 240px;}
.fourCols#header .col3{	height: 150px;	width: 240px;}
.fourCols#header .col4{	height: 150px;	width: 240px;}

.fourCols#contentsection .col1{	width: 240px;}
.fourCols#contentsection .col2{	width: 240px;}
.fourCols#contentsection .col3{	width: 240px;}
.fourCols#contentsection .col4{	width: 240px;}

/* ############### 5 COLUMN LAYOUT ADDONS ############### */
.fiveCols#header .col1{	height: 150px;	width: 192px;}
.fiveCols#header .col2{	height: 150px;	width: 192px;}
.fiveCols#header .col3{	height: 150px;	width: 192px;}
.fiveCols#header .col4{	height: 150px;	width: 192px;}
.fiveCols#header .col5{	height: 150px;	width: 192px;}

.fiveCols#contentsection .col1{	width: 192px;}
.fiveCols#contentsection .col2{	width: 192px;}
.fiveCols#contentsection .col3{	width: 192px;}
.fiveCols#contentsection .col4{	width: 192px;}
.fiveCols#contentsection .col5{	width: 192px;}

/* ############### 6 COLUMN LAYOUT ADDONS ############### */
.sixCols#header .col1{	height: 150px;	width: 160px;}
.sixCols#header .col2{	height: 150px;	width: 160px;}
.sixCols#header .col3{	height: 150px;	width: 160px;}
.sixCols#header .col4{	height: 150px;	width: 160px;}
.sixCols#header .col5{	height: 150px;	width: 160px;}
.sixCols#header .col6{	height: 150px;	width: 160px;}

.sixCols#contentsection .col1{	width: 160px;}
.sixCols#contentsection .col2{	width: 160px;}
.sixCols#contentsection .col3{	width: 160px;}
.sixCols#contentsection .col4{	width: 160px;}
.sixCols#contentsection .col5{	width: 160px;}
.sixCols#contentsection .col6{	width: 160px;}



/* ############### ADDITIONAL GRIDS OR SUBGRIDS ############### */