/*
Description:	CSS Document for screen layout, for IE 8 and better
Created by:		Bo Svensson ( APM )
Date:			100122
Last Edit:		100217
Note:			New table layout for content
*/
/* ---------------------------------------------------- Header content starts here ------------------------------*/
* { margin: 0;
  padding: 0;}

body { background: #454545;}

div#header {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	height: 85px;
	background-color:#454545;
	border-bottom: #D8D8D8 3px solid;
	text-align: left;
	z-index:999;
	overflow: hidden;
	background-image: url(../image/bakgrunder/headerline85.png);
	background-position: top;
	background-repeat: no-repeat;}

img#headerlogo {position: absolute; top: 10px; left: 10px;
				margin: 0px; padding: 0px;
				text-align: left;
				border:0;
				width:98px;
				height:60px;}

p#tagline { position: absolute; top: 52px; left: 120px;
				width: 25%;
				margin: 0px; padding: 0px;
				text-align: left;
				font: 0.8em Arial, Helvetica, sans-serif;
				letter-spacing: 0.12em;}

div#mainpic { position: relative; top: 87px; left: 0px;
			width: 100%; height: 230px;
			margin: 0px; padding: 0px;
			background:url(../image/mainpic/mainpic111204.jpg);
			border-bottom:#D8D8D8 3px solid;}

/* -------------------------------------------header navigation links starts here --------------------------------*/

div#headernav { float: right;
				width: auto; height: auto; 
				margin: 27px 180px 0px 0px; padding: 10px;
				display: inline;}

div#headernav ul { float: right;
					margin: 0px; 					/*removes indent IE and Opera*/
					padding: 12px; 				/*removes indent Mozilla and NN7*/
					list-style-type: none;} 	/*turns off display of bullet*/	
					
div#headernav li { display:inline;
				margin: 5px;
				padding: 0px;}

div#headernav a {padding: 5px 2px 9px 0px;
			margin: 5px 0px 5px 0px;
			text-align: left; font: bold 0.95em Arial, Helvetica, sans-serif;
			letter-spacing: 0.12em; 
			text-decoration: none;
			color: #C2C2C2;
			border-bottom: 3px solid;
					border-bottom-color: #454545;}
					
#headernav a:hover, #headernav a:active,
#overlink a:link, #overlink a:visited,
#overlink a:hover, #overlink a:active {color: #FFFFFF;
					border-bottom: 3px solid;
					border-bottom-color: #9DBCFF;}

/* -------------------------------------------------------- Warning starts here ----------------------------- */

div#warning { display: none;}


/* ------------------------------------------------------- Common Font Styles Starts Here -------------------- */

h1 { font: bold 2em sans-serif; text-align: left;
			font-style: normal;
			letter-spacing: 0.5em;
			margin: 0px 0px 0px 0px;
			padding: 10px 0 0 0;}

h2 { font: bold 1.5em Arial, Helvetica, sans-serif; text-align:left;
			margin: 20px 0px 10px 0px;
			padding: 0px;
			letter-spacing: 0.25em;}

h3 {		font: bold 1.2em Arial, Helvetica, sans-serif; text-align:left;
			margin: 15px 20px 10px 0px; padding: 7px 0px 7px 20px;
			letter-spacing: 0.15em;
			color:#FFF; background: transparent;
			background-image: url(../image/bakgrunder/bkgrub1.png);
			background-position: right;
			background-repeat: no-repeat;}

h4 {		font: bold 1.1em Arial, Helvetica, sans-serif; text-align:left;
			font-style: normal;
			margin: 10px 0px 5px 20px; padding: 0px;}

#contentcelleft h4 { font: bold 1.1em Arial, Helvetica, sans-serif; text-align:left;
			font-style: normal;
			margin: 10px 0px 10px 0px; padding: 0px;}

h5 {		font: bold 0.9em/1.4em Arial, Helvetica, sans-serif; text-align:left;
			letter-spacing: 0.02em;
			width: 80%;
			margin: 15px 0px 15px 0px; padding: 0px;}
			
#contentcellmid h5 { font: bold 0.9em/1.4em Arial, Helvetica, sans-serif; text-align:left;
			letter-spacing: 0.02em;
			margin: 5px 20px 5px 20px; padding: 0px;}

			


#contentcelleft p { font: 0.9em Arial, Helvetica, sans-serif;
				line-height: 1.2;
				width: 82%;
				letter-spacing: 0.02em;
				margin: 0px 80px 0px 0px; padding: 0px;}

#contentcellmid p { font: 0.9em Arial, Helvetica, sans-serif;
				line-height: 1.2;
				letter-spacing: 0.02em;
				margin: 0px 20px 0px 20px; padding: 0px;}

#contentcellright p { font: 0.9em Arial, Helvetica, sans-serif;
				line-height: 1.2;
				letter-spacing: 0.02em;
				margin: 0px 20px 3px 20px; padding: 0px;}
				
.vittext { color:#FFFFFF; background: transparent;}
.svarttext { color:#000000; background: transparent;}
.orangetext { color:#D79132; background: transparent;}



/* -------------------------------------------------------- content styling starts here ------------------------------ */

#main a:link {color: blue; text-decoration:none;}
#main a:visited {color: blue; text-decoration:none;}
#main a:link:hover {color: red;
							text-decoration: underline;}
#main a:visited:hover {color: red; text-decoration: underline;}

#wrapper { position: relative; top: 120px; left: 0px; 
			width: 95%;
			margin-left: 0;
			text-align: left;
			padding-bottom: 15px;}

#main { display: table;
		table-layout: auto;
  		border-collapse: collapse;
  		width: 100%;}

#contentrowtop {    display: table-row;
					width: 100%;
					height: 40px;}

#contentrowtopcl {  display: table-cell;
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc1top.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrowtopcm {  display: table-cell;
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc2top.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrowtopcr {  display: table-cell;
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc3top.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrowbot { 	display: table-row;
					width: 100%;
					height: 40px;}
					
#contentrowbotcl {  display: table-cell; 	
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc1bot.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrowbotcm {  display: table-cell; 	
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc2bot.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrowbotcr {  display: table-cell; 	
					height: 40px;
					background-image: url(../image/bakgrunder/bkgrtabc3bot.jpg);
					background-position: right;
					background-repeat: no-repeat;}

#contentrow { display: table-row;}

#contentcelleft { display: table-cell;
					background-color: #FFFFFF;
					padding-left: 40px;}

#contentcellmid { display: table-cell;
					background-color: #E6E6E6;}

#contentcellright { display: table-cell;
					background-color:#C2C2C2;}
								

.smallcollumn { width: 35px;}
.smallestcollumn { width: 25px;}
.normalcollumn { width: 240px;}



#contentcellmid img{ margin:0 -20px 0 20px;}


#contentcellright img{ margin: 0 0 0 20px;}


/* ------------------------------------------------------- Index OM APM list  --------------------------- */
.factlist {  list-style-type: none; 
				list-style-image: url(../image/bakgrunder/bulletvgron.png);
				background-repeat: no-repeat;
				background-position: bottom;
				margin-bottom: 30px;
				margin-left: 22px;
				font: 0.95em Arial, Helvetica, sans-serif;}

.factlist li { padding-bottom: 8px;}

.factlist a { padding-left: 15px;}



.pdftlist {  list-style-type: none; 
				list-style-image: url(../image/ikoner/pdf32.png);
				background-repeat: no-repeat;
				background-position: top;
				margin-bottom: 5px;
				margin-left: 60px;
				font: 0.95em Arial, Helvetica, sans-serif;}

.pdftlist li { padding-bottom: 0px;
				padding-top: 5px;}

.pdftlist a { padding-left: 10px;}


/* ------------------------------------------------- PRODUCT LIST    ------------------------- */
.productlist {  list-style-type: none; 
				list-style-image: url(../image/bakgrunder/bulletvgron.png);
				background-repeat: no-repeat;
				background-position: bottom;
				margin-bottom: 50px;
				margin-left: 22px;
				font: 0.95em Arial, Helvetica, sans-serif;}

.productlist li { padding-bottom: 8px;}

.productlist a { padding-left: 15px;}


/* ---------------------------------------------------- UL list productlinks starts here ------------------------------ */

#productlinks { margin: 0 0 100px 0;
				padding: 0;}
#productlinks ul { list-style-type: none;
				margin: 20px 0px;}

#productlinks li { }

#productlinks a { font: bold 1em Arial, Helvetica, sans-serif;
			letter-spacing: 0.1em;}

#productlinks h4 {margin: 10px 0 0 0;
					padding: 20px 0;}


									
/* ---------------------------------------------------------------- image styling starts here ---------------------------- */

.imgcelleft {  margin: 10px 0 20px 0px; padding: 0px;}

img.foretaget { margin: 10px 5px 30px 0px;
				width: 250px;
				height: 175px;
				border: 2px solid #c2c2c2;}

img.product { margin: 10px 5px 30px 0px;
				width: 250px;
				height: 175px;
				border: 2px solid #c2c2c2;}

img.kapacitet { margin: 10px 5px 30px 0px;
				width: 250px;
				height: 175px;
				border: 2px solid #c2c2c2;}

img.frame { border: 1px solid #c2c2c2;} 
img.inline { vertical-align: top;
			float: right;
			margin-top: -60px;
			margin-right: -30px;}
			
/* ------------------------------------------------------------ arkiv starts here --------------------------------------- */

.arkivnav ul { margin: 0; 				
					padding: 0; 			
					list-style-type: none;}
					
.arkivnav li { display:inline;
				margin: 0;
				padding: 0;}

.arkivnav a {padding: 40px 80px 30px 0px;
			margin: 0;
			background-image: url(../image/ikoner/004259-3d-60.png);
			background-repeat: no-repeat;
			background-position: right;
 			font: bold 1em Arial, Helvetica, sans-serif;}
					
.arkivnav a:hover { background-image: url(../image/ikoner/105122-3d-60.png);}

/* ------------------------------------------------- */
.arkivnavback ul { margin: 0; 				
					padding: 0; 			
					list-style-type: none;}
					
.arkivnavback li { display:inline;
				margin: 0;
				padding: 0;}

.arkivnavback a {padding: 40px 80px 30px 0;
			margin: 0;
			background-image: url(../image/ikoner/004255-3d-60.png);
			background-repeat: no-repeat;
			background-position: right;
 			font: bold 1em Arial, Helvetica, sans-serif;}
					
.arkivnavback a:hover { background-image: url(../image/ikoner/105118-3d-60.png);}

.spacer { height: 10px;}
.endspacer { height: 10px;
			margin: 0 20px 10px 20px;
			border-bottom: #454545 1px dotted;}


/* ------------------------------------------------ Bildarkiv starts here -------------------------------------- */

.thumbwrap { position: relative;
				width: 100%;
				margin: 0 0 30px 0;
				padding: 0;}

img.thumb { border: 2px solid #c2c2c2;
			width: 200px;
			height: 135px;
			margin: 10px 5px 15px 0px;}

.thumbwrap p { margin: 0;
				width: 60%;}

.italic { font-style: italic;}

/* --------------------------------------------------------------- kontakt styling starts here ------------------------ */

#kontaktwrap { position: relative;
				width: 80%;}

.kontaktrubrik { width: 100%;
				background-color: #CCCCCC;}
.kontaktrow { display: table-row;}
.kontaktcell { display: table-cell;
				width: auto;
				overflow: hidden;}
#kontaktwrap h2 { margin-top: 30px;
					padding: 5px 0 5px 10px;}
#kontaktwrap h5 { margin: 10px 0 2px 0;}

				
#mapwrap { position: relative;
				width: 80%;}

.maprubrik { width: 100%;
				background-color: #CCCCCC;}
#mapwrap h2 { margin-top: 60px;
					padding: 5px 0 5px 10px;}
#mapwrap p { margin-bottom: 10px;}


/* --------------------------------------------------------------- kapacitet styling starts here ------------------------ */

#kapacitetwrap { width: 100%;}

.kapacitetrubrik { width: 100%;
				background-color: #CCCCCC;}

.kapacitetrow { display: table-row;
				border-top: #CCCCCC 1px solid;}

.kapacitetcelleft { display: table-cell;
					width: 270px;
				overflow: hidden;
				vertical-align: top;
				padding-bottom: 20px;
				padding-top: 25px;}
				
.kapacitetcellmid { display: table-cell;
					width: 215px;
					text-align: left;
				overflow: hidden;
				vertical-align: top;
				padding-bottom: 20px;
				padding-top: 25px;}
				
.kapacitetcellright { display: table-cell;
					width: 480px;
				overflow: hidden;
				vertical-align: top;
				padding-bottom: 20px;
				padding-top: 25px;}
				
.kontaktperson { margin: 20px 0px 20px 0px;}

#kapacitetwrap h5 { margin: 0px 0 0px 30px;
					line-height: 22px;}

#kapacitetwrap p { margin: 0px 0 0px 10px;
					line-height: 22px;}				
/* ---------------------------------------------------------------- Google map starts here -------------------- 

.map { width: 100%; height: 400px;
		border: 2px solid #c2c2c2;
		overflow: hidden;
		margin: 0;
		padding: 0;}

.maplinks { text-align: left;
			color: #0000FF;}
*/
/* ----------------------------------------------------------------- foot starts here -------------------------- */
div#validwrap { float: left;
				width: 200px;
				margin: 0 0px 0 40px;
				padding: 0;}

img.validate { display: inline; 
			padding: 0 5px 0 0;
			width: 88px;
			height: 31px;
			border:0;}

div#foot { margin: 15px 0 0 0;
			padding: 10px 0 0 0;
			width: 100%;
			color: #FFFFFF;
			background-color: #D79132;
			background-image: url(../image/bakgrunder/graorange45454510tr.jpg);
			background-repeat: no-repeat;
			background-position: right top;
			overflow: hidden;}

div#foottextwrap {width: auto;
					height: auto;
					vertical-align: top;
					padding: 0 10% 0 0;}

p.topline { margin: 0px; padding: 0px;
					font: bold 11px Arial, Helvetica, sans-serif; letter-spacing: 2px; line-height: 16px;
					text-align: center;}

p.bottomline { margin: 0px; padding: 0px;
						font: bold 11px Arial, Helvetica, sans-serif; letter-spacing: 2px; line-height: 16px;
						text-align: center;}

div#cornerfootbot { width: 100%; height: 10px;
			margin: 0px; padding: 0px;
			background: url(../image/bakgrunder/graorange45454510br.jpg) no-repeat right top;}


div#foot a {text-decoration: none;
			font: bold 11px Arial, Helvetica, sans-serif; letter-spacing: 2px; line-height: 16px;}

div#foot a:link {color: #FFFFFF;}
div#foot a:visited {color: #FFFFFF;}
div#foot a:hover { color: #D73244; text-decoration: underline;}
div#foot a:active {color: #FFFFFF;}

/* ------------------------------------ Lightbox starts here -------------------------------------------------- */

#lightbox{	position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none;}

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 5px auto 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../image/bildarkiv/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../image/bildarkiv/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 12px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

/* ------------------------------------ translate ------------------------------------- */

div#google_translate_element { position: absolute;
								right: 10px;
								top: 10px;
								text-decoration: none;
								border-left: 0;
								padding: 5px 15px 5px 5px;
								background: transparent;
			background-image: url(../image/bakgrunder/bkgrub1.png);
			background-position: right;
			background-repeat: repeat-y;
			text-align: left;
			line-height: 1.5;}

select { width: 95px;
		color: #ccc;
		background-color: #454545;
		text-align: center;}


#google_translate_element a:link,
#google_translate_element a:hover,
#google_translate_element a:active { text-decoration: none; border: 0;}