*
	{
	border:0;
	margin:0;
	padding:0;
}

body 	{ 
		background-color: white;
		background-image: url(images/selkbag-bck_home.gif); 
	   	background-repeat: repeat-x; 
	   	background-position: 0 0;
		font-size: 11px; 
   		font-family: georgia, helvetica, arial, sans-serif;
		color: #666666; 
		line-height: 18px;
		text-align: left;
	    }

body a {color: #666666; 
		text-decoration: none;
		}

body a:hover	{
		color: #666666; 
		text-decoration: underline; 
				}
 
#wrapper	{
			MARGIN: 188px auto 20px; 
			width: 735px;
			position: relative; 
			}

#container { 
			background-image: url(images/selkbag_containerbck.gif); 
			background-repeat: no-repeat; 
			height: 456px;
			}

#leftcontent 	{
				position:absolute;
				left: 7px; 
				top: 17px;
				width: 240px;
				height: 445px;
				}

#middlecontent	{
				position: absolute;
				left: 247px;
				top: 17px;
				width: 240px;
				height: 445px;
				}
				
#rightcontent	{
				position:absolute;
				left: 487px;
				top: 17px;
				width: 240px;
				height: 445px;
				}
				
#text-content	{
					position:absolute;
					left: 8px;
					top: 8px;
					width: 222px;
					height: 429px;
					}

#logo 		{ 		
					background: url(images/selkbag_logo.gif);
					left: 0px;
					top: 0px; 
					position: absolute;
					height: 70px;
					width: 222px;
					 }

#logo A 	{
					DISPLAY: block; 
					HEIGHT: 67px;
					}


/*-----------------------------------------------------------------------------
START MENU
Define the width of the nav div
-----------------------------------------------------------------------------*/

#nav
	{ 
	position: absolute;
	top: 222px;
	right: 0px;
	width:250px; 
	height: 97px;
	}

	
#nav ul 
	{
	list-style:none;
	width: 250px;
	height: 97px;
	}

#nav li 
	{

    list-style: none;
	display: inline;
	text-align: center;
	}

#nav li a 
	{
	text-decoration: none;
	display:block;
	float:left;	
	background: url(images/menu.gif) no-repeat;
	text-indent:-9999px;
	}	
	
/*-----------------------------------------------------------------------------

Define the width of each li item. This is used as a letter box to show the 
correct part of the background image

-----------------------------------------------------------------------------*/	
	
	
li#selkbags a {
	width:95px;
	height:97px;
	 }
li#info a {
	width:67px;
	height:97px;
	 }
li#bestel a {
	width:65px;
	height:97px;
	 }
	
/*-----------------------------------------------------------------------------

Position the background image within the left boxes we have created. Use hover states
to show the correct background position for hover states.

A negative margin is used to show the whole tab. As this doesn't work in IE a 
separate stylesheet is used for IE6 and below.

-----------------------------------------------------------------------------*/	


li#selkbags a:link, li#selkbags a:visited {	
	background-position: 0px 0px;
	}
	
li#selkbags a:hover, li#selkbags a:focus {	
	background-position: 0px -96px;
	}
	
li#info a:link, li#info a:visited {	
	background-position: -95px 0px;
	}
	
li#info a:hover, li#info a:focus {	
	background-position: -80px -288px;
	width: 82px;
	margin-left: -15px;
	}	
	
li#bestel a:link, li#bestel a:visited {	
	background-position: -162px 0px;
	}
	
li#bestel a:hover, li#bestel a:focus {	
	background-position: -147px -480px;
	width: 80px;
	margin-left: -15px;
	}	
	

/*-----------------------------------------------------------------------------

Set the on states using the body id.

-----------------------------------------------------------------------------*/	

/*-----------------------------------------------------------------------------

van selkbag naar selkbag.
van selkbag naar info

-----------------------------------------------------------------------------*/	


body#selkbags-page li#selkbags a:link, body#selkbags-page li#selkbags a:visited {	
	background-position: 0px -96px;
	}

body#selkbags-page li#info a:hover, body#selkbags-page li#info a:focus {	
	background-position: -80px -192px;
	width: 82px;
	margin-left: -15px;
	}

/*-----------------------------------------------------------------------------

van info naar info
van info naar selkbag
van info naar betsel
-----------------------------------------------------------------------------*/	


body#info-page li#info a:link, body#info-page  li#info a:visited {	
	background-position: -80px -288px;
	width: 82px;
	margin-left: -15px
	}

body#info-page li#selkbags a:hover, body#info-page  li#selkbags a:focus {	
	background-position: 0px -192px;
	overflow: auto;
	width: 95px;
	position:relative;
	}


body#info-page li#bestel a:hover, body#info-page li#bestel a:focus {	
	background-position: -147px -384px;
	width: 80px;
	margin-left: -15px;

	}

/*-----------------------------------------------------------------------------

van bestel naar betsel
van bestel naar info
-----------------------------------------------------------------------------*/	
	
body#bestel-page li#bestel a:link, body#bestel-page li#bestel a:visited {	
	background-position: -147px -480px;
	width: 80px;
	margin-left: -15px;
	}


body#bestel-page li#info a:hover, body#bestel-page li#info a:focus {	
	background-position: -80px -384px;
	width: 82px;
	overflow: auto;
	position: relative;
	}

/*------------------
END MENU
-------------------*/
	
	
#left-menuholder 	{
					
					position: absolute;
					top: 245px;
					left: 15px;
					width: 464px;
					height: 44px;
										}

#left-contentholder1	{
						position: absolute;
						top: 17px;
						left: 15px;
						width: 464px;
						height: 200px;
						padding: inherit;
						margin: inherit;
						}
						
#bestel-line			{
						background-image:url(images/selkbag-bestellines.jpg);
						background-repeat: no-repeat;
						position: absolute;
						left: 0px;
						top: 0px;
						width: 206px;
						height: 250px;
						padding-left: 244px;
						padding-top: 8px;
						line-height: 48px;
						}

#line1-visual			{
	background-image:url(images/selkbag-bestelline1_hover.jpg);
	position:absolute;
	right: 0px;
	top: 0px;
	width: 130px;
	height: 215px;
	visibility: hidden;
						}
				
																		
#left-contentholder2	{
						position: absolute;
						top: 300px;
						left: 15px;
						width: 464px;
						height: 130px;
						}
						
#holder2-left 		{
					position:absolute;
					left: 0px;
					top: 0px;
					width: 222px;
					}
					
#holder2-right 		{
					position:absolute;
					left: 240px;
					top: 0px;
					width: 222px;
					}
					
												
#leftcolumn	{
				position: absolute;
				top: 0px;
				left: 0px;
				width: 215px;
				height: 228px;
				}

#intro-text	{
				position: absolute;
				top: 75px;
				width: 222px;
				height: 140px;
				}

#enjoy 			{
				position: absolute;
				left: 0px;
				bottom: 4px;
				width: 222px;
				height: 10px;
				text-align:center;
				}
				
#selkbag-button
				{
				top: 0px;
				right: 168px;
				height: 84px;
				width: 85px;
				position: absolute;
				}

#selkbag-button A 	{
					DISPLAY: block; 
					HEIGHT: 84px;
					}

#selkbag-button A:hover 	{
							background: url(images/selkbag-menu.gif) no-repeat 0px -86px;
							}

.active#selkbag-button 		{
							BACKGROUND: url(images/selkbag-menu.gif) no-repeat 0px -86px; 	
							}
	
	
#info-button
				{
				top: 0px;
				right: 83px;
				height: 84px;
				width: 85px;
				position: absolute;
				}

#info-button A 		{
					DISPLAY: block; 
					HEIGHT: 84px;
					}

#info-button A:hover 		{
							background: url(images/selkbag-menu.gif) no-repeat -85px -86px;
							}

.active#info-button 		{
							BACKGROUND: url(images/selkbag-menu.gif) no-repeat -85px -86px ;
							}
	
#bestel-button
				{
				top: 0px;
				right: 0px;
				height: 84px;
				width: 83px;
				position: absolute;
				}

#bestel-button A 	{
					DISPLAY: block; 
					HEIGHT: 84px;
					}

#bestel-button A:hover 		{
							background: url(images/selkbag-menu.gif) no-repeat -170px -86px;
							}

.active#bestel-button 		{
							BACKGROUND: url(images/selkbag-menu.gif) no-repeat -170px -86px;
							}
	
#info-menu		{
				margin-top: inherit; 
				text-align: left;
				padding-top: 11px;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 19px;
				line-height: normal;
				color: #216078;
				}
#info-menu a	{
				text-decoration: none;
				color: #216078;
				}

#info-menu a:hover	{
					text-decoration: none;
					color: #333333;
					}

.info-menu-active {color: #333333}

#selkbagvisuals-home		{
							position: absolute;
							top: 17px;
							left: 7px;
							width: 480px;
							height: 445px;
							}				

#selkbag-menuholder	{
					background: url(images/selkbag_selkbagmenu.gif);
					position:absolute;
					left: 40px;
					top: 3px;
					height:40px;
					width:120px;
					}

#selkbag-menu-nr1
				{
				position: absolute;
				top: 0px;
				left: 0px;
				height: 40px;
				width: 40px;
								}

#selkbag-menu-nr1 A 	{
					DISPLAY: block; 
					HEIGHT: 40px;
					}

#selkbag-menu-nr1 A:hover 	{
							background: url(images/selkbag_selkbagmenu.gif) no-repeat 0px -48px;
							}

.active#selkbag-menu-nr1 		{
							BACKGROUND: url(images/selkbag_selkbagmenu.gif) no-repeat 0px -48px; 	
							}

#selkbag-menu-nr2
				{
				position: absolute;
				top: 0px;
				left: 40px;
				height: 40px;
				width: 40px;
								}

#selkbag-menu-nr2 A 	{
					DISPLAY: block; 
					HEIGHT: 40px;
					}

#selkbag-menu-nr2 A:hover 	{
							background: url(images/selkbag_selkbagmenu.gif) no-repeat -40px -48px;
							}

.active#selkbag-menu-nr2 		{
							BACKGROUND: url(images/selkbag_selkbagmenu.gif) no-repeat -40px -48px; 	
							}
							
#selkbag-menu-nr3
				{
				position: absolute;
				top: 0px;
				left: 80px;
				height: 40px;
				width: 40px;
								}

#selkbag-menu-nr3 A 	{
					DISPLAY: block; 
					HEIGHT: 40px;
					}

#selkbag-menu-nr3 A:hover 	{
							background: url(images/selkbag_selkbagmenu.gif) no-repeat -80px -48px;
							}

.active#selkbag-menu-nr3 		{
							BACKGROUND: url(images/selkbag_selkbagmenu.gif) no-repeat -80px -48px; 	
							}							

INPUT 		{
			PADDING-RIGHT: 5px; 
			PADDING-LEFT: 5px; 
			PADDING-TOP: 3px;
			PADDING-BOTTOM: 3px;  
			BACKGROUND: #f2f2f2; 
			WIDTH: 210px; 
			margin-bottom: 2px;
			BORDER-TOP-STYLE: none;
			BORDER-RIGHT-STYLE: none; 
			BORDER-LEFT-STYLE: none; 
			BORDER-BOTTOM-STYLE: none;
			font-size: 11px; 
   			font-family: georgia, helvetica, arial, sans-serif;
			color:#666666; 
			}

TEXTAREA 	{
			PADDING-RIGHT: 5px; 
			PADDING-LEFT: 5px; 
			PADDING-TOP: 6px;
			PADDING-BOTTOM: 6px;  
			BACKGROUND: #f2f2f2;  
			WIDTH: 210px; 
			BORDER-TOP-STYLE: none;
			BORDER-RIGHT-STYLE: none; 
			BORDER-LEFT-STYLE: none; 
			BORDER-BOTTOM-STYLE: none;
			font-size: 11px; 
	   		font-family: georgia, helvetica, arial, sans-serif;
			color:#666666; 
			}

TEXTAREA 	{
			PADDING-RIGHT: 5px;
			FLOAT: left; 
			OVERFLOW: auto; 
			WIDTH: 210px; 
			HEIGHT: 80px
			}
			
INPUT.submit 	{
				BACKGROUND: url(images/selkbag-verder2.gif) no-repeat left top; 
				WIDTH: 40px; 
				HEIGHT: 40px;
				}
				
INPUT.submit:hover 	{
					BACKGROUND: url(images/selkbag-verder2.gif) no-repeat 0px -40px
					}

FORM.product p{line-height: 30px;}

					
a.tt{
    position:relative;
    z-index:24;
    color: #666666;
	font-weight: normal;
    text-decoration:none;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color:  #666666; background:;}
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    top:0px; left:0;
	padding: 15px 0 0 0;
	width:166px;
	color:  #666666;
    text-align: center;
	filter: alpha(opacity:90);
	KHTMLOpacity: 0.90;
	MozOpacity: 0.90;
	opacity: 0.90;
}
a.tt:hover span.top{
	display: block;
	padding: 20px 8px 0;
    background: url(images/bubble.gif) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 8px; 
	background: url(images/bubble_filler.gif) repeat bottom; 
}
a.tt:hover span.bottom{
	display: block;
	padding:8px 8px 10px;
	color:  #666666;
    background: url(images/bubble.gif) no-repeat bottom;
}

.white {color: #FFFFFF; font-weight: bold; }