﻿/*

    CSS Document


    Site: PS Kommunikation
    URL: http://www.pskommunikation.se
    Author: PS Kommunikation
    Version: 1.3

    Date: 2010.04.14

*/


/*
 *      DEFAULT
 *
 */



BODY {
	text-align: center;
	background: #e0e0e0 url(/images/bgBody.gif) repeat-x;
}
DIV#wrapper {
	margin: 0 auto; 
	background:url(/images/bgWrapper.jpg) no-repeat;
	width: 960px;
	height:900px;
    text-align: left;
}


/*
 *      MASTHEAD
 *
 */

DIV#logo {
    float:left; 
    display:inline; 
    margin-top:0px;    
}

/* helpnav */

DIV#helpNav UL {
   	display:inline;
   	list-style:none;
	float:right;
}
DIV#helpNav UL LI {
    float:left;
}
DIV#helpNav UL LI A {   
    color:#333;
    width:25px;
    height:25px;
    display:block;
    text-indent:-9999px;
}
DIV#helpNav UL LI A#normal {
    background:url(/images/iconTextsizeNormal.gif) no-repeat;
}
DIV#helpNav UL LI A#larger {
    background:url(/images/iconTextsizeLarger.gif) no-repeat;
}
DIV#helpNav UL LI A#largest {
    background:url(/images/iconTextsizeLargest.gif) no-repeat;
}

/*
 *      NAVIGATION
 *
 */

DIV#mainNav {
    margin-bottom:25px;
}
DIV#mainNav UL {
    float:right;
    list-style-type:none;     
}
DIV#mainNav UL LI {
    float:left;
    margin-left:25px;
}
DIV#mainNav UL LI A {
    color:#999;
    font-size:1.1em;
    text-transform:uppercase;
    font-weight:bold;
    text-decoration:none;
}
DIV#mainNav UL LI A:hover {
    color:#0ea9dd;
}

/* subnav */


DIV#subNav {
    background:url(/images/bgContentTopSubpage.gif) top left no-repeat;
    padding:0 2px;
    position:relative;    
}
DIV#subNav UL {
    padding-top:15px;
    background:url(/images/bgSecNavLine.gif) bottom left repeat-x;
    list-style-type:none;    
    padding-left:50px;
    margin:0;
}
DIV#subNav UL LI {
    float:left;
    line-height:3em;
    padding-left:5px;
    margin:0;
    font-size:1.1em;
}
DIV#subNav UL LI A {
    color:#666;
    display:block;
    padding:0 25px 0 20px;
    text-decoration:none;
}
DIV#subNav UL LI A:hover {
    color:#8b2c44;
}
DIV#subNav UL LI.active A:hover {
    font-weight:normal;
    color:#8b2c44;
}
DIV#subNav UL LI.active {
    background:#f8f8f8 url(/images/bgSecNavLinkLeft.gif) top left no-repeat;
}
DIV#subNav UL LI.active A {
    background:#f8f8f8 url(/images/bgSecNavLinkRight.gif) top right no-repeat;
    color:#8b2c44;
}

/*
 *      PAGETOOLS
 *
 */
 
DIV#pageTools {
    position:absolute;  
    right: 20px;
    top:10px;
}

/*
 *      USP
 *
 */
 
DIV#usp {
    height:360px;
}


/*
 *      CONTENT
 *
 */

/*** START ***/

BODY#start DIV#contentPlaceholder {
    background:url(/images/bgContentTopSubpage.gif) top left no-repeat;
    padding:54px 0 0 0;
}
BODY#start DIV#content {
    background:url(/images/bgContentTileSubpage.gif) repeat-y;
    border-top:solid 1px #dddddd;
    height:auto;
    width:860px;
    padding:25px 50px 20px 50px;
}

/** Primary content **/

DIV#primaryContent {
    margin:0 0 40px 0;
}
DIV#colLeft {
    float:left;
    width:400px;
}
DIV#colRight {
    float:right;
    margin:0 0 0 20px;
    width:420px;
}
DIV#colRight H2 {
    font-size:1.2em;
    line-height:1.4em;
    font-weight:bold;
    margin:0 0 0.8em 0;
}

/** Secondary content **/


/* news */

BODY#start DIV.blogItem {
    float:left;
    width:195px;
    padding:10px 0;
    margin:0 10px;
}
BODY#start DIV.blogItem SPAN {
	display:block;
    margin:0 0 0.3em 0;
}
BODY#start DIV.blogItem P {
    font-size:1.1em;
    line-height:1.4em;
    margin-top:5px;
}
BODY#start DIV.blogItem P STRONG {
    font-weight:bold;
    color:#0ea9dd;
}
BODY#start DIV.blogItem A {
    color:#0ea9dd;
    text-decoration:none;
}
BODY#start DIV.blogItem A:hover {
    text-decoration:underline;
}

/* twitter */

BODY#start DIV#twitter {
    background:url(/images/bgTwitter.gif) no-repeat left top;
    height:93px;    
    width:900px;
}
BODY#start DIV#twitter DIV.blogItem {
    width:880px;
}
BODY#start DIV#twitter DIV.blogItem H3 {
    background:none;
    color:#fff;
    margin:0 0 2px 0;
    padding:0;    
}
BODY#start DIV#twitter DIV.blogItem P {
    color:#fff;
    margin:0 0 10px 0;
}

/*** SUBPAGE ***/

BODY#subpage DIV#contentPlaceholder, 
BODY#subpageCase DIV#contentPlaceholder  {
    background:url(/images/bgContentTileSubpage.gif) top left repeat-y;
}
BODY#subpage DIV#content, 
BODY#subpageCase DIV#content  {
    background:url(/images/bgContentTileSubpage.gif) top left repeat-y;
    height:auto;
    width:860px;
    padding:75px 50px 10px 50px;
}
BODY#subpage DIV#primaryContent  {
    display:inline;
    float:left;
    width:420px;
}
BODY#subpageCase DIV#primaryContent   {
    width:860px;
}
BODY#subpage DIV#secondaryContent {
    display:inline;
    float:right;    
    width:380px;
}
BODY#subpageCase DIV#secondaryContent  {
    width:860px;
    margin-top:50px;
}

/* portfolio */

BODY#subpageCase DIV#primaryContent DIV.item-case,
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin {
    width:260;
    height:32em;
    display:block;
    margin-right:40px;
    float:left;
}
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin {   
    margin:0;
}
BODY#subpageCase DIV#primaryContent DIV.item-case IMG
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin IMG {
    padding:0;
    margin:0;
    border-top:20px solid red
}
BODY#subpageCase DIV#primaryContent DIV.item-case A,
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin A {
    color:#0ea9dd;
}
BODY#subpageCase DIV#primaryContent DIV.item-case P,
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin P {
    margin:5px 0 0 0;
}
BODY#subpageCase DIV#secondaryContent H2 {
    margin-bottom:15px;
}
BODY#subpageCase DIV#secondaryContent DIV.item {
    float:left;
    display:inline;
    width:168px;
    margin:0 2px 30px 2px;
    height:31em;
    padding:0;
    font-size:.9em;
    position:relative;
} 
BODY#subpageCase DIV#secondaryContent DIV.item P {
    margin:5px 5px;
    line-height:1.4em;
}
BODY#subpageCase DIV#secondaryContent DIV.item P img {
    margin-bottom:5px;
}

/* description */

SPAN.customer {
    font-size:1.2em; 
    font-weight:bold; 
}
BODY#subpageCase DIV#primaryContent DIV.item-case SPAN.customer,
BODY#subpageCase DIV#primaryContent DIV.item-case-noMargin SPAN.customer {
    font-size:1.3em;
}
SPAN.description {
    color:#555;
    font-size:1em;
}
SPAN.description strong {
    text-transform:uppercase;
    color:#888;
    font-size:0.9em;   
}
SPAN.description A {
    position:absolute;
    bottom:5px;
    display:block;
}
/* case */

BODY#subpageCase DIV#primaryContent IMG {
    float:right;
    margin:40px 20px 0 0px;
}
BODY#subpageCase DIV#primaryContent H1, 
BODY#subpageCase DIV#primaryContent H2 {
    float:left;
    display:block;
    width:260px;
}
BODY#subpageCase DIV#primaryContent P {
    width:260px;
}
BODY#subpageCase .col {
    float:left;
    margin:0 40px 0 0;
    width:260px;
}
BODY#subpageCase .colRight {
    float:left;
    margin:0;
    width:260px;
}

/* blog */

BODY#subpage .blogItem {
    border-bottom:solid 3px #eee;
    margin-bottom:2em;
}
BODY#subpage DIV.blogItem H3 {
    background:url(/images/iconPen16x16.gif) no-repeat left center;
    padding-left:20px;
}
BODY#subpage DIV.blogItem SPAN {
	display:block;
    margin:0 0 0.3em 0;
}
BODY#subpage UL#blogLinks {
    margin:0;
    line-height:2em;
    list-style:none;
    padding:1em 0;
}
BODY#subpage UL#blogLinks LI {
    list-style-type:none;
    font-size:1.1em;
}
BODY#subpage UL#blogLinks LI {
    padding-left:20px;
    background: url(/images/iconBlogger.gif) left center no-repeat;
}
BODY#subpage UL#blogLinks LI {
    padding-left:20px;
    background: url(/images/iconFeed.gif) left center no-repeat;
}

/*
 *      SIDEBAR
 *
 */
BODY#subpage DIV#focus {
    background:url(/images/bgFocusTopSubPage.png) no-repeat top left;
    padding-top:3px;
    margin-top:8.2em;
    width:380px;    
}
BODY#subpage DIV#focusInner {
    background:url(/images/bgFocusBottomSubPage.png) no-repeat bottom left;
    padding:0 0 10px 0;    
}
BODY#subpage DIV#focus H2 {
    color:#fff;
    padding:20px 20px 0.3em 20px; 
}
BODY#subpage DIV#focus P {
    color:#fff;
    margin:0 20px 1em 20px; 
}
DIV#focus FIELDSET {
    border:none;
    margin:15px 0px;
    padding:0;     
}
DIV#focus FIELDSET P {
    margin:0; 
    padding:0;
}
DIV#focus A {
    color:#fff;
}
DIV#focus LEGEND {
    color:#fff; 
    font-weight:bold;
    padding:0 1em 0 1em;
}
DIV#focus LABEL {
    color:#fff;
    display:block; 
    font-size:0.9em;
    margin:5px 0 0 0;
    text-align:left;    
}
DIV#focus INPUT {
	border:1px solid #ccc;	
	color:#333;  
    display:block;  
	height:1.8em;    
    font-family:Lucida Sans, sans-seriff;
    font-size:0.9em;
	padding:5px 5px 0 5px;
    width:300px;
	
 }
DIV#focus INPUT.submit {
	background:url(/images/bgSubmitBlack.gif) no-repeat;
	width:88px;
	height:23px;
	border:none;
	margin-top:10px;
}
DIV#map {
    height:450px;    
    width:380px;
}

/* newsletter */
/*
DIV#newsletter {
    background:url(/images/bgFocusTopSubPage.png) no-repeat top left;
    margin-top:8.2em;
    padding:3px 0 0 0;
}
DIV#newsletter DIV#subscribeNewsletter, 
DIV#newsletter DIV#unsubscribeNewsletter {
    padding:20px 20px 30px 20px;
    background:url(/images/bgFocusBottomSubPage.png) no-repeat bottom left;
}
DIV#subscribeNewsletter H2, 
DIV#unsubscribeNewsletter H2, 
DIV#subscribeNewsletter P, 
DIV#subscribeNewsletter A, 
DIV#subscribeNewsletter LABEL, 
DIV#unsubscribeNewsletter P, 
DIV#unsubscribeNewsletter A, 
DIV#unsubscribeNewsletter LABEL {
    color:#fff;
}
DIV#newsletter INPUT.submit {
	background:url(/images/bgSubmitBlack.gif) no-repeat;
	width:88px;
	height:23px;
	border:none;
}
*/
.hidden {
    display:none;
    visibility:hidden;
}
.visible {
    display:block;
    visibility:visible;
}

/*
 *      FOOTER
 *
 */
 
BODY#start DIV#footer, BODY#subpage DIV#footer, BODY#subpageCase DIV#footer {
    background:url(/images/bgContentBottomSubpage.gif) no-repeat;
    padding:15px 5px;
}
DIV#footer H1 {
    font-size:1.1em;
    margin-bottom:0.3em;        
}
DIV#footer H2 {
    font-size:1.1em;    
}
DIV#footer P {
    color:#888;
    font-size:1.1em;
    line-height:1.3em; 
}
DIV#footer A {
    color:#888;    
    font-size:1em;    
}
DIV#footer A:HOVER {
    color:#777;    
}
DIV#footer P.left {
    display:inline;
    float:left;
}
DIV#footer P.right {
    display:inline;    
    float:right;
}

/*
 *      CLASSES
 *
 */

.floatLeft { 
    float:left;
    margin:0 20px 0 0;
}
.floatRight { 
    float:right;
    margin:0 0 0 20px;
}
.noMargin {
    margin:0;
}
.marginTop {
    margin:80px 0 0 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 */