@import url("shadowbox.css");

/* css knipper bug oplossing */
html { 
	filter: expression(document.execCommand("BackgroundImageCache", false, true)); 
}

body	{
	background			: #ffffff url(../img/bg_body.gif) no-repeat left 123px;
	margin				: 0;
	padding				: 0;
	font				: 0.8em Arial;
}

.toegankelijkheid	{
	display				: none;
}

.clear	{
	height				: 1px;
	line-height			: 1px;
	clear				: both;
}

a	{
	color				: #48b1c7;
}

a:hover	{
	text-decoration		: none;
}

/* --------------------------------	*/
/* container					 	*/
/* --------------------------------	*/
#container	{
	position			: relative;
	margin				: 0;
	width				: 994px;
	text-align			: left;
	overflow			: hidden; /*avoid horscroll*/
}


/* --------------------------------	*/
/* header						 	*/
/* --------------------------------	*/
#header	{
	position			: relative;
	height				: 100px;
}

#header h1	{
	margin				: 0;
	position			: relative;
	top					: 56px;
	left				: 29px;
}

#header h1 a	{
	text-indent			: -9000px;
	overflow			: hidden;
	display				: block;
	height				: 80px;
	width				: 296px;
	background			: url(../img/logo.jpg) no-repeat;
}

#header a.de    {
    background          : url(../img/deutschland.gif) no-repeat 0 0;
    width               : 35px;
    height              : 22px;
    text-indent         : -900em;
    overflow            : hidden;
    display             : block;
    position            : absolute;
    right				: 27px;
    top                 : 10px;
}


/* --------------------------------	*/
/* main					 			*/
/* --------------------------------	*/
#main	{
	min-height			: 510px;
}


/* --------------------------------	*/
/* main menu					 	*/
/* --------------------------------	*/
#main_menu	{
	position			: absolute;
	top					: 10px;
	left				: 337px;
	z-index				: 1 !important;
}

#main_menu ul	{
	margin				: 0;
	padding				: 0;
	list-style			: none;
}

#main_menu li	{
	float				: left;
}

#main_menu	a	{
	display				: block;
	width				: 145px;
	height				: 508px;
	overflow			: hidden;
	text-indent			: -999em;
	background-position	: center top;
	background-repeat	: no-repeat;	
}

#main_menu a.wonen			{	background-image	: url(../img/btn_wonen.jpg);	}
#main_menu a.slapen			{	background-image	: url(../img/btn_slapen.jpg);	}
#main_menu a.keukens		{	background-image	: url(../img/btn_keukens.jpg);	}
#main_menu a.budget-wonen	{	width: 146px; background-image	: url(../img/btn_budget_wonen.jpg);	}
#main_menu a.cadeaushop		{	background-image	: url(../img/btn_cadeaushop.jpg);	}



/* --------------------------------	*/
/* left menu					 	*/
/* --------------------------------	*/
#menu	{
	margin				: 0;
	padding				: 0;
	list-style			: none;
	position			: absolute;
	top					: 190px;
	left				: 25px; 
	width				: 120px;
	z-index				: 100;
}

#menu li	{
	list-style			: url(../img/arrow_menu.gif);
	margin				: 0 0 0 20px;	
	position			: relative;
	width				: 110px;
}

#menu a	{
	display				: block;
	width				: 110px;
	text-transform		: uppercase;
	font-weight			: bold;
	color				: black;
	text-decoration		: none;
	font-size			: 0.95em;
	padding				: 3px 0;
	position			: relative;
	background-color	: #F9E600;
}

#menu a:hover	{
	text-decoration		: underline;
}

/* --------------------------------	*/
/* left menu sub				 	*/
/* --------------------------------	*/
#menu ul	{	
	display				: block;
	width				: 172px;
	position			: absolute;
	top					: 0;	
	left				: -999em;	
	z-index				: 1337;
	background			: #A7E0EB;
	
	margin				: 0;
	padding				: 0;
	
	border-top			: solid 1px black;
	border-bottom		: solid 1px black;
}

#menu li li	{
	margin				: 0 0 0 20px;
	padding				: 0;
}

#menu li:hover ul, #menu li.sfhover ul	{
	left				: 110px;
}

#menu li ul	{
	padding				: 0 0 0 10px;
	z-index				: 20000 !important;
}

#menu li ul a	{
	width				: auto;
	background-color	: transparent;
	text-transform		: none;
}


/* --------------------------------	*/
/* content						 	*/
/* --------------------------------	*/
#content input, #content select, #content textarea	{
	border				: solid 1px #A7DFEB;
	font				: 1em Arial;
}

#content input.radio, #content input.checkbox 	{
	border				: none;
}

#content input.button, .button 	{
	cursor				: pointer;
	background			: #A7DFEB;
	color				: #000;
	font-weight			: bold;
	border				: none;
}

/* --------------------------------	*/
/* banner klantenkaart				*/
/* --------------------------------	*/
#klantenkaart	{
	position			: relative;
	top					: 300px;
	left				: 45px;
	z-index				: 10;
	width				: 129px;
	height				: 99px;
}

#klantenkaart a	{
	display				: block;
	width				: 146px;
	height				: 99px;
	overflow			: hidden;
	text-indent			: -999em;
	background			: white url(../img/klantenkaart.jpg) no-repeat left top;
}


/* --------------------------------	*/
/* banner flatscreens			 	*/
/* --------------------------------	*/
#flatscreens	{
	position			: relative;
	top					: 198px;
	left				: 190px;
	z-index				: 10;
	width				: 129px;
	height				: 115px;
}

#flatscreens a	{
	display				: block;
	width				: 129px;
	height				: 115px;
	overflow			: hidden;
	text-indent			: -999em;
	background			: white url(../img/flatscreens.gif) no-repeat left top;
}

/* --------------------------------	*/
/* banner						 	*/
/* --------------------------------	*/
#banner	{
	position			: relative;
	top					: 420px;
	left				: 337px;
}

#banner a	{
	display				: block;
	width				: 580px;
	height				: 48px;
	overflow			: hidden;
	text-indent			: -999em;
	background			: white url(../img/banner_wooncheque.gif) no-repeat left top;
}

#banner a:hover	{
	background-position	: left bottom;
}

/* zijbalk */
#home_zijbalk {
    padding-top         : 300px;
    width               : 325px;
}

/* uitgelicht */
#home_zijbalk .uitgelicht {
    display             : block;
    padding             : 6px 2px 6px 25px;
    margin-bottom       : 20px;
    border              : 1px solid #000;
    border-left         : none;
    font-weight         : bold;
    text-decoration     : none;
    color               : #000;
    background          : #A7DFEB url("../img/arrow_menu.gif") no-repeat 10px 8px;
}

#home_zijbalk .uitgelicht:hover {
    background-color	: #F9E600;
}

/* intro */
#home_zijbalk .intro {
    margin-bottom       : 20px;
    padding-left        : 25px;
}

/* nieuwsbrief_home */
#home_zijbalk .nieuwsbrief {
    margin-bottom       : 20px;
    padding-left        : 15px;
	position			: relative;
}

#home_zijbalk .nieuwsbrief h2    {
    margin              : 0 0 0 10px;
    font-weight         : bold;
    font-size           : 12px;
}

#home_zijbalk .email-info {
	position			: absolute;
	display				: block;
	top					: 41px;
	left				: 27px;
	font-size			: 12px;
	width				: 116px;
	padding				: 0 0 0 2px;
	color				: #666666;
}

html* #home_zijbalk .email-info  {
	top					: 48px;	
	left				: 29px;
}


/* folders */
#home_folders {
    position            : absolute;
    top                 : 511px;
    right               : 10px;
}

#home_folders a {
    display             : block;
    text-indent         : 0;
	padding				: 62px 0 0 85px;
    overflow            : hidden;
	text-transform		: uppercase;
	text-decoration		: none;
	color				: #000;
	font-weight			: bold;
    overflow            : hidden;
	font-size			: 14px;
	text-shadow			: #7e7940 1px 1px 1px;
    width               : 205px;	
    height              : 42px;
    background          : url(../img/folders.jpg) no-repeat 0 0;
}

/* aanmelden button*/
#home_aanmelden {
    position            : absolute;
    top                 : 505px;
    right               : 350px;
}

#home_aanmelden a {
    display             : block;
	padding				: 66px 0 0 80px;
	text-transform		: uppercase;
	text-decoration		: none;
	color				: #000;
	font-weight			: bold;
    overflow            : hidden;
	font-size			: 1.1em;
	text-shadow			: #7e7940 1px 1px 1px;
    width               : 235px;
    height              : 42px;
    background          : url(../img/button-aanmelden.png) no-repeat -10px 0;
}

/* klantenkaart button*/
#home_klantenkaart {
    position            : absolute;
    top                 : 511px;
    right               : 350px;
}

#home_klantenkaart a {
    display             : block;
    text-indent         : 0;
	padding				: 61px 0 0 81px;
    overflow            : hidden;
	text-transform		: uppercase;
	text-decoration		: none;
	color				: #000;
	font-weight			: bold;
    overflow            : hidden;
	font-size			: 14px;
	text-shadow			: #7e7940 1px 1px 1px;
    width               : 137px;
    height              : 25px;
    background          : url(../img/button-klantenkaart.png) no-repeat left top;
}

#home_klantenkaart a:hover {
	background-position: left -110px;	
}




/* --------------------------------	*/
/* producten database       		*/
/* --------------------------------	*/
#producten	{
	background          : url(../img/iwes/sfeer_wonen.gif) no-repeat left top;
	padding				: 0 0 0 150px;
	min-height			: 450px;
	_height				: 450px;
	border-top			: solid 1px black;
}

#producten h1 {
	padding-left		: 15px;
	font-weight			: normal;
	font-size			: 2.5em;
	margin				: 15px 0 0 0;
	line-height			: 1.5em;
}

#producten h2  {
	background			: black;
	color				: white;
	font-size			: 1.1em;
	line-height			: 1.5em;
	margin				: 0;
	padding-left		: 15px;
}

#producten select.jumpmenu {
    float               : right;
    width               : 150px;
    margin              : 2px 20px;
    font				: 11px Arial;
    border              : none;
}

#producten .intro {
    padding		        : 15px;
    line-height         : 1.6em;
}


/* --------------------------------	*/
/* producten - categorie       		*/
/* --------------------------------	*/
#producten .subcategorieen {
    overflow            : hidden;
    width               : 812px;
}

#producten .subcategorieen ul {
    margin              : 0 15px;
    padding             : 0;
    list-style          : none;
    width               : 820px;
    width               : 820px;
}

#producten .subcategorieen li {
    float               : left;
    width               : 270px;
    height              : 200px;
    border-bottom       : solid 1px #E5E5E5;
    border-right        : solid 1px #E5E5E5;
    position            : relative;
    text-align          : center;
}

#producten .subcategorieen li a.titel {
    position            : absolute;
    bottom              : 20px;
    right               : 20px;
    display             : block;
    padding             : 0 20px 0 10px;
    height              : 25px;
    line-height         : 25px;
    background          : url(../img/producten/categorie.gif) no-repeat right top;
    color               : #000;
    font-weight         : bold;
    text-decoration     : none;
    border-left         : solid 1px #828282;
}

#producten .subcategorieen li.hover {
    background          : #f9f9f9;
}

#producten .subcategorieen li.hover a,
#producten .subcategorieen li a:hover {
    background-position : right bottom;
}


/* --------------------------------	*/
/* producten - producten       		*/
/* --------------------------------	*/
#producten .producten {
    overflow            : hidden;
    width               : 812px;
}

#producten .producten ul {
    margin              : 0 15px;
    padding             : 0;
    list-style          : none;
    width               : 820px;
    width               : 820px;
}

#producten .producten li {
    float               : left;
    width               : 270px;
    height              : 220px;
    border-bottom       : solid 1px #E5E5E5;
    border-right        : solid 1px #E5E5E5;
    position            : relative;
    text-align          : center;
}

#producten .producten li.hover {
    background          : #f9f9f9;
}

#producten .producten li a {
    color               : #000;
}

#producten .producten li .info  {
    position            : absolute;
    top                 : 160px;
    left                : 20px;
    width               : 230px;
    font-size           : 11px;
    text-align          : left;
}

#producten .producten li .info h3,
#producten .producten li .info p {
    font-size           : 11px;
    margin              : 0;
}

#producten .producten li .prijs  {
    position            : absolute;
    top                 : 120px;
    right               : 20px;
    text-align          : right;
}

#producten .producten li .prijs ins,
#producten .producten li .prijs del,
#producten .producten li .prijs span    {
    background          : #F9E600;
    color               : #000;
    font-weight         : bold;
    font-size           : 1.2em;
    text-decoration     : none;
    padding             : 3px 5px;
    display             : inline-block;
}

#producten .producten li .prijs del    {
    background          : #f5f5f5;
    color               : #666;
    font-weight         : normal;
    font-size           : .8em;
    text-decoration     : line-through;
    display             : inline-block;
}

#producten .producten li.hover .prijs del {
    background          : #e5e5e5;
}

/* --------------------------------	*/
/* producten - detail pagina     	*/
/* --------------------------------	*/
/* op product detail pagina is het een kleiner overzichtje */
#product .producten {
    width               : 843px;
}

#product .producten ul {
    width               : 9999px;
    height              : 145px;
    margin              : 0;
    padding             : 0;
    list-style          : none;
}

#product .producten li {
    width               : 150px;
    height              : 145px;
    border-bottom       : none;
}

#product .producten li.actief {
    background          : #e5e5e5;
}

#product .producten li .prijs {
    top                 : 75px;
    right               : 10px;
}

#product .producten li .prijs ins,
#product .producten li .prijs span  {
    font-size           : .9em;
}

#product .producten li .info {
    top                 : 114px;
    left                : 10px;
    width               : 130px;
    text-align          : center;
}

#product .producten li .info a {
    font-weight         : bold;
    text-decoration     : none;
}

/* scrollbalk */
#product .jspScrollable {
    border              : solid 1px #000;
    border-left         : none;
}

#product .jspHorizontalBar {
    height              : 19px;
}

#product .jspHorizontalBar .jspTrack {
    height              : 17px;
    padding             : 1px 0;
    background          : #A7DFEB;
}

#product .jspHorizontalBar .jspDrag {
    cursor              : pointer;
    height              : 17px;
    width               : 100px;
    background          : url(../img/producten/scrollbar.gif) no-repeat left top;
}

#product .jspHorizontalBar .jspDrag .jspDragRight {
    height              : 17px;
    width               : 50%;
    float               : right;
    background          : url(../img/producten/scrollbar.gif) no-repeat right top;
}


/* product info */
#product .product   {
    background          : #fff;
}

#product .product .algemeen  {
    padding             : 15px;
    float               : left;
    width               : 530px;
}

#product .product .algemeen h3   {
    font-size           : 1.4em;
    margin              : 0 0 15px 0;
}

#product .product .algemeen p {
    line-height         : 1.6em;
}

#product .product .info  {
    padding             : 15px;
    float               : right;
    width               : 250px;
}

#product .product .info .artikelnummer  {
    width               : 140px;
    text-align          : right;
    color               : #999;
    margin              : 0 0 6px 0;
    font-size           : .85em;
}

#product .product .info .prijs {
    padding             : 10px;
    margin              : 0 0 16px 0;
    background          : #F9E600;
    text-align          : right;
    float               : left;
    white-space         : nowrap;
}

#product .product .info .prijs del  {
    text-decoration     : none;
}

#product .product .info .prijs span,
#product .product .info .prijs ins  {
    font-size           : 2.2em;
    text-decoration     : none;
}

#product .product .info .specs  {
    clear               : left;
    font-size           : .85em;
}

#product .product .info .specs h4   {
    font-size           : 1.2em;
    margin              : 0 0 5px 0;
}

/* fotos */
#product .fotos {
    padding             : 15px;
    float               : left;
    width               : 530px;
}

#product .fotos ul.thumbs {
    margin              : 0;
    padding             : 0;
    list-style          : none;
    float               : left;
    width               : 90px;
}

#product .fotos ul.thumbs li {
    margin              : 0 0 6px 0;
}

#product .fotos ul.thumbs img {
    border              : solid 3px #e5e5e5;
}

#product .fotos .vergroting {
    overflow            : hidden;
    border              : solid 3px #e5e5e5;
    text-align          : center;
    padding             : 10px;
    width               : 400px;
}


/* --------------------------------	*/
/* footer						 	*/
/* --------------------------------	*/
#footer	{
	position			: relative;
	background			: #a7dfeb url(../img/blokje.gif) no-repeat left top;
	border-top			: solid 1px black;
	padding				: 20px 30px;
    font-size           : 0.85em;
}

#footer .adres  {
    color               : #000;
    margin-bottom       : 10px;
}

#footer .colofon,
#footer .colofon a {
    color               : #fff;
}

#footer .socialmedia    {
    position            : absolute;
    top                 : 20px;
    right               : 30px;
}

#footer .socialmedia a  {
    display             : block;
    width               : 36px;
    height              : 36px;
    float               : left;
    border              : solid 3px #fff;
    background          : url(../img/socialmedia.gif) no-repeat;
    text-indent         : -900em;
    overflow            : hidden;
    margin-left         : 5px;
}

#footer .socialmedia a.linkedin { background-position: 0 0; }
#footer .socialmedia a.twitter { background-position: -36px 0; }
#footer .socialmedia a.youtube { background-position: -72px 0; }
#footer .socialmedia a.facebook { background-position: -108px 0; }

#footer .socialmedia a:hover    {
    border-color        : #000;
}


/* --------------------------------	*/
/* googlemaps					 	*/
/* --------------------------------	*/
iframe.googlemaps	{
	border				: solid 1px black;
	overflow			: hidden; 
}

#googlemaps	{
	height				: 300px;
	width				: 800px;
	background			: #fff;
	text-align			: left;
	font				: 1em Arial;
	color				: #000;
}

#googlemaps a	{
	color				: #58585A;
}


/* --------------------------------	*/
/* merken logos					 	*/
/* --------------------------------	*/
.merken {
    width: 994px;
    height: 110px;
    margin: 5px 0;
    overflow: hidden;
    border-top:  1px solid #000;
}

.merken ul {
    height: 110px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    list-style: none;
}

.merken li {
    float: left;
    position: relative;
    height: 110px;
    width: 142px;
    margin: 0;
}


/* jpscroll */
/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer
{
	overflow: hidden;
	position: relative;
}

.jspPane
{
	position: absolute;
}

.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 16px;
	height: 100%;
	background: red;
}

.jspHorizontalBar
{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 16px;
	background: red;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap
{
	display: none;
}

.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: #dde;
	position: relative;
}

.jspDrag
{
	background: #bbd;
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}