* {
	margin: 0;
	padding: 0;
}
html {
	background-color: #ccc;

/*	background-image: url('randig_bakgrund.gif');*/
}
body {
	width: 800px; 
	height: 600px;
	margin: 0 auto;
	font-family: "Arial", sans-serif;
	font-size: 10px;
	background-color: #fff;
	border: 1px solid black;
	position: absolute;
	margin-top: -300px;
	margin-left: -400px;
	top: 50%;
	left: 50%;
}
a {
	text-decoration: none;
	color: #f32b2b;
}
h3 {
	margin-top: 10px;
 	font-family: "Arial", sans-serif;
	color: #000;
	font-weight: bold;
	font-size: 12px;
}

img {
	border: 0;
}
div.clear {
	clear: both;
}
/**
 * Top part 
 */
div#top {
	height: 90px;
	border-bottom: 1px solid #000;
	position: relative;
}
img#top_jw {
	position: absolute;
	left: 45px;
	top: 21px;
}
img#top_bird {
	position: absolute;
	right: 21px;
	bottom: 0;
}
/**
 * Content part
 */
div#contentpane {
	height: 372px; /* (112px image box + 12px margin, drop shadow is in this margin) * 3 */
	position: relative;
	margin-top: 30px;
	margin-bottom: 41px;
}


div#content {
	position: absolute;
	left: 240px;

	width: 516px; /* (112px image box + 12px margin, drop shadow is included) * 4 + 20px scrollbar */
	height: 372px; /* (112px image box + 12px margin, drop shadow is in this margin) * 3 */
	overflow: auto;
}
div#images {
	width: 496px; /* (112px image box + 12px margin, drop shadow is included) * 4*/
}
div#images img {
	display: block;
}
/* These are not div. since the big picture needs them as span */
div.ds1, div.ds2, div.ds3 {
	display: block;
}
div.ds1 {
	background: url('shadow.png') right bottom no-repeat;
	float: left;
}
div.ds2 {
	background: url('corner_bl.png') left bottom no-repeat;
}
div.ds3 {
	padding: 0 6px 6px 0;
	background: url('corner_tr.png') right top no-repeat;
}
div.Portrait {
	/* Top: 6px margin right: 14px margin (Make up smaller image), another 6px comes with ds3, bottom: padding from ds3, left: 6px+14px */
	margin: 6px 14px 0 20px;
}
div.Landscape {
	/* top: margin + smaller image (6 + 14), right: 0 + padding ds3, bottom: 14px, another 6px from ds3, left: 6px margin */
	margin: 20px 0 14px 6px;
}
div#imgbox {
	background-color: #fff;
	/* Same as #content */
	position: absolute;
	top: 0;
	left: 240px;
	width: 516px;
	/* Not same */
	z-index: 200;
	height: 402px; /* 372 (#content) + 6 + 14(text) + 10(arrow) */

	display: none;
}

div#imgbox img {
	display: block;
}
div#imgbox div.ds1 {
	position: relative;
}
div#imgbox a.close {
	background-image: url('cross.png');
	background-position: 0 0;
	background-repeat: no-repeat;
	position: absolute;
	top: 0px;
	right: -11px; /* 6px dropshadow  + 10/2*/
	display: block;
	height: 10px;
	width: 10px;
}
div#imgbox a.close:hover {
	background-position: 0 -10px;
}
div#imgbox a.next, div#imgbox a.prev {
	background-image: url('arrows.png');
	background-repeat: no-repeat;
	position: absolute;
	bottom: 0;
	display: block;
	height: 10px;
	width: 16px;
}

div#imgbox a.next {
	left: 241px; /* 472 / 2 + 5px margin*/
	background-position: 0 0;
}
div#imgbox a.next:hover {
	background-position: 0 -10px;
}
div#imgbox a.prev {
	left: 221px; /* 472 / 2 - 10  - 5px margin*/
	background-position: 0 -20px;
}
div#imgbox a.prev:hover {
	background-position: 0 -30px;
}

div#imgbox p#caption {
	position: absolute;
	bottom: 10px; /* Move above arrows */
	left: 16px;
	width: 428px; /* 472 - 2*22 */
	height: 14px; /* Height of img*/
	display: block;
	text-align: center;
	text-transform: uppercase;
}

div#imgboxLoading {
	position: absolute;
	left: 251px; /*470 / 2 + 32 / 2*/
	top: 193px; /* 354 / 2 + 32 / 2*/
}
/* Left menu part */
ul#left_menu {
	margin-left: 45px;
	float: left;
	width: 195px; /* 240 - 45 */
	list-style-type: none;
	font-size: 9px;
	text-transform: uppercase;
}
ul#left_menu li a {
	display: -moz-inline-box; /* Emulate inline-block in Gecko */
	display: inline-block;
	vertical-align: middle;
	height: 12px;
	padding: 4px 0;
	color: #000;
}
ul#left_menu li.first a {
	padding-top: 18px; /* Add 12px more before the link */
}
ul#left_menu li a:hover, ul#left_menu li.selected a {
	color: #E82B2B;
}
ul#left_menu li img {
	display: none;
}
div#popup {
	display: none;
	position: absolute;
	top: 0;
	/* Same as #content */
	left: 240px;
	height: 372px;
	width: 516px; 
	z-index: 100;
	background-color: #fff;
}
/* Bottom part */
div#bottom {
	height: 60px;
	border-top: 1px solid #000;
	position: relative;
}
img#copyright {
	position: absolute;
	left: 495px;
	top: 49px;
}
img#websystem {
	position: absolute;
	left: 45px;
	top: 49px;
}

ul#bottom_menu {
	list-style-type: none;
}
ul#bottom_menu li {
	position: absolute;
	overflow: hidden;
	top: 12px;
	height: 14px;
}
ul#bottom_menu li a img {
	position: relative;
	top: 0;
}
ul#bottom_menu li a:hover img {
	top: -100%;
}
ul#bottom_menu li.selected a img {
	top: -100%;
}
li#bm_dbarchive {
	left: 47px;
}
li#bm_images {
	left: 168px;
}
li#bm_products {
	left: 289px;
}
li#bm_eq {
	left: 410px;
}
li#bm_about {
	left: 537px;
}
li#bm_guestbook {
	left: 577px;
}
li#bm_contact {
	left: 635px;
}
li#bm_home {
	left: 733px;
}

/* Här kommer inställningar för de olika sidorna */

/* Startbild för album */
div#archive_start {
	position: absolute;
	left: 235px;
	top: 20px;
/*	border: 1px solid #000;*/
}



/* Product och utrustningssidan */

div#products_content {
	position: absolute;
	left: 240px;
	width: 520px; /* samma som content, nästan... Innan ändringen var det så. */
	height: 380px;

	overflow: auto;
}

div#products_text {
   position: absolute;
 	left: 0px;
	width: 370px;
	height: 350px;
/*	overflow: auto; */
	font-size: 12px;
}
/* här ligger alla bilder */
div#product_pics {
	position: absolute;
	left: 390px;
	width: 107px;
	height: 350px;
	overflow: auto;
}
/* en per bild... */
div.product_pic {
	margin-bottom: 5px;
}


/* kontakt */

div#contact_text {
	position: absolute;
	left: 60px;
	top: 240px;
	width: 495px; /* Samma som content */
	height: 180px;
/*	overflow: auto;*/
	font-size: 12px;
}

div#contact_pic {
	position: absolute;
	top: -27px;
	left: 15px;
	width: 770px;
	height: 428px;
/*	overflow: auto;*/
}

/* om mig  */
div#about_text {
	position: absolute;
	left: 240px;/* Samma som content */
	top: 5px;
	width: 495px; /* Samma som content */
	height: 380px;
/*	overflow: auto;*/
	font-size: 12px;
}

div#about_pic {
	position: absolute;
	top: 5px;
	left: 45px;
	width: 170px;
	height: 400px;
	overflow: auto;
/*	border: 1px solid black; */
}

/* home (startsidan) */


div#home_pic {
	position: absolute;
	left: 80px;	
	top: 10px;		
}

div#home_info {
	position: absolute;
	top: 75px;
	left: 550px;
	width: 160px; 
	height: 380px;
	font-family: "Arial", sans-serif;
	font-size: 12px;

/*	border: 1px solid #000; */
}
div#home_info div {
	padding: 14px;
	position: absolute;
	display: none;
	left: -160px;
	width: 320px;
	height: auto;
	border: 1px solid black;
	background-color: #eee;
 	font-size: 12px;

}

/* arkivet  */
div#archive {
	position: absolute;
	left: 100px;
	top: -10px;
	width: 600px; 
	height: 400px;
	overflow: auto;
	font-size: 12px;
}