﻿@charset "utf-8";
/* CSS Document */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	color: black;
	background: url(images/bg.png) repeat-y top center;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
strong{
	font-size:13px;
	font-weight:bold;
	}

/********************************************/

html {overflow-y: scroll;}

body{
	font-family: Arial, Helvetica, sans-serif;
	color:#000;
	}

#wrapper{
	width: 920px;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	border-spacing:10px;
	border-left:1px solid #AAAAAA;
	border-right:1px solid #AAAAAA;
	border-bottom:medium solid #893557;
	background-color:#d7d7d7;
	}
.bordertop, .bordertop2{
	background:url(images/borders/bordertop.png);
	height:8px;
	margin-left:5px;
	}
.borderbottom, .borderbottom2{
	background:url(images/borders/borderbottom.png);
	height:8px;
	margin-left:5px;
	margin-bottom:5px;
	}
.big_bordertop{
	background:url(images/borders/big_bordertop.png);
	height:8px;
	margin-left:5px;
	}
.big_borderbottom{
	background:url(images/borders/big_borderbottom.png);
	height:8px;
	margin-left:5px;
	}
#top{
	background:url(images/header920.jpg);
	width:920px;
	height:71px;
	}
#headerlink{
	display:block;
	width:300px;
	height:79px;
	}
	
/************INDEX INNEHÅLL*********/
#maincontent{
	min-height:700px;
	background:#d7d7d7;
	padding-top:5px;
	}
#flash{
	background:url(images/borders/flashborder.gif) repeat-y;
	float:left;
	width: 540px;
	height: 336px;
	overflow:hidden;
	margin-left:12px;
	padding: 0 8px;
	}
#imageContainer{
	overflow:hidden;
	}

#inspirationbutton{
	position:relative;
	left:240px;
	bottom:40px;
	z-index:500;
	}
#righttop{
	background:url(images/borders/righttopborder.gif) repeat-y;
	float:right;
	width: 320px;
	height: 336px;
	overflow:hidden;
	margin-right:12px;
	padding:0 8px;
	}
#righttop img{
	opacity:0.5;
	filter: alpha(opacity = 50); 
	}
#righttop img:hover{
	opacity:1;
	filter: alpha(opacity = 100); 
	}

#news{
	float:left;
	width:536px;
	height: 300px;
	margin: 0px 0 0px 0;
	padding:10px;
	background: url(images/borders/flashborder.gif) #fff repeat-y;
	margin-left:12px;
	}
#news p{
	margin:0px 0px 10px 10px;
	text-align:left;
	}
#news h1{
	margin: 10px 0 25px 10px;
	}
	
#welcomediv{
	float:left;
	width:330px;
	}

#contactlink{
	display:block;
	padding:5px;
	height:242px;
	margin-left:350px;
	margin-top:55px;
	width:171px;
	text-decoration:none;
	color:#555;
	font-size:13px;
	padding-left:10px;
	border-left:1px dotted #aaa;
	font-weight:bold;
	position:absolute;
	right:361px;
	}
#contactimg{
	left:1px;
	position:relative;
	top:94px;
	background-image:url(images/kontakt2.png);
	display:block;
	height:164px;
	top:94px;
	width:185px;
	z-index:3;
	}
#contactlink:hover{
	background:#eee;
	}
#rightmenu{
	float:right;
	width:320px;
	height: 320px;
	margin: 0px 12px 0px 0;
	padding: 0 8px;
	background: url(images/borders/righttopborder.gif) #fff repeat-y;
	}
	
#footer{
	position:relative;
	height:18px;
	text-align:center;
	margin-top:4px;
	font-size:12px;
	color:#555;
	}
.clear{
	clear: both;
	height: 0;
	visibility: hidden;
	display: block;
	}

.fullpage_content{
	background:url(images/borders/big_border.gif) repeat-y;
	padding: 10px 13px 1px 8px;
	margin-left:5px;
	min-height:670px;
	}

/*********TEXT***********/

p{
	margin:10px 0 10px 0;
	font-size: 13px;
	}
h1,h2{
	margin:10px 0 20px 0;
	font-size:22px;
	font-weight:100;
	color:#006600;
	}
h2{
	margin:0px 0 20px 0;
	font-size:18px;
	font-weight:100;
	color:#006600;
	}
	
li{
	font-size: 13px;
	}
	
a{

	color:#006600;
	}
a:hover{
	color:#39c339;
	text-decoration:underline;
	}
	

	
/***********BANNER********/
.banner{
	display:block;
	height:84px;
	opacity:1;
	}
.banner:hover{
	opacity:0.8;
	filter:alpha(opacity=80);
	}

#banner1{
	background-image: url(images/banner/tomtbanner.jpg);
	}
#banner2{
	background-image: url(images/banner/ombyggnationbanner.jpg);
	}
#banner3{
	background-image: url(images/banner/principbanner.jpg);
	}
#banner4{
	background-image: url(images/banner/garagebanner.jpg);
	}
	
/*********TOPMENU********/

.menuitem{background-image: url(images/meny/meny.gif);}
#menuitem1{background-position:0 0;}
#menuitem2{background-position:-114px 0;}
#menuitem3{background-position:-228px 0;}
#menuitem4{background-position:-342px 0;}
#menuitem5{background-position:-456px 0;}
#menuitem6{background-position:-570px 0;}
#menuitem7{background-position:-685px 0;}
#menuitem8{background-position:-799px 0;}
#menuitem1:hover{background-position:0 40px;}
#menuitem2:hover{background-position:-114px 40px;}
#menuitem3:hover{background-position:-228px 40px;}
#menuitem4:hover{background-position:-342px 40px;}
#menuitem5:hover{background-position:-456px 40px;}
#menuitem6:hover{background-position:-570px 40px;}
#menuitem7:hover{background-position:-685px 40px;}
#menuitem8:hover{background-position:-799px 40px;}

#topmenu{
	height:40px;
	position:relative;
	}
	
#topmenulist{list-style-type:none; position: relative; height: 40px; font-size:14px;}
#topmenulist li{ float:left; height: 40px; width: 115px;}
#topmenulist li a{ float:left; height: 40px; width: 114px;}
#topmenulist li a{ text-decoration:none; color:#bbb; font-weight:bold; font-size:12px; }

.menudots{
	position:relative;
	}
/***********************************/

/******************OM OSS***********/
#abouttext{
	float:left;
	padding:20px 10px 20px 20px;
	width:480px;
	text-align:justify;
	}
#abouttext li{
	list-style:circle;
	margin-left:28px;
}
#kontakt{
	margin-left: 510px;
	padding:20px 20px 0px 10px;
	width: 350px;
	}
#hitta{
	margin-left: 510px;
	padding:20px 20px 20px 10px;
	width: 350px;
	}
.profil{
	font-size:12px;
	margin-bottom:	15px;
	}
.left{
	float:left;
	}
.right{
	margin-left:170px;
	}
.greyback{
	width:160px;
	font-size:13px;
	color:#333;
	padding:10px;
	background-color:#eee;
	}
.mailto{
	text-decoration:none;
	border-bottom:1px dotted #aaa;
	color:#333;
	}
.mailto:hover{
	color:#aaa;
	}
/*********************GALLERI*************/
#preview{
	position:absolute;
	border:1px solid #aaa;
	background:#fff;
	padding:5px;
	display:none;
	color:#333;
	float:left;
	}
.thumb{
	border:1px solid #aaa;
	background:#fff;
	padding:5px;
	margin:8px 0 0 19px;
	color:#333;
	width:185px;
	}
.thumb:hover{
	/*opacity:0.9;
	filter:alpha(opacity=90);*/
	border-color:#217A14;
	}
#aboutgalleri{
	float:left;
	padding:20px 10px 20px 20px;
	text-align:left;
	width:410px;
    }
#aboutgalleriinfo{
	float:left;
	margin-top:44px;
	border-top:1px dotted #AAAAAA;
	}
/*********************TOMTER*************/
#abouttomter{
	border-right:1px solid #AAAAAA;
	width:340px;
	padding:20px;
	float:left;
	}
#abouttomtertext{
	width:300px;
	}
.tomtomrade{
	display:block;
	text-decoration:none;
	}
.tomtomrade:hover{
	background:#fafafa;
	}
.tomtomrade, .tomtomrade:hover, .tomtomrade:visited{
	color:#000;
	text-decoration:none;
	}
.tomtomrade h3{
	color:#006600;
	font-size:13px;
	font-weight:bold;
	}
.tomtomrade p{
	font-size:12px;
	}
.table{
	padding:0 20px;
	width:855px;
	font-size:12px;
	}
.tomtdiv{
	border-top:	1px dotted #aaa;
	
	}
.titlerow{	
	height:20px;
	font-weight:bold;
	}
.titlerow2{
	height:15px;
	color:#006600;
	padding-top:5px;
	font-weight:bold;
	}
.titlerow2 div{
	float: left;
	}
.titlerow div{
	float: left;
	}
.stad{width:140px;}
.omrade{width:110px;}
.gata{width:200px;}
.area{width:100px;}
.pris{width:80px;}
.tomttext{
	padding-top: 7px;
	padding-bottom:7px;
	float:left;
	width:630px;
	}
.lasmer{
	float:right;
	padding-top:7px;
	}
.tomtbilder{
	padding:10px;
	float:right;
	}
.tomtbild{
	width:100px;
	padding:0 5px;
	margin-right:30px;
	}
.alt{
	background:#eee;
	}
/*********************VÅRA HUS*************/
.innercontent{
	padding:0px 0 15px 15px;
	width:864px;
	position:relative;
	}
#varadiv{
	position: relative;
}
#husinfo {
	left:530px;
	position:absolute;
	top:5px;
	padding-right:50px;
	width:280px;
	}
#husinfo h1{
	font-size:32px;
	font-weight:bold;
	}
#husinfo p{
	font-size:13px;
	font-weight:bold;
	color:#636363;
	}
#energihus{
	position:absolute;
	top:180px;
	left:530px;
	width:260px;
	padding:5px;
	background:#e1eed1;
	border:1px solid #ddd;
	}
#energihus p{
	margin:0;
	}
.varakategori{
	margin-top:12px;
	float:left;
	width:423px;
	height:219px;
	}
.altkategori{
	margin-left:17px;
	}
.kategoriinfo{margin-left:20px;margin-top:15px;width:260px;}
.altinfo{margin-left:155px;}
.kategoriinfo h1{font-size:32px;font-weight:bold;}
.kategoriinfo p{font-size:13px;font-weight:bold;color:#636363;}
.kategoriinfo a{float:right;font-size:13px;font-weight:bold;margin-right:20px;text-decoration:none;}


#cat1{background-image:url(images/varahus/principsektion.jpg);}
#cat2{background-image:url(images/varahus/process.jpg);}
#cat3{background-image:url(images/varahus/leverantorer.jpg);}
#cat4{background-image:url(images/varahus/sabyggervi.jpg);}
.varakategorismall{
	float:left;
	padding:0 6px;
	margin-bottom:20px;
	opacity: 0.6;
	filter: alpha(opacity = 60);
	}
.varakategorismall.active,.varakategorismall:hover{
	opacity: 1;
	filter: alpha(opacity = 100);
	}
#specialkategori{
	margin-left:15px;
	}
/*********************PRINCIPSEKTION*************/
.princip{
	position:relative;
	padding:0px 20px 0px 20px;
	}
.principtitel{
	margin:30px 20px 10px 20px;
	padding-top:20px;
	border-bottom:1px solid #ddd;
	}
.principtitel2{
	border-bottom:1px solid #DDDDDD;
	}	
.principbild{
	width:550px;
	float:right;
	padding:5px;
	border:1px solid #bbbbbb;
	}
.halfpagebox{
	width: 350px;
	display:block;
	float:left;
	}
.halfpagepic{
	width: 462px;
	float:right;
	padding:5px;
	}
.principlista{
	padding-top:10px;
	}
.principlista li{
	margin-bottom:15px;
	font-weight:bold;
	}
/****************LEVERANTORER********************/
.ui-widget { 
}
12.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { 
}
13.ui-widget-content {  
	background: #ffffff url(images/ui-bg_glass_75_ffffff_1x400.png) 0 0 repeat-x; 
	color: #222222;
}
.ui-tabs { padding: 20px 0 0 0; zoom: 1; }
.ui-tabs .ui-tabs-nav { list-style: none; float:left; height:200px;position: relative; padding: .2em .2em 0; }
.ui-tabs .ui-tabs-nav li { position: relative;border-bottom-width: 0 !important; margin: 0 .2em 5px 0; padding: 0; }
.ui-tabs .ui-tabs-nav li a {text-decoration: none; padding: .5em 1em; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { border-bottom-width: 0;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text;  color:#006600;}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border:1px solid #aaa; background: none; height:150px;
margin-left:100px;}
.ui-tabs .ui-tabs-hide { display: none !important; }
/************ENERGIHUS******************/
.infobild{
	float:right;
	width:395px;
	border:4px solid #BBBBBB;
	padding:5px;
	margin:10px 20px 0;
	}
.infobox{
	width:419px;
	padding:20px 0 0 20px;
	float:left;
	}
	
/**********KÖPPROCESSON****************/
.processdiv{
	padding:50px 20px 0 20px;
	width:384px;
	height: 217px;
	background:url(images/process/divback.jpg) no-repeat 0px 18px;
	position:relative;
	float:left;
	margin-left:15px;
	}
.number{
	left:0;
	position:absolute;
	top:3px;
}
.processImg{
	right:0;
	position:absolute;
	bottom:0px;
}
/**********GARAGE****************/
#garagetitel{
	border-bottom:1px solid #aaa;
	}
#garageinfo{
	margin:30px 0 0 40px;
	width:530px;
	height:385px;
	border-bottom:1px solid #aaa;
	position: relative;
	}
#garagebild{
	float:right;
	margin:56px 40px 0 0;
	}
#column1{
	width:255px;
	padding-right:10px;
	position:absolute;
	top:37px;
	}
#column2{
	position:absolute;
	left:275px;
	width: 255px;
	top:37px;
	}
.garagethumb{
	background:#FFFFFF none repeat scroll 0 0;
	border:1px solid #AAAAAA;
	color:#333333;
	margin:40px 0 0 40px;
	padding:5px;
	width:185px;
	float:left;
	}
.garagethumb:hover{
	border-color:#217A14;
	}
#middlethumb{
	margin: 40px 72px 0 112px;
	}
.bottom{
height:50px;
}
/**********OMBYGGNATION****************/
#citatruta{
	width:439px;
	height:272px;
	background: url(images/ombyggnation/citat.jpg);
	float:right;
	position:relative;
	}
#citatbild{
	position:absolute;
	right:15px;
	top:25px;
	}
#citat{
	width:220px;
	position:absolute;
	left:20px;
	top:10px;
	font-size:20px;
	color:#999;
	}
#citatlink{
	color:#3B883B;
	font-size:13px;
	left:195px;
	position:absolute;
	text-decoration:none;
	top:190px;
	width:110px;
	}
/********BYGGVAROR************/
#bygginfo{
	margin:30px 0 0 40px;
	width:530px;
	height:150px;
	position: relative;
	}
#byggvarortitel{
	border-bottom:1px solid #aaa;
	}
#columnbygg{
	width:530px;
	padding-right:10px;
	position:absolute;
	top:37px;
	}
#lager{
	margin:30px 0 0 40px;
	width:530px;
	position: relative;
	}
#columnlager{
	width:530px;
	padding-right:10px;
	position:absolute;
	top:37px;
	}
#byggvarortitel{
	border-bottom:1px solid #aaa;
	}
.lagerlista{
	padding-top:70px;
	padding-bottom:10px;
	}
#listbox{
	margin:30px 0 0 40px;
	width:530px;
	position: relative;
	}
#listtitel{
	font-weight:bold;
	}


	



