﻿/*
============================================
Website:        Pap & Membraner
Author:         Warren Buckley
Edited By:      Christian Melbye
Company:        Xeed As
Company Site:   http://www.xeed.no
============================================
*/

/*
============================================
COMMON STYLES
============================================
*/

.left
{
    float:left;
}

.right
{
    float:right;
}

clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

.clearfix {display: inline-block;}  /* for IE/Mac */


/*
============================================
MAIN STYLES
============================================
*/
body
{
    background:url(../Img/Backgrounds/page_bg.gif) repeat-x top left;
    font-family:Helvetica, Arial, Sans-Serif;
}

#container
{
    width:972px;
    margin:0 auto;
}



/*
============================================
HEADER STYLES
============================================
*/
#header
{
    height:122px;
    width:972px;
}

    h1.logo
    {
        width:190px;
        height:84px;
        background:url(../Img/Logos/PMlogo.gif) no-repeat top left;        
    }
    
        h1.logo a
        {
            display:block;
            height:122px;
            text-indent:-100000px;
        }
    
    h6.tef
    {
        width:125px;
        height:122px;
        background:url(../Img/Logos/tef.png) no-repeat top left;     
    }
    
        h6.tef a 
        {
            display:block;
            height:122px;
            text-indent:-100000px;
        }
        
/*
============================================
NAVI STYLES
============================================
*/  

#navi
{
    width:960px;
    height:43px;
    
    background:url(../Img/Backgrounds/navi_top.gif) no-repeat top left;
}

    #navi li
    {
        float:left;    
        text-align:center;
        font-size:14px;
        font-weight:bold;
        color:#FFFFFF;
        height:42px;
    }
    
        #navi li a
        {            
            color:#FFFFFF;
            text-decoration:none;
            height:42px; 
            display:block;
            padding:0 0 0 24px;         
        }
        
            #navi li a span
            {
                padding:0 24px 0 0;
                line-height:42px; 
                height:42px;
                display:block;
                cursor:pointer;                              
            }
        
            #navi li.selected a
            {
                background:url(../Img/Backgrounds/tab_left.gif) no-repeat top left;
            }
            
            #navi li.selected.first a
            {
                background:url(../Img/Backgrounds/tab_left_first.gif) no-repeat top left;
            }
            
                #navi li.selected a span
                {
                  background:url(../Img/Backgrounds/tab_right.gif) no-repeat top right;  
                }

/*
============================================
PAGE INFO STYLES
============================================
*/  
.pageInfo
{
    height:255px;
    width:972px;
}

.pageInfo.noCol
{
    background:url(../Img/Backgrounds/navi_bottom.gif) no-repeat top left;
}

.pageInfo.col
{
    background:url(../Img/Backgrounds/navi_bottom_col.gif) no-repeat top left;
}

.pageInfo h2
{
    color:#ffcc33;
    font-size:18px;
    font-weight:bold;
    margin:0 0 15px 0;
}

.pageInfo h4
{
    color:#ffcc33;
    font-size:13px;
    margin:0 0 15px 0;
}

.pageInfo p
{
    color:#cfc9cb;
    font-size:13px;
    margin:0 0 15px 0;
}

.pageInfo strong
{
    font-weight:bold;
}


    .mainCol, .mainColHome
    {
        width:627px; /*650px - 0 - 23px = 627px*/
        padding:30px 0 0 23px;
    }
    
    .mainCol .col_1
    {
        width:290px;
        margin:0 25px 0 0;
    }
    
    .mainCol .col_2
    {
        width:290px;
    }
    
    .mainColHome .col_1
    {
        width:203px;
        margin:0 25px 0 0;
    }
    
        .mainColHome .col_1 ul
        {
            list-style-position:outside;
            margin:0 0 0 25px;
        }
    
        .mainColHome .col_1 li
        {
            list-style-image:url(../Img/Misc/tick_icon.png);            
            margin:0 0 15px 0;
                                                
            font-weight:bold;
            font-size:18px;
            color:#ffcc33;
        }
    
    .mainColHome .col_2
    {
        width:365px;
    }

    .subCol    
    {
        padding:55px 0 0 15px;
        width:210px; /*225px - 15 = 210px */   
        font-size:12px;    
    }
    
    .subCol a, .subCol span
    {
        color:#dadada;
        padding:0 0 0 35px; 
        text-decoration:none;       
    }
    
    .subCol .tel
    {
        background:url(../Img/Misc/tel.png) no-repeat top left;
        line-height:25px;
        height:30px;
        display:block;
    }
    
    .subCol .mail
    {
        background:url(../Img/Misc/mail.png) no-repeat top left;
        line-height:25px;
        height:30px;
        display:block;
    }

/*
============================================
CONTENT CONTAINER STYLES
============================================
*/ 
.contentContainer
{
    padding:0 0 10px 0;
    margin:0 0 5px 0;
}

    .contentContainer.noCol
    {
        background:url(../Img/Backgrounds/content_bg_bottom.gif) no-repeat bottom left;
    }
    
    .contentContainer.col
    {
        background:url(../Img/Backgrounds/content_bg_bottom_col.gif) no-repeat bottom left;
    }

    #content
    {
        padding:20px 20px 0 19px;
        width:921px; /*960 - 20 - 19 = 921 */
    }

    .contentContainer.noCol #content
    {
        background:url(../Img/Backgrounds/content_bg.gif) repeat-y top left;   
    }
    
    .contentContainer.col #content
    {
        background:url(../Img/Backgrounds/content_bg_col.gif) repeat-y top left;
    }
    
/*
============================================
CONTENT STYLES
============================================
*/ 

#content h2
{
    font-size:20px;
    font-weight:bold;
    color:#424242;
    
    margin:0 0 15px 0;
}

/*
============================================
3 COLUMN STYLES
============================================
*/ 
.threeColContainer
{
    
}
    .threeColContainer .col_1
    {
        width:360px;
        margin:0 34px 0 0;
        /*background-color:Green;*/
        
        font-size:14px;
        color:#494949;
    }
    
    .threeColContainer .col_2
    {
        width:200px;
        margin:0 40px 0 0;
        /*background-color:Red;*/
    }
    
    .threeColContainer .col_3
    {
        width:285px;
        /*background-color:Blue;*/
    }
    
        .threeColContainer .col_1 .text
        {
            margin:25px 0 28px 0;
            padding:0 25px 0 7px;
        }
        
            .threeColContainer .col_1 .text p
            {
                line-height:19px;
                margin:0 0 5px 0;
            }
    
        .threeColContainer .col_1 .text a
        {
            font-size:12px;
            font-weight:bold;
            color:#3366cc;
            text-decoration:none;
            
            padding:0 0 0 19px;
            
            background:url(../Img/Misc/arrow_left.gif) no-repeat center left;
        }
    
        .threeColContainer .col_1 .col_1twoColumn
        {
            margin:15px 0 0 0;
        }
        
            .threeColContainer .col_1 .col_1twoColumn img
            {
                border:5px solid #eaeaea;
            }
            
            .threeColContainer .col_1 .col_1twoColumn h5
            {
                color:#333333;
                font-size:11px;
                font-weight:bold;
                margin:0 0 3px 0;
            }
            
            .threeColContainer .col_1 .col_1twoColumn p
            {
                padding:10px 15px 15px 5px;
                color:#494949;
                font-size:12px;
            }
            
            .threeColContainer .col_1 .col_1twoColumn a
            {
                font-size:12px;
                font-weight:bold;
                color:#3366cc;
                text-decoration:none;
            
                padding:0 0 0 19px;
                margin:0 0 0 5px;
            
                background:url(../Img/Misc/arrow_left.gif) no-repeat center left;
            }
           
            
        
            .threeColContainer .col_1 .col_1twoColumn .col_1
            {
                width:175px;
                margin:0 10px 0 0;
                /*background-color:Fuchsia;*/
            }
            
            .threeColContainer .col_1 .col_1twoColumn .col_2
            {
                width:175px;
                margin:0;
                /*background-color:Yellow;*/
            }
    
        .threeColContainer .col_2 .itemContainer
        {
            
        }
        
            .threeColContainer .col_2 .itemContainer .item
            {
                width:88px;
                margin:15px 0 0 15px;
                
                font-size:11px;
                font-weight:bold;
                color:#333333;
            }
            
            .threeColContainer .col_2 .itemContainer .item.first
            {
                margin-left:0;
            }
            
                .threeColContainer .col_2 .itemContainer .item img
                {
                    border:4px solid #eaeaea;
                    margin:5px 0 0 0;
                }
    
        .threeColContainer .col_3 ul
        {
            margin:0 0 25px 0;
        }
        
            .threeColContainer .col_3 li
            {
                margin:20px 0 0 0;
            }
            
                .threeColContainer .col_3 li h4
                {
                    color:#333333;
                    font-size:12px;
                    font-weight:bold;
                }
                
                .threeColContainer .col_3 li p
                {
                    font-size:12px;
                    color:#494949;
                } 
                
                .threeColContainer .col_3 li a
                {
                    font-size:12px;
                    font-weight:bold;
                    color:#3366cc;
                    text-decoration:none;
                
                    padding:0 0 0 19px;
                
                    background:url(../Img/Misc/arrow_left.gif) no-repeat center left;
                } 
/*
============================================
GRID CONTAINER/ITEM STYLES
============================================
*/ 
.gridContainer
{
    
}

    .gridContainer .item
    {
        width:198px;
        margin:0 0 30px 42px;
    }
    
    .gridContainer .item.firstInRow
    {
        margin:0 0 30px 0;
    }
    
        .gridContainer .item h4
        {
            color:#333333;
            font-size:12px;
            font-weight:bold;
            margin:0 0 5px 0;
        }
    
        .gridContainer .item img
        {
            border:4px solid #eaeaea;
            margin:0 0 15px 0;
        }
        
        .gridContainer .item p
        {
            color:#3e3f3f;
            font-size:12px;
            margin:0 0 10px 0;
        }

/*
============================================
FOOTER STYLES
============================================
*/
#footer
{
    width:917px; /*967 -25 - 25 = 917*/
    height:50px;
    background:url(../Img/Backgrounds/footer_bg.gif) no-repeat top left;
    line-height:40px;
    padding:0 25px;   
    margin:0 0 15px 0; 
    
    color:#ced7e5;    
    font-size:12px;
    text-align:right;
}

    #footer a
    {
        color:#ced7e5;
        text-decoration:none;
    }
    
/*
============================================
HEADER STYLES
============================================
*/
h3.omOssHeader
{
    width:360px;
    height:26px;    
    text-indent:-100000px;
    
    background:url(../Img/Misc/om_oss_header.gif) no-repeat top left;
}

h3.referanseprosekteHeader
{
    width:360px;
    height:26px;
    
    text-indent:-100000px;
    
    background:url(../Img/Misc/referanseprosekter_header.gif) no-repeat top left;    
}

h3.hvaViGjorHeader
{
    width:200px;
    height:26px;
    
    text-indent:-100000px;
    
    background:url(../Img/Misc/hva_vi_gjor_header.gif) no-repeat top left;    
}

h3.temaHeader
{
    width:285px;
    height:26px;
    
    text-indent:-100000px;
    
    background:url(../Img/Misc/tema_header.gif) no-repeat top left;    
}

h3.samarbeidspartnereHeader
{
    width:285px;
    height:26px;
    margin:0 0 20px 0;
    
    text-indent:-100000px;
    
    background:url(../Img/Misc/samarbeidspartner_header.gif) no-repeat top left;    
}


/*
============================================
ADDITONAL STYLE FOR A PURE TEXT LAYOUT
============================================
*/

.textContent 
{
    font-size: 12px;
    margin-bottom: 10px;
}

.textContent .ingress
{
    font-style: italic;
    margin-bottom: 10px;
}

