@charset "utf-8";
/* CSS Document */
img, a						{	border:0px; outline:none; }
body, html 				{ 	width:100%; height:100%; margin:0px; padding:0px; background-color:#FFFFFF; font-family:Arial; font-size:11px; line-height:18px;}
td						{	font-family:Arial; font-size:11px; line-height:18px;}
p:first-child			{	margin:0px; }
h1						{	padding:12px 0px 5px 0px; margin:0px; font-size:15px; line-height:18px; color:#000;}
a						{	color:#666; text-decoration:none; }
a:hover					{ 	color:#000; }


#container				{	position:relative; top:0px; width:990px; margin:0px auto;}
#header					{	height:116px; }
	#logo				{	position:absolute; width:244px; height:113px; z-index:1; top:0px; left:0px; display:block; background:url(../images/logo.gif) no-repeat; text-indent:-3200px; overflow:hidden;}
	#menu				{	position:absolute; right:0px; top:56px; margin:0px; padding:0px; list-style-type:none; z-index:2; }
	#menu li			{	float:left; display:block; padding:0px 0px 2px 10px; }
	#menu a				{	float:left; display:block; color:#FFF; text-indent:-2000px; overflow:hidden; background-repeat:no-repeat; }
	#menu a.active,
	#menu a:hover		{	background-position:0px -100px;}

#top						{ 	z-index:2; position:relative; background-color:#FFF; height:300px; overflow:hidden; height:326px;}
	#top #media				{	width:495px; height:325px; background-color:#999; float:left;}
	#top #map				{	width:495px; height:325px; }
	#top #blocks			{	width:495px; height:325px; margin:0px; padding:0px; list-style-type:none; float:left;}
	#top #blocks li			{	float:left; width:160px; height:160px; margin:0px 0px 0px 0px; padding:0px 0px 5px 5px; overflow:hidden;}
	#top #blocks a			{	display:block; position:relative; width:160px; height:160px; overflow:hidden;}
	#top #blocks .flip		{	position:absolute; left:0px; top:0px; width:160px; height:160px; overflow:hidden;}
	
	#top #blocks img		{	position:absolute; left:0px; top:0px; width:100%; height:200%;}
	#top #blocks a.active img	{	top:-160px;}
	#top #blocks a:hover	{	background-color:transparent;}
	#top #blocks .clicker	{	position:absolute; left:0px; top:0px; width:160px; height:160px;}

#bottom						{	z-index:3; position:relative;height:240px;}
	#bottom #left			{	width:495px; height:240px; float:left;}
	#bottom #right			{	width:490px; height:240px; float:left; padding:0px 0px 0px 5px;}
	#bottom #1col			{	width:990px; height:240px; clear:both;}
	
#logos					{	margin:0px; padding:10px 0px 0px 0px; list-style-type:none; clear:both;}
#logos li				{	float:left; padding:0px 0px 0px 4px;  height:40px;}
#logos li:first-child	{	padding:0px 0px 0px 0px;}
#logos a				{	display:block; height:40px; float:left}
#logos img				{	margin:20px 0px 0px 0px;  }
#logos li.active img	{	margin:0px 0px 0px 0px;}

#footer					{	position:relative; clear:both; padding:10px 0px 0px 0px; text-align:right; color:#999;}
#footer a				{	color:#999;}
#footer a:hover			{	color:#000;}
/* HOOGTE VAN DE STANDAARD SCROLL*/
.mainscroll							{	height:240px; }

/* NEWPAGINA */
#newszoom							{	}
.newszoomscroll						{	height:220px;}

/* PLATTEGROND */ 
#media #plattegrond					{	position:relative;width:495px; height:325px; overflow:hidden;}
#media #plattegrond .bol			{	position:absolute; display:block; width:12px; height:12px; background:url(../images/bolletje.gif) 0px 0px; overflow:hidden; text-indent:-2000px; margin:-6px 0px 0px -6px;}
 /* #media #plattegrond a.active		{	background-position:50% -16px; width:16px; height:16px; margin:-8px 0px 0px -8px;}*/

#plattegrondwinkels					{ 	position:relative; width:990px; padding:0px 0px 0px 5px;}
#plattegrondwinkels .info			{	float:left; padding:10px 0px 0px 0px; width:160px;}
#plattegrondwinkels #routelink		{	width:100%; display:block; float:right; background-color:#ffde00; color:#000; padding:2px 0px 2px 0px; text-decoration:none; text-align:center;  }
#plattegrondwinkels #routelink:hover		{	color:#ffde00; background-color:#000; }

#plattegrondwinkels ul				{ 	padding:10px 5px 0px 0px; margin:0px; list-style-type:none; float:left; width: 160px; }
#plattegrondwinkels li				{ 	padding:0px 0px 0px 0px;  text-align:left; line-height:14px;}
#plattegrondwinkels li span			{ 	display:block; cursor:default; padding:2px;  margin:0px 0px 0px -2px}
#plattegrondwinkels li span:hover,
#plattegrondwinkels li span.hovered,
#plattegrondwinkels li span.active	{ 	background-color:#ffde00; color:#000;}
#plattegrondwinkels li a			{ 	display:block; font-weight:bold; color:#333; text-decoration:none; padding:2px; margin:0px 0px 0px -2px}
#plattegrondwinkels li a:hover,
#plattegrondwinkels li a.hovered,
#plattegrondwinkels li a.active		{ 	background-color:#ffde00; color:#000; }
#plattegrondwinkels li				{ 	color:#aaa;}
#legenda	{	position:absolute; top:140px; left:0px; margin:0px; padding:0px; list-style-type:none; width:100px; line-height:12px; font-size:10px;}
#legenda li	{	color:#FFF; padding:2px; margin:2px 0px 0px 0px; cursor:pointer; }
#legenda li:hover	{	color:#000;}


/* WINKEL OVERZICHT PAGINA */ 
#winkels				{ 	width:100%; padding:0px 0px 0px 5px; }
#winkels .info			{	float:left; width:160px; padding:10px 5px 0px 0px; }
#winkels ul				{ 	padding:10px 5px 0px 0px; margin:0px; list-style-type:none; float:left; width: 160px;  }
#winkels li span		{ 	display:block; cursor:default; padding:1px 2px 1px 2px;  margin:0px 0px 0px -2px}
#winkels li a			{ 	display:block; font-weight:bold; color:#333; text-decoration:none; padding:1px 2px 1px 2px; margin:0px 0px 0px -2px}
#winkels li a:hover,
#winkels li a.active	{ 	background-color:#ffde00; color:#000; }
#winkels li				{ 	color:#aaa;}

#koopzondagen { padding:0px; margin:0px; list-style-type:none; padding:10px 0px 0px 0px;}
#koopzondagen li { padding:0px 0px 4px 0px;}
#koopzondagen span { display:block; float:left; width:150px;}

/* PRODUCT PAGINA */ 
#producten					{ 	width:100%; }

#producten ul				{ 	padding:40px 0px 0px 0px; margin:0px; list-style-type:none; float:right; width: 35%; }
#producten li				{ 	padding:0px 0px 1px 15px; }
#producten li a				{ 	color:#666; text-decoration:none; font-size:12px;}
#producten li a:hover,
#producten li a.active		{ 	color:#000; font-weight:bold; }
#producten li				{ 	color:#aaa;}

#productzoom				{	height:100%; overflow:hidden; }

.productinfo				{	height:100%; width:320px; float:left; padding:0px 0px 0px 0px;}
.productinfo h1				{	padding:12px 0px 5px 0px; margin:0px; font-size:15px; line-height:18px; color:#000; }
.scrollproductzoom			{	height:100%; width:310px; }

.winkelscroll				{	position:relative; height:100%; width:170px; float:left;}
.winkelscroll .scroll		{	height:210px; padding:0px 0px 0px 10px; margin:0px; list-style-type:none; }
.winkelscroll h1			{	padding:12px 0px 5px 10px; margin:0px; font-size:15px; line-height:18px; color:#000; }
.winkelscroll				{	position:relative; height:100%; width:170px; float:left; color:#aaa;}
.winkelscroll li a			{ 	display:block; font-weight:bold; color:#333; text-decoration:none; padding:2px; margin:0px 0px 0px -2px }
.winkelscroll li a:hover,
.winkelscroll li a.active	{ 	background-color:#ffde00; color:#000;  }



/* ACTIE DING*/
#actie 				{	background:url('../images/actie_bg.png') 0px 0px no-repeat; width:668px; height:345px; position:absolute; left:50%; margin-left:-334px; top:200px; z-index:1000; display:none; }
#actie .pictures 	{ 	border:4px solid #f7e100; width:442px; height:323px; float:left; overflow:hidden;}
#actie .right 		{ 	border:4px solid #f7e100; width:199px; height:323px; float:left; border-left:0px; background-color:#7b7c7e;}
#actie .close		{ 	background:url('../images/close_actie.gif') no-repeat 0px 0px; display:block; height:16px; width:16px; position:absolute; right:19px; top:5px; text-indent:-999px; overflow:hidden; }
#actie .right h1	{ 	padding:0px 10px 0px 10px; color:#FFF;}
#actie .right .scroll2	{ 	 padding:20px 0px 0px 0px;}
#actie .right .padder	{ 	padding:10px; color:#FFF;}
#actie .right .scrolleractie	{ 	width:194px; height:290px; overflow:hidden; display:block; }
/* WINKEL PAGINA */ 
#winkelleft .winkelinfo									{	float:right; width:380px;}

#winkelleft .winkelinfo	.openingstijden					{	float:left; width:300px;}
#winkelleft .winkelinfo	.openingstijden	h1				{	padding:12px 0px 15px 0px; margin:0px; font-size:15px; line-height:18px; color:#000; }
#winkelleft .winkelinfo	.openingstijden label			{	display:block; width:110px; float:left; clear:both; padding:2px 0px 0px 0px;}
#winkelleft .winkelinfo	.openingstijden span			{	float:left; padding:2px 0px 0px 0px;}
#winkelleft .winkelinfo	.openingstijden div				{	padding:5px 0px 0px 0px; clear:both;}
#winkelleft .winkelinfo	.openingstijden	a				{	display:block; color:#000; text-decoration:underline; font-weight:bold; padding:10px 0px 0px 0px; clear:both;}

#winkelleft .winkelinfo	.logo							{	float:right; position:relative; height:240px;}
#winkelleft .winkelinfo	.logo img						{	position:absolute; top:14px; right:5px; }

#winkelleft .winkelinfo	#winkellinks					{	display:block; position:absolute; bottom:0px; right:0px;  width:300px;}
#winkelleft .winkelinfo	#winkellinks a					{	display:block; float:right; background-color:#ffde00; color:#000; padding:2px 10px 2px 10px; text-decoration:none;  margin-left:10px;}
#winkelleft .winkelinfo	#winkellinks a.active			{	color:#ffde00; background-color:#000;}
#winkelright											{	padding:0px; position:relative; }

.winkeltekst											{	padding:10px 0px 0px 10px;}
.winkeltekst .scroll									{	padding:0px; height:220px; overflow:hidden;}



/* SCROLLER JQUERY */ 
.jScrollPaneContainer 				{	position: relative; overflow: hidden; z-index: 1; }
.jScrollPaneTrack 					{	position: absolute; cursor: pointer; right: 0; top: 0; height: 100%; background: #ecedef; }
.jScrollPaneDrag 					{ 	position: absolute; background: #ffde00; cursor: pointer; overflow: hidden; }
.jScrollPaneDragTop 				{	position: absolute; top: 0; left: 0; overflow: hidden; }
.jScrollPaneDragBottom 				{ 	position: absolute; bottom: 0; left: 0; overflow: hidden; }
a.jScrollArrowUp 					{	display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; }
a.jScrollArrowUp:hover 				{	/*background-color: #f60;*/ }
a.jScrollArrowDown 					{	display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; }
a.jScrollArrowDown:hover 			{	/*background-color: #f60;*/ }
a.jScrollActiveArrowButton, 
a.jScrollActiveArrowButton:hover 	{	/*background-color: #f00;*/ }



/**********************************************
TBMODULE
**********************************************/
.tbmodule{ background-color:#ea0082; color:#FFF; padding:20px; margin:15px 0px 15px 0px; text-align:center; font-weight:bold; border:dotted 1px #000000; }

/**********************************************
IMAGES VANUIT TOOLBOX
**********************************************/
.img_left_border{ float:left; margin-right:15px; margin-bottom:5px; }
.img_left_noborder{ float:left; margin-right:15px; margin-bottom:5px; }
.img_right_border{ float:right; margin-left:15px; margin-right:4px;	margin-bottom:5px; }
.img_right_noborder{ float:right; margin-right:4px;	margin-left:15px; margin-bottom:5px; }
.img_noalign_noborder{ margin:0px; }
.img_noalign_border{ margin:0px; }
.cssbutton{ cursor:pointer; border:1px solid #FFF; background-color:#00457c; color:#FFF; background-image:url('../images/arrow_rechts.gif'); background-repeat:no-repeat; background-position:100% 50%; text-align:left; text-indent:4px;	padding-left:4px; padding-right:20px; padding-top:3px; padding-bottom:3px;	font-size: 12px; float:left;}
.cssfield{ padding:5px; line-height:11px;border:1px solid #4db3d0; font-size:11px;}
.boekField{ border:1px solid #dedede; padding:2px 0px 2px 4px; height:18px;}