﻿/* Design & Coding done by Johanna Svanström.
	 
	 johanna@bymind.com
	 http://www.bayminddesing.se			*/


/* Div styles
----------------------------------------------- */

html, body {
margin:						0;
padding:					0;	
color:						#000; 
background :				#ccc url(../../img/bg.png) repeat-y 50%;
background-attachment:		fixed;
background-color:			#fff;
font:						small Arial, Helvetica, Verdana, sans-serif;
}

#canvas {
background-color:			#fff;
color:						#000;
margin-left:				auto;
margin-right:				auto;
width:						988px;
height:						100%;
position:					relative;
padding:					1px 1px 1px 1px;
}

img {
border:						none;
}

/* Loggan ligger här
----------------------------------------------- */

#header {
width:						100%;
position:                   relative;
margin: 0;
padding:0;
}

	#header img {
	margin:		  		 	  0px 30px 0px 0px;
	border:					none;	
		}

/* Menyn
----------------------------------------------- */

#navigation {
width:						989px;
position:                   relative; 
margin: 0;
padding:0;
}
	
	#navigation ul {			
	background:				#464749; 
	font-size:				13px;
	text-align:				left;
	margin:					0 0 3px 0;
	padding:		 		0.8em 0 0.8em 0;
	width:					100%;
	}
			
	#navigation li {
	display:				inline;
	color:					#fff;
	margin:					0;
	padding:				0;
	}
	
	#navigation a:link, #navigation a:visited {
	text-decoration:		none;
	color:					#fff;
	padding:				0.5em 0.8em 0.5em 0.8em;
	margin-right:			0px;
	}
			
	#navigation a:hover	{
	color:					#fff;
	background-color:		#ee1b2e;
	margin:					0;
	}
/*--slut Menyn--*/


/* Topbilder
----------------------------------------------- */	
	
#top1 {
width:						992px;	
position:					relative;
margin-top:					0px;
padding-top:0;
	}
	
	#leftie {
	float:					left;
	position:				relative;
	width:					500px;
	height:					200px;
	
	margin-right:			4px;
	margin-bottom:			3px;
	/*background-image:		url(../../img/greenrutasmal.jpg)*/
	background-color:		black;
		}
		
	#middie {
	float:					left;
	position:				relative;
	width:					240px;
	height:					200px;
	
	margin-right:			4px;
	margin-bottom:			3px;
	background-image:		url(power_ad.jpg)
	/*background-image:		url(../../img/orangerutasmaltext.jpg)*/
		}
		
	#rightie {
	float:					left;
	position:				relative;
	width:					240px;
	height:					200px;
	
	margin-bottom:			3px;
	background-image:		url(../../img/greyrutasmal.jpg)
		}
	
	
#top2 {
width:						992px;	
position:					relative;
margin:0;
padding:0;
}
	
	#leftip {
	float:					left;
	width:					240px;
	height:					100px;
	margin-top:             0px;
	margin-right:			4px;
	margin-bottom:			3px;
	background-image:		url(../../img/orangetop2.jpg)
		}
		
	#rightip {
	float:					left;
	width:					744px;
	height:					100px;
	margin-top:             0px;
	margin-bottom:			3px;
	background-image:		url(../../img/greentop2.jpg)
		}
/*--slut Topbilder--*/


/* Huvudinnehåll - texter mm
----------------------------------------------- */	
	
#main {
	position:				relative;
	top:					0px;
	left:					0;
	width:					100%;
	margin-top:				0px;
	padding-top:0;
	}
	
	.img {
	float:					left;
	width:					150px;
	}
	
	/*#left {
	float:					left;
	position:				relative;
	width:					230px;
	margin-right:			2px;
	padding-left:			10px;
	margin-left:			0px;
	background-color:		#deeccf;
	}*/
	
	#left {
	float:					left;
	position:				relative;
	width:					239px;
	margin-right:			2px;
	margin-top:				-13px;
	padding-left:			0px;
	margin-left:			-5px;
	background-color:		#fff;
	}
	
		.leftinner {
		border-bottom:			1px solid #fff;
		width:					239px;
		height:					115px;
		margin-top:				5px;
		margin-bottom:          10px;
		
		}
		
		
	
		#left a:link #left a:visited{
		 text-decoration:	none;
		 color:				Maroon;
		 font-size:			13px;
		 font-style:		oblique;
		}
	
	
		
		#prod {
		border-bottom:		solid 1px black;
		padding-bottom:		30px;
		}
	
			#prod  img p{
			float:			left;
			padding-right:	20px;
		}
	
	#middle {
	float:					left;
	position:				relative;
	width:					435px;
	margin-right:			0px;
	margin-left:			-0px;
	padding-left:			30px;
	padding-right:			0px;
	}
		
		#middle img {
		padding-left:		0px;	
		}
	
	#right 
	{
	
	float:					left;
	width:					235px;
	margin-right:			0px;
	border:					1px solid black;
	}
/*--slut Huvudinnehåll--*/

/* Produkter mm - texter mm
----------------------------------------------- */	
	
#mainie {
	position:				relative;
	top:					0;
	left:					0;
	width:					100%;
	margin-top:				4px;
	margin-bottom:			20px;
		}
	
		#content {
		margin:				0 0px 0 0;
		float:left;
		background-color:	#fff;
		color:				#000;
		}
		
			#content .inner {
			margin:			  10px 30px 10px 0px;		
			}
			
			#content .inner h2 {
			color:			#245185;
			padding-bottom: 0.2em;
			border-bottom:	1px solid #464749;
			font-size:		14px;
			}
			
			#content .inner h3 {
			font-size:		16px;
			padding-bottom: 0.2em;
			border-bottom:	1px solid #464749;
			margin-bottom:	30px;
			}
			
			#content .inner h3 a:link, #content .inner h3 a:visited {
			color:			#245185;			
			}						
														
			#content .inner p {
			color:			#464749;
			font-size:		12px;
			margin-top:		20px;
			}
				
			#content .inner p.author {
			font-weight:	bold;
			}
		
			#content .inner p.more {
			margin-top:		0;
			text-align:		right;
			
			}
		
			#content .inner p.more a:link, #content .inner p.more a:visited {
			padding-left:	14px;
			font-size:		12px;
			color:			#b71f2c;
			}	
			
			#content .inner p.content a:link, #content .inner p.more a:visited {
			padding-right:	30px;
			font-size:		12px;
			color:			#b71f2c;
			}	
			
			#content .inner p.mic a:link, #content .inner p.mic a:visited {
			font-size:		12px;
			color:			#b71f2c;
			}			
			
			#content .inner .features li img {
			float:			left;
			margin:			0px 20px 0px 0;
			}
			
			#content .inner ul.features {
			margin:			0;
			padding:		0;
			list-style:		none;
			}


			
		#extraContent {
		position:			relative;
		float:right;
		width:				239px;
		min-height:			400px;
		background:			url(../../img/greybg.png) repeat-x left top;
	
		color:				#464749;
		margin:				0;
		padding:			0px 0 0 0;
		}
		
			#extraContent h3 {
			font-size:		12px;
			margin:			0;
			padding:		0.2em 0 0 10px;
			font-weight:	bold;
			}
		
			#extraContent h2 {
			font-size:		14px;
			margin:			0;
			padding:		0.2em 0 0 10px;
			font-weight:	bold;
			}
			
			#extraContent .inner {
			padding:		10px;
			}
			
				
			#extraContent a:link, #extraContent a:visited {
			color:			#000;
			}
			
			#extraContent p {
			padding:		 0 10px 20px 20px;
			font-size:		12px;
			line-height:	1.4em;
			}
						
			#extraContent p.more {
			clear:		right;
			margin:		 -20px 30px 0 0;
			text-align: right;
			}
			
			#extraContent p.mac {
			clear:		right;
			margin:		 15px 0 0 0;
			text-align: right;
			}
		
				#extraContent p.more a:link, #extraContent p.more a:visited {
				color:	#000;
				padding-left: 14px;
				}
				
		
			
			#extraContent .date {
			font-weight:bold;
			display:	block;
			}
		
/*--slut Huvudinnehåll--*/


/* Footer
----------------------------------------------- */	
	
#footer {
width:					98%;
position:				relative;
clear:both;
padding:				10px;
border-bottom:			solid 1px #000;
border-top:				solid 1px #000;
margin-bottom:			5px;
	}
	
.drop 
{
	position: absolute; 
	width: 3;  
	/*filter: flipV(), flipH(); */
	font-size: 40; 
	color: blue 
	}
	

/* Table
----------------------------------------------- */	
	
#ulnorge li {
 list-style-type:none;
 
height:					20px;	}
	
.drop 
{
	position: absolute; 
	width: 3;  
	/*filter: flipV(), flipH(); */
	font-size: 40; 
	color: blue 
	}
	
.tableprod 
{
	color: #464749;
	}
	
	/* Jquery galleri Lightbox  
---------------------------------------------------------*/

/* Färgen på lightboxen */
.galleria-container {
    position: relative;
    overflow: hidden;
    background: #f3f3f3;
}


.galleria-container img {
    -moz-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;

}

.galleria-stage {
    position: absolute;
    top: 15px;
    bottom: 60px;
    left: 10px;
    right: 10px;
    overflow:hidden;   
    
}
.galleria-thumbnails-container {
    height: 50px;
    bottom: 0;
    position: absolute;
    left: 10px;
    right: 10px;
    z-index: 2;
}
.galleria-carousel .galleria-thumbnails-list {
    margin-left: 30px;
    margin-right: 30px;
}
.galleria-thumbnails .galleria-image {
    height: 40px;
    width: 60px;
    background: #000;
    margin: 0 5px 0 0;
    border: 1px solid #000;
    float: left;
    cursor: pointer;
}
.galleria-counter {
    position: absolute;
    bottom: 10px;
    left: 10px;
    text-align: right;
    color: #000;
    font: normal 14px/1 arial,sans-serif;
    z-index: 1;
}
.galleria-loader {
    background: #000;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    display: none;
    background: url(classic-loader.gif) no-repeat 2px 2px;
}
.galleria-info {
    width: 40%;
    top: 15px;
    left: 15px;
    z-index: 2;
    position: absolute;
    
	
}
.galleria-info-text {
    background-color: #8c8b8b;
    padding: 12px;
    display: none;
    
    
 }
.galleria-info-title {
    font: bold 12px/1.1 arial,sans-serif;
    margin: 0;
    color: #fff;
	margin-bottom: 7px;
	
}
.galleria-info-description {
    font: italic 12px/1.4 georgia,serif;
    margin: 0;
    color: #dbdbdb;
}
.galleria-info-close {
    width: 9px;
    height: 9px;
    position: absolute;
    top: 5px;
    right: 5px;
    background-position: -653px -11px;
    opacity: .5;
    filter: alpha(opacity=50);
    cursor: pointer;
    display: none;
}
.notouch .galleria-info-close:hover{
    opacity:1;
    filter: alpha(opacity=100);
}
.touch .galleria-info-close:active{
    opacity:1;
    filter: alpha(opacity=100);
}

/* i:et på lightboxen */
.galleria-info-link {
    background-position: -669px -5px;
    opacity: .7;
    filter: alpha(opacity=70);
    position: absolute;
    width: 20px;
    height: 20px;
    cursor: pointer;
 }
 
.notouch .galleria-info-link:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}
.touch .galleria-info-link:active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.galleria-image-nav {
    position: absolute;
    top: 50%;
    margin-top: -62px;
    width: 100%;
    height: 62px;
    left: 0;
}

.galleria-image-nav-left,
.galleria-image-nav-right {
    opacity: .3;
    filter: alpha(opacity=30);
    cursor: pointer;
    width: 62px;
    height: 124px;
    position: absolute;
    left: 10px;
    z-index: 2;
    background-position: 0 46px;
}
.galleria-image-nav-right {
    left: auto;
    right: 10px;
    background-position: -254px 46px;
    z-index: 2;
}
.notouch .galleria-image-nav-left:hover,
.notouch .galleria-image-nav-right:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}
.touch .galleria-image-nav-left:active,
.touch .galleria-image-nav-right:active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.galleria-thumb-nav-left,
.galleria-thumb-nav-right {
    cursor: pointer;
    display: none;
    background-position: -495px 5px;
    position: absolute;
    left: 0;
    top: 0;
    height: 40px;
    width: 23px;
    z-index: 3;
    opacity: .8;
    filter: alpha(opacity=80);
  
}
.galleria-thumb-nav-right {
    background-position: -578px 5px;
    border-right: none;
    right: 0;
    left: auto;
}
.galleria-thumbnails-container .disabled {
    opacity: .2;
    filter: alpha(opacity=20);
    cursor: default;
}
.notouch .galleria-thumb-nav-left:hover,
.notouch .galleria-thumb-nav-right:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    background-color: #111;
}
.touch .galleria-thumb-nav-left:active,
.touch .galleria-thumb-nav-right:active {
    opacity: 1;
    filter: alpha(opacity=100);
    background-color: #111;
}
.notouch .galleria-thumbnails-container .disabled:hover {
    opacity: .2;
    filter: alpha(opacity=20);
    background-color: transparent;
}

.galleria-carousel .galleria-thumb-nav-left,
.galleria-carousel .galleria-thumb-nav-right {
    display: block;
}
.galleria-thumb-nav-left,
.galleria-thumb-nav-right,
.galleria-info-link,
.galleria-info-close,
.galleria-image-nav-left,
.galleria-image-nav-right {
    background-image: url(classic-map.png);
    background-repeat: no-repeat;
}


 /* This rule is read by Galleria to define the gallery height: */
            #galleria{height:400px; width:625px; margin-top:40px; margin-left:auto; margin-right:auto;

/* Detta är endast för att få skugga på själva lightboxen */		
    -moz-box-shadow: 0px 0px 8px #cbcbcb;
	-webkit-box-shadow: 0px 0px 8px #cbcbcb;
	box-shadow: 0px 0px 8px #cbcbcb;
	/* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=145, Color='#cbcbcb')";}
			
	#link{height:405px; width:300px; float:left; padding-left:15px; padding-right:10px; border:solid; border-color:#606060;
			
	-moz-box-shadow: 1px 1px 2px #cbcbcb;
	-webkit-box-shadow: 1px 1px 2px #cbcbcb;
	box-shadow: 1px 1px 2px #cbcbcb;
	/* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=145, Color='#cbcbcb')";}

