/* CSS Document */
/* ############### tales.be css framework v0.1 (by kvd) ###############  */


/* ############### SITESPECIFIC CSS - KVD ############### */
/* ############### SITEWIDE RULES - SITESPECIFIC ############### */
html, body{	background-color: #5e9ab5; background-image: url(../gfx/basics/page.back.gif);}



/* ############### BASIC BUILDING BLOCKS ADDONS ############### */
#pagewrapper{
	width: 940px;
	background-image: url(../gfx/basics/back.overlay.jpg);
	background-repeat: no-repeat;
	margin-left: 0px; /* for lefthanded layout instead of centered*/
	/* margin-top: XXpx; */ /* offset from pagetop */
}

#header{ height: 111px;}
#content{
	background-image: url(../gfx/basics/content.back.png) !important;
	background-image: url(../gfx/basics/content.back.gif); /* IE6 */
	background-repeat: repeat-y;
	margin-top: -1px; /* fix offset from #topnav */
	}
#footer{ 
	background-image: url(../gfx/basics/bottom.back.png) !important;
	background-image: url(../gfx/basics/bottom.back.gif); /* IE6 */
	background-repeat: no-repeat;
	height: 50px;
}

#topnav{
	background-color: #007dc6;
	background-image: url(../gfx/basics/topnav.back.gif);
	background-repeat: repeat-y;
	/* relative positioning: pull #topnav up or down, to the left or right, it will layer itself above the header */
	position: relative;
	left: 245px;
	top: -1px;
	width: 695px;
	height: 24px; 
	overflow: hidden;
	text-align: right;
}

#crumbpath{
	display: none;
}


/* ############### 2 COLUMN LAYOUT ADDONS: dimensions, colors, backgrounds ############### */
.col1{	}
.col2{	/*width: 695px;*/ /* = pagewrapper.width - col1.width */}

.twoCols#header .col1{
	color: #fff;
	height: 110px;
	width: 245px;}
.twoCols#header .col2{
	color: #305667;
	background-color: #b7d6e4;
	background-image: url(../gfx/basics/back.top.gif);
	background-repeat: no-repeat;
	height: 110px;
	width: 695px;}

.twoCols#content .col1{
	width: 245px;}
.twoCols#content .col2{
	padding: 40px 0 0 20px;
	width: 655px;
	}

/* minimum height for sidenav and text-block */
/* remember: when working with backgroundcolors or borders, 
you'll need to set a repeating background on 
.twoCols#content, since col1 doesn't know how
long col2 becomes (and vice-versa)
 !!!!!
*/
.twoCols#content .col1 {min-height: 200px;} /* mozilla + IE7 */
*html* .twoCols#content .col1 {height: 200px;} /* IE6 */

.twoCols#content .col2 {min-height: 200px;} /* mozilla + IE7 */
*html* .twoCols#content .col2 {height: 200px;} /* IE6 */






/* ############### HEADER ADDONS ############### */
.twoCols#header .col1{ }
.twoCols#header .col2{ padding: 20px 20px 0 0; text-align: right; width: 675px; height: 90px;}
.twoCols#header .col2 p{ color: #1d4b7d; line-height: 150%}
.twoCols#header .col2 p a:link, twoCols#header .col2 p a:visited{ color: #1d4b7d; text-decoration: none;}
.twoCols#header .col2 p a:hover, twoCols#header .col2 p a:active{ color: red}

.twoCols#header .col1 a{
	display: block;
}