﻿/*

    CSS Document


    Site: jonasform
    URL: http://www.jonasform.se
    Author: PS Kommunikation
    Version: 1.1

    Date: 2009.06.01

*/


/*
 *      DEFAULT
 *
 */

BODY {
	background:#333 url(/images/bg.gif) repeat;	
	text-align:center;
}
DIV#wrapper {
	margin:0 auto; 
    text-align: left;	
    width:985px;
}

DIV#placeholder {
    float:right;     
    margin:5px 0 0 0;
    width:400px;
}

/*
 *      MASTHEAD
 *
 */

DIV#masthead {
    position:relative;
    height:120px;
    margin:0 0 15px 0;
}
DIV#placeholder {
}
/** LOGO **/

DIV#logo {
    float:left;    
    height:48px;
    margin:70px 0 20px 5px;    
    width:239px;
}

/** PAGETOOLS **/

UL#pagetools {
   	float:right;
   	list-style:none;
   	height:50px;	
   	display:block;
   	padding:0;
}
UL#pagetools LI {
    float:left;
    margin:0 0 0 2px;    
}
UL#pagetools LI A {   
    color:#333;
    display:block;    
    width:20px;
    height:20px;    
    text-indent:-9999px;
}
UL#pagetools LI A#normal {
    background:url(/images/icon-textsize-small.gif) no-repeat;
}
UL#pagetools LI A#larger {
    background:url(/images/icon-textsize-medium.gif) no-repeat;
}
UL#pagetools LI A#largest {
    background:url(/images/icon-textsize-large.gif) no-repeat;
}
UL#pagetools LI A#print { 
    background:url(/images/icon-helpnav-print.gif) no-repeat;
    width:60px;
    margin-right:10px;
}
UL#pagetools LI A#about { 
    background:url(/images/icon-helpnav-about.gif) no-repeat;
    width:89px;
    margin-right:10px;
}
UL#pagetools LI A#english { 
    background:url(/images/icon-helpnav-translate.gif) no-repeat;
    width:65px;
    margin-right:10px;
}
UL#pagetools A:HOVER {
    text-decoration:underline;
}


/** MAINNAV **/

UL#mainNav  {
    bottom:0;  
    list-style-type:none;
    margin:0;
    padding:0;
    position:absolute;
    right:0;
    bottom:7px; 
}
UL#mainNav LI {
    display:inline;
    float:left;
    margin:0 0 0 20px;
    text-transform: uppercase;
}
UL#mainNav LI A {
    color:#fff;
    display:block;
    font-size:1.1em;
    font-weight:bold;
    padding:5px; 
    text-decoration:none;
}
UL#mainNav LI.active A {
   background:#3a3b3b url(/images/bg-greybox.gif) left top repeat-x;
}
UL#mainNav LI A:hover {
    text-decoration:none;
}
UL#mainNav LI.active A {
    text-decoration:none;
}
/** SUBNAV **/

UL#subNav {
    list-style: none;
    margin:0;
    padding:0;
    width:185px;
} 
UL#subNav LI {
    background:url(/images/bg-news-divider.gif) no-repeat left bottom;    
    display:block; 
    float:left;
    font-family: "Arial", Verdana, sans-serif;	    
    margin:0;     
    padding:0;
    width:185px;
}
UL#subNav LI A {
    background:url(/images/subnav-arrow-right.gif) no-repeat 160px center;
    color:#666;
    display:block;
    line-height:2.5em;
    padding:0 20px 0 5px;
    margin:0;
    text-decoration:none;
}
UL#subNavLI A:HOVER {
    color:#36afe7;
}
UL#subNav LI.current A {
    background:none;
    color:#666;  
    font-weight:bold;   
}

/*
 *      CONTENT START
 *
 */

DIV#main {

}

/** USP **/
 
DIV#usp {
    background:url(/images/usp.jpg) no-repeat left center;
    height:425px;
    position:relative;
    width:985px;
} 
DIV#uspText {
    bottom:25px;
    position:absolute;
    left:50px;
}
DIV#uspText H1 {
    font-size:21px;
}
DIV#Photo {
    bottom:0;
    position:absolute;
    right:25px;
}
 
/** MIDDLE **/

DIV#start-middle {
    width:900px;
}

/* CONTENT  */

DIV#content {
    margin:20px 0 20px 0;    
    width:985px;     
}

/* puff  */

DIV#puff {
    display:inline;
    float:left;
    margin:0 20px 0 0;
    width:220px;
}
DIV#puff H2 {
    background:url(/images/icon-recycling.png) no-repeat center left;
    color:#90ba26;
    padding:0 0 0 20px;
}

/* blogg  */

DIV#blogg {
    display:inline;
    float:left;
    margin:0 10px 0 0;
    width:230px;

}
DIV#blogg H2 {
    background:url(/images/icon-blogg.png) no-repeat center left;
    color:#90ba26;    
    padding:0 0 0 26px;
    margin-bottom:10px;
}
DIV#blogg h3 {
    font-size:1.1em;
}
DIV#blogg P {
    margin:20px 0;

}
DIV#blogg SPAN 
{
    display:block;
    margin:0px 0px;
    line-height:0.5em;
}

/* primaryContent  */

DIV#primaryContent {
    display:inline;
    float:right;
    width:480px;
}
DIV#primaryContent H2 {
    background:url(/images/icon-info.gif) no-repeat center left;
    color:#90ba26;    
    padding:0 0 0 16px;
}


/*
 *      CONTENT TEXT AND IMAGE
 *
 */

BODY#subpage DIV#sidebar {
    float:left;
    margin:20px 0 0 0;    
    width:265px;     
}
BODY#subpage DIV#content {
    float:right;
    margin:20px 0 20px 0;    
    width:960px;     
}
DIV#colLeft IMG {
    float:right;
    margin:55px 20px 0 0;  
}
DIV#colLeft { 
    float:left;
    width:380px;    
}
DIV#colRight {
    float:right;
    width:580px;
}
DIV#colRight IMG.left {
    float:left; 
    margin:5px 10px 0 0;
}
DIV#colRight IMG.right {
    float:right; 
    margin:0 0 0 10px;
}
BODY#subpage .galleryContainer {
    margin:20px 0 0 0;
}
BODY#subpage DIV#content P {
    margin:0 0 1.0em 0;    
}
BODY#subpage .galleryItem {
    background:#141414;
    display:inline;
    float:left;
    height:127px;
    margin:0px 4px 0 4px;
    padding:10px 5px;
    text-align:center;
    width:127px;
}
BODY#subpage .galleryItem IMG A {
    border:none;
}

/*
 *      CONTENT PRODUCTS
 *
 */

BODY#subpageProducts DIV#content {
    float:right;
    margin:20px 0 20px 0;    
    width:580px;     
}
BODY#subpageProducts .productContainer {
    margin:0 0 40px 0;
}

BODY#subpageProducts .productItem {
    background:#141414;
    display:inline;
    float:left;
    height:127px;
    margin:0px 5px 0 5px;
    padding:10px 10px;
    width:500px;
}
BODY#subpageProducts .productItem H2 {
    margin:0 0 0.3em 0;
}
BODY#subpageProducts .productItem P {
    margin:0 0 0.5em 0;
}
BODY#subpageProducts .productItemImage {
    background:#141414;
    display:inline;
    float:left;
    height:127px;
    margin:0 10px 0 0;
    text-align:center;
    width:90px;
}
BODY#subpageProducts .productItemText {
    background:#141414;
    display:inline;
    float:right;
    height:127px;
    width:300px;
}
BODY#subpageProducts .productItem IMG A {
    border:none;
}

/*
 *      BLOG
 *
 */

BODY#subpage DIV.blogItem {
    padding:0;
    margin:0 0 30px 0;
}
BODY#subpage DIV.blogItem P {
   
}
BODY#subpage DIV.blogItem SPAN {
	color:#90ba26;
	display:block;
    margin:0 0 0em 0;
}
BODY#subpage UL#blogLinks {
    float:right;
    margin:35px 20px 0 0;
    line-height:2em;
    list-style:none;
    padding:1em 0;
}
BODY#subpage UL#blogLinks LI {
    list-style-type:none;
}
BODY#subpage UL#blogLinks LI#feedLink {
    padding-left:20px;
    background: url(/images/icon-blogger.gif) left center no-repeat;
}
BODY#subpage UL#blogLinks LI#bloggerLink {
    padding-left:20px;
    background: url(/images/icon-feed.gif) left center no-repeat;
}
BODY#subpage DIV.blogger-post-footer {
    display:none;
    visibility:hidden;
}

/*
 *      FOOTER
 *
 */

DIV#footer {
    background:url(/images/divider.gif) repeat-x;
    padding:5px 0px;
    margin:0 0 0 0;
}
DIV#about {
    display:inline;
    float:left;
    margin:5px 40px 0 0;
    width:270px;
}
DIV#producer {
    display:inline;
    float:right;
    margin:5px 0 0 0;
    text-align:right;
    width:270px;
}
DIV#footer P {
    color:#888;
    font-size:1.1em;
    line-height:1.3em;
    margin:0;
    padding:0; 
}
DIV#footer A {
    color:#888;    
    font-size:1em;    
}
DIV#footer A:HOVER {
    color:#777;    
}

/*
 *      CLASSES
 *
 */
.pic-text {
    font-size:1em;
    font-style:italic;
}
.btn {
    background:url(/images/btn-search.gif) no-repeat left bottom;
    color:#fff;
    font-size:11px;
    font-weight:bold;
    height:18px;
    padding:0;
    width:46px; 
}
.rss { 
    background:url(/images/icon-rss.gif) no-repeat left center;
    height:20px;
    line-height:20px;
    display:block;
    padding:0 0 0 20px;
}
.arrow-right-small { 
    background:url(/images/icon-arrow-right.gif) no-repeat top left;
    height:17px;
    line-height:17px;
    display:block;
    padding:0 0 0 15px;
}
.sitemap { 
    background:url(/images/icon-sitemap.gif) no-repeat left center;
    height:20px;
    line-height:20px;
    display:block;
    padding:0 0 0 20px;
}
.about { 
    background:url(/images/icon-about.gif) no-repeat left center;
    height:20px;
    line-height:20px;
    display:block;
    padding:0 0 0 16px;
}
.float-left {
    display:inline;
    float:left;
}
.float-right {
    display:inline;
    float:right;
} 
.no-margin {
    margin:0;
}
.hide {
    position: absolute;
	left: -9999px;
	z-index: 100;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline-block; clear:both;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */