/*-----------------------------------------------------------------------------
Overlapping CSS Navigation
version:   1.0
date:      09/12/06
author:    george ornbo
email:     george at shapeshed dot com

Licensed under a 2.0 Creative Commons License

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

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


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

Define the width of the nav div

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

#nav
	{ 
	width:auto; 
	height: 42px;
	}

	
#nav ul 
	{
	list-style:none;
	width: auto;
	height: 42px;
	}

#nav li 
	{
    list-style: none;
	display: inline;
	text-align: center;
	}

#nav li a 
	{
	text-decoration: none;
	display:block;
	float:left;	
	background: url(../images/all_states.png) no-repeat;
	text-indent:-9999px;
	/* border:1px solid #F00;*/

	}	
	
/*-----------------------------------------------------------------------------

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

-----------------------------------------------------------------------------*/	
	
	
li#forside a {
	width:112px;
	height:42px;
	 }
li#produkter a {
	width: 92px;
	height:42px;
	 }
li#prepress a {
	width: 92px;
	height:42px;
	 }
li#tryk a {
	width: 92px;
	height:42px;
	 }
li#faerdiggoerelse a {
	width: 92px;
	height:42px;
	 }
li#links a {
	width: 92px;
	height:42px;
	 }
li#kontakt a {
	width: 98px;
	height:42px;
	 }

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

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#forside a:link, li#forside a:visited {	
	background-position: -0px -0px;
	}
	
li#forside a:hover, li#forside a:focus {	
	background-position: -0px -42px;
	}
	
	
	
	
li#produkter a:link, li#produkter a:visited {	
	background-position: -112px -42px;
	}
	
li#produkter a:hover, li#produkter a:focus {	
	background-position: -95px -126px; /* 1. tal fremkommer ved at tage bredden på den/de foregående knap - den til venstre (linie 67) og fratrække margin-left (linie 124). 2. tal fremkommer ved at gange x med line højden med */
	width: 109px; /* knap bredden + left margin */
	margin-left: -17px;
	}	




li#prepress a:link, li#prepress a:visited {	
	background-position: -204px -42px;
	}

li#prepress a:hover, li#prepress a:focus {	
	background-position: -187px -210px; /* 1. tal fremkommer ved at tage -204 minus -18, 2. tal x gange liniehøjden */
	width: 109px;
	margin-left: -17px;
	}	




li#tryk a:link, li#tryk a:visited {	
	background-position: -296px -42px;
	}
	
li#tryk a:hover, li#tryk a:focus {	
	background-position: -279px -294px;
	width: 109px;
	margin-left: -17px;
	}



li#faerdiggoerelse a:link, li#faerdiggoerelse a:visited {	
	background-position: -388px -42px;
	}
	
li#faerdiggoerelse a:hover, li#faerdiggoerelse a:focus {	
	background-position: -371px -378px;
	width: 109px;
	margin-left: -17px;
	}





li#links a:link, li#links a:visited {	
	background-position: -480px -42px;
	}
	
li#links a:hover, li#links a:focus {	
	background-position: -463px -462px;
	width: 109px;
	margin-left: -17px;
	}
	
	
	
	
li#kontakt a:link, li#kontakt a:visited {	
	background-position: -572px -42px;
	}
	
li#kontakt a:hover, li#kontakt a:focus {	
	background-position: -555px -546px;
	width: 109px;
	margin-left: -17px;
	}

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

Set the on states using the body id.

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

body#forside-page li#forside a:link, body#forside-page li#forside a:visited {	
	background-position: 0px -42px;
	width: 112px;
	}

body#forside-page li#produkter a:hover, body#forside-page li#produkter a:focus {	
	background-position: -95px -84px;
	width: 109px;
	margin-left: -17px;
	}
/*-----------------------*/	
body#produkter-page li#produkter a:link, body#produkter-page li#produkter a:visited {	
	background-position: -95px -126px; /* 1. tal er fremkommet ved at tage foregående knapbredde og fratrække margin-left */
	width: 109px;
	margin-left: -17px;
	}

body#produkter-page li#forside a:hover, body#produkter-page li#forside a:focus {	
	background-position: 0px -84px;
	overflow: auto;
	position: relative;

	}

body#produkter-page li#prepress a:hover, body#produkter-page li#prepress a:focus {	
	background-position: -187px -168px;
	width: 109px;
	margin-left: -17px;

	}
/*-----------------------*/		
body#prepress-page li#prepress a:link, body#prepress-page li#prepress a:visited {	
	background-position: -187px -210px;
	width: 109px;
	margin-left: -17px;
	}


body#prepress-page li#produkter a:hover, body#prepress-page li#produkter a:focus {	
	background-position: -95px -168px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
	position: relative;
	}
	
body#prepress-page li#tryk a:hover, body#prepress-page li#tryk a:focus {	
	background-position: -279px -252px;
	width: 109px;
	margin-left: -17px;
	position: relative;
	}
/* OK -----------------------*/		
body#tryk-page li#tryk a:link, body#tryk-page li#tryk a:visited {	
	background-position: -279px -294px;
	width: 109px;
	margin-left: -17px;
	}


body#tryk-page li#prepress a:hover, body#tryk-page li#prepress a:focus {	
	background-position: -187px -252px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
	position: relative;
	}
	
body#tryk-page li#faerdiggoerelse a:hover, body#tryk-page li#faerdiggoerelse a:focus {	
	background-position: -371px -336px;
	width: 109px;
	margin-left: -17px;
	position: relative;
	}
/*-----------------------*/	
body#faerdiggoerelse-page li#faerdiggoerelse a:link, body#faerdiggoerelse-page li#faerdiggoerelse a:visited {	
	background-position: -371px -378px;
	width: 109px;
	margin-left: -17px;
	}


body#faerdiggoerelse-page li#tryk a:hover, body#faerdiggoerelse-page li#tryk a:focus {	
	background-position: -279px -336px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
	position: relative;
	}
	
body#faerdiggoerelse-page li#links a:hover, body#faerdiggoerelse-page li#links a:focus {	
	background-position: -463px -420px;
	width: 109px;
	margin-left: -17px;
	position: relative;
	}
/*-----------------------*/	
body#links-page li#links a:link, body#links-page li#links a:visited {	
	background-position: -463px -462px;
	width: 109px;
	margin-left: -17px;
	}

body#links-page li#faerdiggoerelse a:hover, body#links-page li#faerdiggoerelse a:focus {	
	background-position: -371px -420px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
 	position: relative;
	}

body#links-page li#kontakt a:hover, body#links-page li#kontakt a:focus {	
	background-position: -555px -504px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
	position: relative;
	}
/*-----------------------*/	
body#kontakt-page li#kontakt a:link, body#kontakt-page li#kontakt a:visited {	
	background-position: -555px -546px;
	width: 109px;
	margin-left: -17px;
	}

body#kontakt-page li#links a:hover, body#kontakt-page li#links a:focus {	
	background-position: -463px -504px;
	width: 109px;
	margin-left: -17px;
	overflow: auto;
 	position: relative;
	}

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

Styles for the demo page

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

h1
	{
	margin: 30px 0px 10px 5px;
	}

p
	{
	margin: 10px 0px 10px 5px;
	}

.browser-list
	{
	margin-left: 20px;
	}