/**
 * Stylesheet Paul Roesher website (HOME) september 2008
 *
 * @media	screen, projection
 * @copyright	Klaver Reclame Producties, DUTCH Grafisch & Nieuwe Media
 * @author	name Ronald Bos
 */

/**
 * CMS framework Websitebaker
 * ----------------------------------------------------------
 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

body {
	color: black;
}

ol, ul {
	list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}


/**
 * = Stijl Informatie Body Element
 * ----------------------------------------------------------
 */

body {
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/background-body.jpg);
	background-repeat: repeat-x;
	background-position: center top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: auto;
}

/**
 * = Layout Header
 * ----------------------------------------------------------
 */

#header {
	float: left;
	height: 380px;
	width: 660px;
	margin-left: 50px;
	display: inline;
}

#logoContainer {
	float: left;
	height: 159px;
	width: 329px;
	margin-top: 20px;
	background-color: #FFDD00;
}
#keurmerk {
	height: 72px;
	width: 60px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/keurmerk.gif);
	background-repeat: no-repeat;
	background-position: left top;
	margin-top: 25px;
}

#logo {
	height: 50px;
	width: 311px;
	margin-left: 9px;
}

#secNavContainer {
	float: left;
	height: 159px;
	width: 329px;
	margin-top: 20px;
	margin-left: 1px;
	background-image: url(http://www.paulroescher.nl/media/Layout/Random/rotate.php);
	background-repeat: no-repeat;
	background-position: left top;
}
#secNav {
	float: right;
	height: 159px;
	width: 109px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/trans-secNav.png);
	background-repeat: no-repeat;
	background-position: right top;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFFFFF;
}

#secNav_links {
	margin-top: 20px;
	margin-left: 10px;
}

#secNav_links a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	line-height: 16px;
}

#secNav_links a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

#secNav_links a:active {
	color: #013B8F;
	text-decoration: none;
}

#PrimNavContainer {
	float: left; 
	height: 19px;
	width: 660px;
	margin-top: 1px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
	####	Header Menu #####
	#######################

	Horizontal Drop-Down Menu based off :
	http://www.tanfa.co.uk/css/examples/menu/tutorial-h.asp
	
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  */
#navContainer {width: auto;display:block;clear:both;}


/* Remove List Formattings
~~~~~~~~~~~~~~~~~~~~  */
 ul.menu, li.menu {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

#nav {
	height: 19px;
	border-top: 0;
	padding:0;
}
#nav ul {
	list-style-type: none; 
	margin: 0; 
	padding: 0; 
	font-size: 13px; 
	text-transform: uppercase;
	width: auto;
	/*
	(Disappearing List-Background)
	http://www.positioniseverything.net/explorer/ie-listbug.html
	*/
	position: relative; /* Fix the Stupid IE6 Bug */
}
#nav ul li {
	float: left;
	color: #fff;
	text-align: center;
	font-weight: normal;
	width: 110px;
}
#nav ul li a {
	display: block;
	color: #fff;
	text-decoration: none;
	background-color: #013B8F;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	height: 16px;
	padding-top: 3px;
}

/* Root Level Link Formatting */
#nav ul li a:hover, #nav li a:focus {background: #FFDD00; color: #013B8F;}
#nav li a:active, #nav ul li a.active {background: #FFDD00; color: #013B8F;}


/* end menu */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/**
 * = Layout Product Groepen Images Home
 * ----------------------------------------------------------
 */
#cat1 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/keukens.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#cat2 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/badkamers.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#cat3 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/tegels.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#cat4 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/vloeren.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#cat5 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/haarden.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#cat6 {
	float: left;
	height: 180px;
	width: 109px;
	margin-top: 1px;
	margin-left: 1px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Layout/Home/Groepen/kasten.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}

/**
 * = Layout Blending Images Container
 * ----------------------------------------------------------
 */

#ImageHeaderFade {
	position: absolute;
	z-index: -1;
	width: 300px;
	height: 360px;
	background-color: #FFFFFF;
	top: 20px;
	left: 710px;
}
.blend img {
opacity: 0;
-moz-opacity: 0;
-khtml-opacity:0;
filter: alpha(opacity=0);
}

/**
 * = Layout Sidebar (right) Elementen
 * ----------------------------------------------------------
 */

#sidebar {
	position: relative;
	width: 349px;
	float: right;
	height: auto !important;
}
#lookSidebar {
	float: left;
	width: 300px;
	height: 360px;
	margin-top: 20px;
}
#payoff {
	float: left;
	width: 300px;
	height: 65px;
	margin-top: 230px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/roescher-payoff.png);
	background-repeat: no-repeat;
	background-position: left bottom;
}
#headingBon {
	float: left;
	width: 300px;
	height: 65px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/top-bon.png);
	background-repeat: no-repeat;
	background-position: left bottom;
}
.headingTitle {
	margin-top: 25px;
	margin-left: 90px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #013B8F;
}
#aanbiedingContainer {
	float: left;
	width: 300px;
	min-height: 345px;
	background-color: #FFFFFF;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/achtergrond-bon.png);
	background-repeat: no-repeat;
	background-position: left top;
	
}

#opmaakAanbieding {
	float: left;
	width: 255px;
	margin-top: 15px;
	margin-right: 35px;
	margin-left: 27px;
}

#opmaakAanbieding a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: bold;
	color: #013B8F;
	text-decoration: none;
	line-height: 16px;
}

#opmaakAanbieding a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

#opmaakAanbieding a:active {
	color: #013B8F;
	text-decoration: none;
}

/**
 * = Layout Content (centre) Elementen
 * ----------------------------------------------------------
 */

#content {
	width: 659px;
	float: left;
	margin-left: 50px;
	height: auto !important;
	display: inline;
}
#mainContent {
	width: 420px;
	float: left;
	margin-top: 10px;
	text-align: justify;
}

#mainContent a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: bold;
	color: #013B8F;
	text-decoration: none;
	line-height: 16px;
}

#mainContent a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

#mainContent a:active {
	color: #013B8F;
	text-decoration: none;
}
.lb a:link, a:visited, a:hover {
	text-decoration: none;
}

#secContent {
	width: 219px;
	float: right;
	margin-top: 1px;
	margin-left: 10px;
	font-size: 11px;
	text-align: justify;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/achtergrond-secContent.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	min-height: 250px;
}

.contentplacement {
	width: 200px;
	margin-top: 19px;
	margin-left: 9px;
}

.contentplacement ul {
	margin-bottom: 10px;
	list-style-type: square;
	color: #013B8F;
}

.contentplacement a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	line-height: 16px;
}

.contentplacement a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

.contentplacement a:active {
	color: #013B8F;
	text-decoration: none;
}

#homeStreamer {
	float:left;
	width:420px;
	min-height: 190px;
	max-height:inherit;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/achtergrond-mededelingen.gif);
	background-repeat: no-repeat;
	background-position: left top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: italic;
	text-align: left;
}

#streamerLeft {
	width:190px;
	margin-left:10px;
	margin-top:50px;
	float:left;
	clear:right;
}
#streamerRight {
	width:190px;
	margin-right:10px;
	margin-top:50px;
	float:right;
}

.contentplacement a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

.contentplacement a:active {
	color: #013B8F;
	text-decoration: none;
}

#button{
	width: inherit;
}

#button a, a:link, a:hover, a:active, a:visited {
	border: none;
	text-decoration:none;
}

#combiPage {
	width:420px;
	height:inherit;
	background-image:url(http://www.paulroescher.nl/media/Templates/Algemeen/bon-pagina.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}


/**
 * = Layout Footer Elementen
 * ----------------------------------------------------------
 */

#footer {
	background: #FFFFFF;
}
#CatContainer {
	float: left;
	width: 659px;
	display: inline;
}

#footerCat1 {
	float: left;
	height: 25px;
	width: 219px;
	background-color: #013B8F;
}
#CatTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
}
#footerCat2 {
	float: left;
	height: 25px;
	width: 219px;
	background-color: #013B8F;
	margin-left: 1px;
}
#CatTitle2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
}
#footerCat3 {
	float: left;
	height: 25px;
	width: 219px;
	background-color: #013B8F;
	margin-left: 1px;
}
#CatTitle3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
}

#footerSubCat1 {
	float: left;
	height: 114px;
	width: 219px;
	margin-top: 1px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/achtergrond-FooterSubCat.jpg);
	background-repeat: repeat-x;
	background-position: left bottom;
}
.CatTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #FFFFFF;
	margin-top: 3px;
	margin-left: 20px;
}
.CatTitle2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #FFFFFF;
	margin-top: 3px;
	margin-left: 20px;
}
.CatTitle3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #FFFFFF;
	margin-top: 3px;
	margin-left: 20px;
}
#footerSubCat2 {
	float: left;
	height: 114px;
	width: 219px;
	margin-top: 1px;
	margin-left: 1px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/achtergrond-FooterSubCat.jpg);
	background-repeat: repeat-x;
	background-position: left bottom;
}
#footerSubCat3 {
	float: left;
	height: 114px;
	width: 144px;
	margin-top: 1px;
	margin-left: 1px;
	padding-left: 75px;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/background-cat3Man.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
}
.CatContent {
	margin-top: 8px;
	margin-left: 20px;
}
.CatContent a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	line-height: 16px;
}

.CatContent a:hover {
	color: #013B8F;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #013B8F;
}

.CatContent a:active {
	color: #013B8F;
	text-decoration: none;
}

/**
 * = Sticky footer
 * ----------------------------------------------------------
 */

html, body {
	height: 100%;
}

#container {
	width: 1060px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -140px auto;
	position: relative;
	background-image: url(http://www.paulroescher.nl/media/Templates/Algemeen/background-page.png);
	background-repeat: no-repeat;
	background-position: center top;
}

#footer {
	height: 140px;
	margin: 0 auto;
	width: 960px;
	position: relative;
}

#push {
	height: 140px;
}

/**
 * = Clearfix
 * ----------------------------------------------------------
 * @see http://www.positioniseverything.net/easyclearing.html
 * @see http://www.456bereastreet.com/archive/200603/new_clearing_method_needed_for_ie7/
 * @see http://www.stuffandnonsense.co.uk/archives/clearing_floats_without_structural_markup_in_ie7.html
 */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}