/*
   main.css
   Brukspecialisten
   
   Created by Patrik Wilhelmsson on 2008-09-14.
   Copyright 2008 Media Tech Design. All rights reserved.
*/

body					{ background: #01abc4;}
body#chat, body#villkor	{ background: #FFF; padding: 5px;}
body#admin				{ background: #000;}
body#intranet			{ background: #BBBDBE;}

/* LOGIN */
body#login				{ background: #F0F0F0;}
#login #container		{ padding-top: 50px; text-align: center;}
#login #modal			{ background: #FFF; width: 500px; border: 10px solid #CCC; text-align: left; margin: 0 auto;}
#login #inner			{ padding: 10px;}
#login #logo			{ float: left;}
#login form				{ margin: 16px 0 0 84px;}
#login form label		{ width: 80px;}
#login h1				{ text-transform: none;}

/* GLOBAL SAKER */
h1, h2, h3 			{font-family: helvetica,arial,sans-serif; font-size: 18px; font-weight: bold; margin-bottom: 10px; text-transform: uppercase;}
h2				{ font-size: 14px;}
h3				{ font-size: 12px; margin: 0;}	
h1.news			{ margin-bottom: 0px;}
a				{ color: #01abc4;}
a:visited		{ color: #01abc4;}	
a:active		{ outline:none;}
p				{ margin-bottom: 15px;}		

/* MARKUP */
#wrapper			{ width: 900px; background: #FFF; margin:0 auto; padding: 20px;}
#header				{ border-bottom: 2px solid #01abc4; margin-bottom: 20px; }
#header-left		{ float: left; width: 200px; }
#content_wrapper	{ margin: 11px 0 0 0; clear: both; }
#sidebar			{ float: left; width: 200px; margin-right: 20px;}
#intranet #sidebar	{ float: right;margin-right: 0px; margin-left: 20px;}
#content 			{ float: left; width: 680px; /*width: 660px; padding-right: 20px; overflow-y: auto; height: 420px;*/}
#content_wide		{ width: 100%; padding: 0; float: none;}
#admin #content		{ height: auto; min-height: 420px;}
#footer 			{ width: 940px; margin: 0 auto; text-align: right; font-size: 10px; color: #333; height: 35px; line-height: 35px; }
#searchbox			{ float: left; width: 200px;}
#searchbox a		{ color: #9d9f9e; text-decoration: none;}	
#searchbox a:visited	{ color: #9d9f9e; text-decoration: none}	
#searchbox a:hover	{ color: #9d9f9e; text-decoration: underline}		

/* MENUS */
#menu			{  }
.tabs li		{ float: right; height: 26px; line-height: 19px; width: 166px; background:url("../images/norm_right.png") no-repeat right top; margin: 0 0 0 5px; position: relative; text-transform: uppercase;}
.tabs a			{ color: #FFF; background:url("../images/norm_left.png") no-repeat left top; display: block; padding:5px 15px 4px 8px; text-decoration:none;}
.tabs a:visited { color: #FFF;}
.tabs a:hover	{ text-decoration: underline;}
.tabs li ul 	{ display: none; position: absolute; left:-5px;}
.tabs li ul li	{ margin-left: 0; padding-left: 5px; width: 171px; float: none; background: transparent url(/images/flyout_bg.png) repeat-y left top;}
.tabs li ul a	{ color: #333; background-image: none; }
.tabs li ul a:visited	{ color: #333; background-image: none;}
.tabs ul li.end	{ background: transparent url(/images/flyout_end.png) no-repeat 1px top;} 
.tabs a.active	{ text-decoration: underline;} 
#content ul		{list-style: disc inside;}
#content li		{padding-left: 0px;}
ul#offertmenu 	{ list-style-type: none;}
#offertmenu li	{ float: left; width: 105px; margin: 0 5px 0 0px; text-transform: none;}
#offertmenu a	{ padding:5px 15px 0px 8px;}
#sidebar .ui-accordion .ui-accordion-content {overflow: hidden;}

img.fancy		{ padding: 3px; border: 1px solid #CCC;}

/* CART */
#outer_cart_wrap	{ width: 900px; z-index: 100; background: #FFF url(/images/cart_bg.png) no-repeat left bottom;}
#cart				{ height: 37px; padding: 0 20px; color: #9d9f9e;}
#cart div			{ float: left; line-height: 35px; }
#cart a				{ color: #9d9f9e; text-decoration: none;}
#cart a:hover 		{ text-decoration: underline;}
#cart_wrapper		{ display: none;}
#cart_rows			{ border-top: 1px solid #FFF; border-bottom: 1px solid #666; background: #F0F0F0; }
#cart_rows img		{ vertical-align: middle;}
#cart_rows table	{ border-collapse: collapse;}
#cart_rows td		{ border: 1px solid #FFF; padding: 3px;}
#varukorg			{ width: 324px; float: right; background: #01abc4 url(/images/varukorg_bg.png) no-repeat left top; padding: 4px 8px 10px 8px; color: #FFF; font-size: 10px;}
#varukorg h2		{ font-size: 12px; color: #FFF;}
#shoppingCartItems	{ width: 230px;}
#varukorg a			{ color: #FFF;}
#varukorg a:visited	{ color: #FFF;}

/* SIDEBAR */
#sidebar a			{ color: #FFF; text-decoration: none; text-transform: uppercase;}
#sidebar a:visited	{ color: #FFF;}
#sidebar a:hover	{ text-decoration: none;}
#s					{ width: 152px; border: 1px solid #CCC; padding-left:4px;} /* Sök rutan*/
#sidebar li			{ font-size: 10px; color: #FFF; padding: 2px 0;}
#admin #sidebar li	{ font-size: 11px; color: #FFF; padding: 1px 0;}
#sidebar h2			{ font-weight: normal; font-size: 12px; color: #FFF;}
#sidebar li.selected	{ background: #FFF url(../images/lb.png) no-repeat left bottom; color: #01abc4;}
#sidebar li.active	{background: #FFF url(../images/menu_active.png) no-repeat left bottom; padding-left: 5px; line-height: 13px; }
#sidebar li.active a	{color: #01abc4;}
#sidebar a.selected		{ background: #FFF url(../images/lt.png) no-repeat left top; padding-top: 2px;}
#sidebar .selected a			{ color: #01abc4; text-decoration: none; padding-left: 16px;}
#sidebar .selected a:visited	{ color: #01abc4;}
#sidebar .selected a:hover		{ text-decoration: underline;}


/* BOXAR */
.boxtop,
.boxbottom		{ width: 172px; height: 8px; background: #FFF url("../images/boxtop.png") no-repeat top left;}
.boxcontent		{ background: #53c8d9; padding: 0 8px; font-size: 10px;}
.boxbottom		{ background: #FFF url("../images/boxbottom.png") no-repeat left top;}

/* FRONTPAGE TEASERS */
.teasers .teaser	{ width: 218px; border: 1px solid #CCC; height: 158px; float: left; margin-right: 10px; margin-bottom: 10px; position: relative; background: #FFF url(../images/teaser_bg.png) repeat-x;}
.teasers .end		{ margin-right: 0;}
.teasers .title		{ font-weight: bold; font-size: 12px; padding: 7px; line-height: 1; text-shadow: 1px 1px #FFF; white-space: nowrap; overflow: hidden;}
.teasers .pimg		{ float: left; width: 110px; margin-left: 7px; text-align: center; overflow: hidden;}
.teasers .price		{ line-height:19px; padding-top: 10px; font-family: "Arial Black", Arial, "MS Trebuchet", sans-serif; font-size: 21px; color: #01abc4; text-shadow: 1px 1px #000; padding-right: 8px; text-align: right;}
.teasers .ordprice	{ font-size: 9px; color: #000; text-shadow: none; font-family: "lucida grande", "Lucida Sans Unicode",verdana, sans-serif;}
.teasers .besk		{ clear: left; padding: 0 7px; line-height: 15px; height: 28px; margin-bottom: 4px; font-size: 10px; overflow: hidden;}
.teasers .infobox	{ padding: 0 7px; height: 20px; background-color: #f3f4f5; line-height: 20px;}
.teasers .moreinfo	{ float: left;}
.teasers .kop		{ float: right;}
.teasers a			{ text-decoration: none;}
sup					{ font-size: 14px; vertical-align:12px;}
#banners			{ margin-bottom: 10px;}

/* FORMS */
input.solidborder		{ border: 1px solid #C5E7EA;}
label					{ float: left; width: 130px; text-align: right; margin: 0px 10px 0px 0px;}
#admin label			{ text-align: left; margin: 0;}
form div 				{ margin-bottom: 5px;}
#content input.submit	{ padding: 2px 5px;}	
div.block				{ background: #f0F0F0; padding: 5px; margin: 3px 0pt 0px 0px;}
div.blockintro			{ color: #666666;}
div.action				{ border-top: 1px solid #999; text-align: right; padding-top: 8px; margin-bottom: 15px;}
input.checkbox			{ margin: 0;}
.form_column			{ float: left; width: 187px;}

/* TABELS */
table.list,
table.detail-list		{ width: 100%; border-collapse: collapse;}
table.list th			{ font-weight: bold; padding: 2px; border-bottom: 1px solid #CCC;}
table.list td	 		{ padding: 2px; border-bottom: 1px solid #CCC; vertical-align: top;}
#produkt-tbl tr:hover	{ background: #f0f0f0;}
table .right			{ text-align: right;}
table .fill				{ width: 10px;}
table th				{ text-align: left;} 
table tr.odd			{ background: #f0F0F0;}
table.detail-list td	{ width: 25%;padding: 2px;}


/* PRODUCTS */
#pHead, 
#pInfoTxt, 
#pTinfoTxt,
#pAlso			{ margin-bottom: 25px;}
#pImg			{ float :left;}
#pInfo			{ font-size: 11px; float: right; width: 410px; background: #f8f8f8; border-top: 1px dashed #d1d1d1; border-bottom: 1px dashed #d1d1d1; padding: 10px;}
#pInfoL,
#pInfoR			{ float: left; width: 205px; font-size: 11px;}
#pInfo table td	{ font-size: 11px; padding: 2px;}
span.dittPris	{ font-weight: bold; font-size: 20px;}
span.ordPris	{ color: #999; font-size: 10px;}

/* CHECKOUT */
#breadcrum .active 	{ color: #01abc4;}
#lev_block2			{ display: none;}

/* ORDER */
.orderBlock		{margin-bottom: 25px;}
#fraktnew		{display: none;}
label.error		{background: #b00000; float: none; color: #FFF}

/* CHAT */
.conversation	{ margin-bottom: 5px;}
.ctime			{ font-size: 10px; color: #CCC; text-align: center;}
.part0			{ color: #01ABC4; }
.part1			{ color: #C56B00; }
#screen			{ border:1px solid #01ABC4; height:280px; overflow: auto; padding: 5px;}
.chatstatus_n td{ background: #F23968;}
#chatoverlay	{ height: 25px; background: #F23968; border-bottom: 1px solid #b00000; display: none;}
#chat_c			{ width: 900px; margin:0 auto; line-height: 25px;}

/* Filarkiv */
.dir			{ background: #F0F0F0; border: 1px solid #CCC; text-align: center; width: 150px; height: 150px; vertical-align: middle;}
.dir:hover		{ background: #FFF;}

/* SORTABLE TABLES */
table.sortable thead tr th				{ background-color: #F0F0F0; border-right: 2px solid #FFF; padding-left: 2px;}
table.sortable thead tr .header 		{ background-image: url(/images/bg.gif); background-repeat: no-repeat;	background-position: center right;	cursor: pointer;}
table.sortable thead tr .headerSortUp 	{ background-image: url(/images/asc.gif);}
table.sortable thead tr .headerSortDown { background-image: url(/images/desc.gif);}

/* MISC */
.col2			{ float: left; width: 50%}
.nowrap			{ white-space: nowrap;}
.aligncenter	{ text-align: center;}
.alignright		{ text-align: right;}
small			{ font-size: 10px; }
.date			{font-size: 10px; color: #666; margin-bottom: 10px;}
p.error, p.info			{background: #CC0000; color: #FFF; padding: 5px; font-size: 11px;}
p.info					{background: #01abc4;}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix 		{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix 		{display: block;}
img.middle		{vertical-align:  middle;}
#hide_wrap		{ display: none;}
#contact		{ font-size: 9px; text-align: center; color: #aaa; padding-top: 10px;}
#breadcrum		{border-bottom: 1px solid #E4E4E4; font-size: 10px; text-transform:	uppercase; color: #666; margin-bottom: 7px; padding-bottom: 5px;}
.overview td	{ padding-bottom: 30px; width: 260px; padding-right: 15px;}	
table.sidebar 	{ margin-left: 10px; float: right;}
table.sidebar td { padding-bottom: 5px;}
.puffs			{ margin-top: 4px; text-align: right;}	
#villkor li		{list-style: disc outside none; margin-left: 15px;}
