/*
    Project: Nautic
    File: main.css
    Date: 2008-11-24
    Author: www.capab.se
*/

/************************************************* GENERAL **********************************/

body {
    background: #e1e1e1 url("../img/bg_body.gif") repeat-x;
    color: #383838;
    font: normal 68.75%/1.4545em Tahoma, Arial, Helvetica, Sans-Serif;
    text-align: center;
}

a {
    color: #07abef;
    text-decoration: none;
}

a:hover,
a:focus {text-decoration: underline;}

select, input, textarea {
    font-size:12px;
    font-family:Verdana;

}

.gray-border {
    border: solid 3px #d8d8d8;
}

.area-button {
    background-color:#cacaca;
    color:White;
    font-weight:bold;
    padding:2px 7px;
    font-size:12px;
    margin-left:5px;
    margin-right:5px;
}

li.disc
{
    
    list-style-type:disc;
    list-style-position: inside;
}

img {display: block;}

.line {
    border-bottom: solid 1px #e2e2e2; 
    height:10px;
    width:10p%;
    margin-bottom:15px;
}

a.read-more {
    color: #07abef;
    font-weight: bold;
    margin: 1em 0;
    padding-left: 9px;
    background: url("../img/double_arrow_blue.gif") 0 50% no-repeat;
    display: block;
}

a.contact-button {
    color: #07abef;
    font-weight: bold;
    margin: 1em 0;
    padding-left: 9px;
    background: url("../img/double_arrow_blue.gif") 0 50% no-repeat;
}

.OkButton
{
    font-size:11px;
    height:19px;
}

#header img 
    {
        float: left;
        width:auto;
    }

#header
{
    line-height:0;
}

#wrapper {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 142px;
    background: url("../img/bg_wrapper.png") 50% 0 no-repeat;
}

#container {
    position: relative;
    margin: 0 auto;
    width: 880px;
    text-align: left;
}

#logo {
    position: absolute;
    top: 22px;
    left: 13px;
    display: block;
}

/************************************************* TOP NAVBAR **********************************/

#top-navbar {
    position: absolute;
    top: 17px;
    left: 531px;
    width: 319px;
    height: 32px;
    background: url("../img/bg_top_navbar_se.png") no-repeat;
}

    #top-navbar ul {
        list-style-type: none;
        text-indent: -9999px;
    }
    
    #top-navbar ul li {
        display: inline;
        width: auto;
        float: left;
    }
    
    #top-navbar ul li a {
        width: 100%;
        height: 20px;
        display: block;
    }

    #top-navbar ul li.news a {
        width: 74px;
        padding: 0;
        margin: 4px 0 0 5px;
    }
    
    #top-navbar ul li.company {
        width: 72px;
        margin-top: 4px;
    }
    
    #top-navbar ul li.staff {
        width: 64px;
        margin-top: 4px;
    }
    
    #top-navbar ul li.contact {
        width: 97px;
        margin: 4px 7px 0 0;
    }

/************************************************* TOP NAVBAR english **********************************/

#top-navbar-english {
    position: absolute;
    top: 17px;
    left: 598px;
    width: 252px;
    height: 32px;
    background: url("../img/static/bg_top_navbar_en.png") no-repeat;
}

    #top-navbar-english ul {
        list-style-type: none;
        text-indent: -9999px;
    }
    
    #top-navbar-english ul li {
        display: inline;
        width: auto;
        float: left;
    }
    
    #top-navbar-english ul li a {
        width: 100%;
        height: 20px;
        display: block;
    }
    
    #top-navbar-english ul li.company {
        width: 94px;
        margin-top: 4px;
    }
    
    #top-navbar-english ul li.staff {
        width: 57px;
        margin-top: 4px;
    }
    
    #top-navbar-english ul li.contact {
        width: 101px;
        margin-top: 4px;
        /*margin: 4px 7px 0 0;*/
    }
    

    
/************************************************* MAIN MENU **********************************/

#main-navbar {
    width: 880px;
    height: 157px;
    background: url("../img/bg_navbar.png") bottom left no-repeat;
}
    #main-navbar ul {
        width: 100%;
        float: left;
        margin: 81px 0 0 0;
        height: 76px;
        overflow: hidden;
        list-style-type: none;
        text-indent: -9999px;
    }
    
    #main-navbar ul li {
        width: auto;
        float: left;
        display: inline;
        height: 76px;
    }
    
    #main-navbar ul li a {
        display: block;
        width: 100%;
        height: 100%;
    }
    
    #main-navbar ul li.shipping {
        background: url("../img/menu_shipping_se.png") no-repeat 0 0;
        width: 88px;
    }
       
    #main-navbar ul li.shipping a {background: url("../img/menu_shipping_se.png") no-repeat 0 0;}
    #main-navbar ul li.shipping a:hover,
    #main-navbar ul li.shipping a:focus {background: url("../img/menu_shipping_se.png") no-repeat 0 -76px;}
    #main-navbar ul li.shipping a.active {background: url("../img/menu_shipping_se.png") no-repeat 0 -152px;}

    /* english version */    
    #main-navbar ul li.shipping-en {
        background: url("../img/static/menu_shipping_en.png") no-repeat 0 0;
        width: 88px;
    }
       
    #main-navbar ul li.shipping-en a {background: url("../img/static/menu_shipping_en.png") no-repeat 0 0;}
    #main-navbar ul li.shipping-en a:hover,
    #main-navbar ul li.shipping-en a:focus {background: url("../img/static/menu_shipping_en.png") no-repeat 0 -76px;}
    #main-navbar ul li.shipping-en a.active {background: url("../img/static/menu_shipping_en.png") no-repeat 0 -152px;}

    #main-navbar ul li.fishing {
        background: url("../img/menu_fishing_se.png") no-repeat 0 0;
        width: 82px;
    }
    #main-navbar ul li.fishing a {background: url("../img/menu_fishing_se.png") no-repeat 0 0;}
    #main-navbar ul li.fishing a:hover,
    #main-navbar ul li.fishing a:focus {background: url("../img/menu_fishing_se.png") no-repeat 0 -76px;}
    #main-navbar ul li.fishing a.active {background: url("../img/menu_fishing_se.png") no-repeat 0 -152px;}

    #main-navbar ul li.leisure {
        background: url("../img/menu_leisure_se.png") no-repeat 0 0;
        width: 117px;
    }
    #main-navbar ul li.leisure a {background: url("../img/menu_leisure_se.png") no-repeat 0 0;}
    #main-navbar ul li.leisure a:hover,
    #main-navbar ul li.leisure a:focus {background: url("../img/menu_leisure_se.png") no-repeat 0 -76px;}
    #main-navbar ul li.leisure a.active {background: url("../img/menu_leisure_se.png") no-repeat 0 -152px;}

    #main-navbar ul li.danger {
        background: url("../img/menu_danger_se.png") no-repeat 0 0;
        width: 130px;
    }
    #main-navbar ul li.danger a {background: url("../img/menu_danger_se.png") no-repeat 0 0;}
    #main-navbar ul li.danger a:hover,
    #main-navbar ul li.danger a:focus {background: url("../img/menu_danger_se.png") no-repeat 0 -76px;}
    #main-navbar ul li.danger a.active {background: url("../img/menu_danger_se.png") no-repeat 0 -152px;}

    #main-navbar ul li.webshop {
        background: url("../img/menu_webshop_se.png") no-repeat 0 0;
        width: 99px;
    }
    #main-navbar ul li.webshop a {background: url("../img/menu_webshop_se.png") no-repeat 0 0;}
    #main-navbar ul li.webshop a:hover,
    #main-navbar ul li.webshop a:focus {background: url("../img/menu_webshop_se.png") no-repeat 0 -76px;}
    #main-navbar ul li.webshop a.active {background: url("../img/menu_webshop_se.png") no-repeat 0 -152px;}

#language-navbar {
    position: absolute;
    top: 120px;
    left: 790px;
    display: block;
    font-size: 0.8181em;
    color: #07abef;
}

    #language-navbar a.active {
        color: #fff;
    }
    
/************************************************* CONTENT **********************************/

#content {
    background: #fff;
    width: 100%;
    overflow: hidden;
}
    #content h1 {
        /*font-size: 10px;*/ /*1.4545em;*/
        padding-left:10px;
        margin-bottom:20px;
        height:20px;

    }
    
    #content .header-line
    {
        margin-top:15px;
        border-bottom:solid 2px #e2e2e2;
        margin-right:8px;
    }
        
    #main {
        width: 608px;
        float: left;
        padding: 15px;
    }
    
        #main .purchase-online {
            margin: 0 0 15px 0;
            display: block;
        }
    
        #main .business-area {
            width: 138px;
            float: left;
            padding: 0 7px;
        }

        #main .business-area img {
            border: solid 4px #efefef;
            margin: 10px 0;
        }
        
        #main .business-area a {
            margin: 10px 0 0 0;
            display: block;
        }
        
        #main .product-row {
            background: url('../img/dotted_border.gif') repeat-x;
            padding:20px 0;
            /*
            margin:0px 10px;
            padding-top:20px;
*/
            clear:both;
          
            
        }
        #main .product-row img{
            float:left;
            margin-right:20px;
  /*        padding: 0px 20px 20px 0;  margin:0px 20px 20px 0px;*/
            
        }
            
        #main .content-area .need-some-help {
            width: 434px;
            margin: 20 10px;
            padding: 20px 0;
            background: url("../img/dotted_border.gif") repeat-x;
            clear:both;
        }
        
        #main .content-area p {
            padding-bottom:20px;
        }
        
        #main .content-area .reference {   
            margin-bottom:15px;
            background: url("../img/dotted_border.gif") bottom repeat-x;
        }
        
        #main .content-area .reference img{   
            float:left;
            margin-right:15px;
            margin-bottom:15px;
        }
        
        #main .content-area .reference .intro{   
            font-style:italic;
        }
        
        #main .content-area .reference p{   
            clear:both;
        }
        
        #main .content-area .faq {
            padding-bottom:20px;
            margin-bottom:20px;
            border:solid 0px;
            background: url("../img/dotted_border.gif") bottom repeat-x;
        }
        
    /************************************************* CONTACT AREA **********************************/
            
        #main .contact-area {
            width: 434px;
            padding-top:20px;
            background: url("../img/dotted_border.gif") repeat-x;
            clear:both;
        }        
        
        #main .contact-area .contact-field {
            position:relative;
            left:100px;
            top:-18px;
        }
        
        
        
    /************************************************* SIDEBAR **********************************/
    #sidebar {
        width: 170px; /*  242px; 170 146*/
        float: right;
        padding:15px 15px;
        background: #efefef;
        /*margin:0px;*/
    }
        
        #sidebar #news {
            width: 232px;
            padding: 0 5px;
        }
        
        #sidebar #news h2 {
            width: auto;
            float: left;
            margin: 0 0 15px 0;
            padding-left:14px;
            font-size: 1.2727em;
        }
        
        #sidebar #news span.news-archive {
            width: auto;
            float: right;
        }
    
        #sidebar .news-item {
            width: 202px;
            float: left;
            padding: 15px;
        }
        
        #sidebar .news-item span.rss-category {
            width: auto;
            float: left;
            background: #cacaca;
            color: #fff;
            font-weight: bold;
            padding: 0 6px;
            margin: 4px 0 0 0;
            font-size: 0.8181em;
        }
        
        #sidebar .odd {background: #f7f7f7;}
        
        #sidebar .header 
        {
            padding-right:15px;
            background: url('../img/triangle-down.png') right no-repeat;
        }
        
        
        #sidebar .productheader {
            font-weight:bold;
            padding:5px 10px;
        }        
        
        #sidebar .product {
            padding:5px 10px;
        }        
        
        #sidebar .large-thumb {
            width:155px;
            border:solid 3px #e2e2e2;
            margin:10px auto;
        }

        #sidebar .large-thumb img{
            margin:10px auto;
        }

        #sidebar .large-thumb .line-below-pic{
            width:100%;
            border-bottom:solid 1px #e2e2e2;
        }        
        
        #sidebar .large-thumb .link{
            margin:8px auto 8px 8px;
        }
         
         
        #sidebar .more-references {
            padding-right:25px;
        }
        
        #rss {
            width: 212px;
            float: left;
            padding: 15px;
            color: #fff;
            background: #575757 url("../img/bg_rss.gif") no-repeat;
        }
        
        #rss ul {
            padding: 5px 0 15px 0;
            list-style-type: none;
        }
        
        #rss ul li a {
            background: url("../img/rss.png") no-repeat;
            padding-left: 16px;
        }
        #what-is-rss {
            padding: 0px 15px;
        }
        
                
        #what-is-rss .header {
            background: url('../img/triangle-down.png') right no-repeat;
        }
            
        

/************************************************* CONTENT **********************************/
    
#content-wrapper {
    width: 860px;
    overflow: hidden;
    margin: 10px 0;
    padding: 0 10px;
    background: url("../img/bg_content_wrapper.gif") repeat-y;
}
    #content-wrapper #left-navbar {
        width: 208px;
        float: left;
        padding: 4px;
    }
    
        ul#left-navbar-main li {
            border-left: solid 1px #d2d2d2;
            border-right: solid 1px #d2d2d2;
            margin: 0 0 1px 0;
            background: url("../img/bg_li_left_navbar_main.gif") repeat-x;
        }
        
            ul#left-navbar-main li a {
                width: 191px;
                font-weight: bold;
                color: #585858;
                display: block;
                line-height: 33px;
                padding-left: 15px;
            }
            
            ul#left-navbar-main li a:hover,
            ul#left-navbar-main li a:focus,
            ul#left-navbar-main li a.active {
                color: #07abef;
                text-decoration: none;
            }
        
        ul#menu-products {
            background: #fff url("../img/bg_ul_left_navbar_sub.gif") top left repeat-x;
            border-bottom: solid 1px #d2d2d2;
        }
        
        ul#menu-products li {
            border: none;
            margin: 0;
            padding: 0;
            background: transparent;
        }
        
        ul#menu-products li a {
            width: 176px;
            font-weight: normal;
            border: none;
            line-height: 26px;
            padding: 0 0 0 30px;
            background: transparent url("../img/arrow_grey.gif") 15px 50% no-repeat;
        }
        
        ul#menu-products li a:hover,
        ul#menu-products li a:focus,
        ul#menu-products li a.active {
            background: transparent url("../img/arrow_blue.gif") 15px 50% no-repeat;
        }

/************************************************* CONTENT-RIGHT **********************************/
    
    #content-wrapper #content-right {
        width: 634px;
        float: right;
        margin: 0 0 0 10px;
    }
    
        #content-right #main {
            width: 454px;
            float: left;
            padding: 0;
        }
        
        #content-right #main img.header {
            border: solid 4px #efefef;
        }
        
        #content-right #main h1 {
            margin: 1.5em 0;
        }
        
        #content-right #main .content-area {
            /*border-top: solid 1px #e2e2e2;*/
            padding: 20px 20px;
            background: url("../img/bg_content_area.gif") repeat-x;
        }

        #content-right #main .content-area .logo {
            float:left;
            margin:10px 60px 0px 0px;
        }
 

        #content-right #sidebar {
            width: 162px;
            float: right;
            margin: 0 0 0 10px;
            padding: 4px;
            background: transparent;
        }
        
        .content-area .news-item {
            margin-bottom:20px;
        }
        
        .content-area .news-item span.header {
            color: #07abef;
            font-weight: bold;
            display: block;
        }
        
        .content-area .news-item span.date {
            color: #a7a7a7;
            font-style: italic;
            display: block;
            margin: 0 0 1em 0;
        }
        
        
        .content-area .news-item span.categories {
            width: 424px;
            padding-left: 10px;
            display: block;
            line-height: 30px;
            color: #a7a7a7;
            background: url("../img/bg_news_item.gif") repeat-x;
            border-top: solid 1px #e2e2e2;
            border-bottom: solid 1px #e2e2e2;
        }
        
        .content-area .left-img {
            border: solid 4px #efefef;
            float:left;
            margin-right:20px;
            margin-bottom:5px;
        }
        
        .content-area .right-img {
            border: solid 4px #efefef;
            float:right;
            margin-left:20px;
            margin-bottom:5px;
        }        
        

        
/************************************************* FOOTER **********************************/

#footer {
    width: 860px;
    clear: both;
    float: left;
    color: #a6a6a6;
    line-height: 27px;
    padding: 15px 10px;
}

    #footer a {color: #818181;}

/************************************************* OTHER **********************************/

.left {
    width: auto;
    float: left;
}

.right {
    width: auto;
    float: right;
}



/* ie6 png fix */

img, div, li, a { behavior: url(http://www.nautic.se/js/iepngfix.htc) }

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
/*	letter-spacing: -9px;
	font-size: 55px;*/
}

/*.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 25px;
}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}*/