body { 
	background-image: url(img/bakis.jpg);
	margin-top: 20px;
	background-color: Black;
}
h1
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	font-size: 21px; 
	color: #fff;
	margin: 1em;
	padding: 1em;
	}

h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-variant: normal;
	font-weight: normal;
	font-size: 18px; 
	color: #fff;

}

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: italic; 
	font-variant: normal;
	font-weight: normal;
	font-size: 14px; 
	color: #fff;
	margin: 1em;
	padding: 1em;
}

td {  
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-style: normal; 
	font-variant: normal;
	font-weight: normal;
	font-size: 12px; 
	color: #fff;
}

a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	text-decoration : none;
	color: #fff;
}

a:visited  {
	color: #fff;
	}

a:hover {
	 color: #ccc;
	 }
	 
.listmenu {
	width:100%; 					/* ger div-elementet full bredd */
	float:left; 					/* gör att div-elementet omsluter listan */
	border-top: 0px solid #fff;		/* skapar en linje i div-elementets övre kant */
	border-bottom: 0px solid #fff;	 /* skapar en linje i div-elementets nedre kant */
	font-size:.8em;					/* ANGE TECKENSTORLEKEN HÄR – är höjd på listen också... */
	background-color:#000; 			/* ger div-elementet färg */
	margin-top:0px; 	/* TILLFÄLLIGT - knuffar ner div-elementet en bit i webbläsarfönstret för att göra 
					det här exemplet tydligare */
	}

.listmenu ul {margin:0 0 0 0px;	 /* drar in ul från behållarens kant */ }

.listmenu li {
	float:left;				/* får listan att justeras vågrätt i stället för lodrätt */
	position:relative; 		/* positioneringskontext för den absolut positionerade listmenyn */ 
	list-style-type:none;	/* tar bort punkterna för varje listpost */
	background-color:#000; 	/* anger bakgrunden för menyalternativen */
	border-right:1px solid #fff; 	/* skapar linjer som separerar listposterna */
	}

	.listmenu li:first-child {
	border-left:0px solid #fff; /* den första lodräga linjen på menyn */
	}

.listmenu li:hover { 
	background-color:#fff; /* anger bakgrunden för menyalternativen */
	}

.listmenu a {
	display:block; 			/* alternativen på listmenyn ändrar färg */    
	padding:0 6px; 			/* skapar luft på varje sida om menyalternativen */
	text-decoration:none;	 /* tar bort understrykningen av länken */
	color:#fff;				/* anger teckenfärgen */
	}

.listmenu a:hover {
	color:#666;
	}

/* den vågräta menyn slutar här */

/* listmenyn börjar här */

.listmenu ul li ul 
{
margin:0; 			
/* förhindrar att det tillfälliga värdet från den vågräta menyn ärvs här - OK att ta bort, om du också tar bort det tillfälliga värdet ovan */ 

position:absolute; 	
/* positionerar ul-listmenyn i förhållande till dess relativt positionerade li-förälder */ 

width:10em; 		
/* anger menyns bredd - i kombination med bredden 100% för li-elementet, gör detta att menyn justeras lodrätt 	*/
	
left:-40px;			 /* justerar listmenyn exakt under den vågräta menyn */
	}

.listmenu ul li ul li 
	{
width:100%; 					
/* får listposterna att fylla ut listbehållaren (ul) */ 
border-left:0px solid #fff; /* tre sidor på varje listpost på varje listmeny */  
border-bottom:1px solid #fff;
border-right:0px solid #fff;
	}

.listmenu ul li ul li:first-child 
	{
	border-top:1px solid #069; /* högst upp på listmenyn */
	}

/* gör att listmenyn visas när användaren pekar på menyn */ 
.listmenu ul li ul {display:none;} 			/* döljer listmenyn när användaren inte pekar på menyn */ 
.listmenu ul li:hover ul {display:block; } 	/* visar listmenyn när användaren pekar på menyn */ 

/* HACK-ZON - */
/* hack för IE (alla modeller) så att menyn får en vågrät linje längst ut till vänster */
* html .listmenu ul 
{
	float:left; 				/* får ul att omsluta alla li-elementen */
	border-left:1px solid #000;	/* lägger till linjen längst ut till vänster i ul-elementet */
	margin-left:0px; 			/* IE fördubblar värdet som angivits - varför? */
	}