﻿/**
 * Jonas Åkerlund / Johan Runesson
 * Copyright Sector 5 AB 2011
 */

@media screen {

/*
 * Defaults
 */
html { height: 100%; }
body { font-size: 62.5%; background: #ffffff;	font-weight: normal; font-family: Arial, Verdana, Helvetica, sans-serif; height: 100%; } 
* { margin: 0; padding: 0; } 
a img { border: 0; }

img { margin: 0; padding: 0;} 


/*
 * Common typography
 */
body, table, td, input, textarea, select, fieldset, legend { font-family: Arial, Helvetica, sans-serif; color: #6a6a6a; }

h1 { font-size: 28px; line-height: 32px; margin-bottom: 10px; color: #000; }
.main h1 { margin-bottom: 22px; }
h2 { font-size: 22px; line-height: 26px; margin-bottom: 10px; color: #000; }
h3, h4, h5, h6 {font-size: 12px; line-height: normal; margin-bottom: 3px; }

a { text-decoration: none; color: #59abcc; }
a:hover { text-decoration: none; }
a.read-more { background: url(../images/read-more.gif) no-repeat 0px 4px; padding-left: 8px; }

p { font-size: 12px; color: #333; line-height: 17px; padding-bottom: 5px; }

ul { list-style: none outside; }

table { border-collapse: collapse; }


/*
 * Common layout
 */
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
.hidden { display: none; }

#wrapper { width: 912px; margin: 0 auto; padding: 0; min-height: 100.9%; }

#header { float: left; width: 912px; position: relative; padding-top: 50px; z-index: 2000; }
#header-content { padding: 8px 0 0 0;	margin: 8px 0 0 0; float: left; width: 912px; }

#logo img { display: block; }
#logo { float: left; }

#search { position: absolute; top: 16px; right: 0px; }
body.ie6 #search { position: relative; float: right; top: 0px; margin-top: -140px; }
#search input.searchfield { width: 179px; background-color: #000; border: none; border-right: 1px solid #595b5c; float:left; height:17px; overflow:hidden; padding:3px 8px 2px; white-space: nowrap; font-size: 11px; color: #fff; }
#search div.button a { float: left; height: 15px; background: #000; padding: 5px 8px 2px; color: #fff; font-size: 11px; line-height: 13px; font-weight: normal; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;}

div.button { float: left; }
div.button a { float: left; height: 17px; background: #000; font-weight: bold; color: #ccc; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding: 3px 13px 0; }
div.button a:hover { color: #fff; }


#template { float: left; width: 912px; padding: 0 0 26px; }
#primary-content { float: left; width: 912px; }
#main { padding-top: 28px; }

#presentation { padding-bottom: 24px; }
#presentation img { display: block;}

h1.block { color: #fff; font-size: 15px; background-image: url(../images/header-backgrounds.gif); background-repeat: no-repeat; padding: 4px 8px; }
h1.block.gray { background-position: left top; }
h1.block.blue { background-position: left -60px; }
h1.block.pink { background-position: left -120px; }
h1.block.green { background-position: left -180px; }


/*
 * #primary-nav
 */
#primary-nav { float: left; padding-top: 3px; position: relative; z-index: 2001; border-bottom: 3px solid #000; width: 100%; height: 40px; }
#primary-nav ul { list-style-type: none; float: left; }
#primary-nav li { float: left; position: relative; z-index: 2000; }
#primary-nav a.mega-link { color: #000; font-size: 15px; font-weight: bold; display: block; padding: 12px 25px 9px; z-index: 2100; background: #fff; position: relative;}
#primary-nav li.first a.mega-link { padding-left: 0px; }

#primary-nav li:hover, #primary-nav li.hover { border-left: 1px solid #c0c0c0; padding-top: 0px; }
#primary-nav li:hover a.mega-link, #primary-nav li.active:hover a.mega-link,
#primary-nav li.hover a.mega-link, #primary-nav li.active.hover a.mega-link { color: #68c0e3; border: 1px solid #c0c0c0; border-bottom: 1px solid #fff; border-left: 0px; padding: 11px 24px 12px; }
#primary-nav li.first:hover a.mega-link, #primary-nav li.active.first:hover a.mega-link,
#primary-nav li.hover.first a.mega-link, #primary-nav li.hover.active.first a.mega-link { border: 0px; padding: 12px 25px 9px 0; }
#primary-nav li.first:hover, #primary-nav li.first.hover { border-left: 0px; }

#primary-nav li.active a { color: #979997; }

#primary-nav li:hover .mega-content, #primary-nav li.hover .mega-content { left: 0px; top: auto; }
#primary-nav li:hover .mega-content.dif, #primary-nav li.hover .mega-content.dif { right: 0px; left: auto; }

#primary-nav .mega-content { 
	background: #fff;
	font-weight: normal;
	left: -999em;
	padding: 20px 20px 10px;
	position: absolute;
	text-align: left;
	width: 309px; 
	border: 1px solid #c0c0c0;
	z-index: 1900;
	margin: -1px 0 0 -1px;
}
#primary-nav .mega-content.large { width: 443px; }

* html #primary-nav li.hover .mega-content { left:0px; top: auto; }

#primary-nav .mega-item { border-bottom: 1px solid #e8e8e8; margin-bottom: 20px; padding-bottom: 8px; }
#primary-nav .mega-item .rte p { margin-bottom: 6px; }
#primary-nav .mega-item .rte a { color: #333; }
#primary-nav .mega-item .rte a:hover, #primary-nav .mega-item a:hover { color: #666; }
#primary-nav .mega-item img { padding-bottom: 8px; }
#primary-nav .mega-content h3 { font-size: 15px; line-height: 16px; color: #333; font-weight: bold; }

#primary-nav .mega-list li { display: block; float: none; padding-bottom: 9px; }
#primary-nav .mega-list li a { font-size: 13px; font-weight: bold; color: #333; }
#primary-nav .mega-list li a:hover { color: #666; }
#primary-nav .mega-content li:hover, #primary-nav .mega-content li.hover { border: 0px; }
#primary-nav .mega-list .col { width: 150px; float: left; padding-right: 9px; }
#primary-nav .mega-list .col.last { padding-right: 0px; }

#primary-nav .image-list li { text-align: center; width: 94px; padding: 0 8px; }
#primary-nav .image-list li.prod1 { padding-left: 0px; }
#primary-nav .image-list li.prod3 { padding: 0 18px 0 13px; }
#primary-nav .image-list li.prod4 { padding-right: 0px; }
#primary-nav .image-list li img { text-align: center; }


/*
 * #secondary-nav
 */
#secondary-nav { float: left; width: 172px; margin: 0 47px 8px 0; padding-bottom: 13px; border-bottom: 1px solid #d6d6d6; }
#secondary-nav ul ul { padding-top: 5px; margin-bottom: -5px; }
#secondary-nav li { line-height: 18px; padding-bottom: 10px; }
#secondary-nav li li { padding-bottom: 5px; padding-left: 10px; }
#secondary-nav li a { font-size: 13px; font-weight: bold; color: #020202; }
#secondary-nav li li a { font-weight: normal; }
#secondary-nav a:hover, #secondary-nav li.active a { color: #abaeb1; }
#secondary-nav li.active li a { color: #020202; }


/*
 * Image list
 */
ul.image-list { position: relative; z-index: 100; }
ul.image-list li { position: relative; list-style: none; float: left; padding: 0 6px 2px 0; }
ul.image-list.no-padding li { padding-right: 0px; }
ul.image-list li.last { padding-right: 0px; }
body.ie6 ul.image-list li.last { width: auto !important; }
ul.image-list li img { display: block; padding-bottom: 4px; }
ul.image-list li p { padding-bottom: 15px; }
ul.image-list li p strong a { color: #333; }


/*
 * Startpage
 */
#template.startpage .col { float: left; }
#template.startpage .col.first { width: 458px; padding-right: 77px; }
#template.startpage .col.first img { padding-bottom: 5px; }
#template.startpage .col.last { width: 376px; }

#template.startpage .item { padding-bottom: 30px; }
#template.startpage .item .col { float: left; }
#template.startpage .item .col.first { width: 126px; padding: 0px; }
#template.startpage .item .col.last { width: 245px; }


/*
 * Inspiration
 */
#template.inspiration .col { float: left; }
#template.inspiration .col.first { width: 365px; padding-right: 42px; } 
#template.inspiration .col.last { width: 505px; } 

#slideshow-holder { position: relative; width: 912px; overflow: hidden; }
#slideshow ul, #slideshow, #slideshow ul li { width: 912px; height: 316px; }
#slideshow-holder a.button { position: absolute; line-height: 2000; overflow: hidden; z-index: 500; top: 141px; display: block; background: url(../images/sprite.png) no-repeat 0px 0px; width: 37px; height: 37px; outline: none; cursor: pointer; }
#slideshow-holder a.button.prev { background-position: 0px -243px; left: 17px; }
#slideshow-holder a.button.next { background-position: -51px -243px; left: 859px; }

ul#slideshow-thumbs { position: absolute; top: 114px; left: 688px; z-index: 600; width: 163px; height: 91px; overflow: hidden; }
ul#slideshow-thumbs.prev { left: 61px; }
ul#slideshow-thumbs.next { left: 688px; }
ul#slideshow-thumbs li { display: none; width: 157px; height: 91px; background: url(../images/sprite.png) no-repeat right -420px; }
ul#slideshow-thumbs li img { width: 153px; height: 87px; display: block; border: 2px solid #fff; }
ul#slideshow-thumbs.prev li { padding-left: 6px; background-position: left -420px; }
ul#slideshow-thumbs.next li { padding-right: 6px; }


/*
 * Product-overview
 */
#main.overview { padding-top: 34px; }
#main.overview ul.image-list li { text-align: center; padding-right: 20px; }
#main.overview ul.image-list li h2 { color: #000; border-top: 1px solid #d6d6d6; padding-top: 10px; margin-top: 14px; }
#main.overview ul.image-list li h2 a { color: #000; }
#main.overview ul.image-list li.last { padding-right: 0px; }


/*
 * Product-group
 */
.product-group { padding-top: 10px; margin-bottom: 18px; }
.product-group .col { position: relative; width: 242px; float: left; margin-right: 39px; padding: 0 0 30px; }
.product-group .col.last { width: 613px; margin-right: 0px; padding-left: 18px; }
.product-group .col.border { position: relative; padding: 0px; border-bottom: 1px solid #d6d6d6; }
.product-group .col.last.border { padding: 0px; }
.product-group ul.image-list li { text-align: center; padding-right: 10px; }
.product-group ul.image-list li.last { padding-right: 0px; }
.product-group a.more-info { display: block; line-height: 14px; background: url(../images/sprite.png) no-repeat 0px -357px; padding-left: 20px; margin-top: 5px; font-size: 12px; }
.product-group a.more-info.collapse { background-position: -249px -357px; }

body.ie6 .product-group .col, body.ie7 .product-group .col { padding-bottom: 16px; }
body.ie6 .product-group .col.border, body.ie7 .product-group .col.border { padding-bottom: 0px; }
body.ie6 .product-group ul.image-list li.last { border: 0px !important; padding-top: 0px !important; }

.product-group .col.bubble-info:hover { cursor: pointer; }
.product-group .col.bubble-info:hover p { color: #666; }

.product-group .more-information .col.last { border-top: 1px solid #d6d6d6; padding: 15px 0 38px 0; }
.product-group .more-information a.pdf, .product-group .more-information a.netpublicator { display: block; font-size: 12px; line-height: 17px; font-weight: bold; background: url(../images/sprite.png) no-repeat 0px 0px; padding: 5px 0 5px 30px; }
.product-group .more-information a.pdf { background-position: -235px -49px; }
.product-group .more-information a.netpublicator { background-position: -235px -111px; }

ul.more-info-menu { width: 135px; float: left; }
ul.more-info-menu li { padding: 0 0 4px; }
ul.more-info-menu li a { display: block; font-weight: bold; font-size: 12px; line-height: 14px; color: #333; padding: 6px 5px 5px 10px; outline: none; cursor: pointer; }
ul.more-info-menu li.active a { color: #fff; background: url(../images/sprite.png) no-repeat -125px 0px; }

.more-info-content { width: 415px; float: right; }


/*
 * Article
 */
#content { padding: 34px 0 35px 0; float: left; width: 912px; }
#content .main { float: left;	padding: 0 40px 0 0;	width: 478px; }
#content .main .rte { padding-right: 10px; }
#content .main-image { padding: 0 0 24px 0; }
#content .main-image img { display: block; }
#content .related { float: left; width: 175px; }


/*
 * Designers
 */
#template.designers .main { width: 693px; padding-right: 0px; }
#template.designers .item { border-bottom: 1px solid #d6d6d6; padding-bottom: 15px; margin-bottom: 27px; width: 100% !important; }
#template.designers .item.last { border-bottom: 0px; padding-bottom: 0px; margin-bottom: 0px; }
#template.designers .col.first { width: 443px; float: left; margin-right: 25px; }
#template.designers .col.last { width: 225px; float: left; }
#template.designers ul.image-list { padding-top: 5px; }
#template.designers .rte h2 { font-size: 22px; margin-bottom: 10px; }

/*
 * Search results
 */
#template.searchresults ul, #template.searchresults .head { border-bottom: 2px solid #d6d6d6; margin-bottom: 25px; }
#template.searchresults ul.last { border-bottom: 0px; margin-bottom: 0px; }
#template.searchresults .img { float: left; padding-right: 20px; display: block; width: 75px; }
#template.searchresults .txt { float: left; width: 540px;  }
p.found { font-size: 12px; font-weight: bold; color: #9C9FA1; }
#template.searchresults .main li { padding: 0 0 25px 0; border-bottom: 1px dashed #ccc; margin-bottom: 25px; }
#template.searchresults .main li.last { border-bottom: 0px; margin-bottom: 10px; }
#template.searchresults .main li .rte { margin-bottom: -20px; }

#template.searchresults #content .main { width: 635px; }

#template.searchresults h2 { padding-bottom: 15px; }
#template.searchresults .main .head h2 { padding: 10px 0 0 0; }

/*
.search-results .head h2 { margin: 0; clear: none; padding: 0; border: none; }
.search-results h2 { clear: both; padding: 20px 0 2px 0; margin: 0; border-bottom: 1px solid #DFDFE0; }
.search-results ul { padding: 5px 0 0 0; float: left; }
.search-results li { font-size: 11px; line-height: 16px; padding: 0 0 15px 0; float: left; width: 452px; margin: 0; }

.search-results .img {  padding-right: 10px; float: left; }
.search-results .txt { padding: 5px 0 0 0; }
.search-results li a { color: #68c0e3; text-decoration: underline; }
.search-results li a:hover { color: #6a6a6a; }
*/


/*
 * Paging
 */
.paging { border-top: 1px solid #DFDFE0; padding: 5px 0 0 0; float: left; width: 452px; margin: 10px 0 0 0; }
.paging li { float: left; padding: 0 5px 0 0; font-size: 11px; }
.paging a { text-decoration: underline; color: #68c0e3; }
.paging a:hover { color: #6a6a6a; }


/*
 * RTE
 */
.rte p, .rte ol, .rte ul, .rte table { font-size: 13px; line-height: 19px; margin-bottom: 16px; color: #333; }
.rte a { text-decoration: underline; }
.rte h2 { font-size: 17px; margin-bottom: 4px; }
.rte h3 { margin-bottom: 2px; color: #333; }

.rte ul { padding-left: 20px; list-style: disc outside; }
.rte ol { padding-left: 25px; }
.rte li { margin-bottom: 8px; line-height: 19px; }
.rte ul li { padding: 0 0 0 5px; }

.rte ul.filelist, .rte ol.filelist { list-style: none; padding-left: 0px; }
.rte ul.filelist li, .rte ol.filelist li { padding-left: 0px; margin-bottom: 0px; }
.rte li a.pdf { display: block; font-size: 12px; line-height: 17px; font-weight: bold; background: url(../images/sprite.png) no-repeat -235px -49px; padding: 5px 0 5px 30px; }

.rte a { color: #68c0e3; text-decoration: none; }
.rte a:hover { color: #6A6A6A; }

.rte table td { padding: 5px 5px 5px 0; color: #333; }
.rte table td p { margin: 0px; padding: 0px; }
.rte table.border td { border: 1px solid #979797; padding: 5px; }



/*
 * Footer
 */
#footer { padding: 0 0 100px 0; line-height: 14px; background: #fdfdfc; }
#footer .content { background: url(../images/footer_bkg.gif) repeat-x top left #fdfdfc; border-top: 1px solid #e6e6e4; padding-top: 25px; }
#footer, #footer a { color: #909090; }
#footer a:hover { color: #353535; }
#footer .col { float: left; width: 100px; padding: 0 20px; }
#footer .col.last { width: 160px; }

#footer .rte h4, #footer .rte h4 a, #footer .col.last p strong { text-transform: uppercase; font-size: 11px; color: #909090; }
#footer .rte h4 { margin-bottom: 5px; }
#footer .rte li { background: none; padding: 0px; margin: 0px;  }
#footer .rte li, #footer .rte li a { font-size: 10px; color: #909090; }
#footer .rte ul { padding-left: 0px; list-style: none outside; }
#footer .rte p { font-size: 10px; color: #909090; }
#footer .rte a:hover { color: #353535; }

.banner { padding-bottom: 5px; background: #fff; }

.language-holder { background: #fff; }
ul#language { list-style: none; float: right; padding-bottom: 9px; }
ul#language li { float: left; margin-right: 9px; }
ul#language li.last { margin-right: 2px; }
ul#language li a { display: block; background: url(../images/sprite.png) no-repeat top left; width: 16px; height: 11px; }


ul#language li a.ch { background-position: left -16px; }
ul#language li a.it { background-position: left -31px; }
ul#language li a.nl { background-position: left -47px; }
ul#language li a.es { background-position: left -63px; }
ul#language li a.fr { background-position: left -78px; }
ul#language li a.de { background-position: left -93px; }
ul#language li a.gb,
ul#language li a.uk { background-position: left -108px; }
ul#language li a.fi { background-position: left -127px; }
ul#language li a.no { background-position: left -144px; }
ul#language li a.dk { background-position: left -160px; }
ul#language li a.se { background-position: left -176px; }
ul#language li a.blx { background-position: left -192px; }
ul#language li a.global { background-position: left -208px; }


/*
 * Formpage
 */
input, textarea, select, option { font-size: 11px; }

.form { padding: 10px 0 0 0; margin: 0; width: 452px; float: left; }
.formrow { float: left; width: 400px; padding: 0 0 8px 0; margin: 0; display: block; }
.form .formrow { padding-bottom: 20px; }
.form span .formrow { padding-bottom: 8px; }
.form label { font-size: 13px; padding: 3px 10px 0 0; float: left; width: 80px; font-weight: bold; color: #333; }

.form input.text, .form input.checkbox, .form input.radio, .form textarea { float: left; margin: 0 4px 0 0; padding: 0; font-size: 13px; }
.form input.text, .form textarea { padding: 5px 5px 4px 5px; width: 285px; border: 0px; background: #e6e7e7; }
.form .radio input, .form input.checkbox { width: 13px; height: 13px; }
.form .radio input, .form input.radio { width: 13px; height: 13px; }
.form span.grouplabel { display: block; font-size: 13px; color: #333; padding: 20px 0 8px 0; }
.form span.radio label { float: left; width: auto; }
.form span.radio input { float: left; margin: 1px 4px 0 0; }

.form .validationerror { padding-left: 90px; }
.form .validationerror span { font-size: 11px; }
.form span.error { display: block; clear: both; }

.form span.checkbox { display: block; width: 400px; padding: 0 0 4px 0; }
.form span.checkbox input { float: left; margin: 0 4px 0 0; width: 13px; height: 13px; }
.form span.checkbox label { float: none; width: auto; }


/*
 * Resellers
 */
#template.article-reseller .main, #template.article-reseller .main .form { width: 320px; }
#template.article-reseller .main .form { margin-bottom: 35px; padding-top: 0px; }
#template.article-reseller .main h2 { font-size: 17px; margin-bottom: 4px; }
#template.article-reseller .main .rte h2 { margin-bottom: 14px; }
#template.article-reseller input.text { margin-bottom: 10px; }
#template.article-reseller select { width: 295px; margin: 0px 0px 10px; }
#template.article-reseller .button { float: right; margin-right: 25px; }
body.ie6 #template.article-reseller .button { margin-right: 12px; }


/*
 * Clearfix
 */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
.clearfix { display: block; }


/* tooltip styling */
.popup { position: absolute; display: none; z-index: 1050; border-collapse: collapse; }

.popup .content { width: 175px; min-height: 30px; height: auto !important; height :30px; padding: 17px 25px 0 28px; background: url(../images/tooltip.png) no-repeat top left; }
.popup .footer { width: 228px; padding-bottom: 20px; background: url(../images/tooltip.png) no-repeat bottom left; }
.popup p.header { font-size: 13px; line-height: 19px; }
.popup p { font-size: 11px; line-height: 15px; padding: 0 0 8px 0 !important; text-align: left; }
.popup ul { padding: 0 0 5px 0 !important; }
.popup ul li { padding: 0 0 3px; }
.popup a { font-size: 11px; line-height: 15px; }


/*
 * Print
 */
} @media print {

body { font-size: 11pt; color: #000; padding-right: 30pt;}

#header, #footer, #secondary-nav { display: none; }

h1, h2, h3, h4, h5, h6, p, li, a, blockquote, label, legend, table, td { font-family: Arial, Verdana sans-serif; }

h1 { font-size: 20pt; line-height:25pt; text-transform: uppercase; font-weight: normal;}
h2 { font-size: 12pt; line-height:15pt; margin-bottom: 4pt; }
.rte h2 { text-transform: uppercase;}
h3, h4, h5, h6 { font-size: 11pt; line-height:14pt; margin-bottom: 2pt;}

table td { vertical-align: top;}
ul, ol { list-style-position: outside;}
p, ul, ol, table { margin: 0 0 15pt 0; }
td p { margin: 0;}
a {	text-decoration: underline; color:#999; }
a img { border: none;}
.print { display: block; margin: 0 0 40pt;}
fieldset { border: none;}

}
