/*-----------------------------------------------------------------*/
/* [booksforsingles.nl]

/* [Table of contents]

1. 	Main
2. 	Body
3.		Container #Container
4. 	Content #Content
5.		Footer #Footer
6. 	Nav #Nav
7.		NavTop #NavTop
8.		ColumnRight #ColumnRight
9.		Footer #Footer
	
/*-----------------------------------------------------------------*/
/* [1. Main] */

* { margin:0; padding:0; }
a { color: #990000; outline: none; text-decoration: none; }
a:hover{ color: #990000; text-decoration: underline; }
ul, li{ list-style: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}

/*-----------------------------------------------------------------*/
/* [2. Body] */

body{
	background: #EEEEEE url(../images/layout/bg_body.jpg) repeat-x;
	color: #333333;
	font: 62.5% Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align: center;
}

/*-----------------------------------------------------------------*/
/* [3. Content] */
#Container{
	display: block;
	position: relative;
	margin: 0px auto 0px auto;
	width: 990px;
	text-align: left;
	background: White;
}

#Container h1#Logo a{
	position: absolute;
	top: 0px;
	left: -3px;
	display: block;
	width: 744px;
	height: 143px;
	background: transparent url(../images/layout/bg_logo.png) no-repeat;
	line-height: 1000px;
	overflow: hidden;
	z-index: 1000;
}

/*-----------------------------------------------------------------*/
/* [4. Content] */
#Content{
	float: left;
	margin: 0px 0px 0px 215px;
	padding: 180px 0px 0px 0px;
	width: 526px;
	background: White;
}

#Content h1{
	margin: 0px 0px 10px 10px;
	color: #333333;
	font: bold 1em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#Content h2{
	display: block;
	margin: 0px 0px 10px 0px;
	padding: 10px 0px 0px 10px;
	color: #333333;
	font: bold 1em Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: transparent url(../images/layout/bg_border.gif) repeat-x;
	clear: both;
}

#Content p{
	margin: 0px 0px 10px 10px;
	color: #333333;
	font: 1em/1.75em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#Content table{
	margin: 0px 0px 10px 10px;
	color: #333333;
	font: 1em/1.75em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#Content td{
	vertical-align: top;
	padding-right: 25px;
}

#Content ul{ 
	margin: 20px 0px 10px 10px;
	clear: both;
}

#Content ul li{
	display: block;
	padding: 0px 0px 0px 10px;
	color: #333333;
	font: 1em/1.75em Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: White url(../images/layout/bg_li.gif) no-repeat 0px 8px;
}

#Content ul li.margin{
	padding: 0px 0px 0px 22px;
	background: White url(../images/layout/bg_li.gif) no-repeat 10px 8px;
}

#Content .prodleft{
	position: relative;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 110px 10px 0px 10px;
	width: 155px; /* 175-10-10 */
	height: 165px; /* 275-110 */
	background: White url(../images/layout/bg_prodleft.gif) no-repeat;
}

#Content .prodcenter{
	position: relative;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 110px 10px 0px 10px;
	width: 156px; /* 176-10-10 */
	height: 165px; /* 275-110 */
	background: White url(../images/layout/bg_prodcenter.gif) no-repeat;
}

#Content .prodright{
	position: relative;
	float: left;
	margin: 0px 0px 5px 0px;
	padding: 110px 10px 0px 10px;
	width: 155px; /* 175-10-10 */
	height: 165px; /* 275-110 */
	background: White url(../images/layout/bg_prodright.gif) no-repeat;
}

#Content .prodleft p, #Content .prodcenter p, #Content .prodright p{
	margin: 0px 0px 10px 0px;
	color: #333333;
	font: 1em/1.75em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#Content .prodleft a.cover img, #Content .prodcenter a.cover img, #Content .prodright a.cover img{
	display: block;
	position: absolute;
	top: 10px;
	left: 10px;
	border: none;
}

#Content .prodleft img.soort, #Content .prodcenter img.soort, #Content .prodright img.soort{
	display: block;
	position: absolute;
	top: 10px;
	right: 10px;
}

#Content .prodleft ul, #Content .prodcenter ul, #Content .prodright ul{
	position: absolute;
	top: 231px;
	left: 0px;
	margin: 0px 0px 0px 10px;
	width: 100px;
	height: 43px;
}

#Content .floatleft img{
	float: left;
	margin: 5px 15px 5px 10px;
	border: none;
}

#Content hr{
	clear: both;
}

#Content #Pages{
	clear: both;
	padding: 15px 0px 10px 0px;
	width: 526px; /* 536-10 */
	height: 20px; /* 35-15 */
	color: #333333;
	font: 1em Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: transparent url(../images/layout/bg_border.gif) repeat-x;
}

/*-----------------------------------------------------------------*/
/* [6. Nav #Nav] */

/*
#Nav{
	position: absolute;
	left: 5px;
	top: 135px;
	width: 200px;
}
*/

#Nav{
	float: left;
	margin: 135px 0px 50px -736px; /* 210 + 526 */
	width: 200px;
}

#Nav ul{
	margin: 0px 0px 10px 0px;
	padding: 20px 10px 20px 10px;
	width: 178px; /* 220-10-10-1-1 */
	border: 1px solid #D3D3D3;
}

#Nav ul li a{
	display: block;
	padding: 0px 0px 0px 10px;
	width: 168px; /* 178-10 */
	height: 25px;
	color: #333333;
	font: 10px/25px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: White url(../images/layout/bg_li_nav.gif) no-repeat;
}

#Nav ul li a.active{ text-decoration: none; font-weight: bold; color: #990000; }

#Nav ul li a.catsub{
	display: block;
	padding-left: 20px;
	width: 158px; /* 178-20 */
	height: 25px;
	color: #333333;
	font: 10px/25px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: White url(../images/layout/bg_li_navsub.gif) no-repeat;
}

#Nav ul li a.catsubactive{
	display: block;
	padding-left: 20px;
	width: 158px; /* 178-20 */
	height: 25px;
	color: #990000;
	font: bold 10px/25px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: White url(../images/layout/bg_li_navsub.gif) no-repeat;
}

#Nav ul li a.noborder{
	display: block;
	padding: 0px 0px 0px 10px;
	width: 168px; /* 178-10 */
	height: 25px;
	color: #333333;
	font: 10px/25px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: White url(../images/layout/bg_li.gif) no-repeat 0px 12px;
}

#Nav ul li a:hover{ color: #990000; text-decoration: none; }

/*-----------------------------------------------------------------*/
/* [7. NavTop #NavTop] */

#Container #NavTop{
	position: absolute;
	top: 135px;
	left: 215px;
	padding: 0px 0px 0px 10px;
	width: 516px; /* 526-10 */
	height: 35px;
	background: White url(../images/layout/bg_navtop.gif) repeat;
	font: 10px/35px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
}

#NavTop a{
	font: 10px/35px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
}

/*-----------------------------------------------------------------*/
/* [8. ColumnRight #ColumnRight] */

#Container #ColumnRight{
	float: left;
	margin: 135px 0px 50px 10px;
	width: 234px;
	background: White;
}

#ColumnRight .banner{ margin: 0px 0px 20px 0px; }

#ColumnRight #SearchBox{
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 0px 31px;
	width: 201px; /* 234-31-1-1 */
}

#SearchBox.default{ background: #3366CC url(../images/layout/bg_search_default.jpg); }
#SearchBox.dvd{ background: #006599 url(../images/layout/bg_search_dvd.jpg); }
#SearchBox.elektronica{ background: #660000 url(../images/layout/bg_search_elektronica.jpg); }
#SearchBox.muziek{ background: #FF9933 url(../images/layout/bg_search_muziek.jpg); }

#ColumnRight h1#TopList{
	display: block;
	margin: 0px;
	padding: 15px 10px 0px 10px;
	width: 212px; /* 234-10-10-1-1 */
	height: 25px; /* 40-15 */
	background: #F8F8F8;
	border: 1px solid #D3D3D3;
	border-width: 1px 1px 0px 1px;
	color: #333333;
	font: bold 1em Verdana, Geneva, Arial, Helvetica, sans-serif;
	overflow: hidden;
}

#ColumnRight ul#TopList{
	margin: 0px 0px 20px 0px;
	padding: 0px 10px 0px 10px;
	width: 212px; /* 234-10-10-1-1 */
	border: 1px solid #D3D3D3;
	background: White url(../images/layout/bg_toplist.gif) no-repeat;
}

#TopList li{
	position: relative;
	display: block;
	padding: 5px 0px 0px 30px;
	width: 182px; /* 212-30 */
	height: 35px; /* 40-5 */
}

#TopList li a.cover img{
	display: block;
	position: absolute;
	top: 5px;
	left: 0px;
	border: none;
}

#TopList li a{ color: #333333; }

#ColumnRight .block {
	display: block;
	width: 232px;
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 0px 0px;
	border: 1px solid #D3D3D3;
	background: White;
}

#ColumnRight .block h1{
	margin: 0px 0px 0px 0px;
	padding: 5px 5px 5px 5px;
	font: bold 10px/16px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
	border-bottom: 1px solid #D3D3D3;
	background: #F8F8F8;
}

#ColumnRight .block p{
	margin: 7px 10px 10px 10px;
	font: 10px/16px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
}

#ColumnRight .block ul{
	margin: 0px 0px 10px 10px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	list-style-type: none;
}

#ColumnRight .block ul li{
	padding: 0px 0px 0px 12px;
	font: 10px/16px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
	background: url(../images/layout/bg_li.gif) no-repeat 0px 55%;
}

#ColumnRight .block .colimg{
	margin: 10px 10px 5px 10px;
	width: 70px;
	border: 1px solid Black;
	float: left;
}

/*-----------------------------------------------------------------*/
/* [9. Footer #Footer] */

#Container #Footer{
	position: relative;
	margin: 0px 5px 20px 5px;
	padding: 10px 0px 15px 215px;
	color: #9F9E99;
	font: 0.9em Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: transparent url(../images/layout/bg_border.gif) repeat-x;
	clear: both;
	height: 50px;
}

#Footer a{
	color: #9F9E99;
	text-decoration: none;
}

#Footer a:hover{ color: #C53338; text-decoration: underline; }

#Footer h1#Logo a{
	position: absolute;
	top: 10px;
	left: 10px;
	display: block;
	width: 104px;
	height: 60px;
	background: transparent url(../images/layout/bg_logo_footer.gif) no-repeat;
	line-height: 1000px;
	overflow: hidden;
	z-index: 1000;
}

#Footer #Logo_bolcom{
	position: absolute;
	top: 10px;
	right: 0px;
	width: 120px;
	height: 43px;
}
