/* @override http://boknutsson.se/themes/bk/css/screen.css */

/*

    * BO KNUTSSON *
    ***************
        
    SCREEN STYLESHEET
    -----------------
        
    http://boknutson.se
    
    Color palette
    -------------
    Lightgrey:      [#ccc]

*/

/* @group RESET
======================================== */

body, html,
h1, h2, h3, h4, h5, h6, p, img,
object, param, div, blockquote, pre,
dl, dt, dd, ol, ul, li,
table, caption, tbody, td, tfoot, th, thead, tr,
form, fieldset, label, legend, button,
span, a, abbr, acronym, address, code, del, dfn, em, ins, strong, tt, cite, q,  kbd, samp, var {
    margin: 0;
    padding: 0;
    font-size: 100%;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    vertical-align: baseline;
    text-decoration: none;
    list-style-type: none;
    border: 0;
}
select,
input,
textarea { margin: 0; padding: 0; /*font-family: normal;*/ }
table { border-collapse: collapse; border-spacing: 0; empty-cells: show; }
button { overflow: visible; cursor: pointer; }
textarea,
img { vertical-align: middle; }
blockquote:before,
blockquote:after,
q:before,
q:after { content: ""; }
blockquote,
q { quotes: "" ""; }	

/* @end */

/* @group Default */

body
{
    color: #666;
    font-family: "Helvetica Neue" , Helvetica , Arial, sans-serif;
    font-size: 12px;
    line-height: 22px;
    margin: 0;
    padding: 0;
    background: #fff;
}

hr
{
    height: 1px;
    background: #ddd;
    border: 0;
    margin: 20px 0;
}

/* @group Links */

a:link, a:visited {
    color: #6093BA;
    font-weight: bold;
    text-decoration: none;
}

a:hover, a:focus, a:active {
    border-color: #6093BA;
    text-decoration: underline;
}

/* @end */

/* @group Headings */

h1, h2, h3, h4, h5 {
    color: #4D4D4D;
}

h1
{
    font-size: 20px;
    line-height: 36px;
    margin: 0;
    padding: 0;
}

h2
{
    font-size: 1.3em;
    letter-spacing: normal;
}

h3
{
    font-size: 1.0em;
    font-weight: bold;
}

/* @end */

/* @group Lists */

ol, ul
{
    list-style: none;
}

ul
{
}

ul
{
}

ol
{
}

dt
{
}

dd
{
}

/* @end */

/* @group Margins */

p, ul, ol, dl, blockquote {
    margin-bottom: 20px;
}


/* @end */

#container
{
    width: 790px;
    margin: 0px auto;
}

/* @group Header */

#header
{
    clear: both;
    height: 105px; /*background:#62727C;*/
    background: #6093ba;
    padding: 5px 0;
}
/*
    #header h1 {
    font-size:3.5em;
    
    
    }
    
    #header h2 {
    font-size:2.2em;
    }
*/

#header-content
{
    width: 790px;
    margin: 0 auto;
}

h1.logo
{
    padding-top: 25px;
    float: left;
    text-align: center;
    width: 602px;
}

.partner-left
{
    float: left;
    width: 88px;
    padding-top:5px;
}

.partner-right
{
    float: right;
    width: 100px;
    padding-top:5px;
}

#main-nav
{
    background: url(/themes/bk/img/nav_bg.gif) repeat-x;
    height: 37px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 25px;
}

#main-nav ul
{
    line-height: normal;
    font-size: 0.95em;
    font-weight: bold;
    text-transform: uppercase;
    width: 790px;
    margin: 0 auto;
    padding-right: 22px;
}

#main-nav li
{
    margin-right: 1px;
    margin-top: 7px;
    display: inline;
    float: left;
}

#main-nav li.right
{
    margin-top: 7px;
    display: inline;
    float: right;
    text-transform: none;
}

#main-nav li a:link, #main-nav li a:visited, 
#cat-list li a:link, #cat-list li a:visited
{
    color: #333;
    text-decoration: none;
    padding: 4px 11px;
    display: block;
}

#main-nav li a:hover, #main-nav li a:active, #main-nav li a.selected, 
#cat-list li a:hover, #cat-list li a:active, #cat-list li a.selected
{
    color: #fff;
    background: #333;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

#main-nav-inner  {
    width: 790px;
    margin: 0 auto;
}

#lang {
    /*position: absolute;
    right: 20px;*/
    float: right;
    margin-top: 8px;
}

#lang a {
    height: 24px;
    width: 24px;
    float: left;
    text-indent: -999999px;
    /*background-color: #000;*/
    background-image: url(../img/flags/lang.png);
    background-repeat: no-repeat;
}

#sv {
    margin: 0 5px 0 0;
    background-position: 0 100%;
}

#en {
    background-position: 100% 100%;
}

#lang
#sv.selected-lang {
    background-position:  0 0;
}

#lang
#en.selected-lang {
    background-position: 100% 0;
}

/* @end */



/* @group submenu */

#cat-list {
    margin-bottom: 20px;
    margin-top: -25px;
    overflow: auto;
    background: #fff;
    padding: 10px 10px 10px 0;
    border-top: 0px #ccc dotted;
    border-bottom: 1px #ccc dotted;
    width: 770px;
    /*margin-left: -15px;*/
}

#cat-list ul,
#submenu ul {
    margin-left: 0px;
    line-height: normal;
    font-size: 0.95em;
    font-weight: bold;
    text-transform: uppercase;
    }
    
#cat-list li {
    float:left;
/*    margin-right:7px;
    padding-right:7px;*/
    
    /*border-right:1px #ccc solid;*/
}



#submenu ul a:hover, #submenu ul a:focus,  #submenu ul a.selected {
    background: #333;
    /*text-decoration: underline;*/
}

/* @end */


/* @group Content */

#content {
    clear: both;
    width: 790px;
    margin: 0 auto;
    padding: 0 0 0;
}

/* @end */

/* @group Primary */

#primary {
    width: 540px;
    float: left;
    display: inline; /* IEFIX */
    padding: 0 10px 0 0; 
}

#primary img {
   max-width: 550px; /* Adjust this value according to your content area size*/
   height: auto;
} 

/* @end */

/* @group Secondary */

#secondary {
    width: 200px;
    margin-left: 30px;
    float: right;
    display: inline; /* IEFIX */
}
 
/* @end */

/* @group Column override */

body#konstnarer #primary, body#galleri #primary,body#artists #primary, body#gallery #primary {
    width: 790px !important;
    padding: 0 !important;
}

#konstnarer #secondary,#galleri #secondary,#artists #secondary,#gallery #secondary {
    display:none !important;
}

/* @end */




/* @group Home */

h2.headline
{
    background: #fff;
    font-size: 1.3em;
    color: #666;
    padding: 7px 0;
    margin: 0 0 15px;
    clear: both;
}

.puff-left {
    background:url(/themes/bk/img/puff-gradient.png) repeat-x;
    float:left;
    border: 1px solid #c9cbcc;
}

.puff-right {
    background:url(/themes/bk/img/puff-gradient.png) repeat-x;
    float:right;
    border: 1px solid #c9cbcc;
}

.puff-left,
.puff-right {
    padding: 30px 0 30px 18px;
    height: 40px;
    width: 245px;
    margin-bottom: 10px;
}

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

/* @end */

/* @group Artists */

#brands li {
    margin: 0 10px 15px 0;
    padding: 0; /*line-height:0;*/
    float: left;
    display: inline;
    width: 150px;
    height: 170px;
}

#brands h2 {
   font-size: 11px;
   line-height: 11px;
}

#brand-single
{
    margin-bottom:15px;

}

#brand-single img
{
    padding: 10px;
    float:right;
    max-width: 150px; /* Adjust this value according to your content area size*/
    height: auto;

}

#brand-single hr
{
    clear: both;

}

/* @end */

/* @group Gallery */

#brands,
#products {
    clear:both;
    width:800px;
}

body#home #products {
    width:552px;
}

body#home #products li {
    width:126px !important;
    height:140px;
    margin: 0 12px 25px 0;
}
#products li {
    margin: 0 10px 25px 0;
    padding: 0; /*line-height:0;*/
    float: left;
    display: inline;
    width: 150px;
    height: 170px;
}

#products h2 {
   font-size: 11px;
   line-height: 11px;
   margin-top:5px;
}

/* @end */

/* @group Product-single */

#product-info {
    float: right;
    width: 300px;
    padding-right: 10px;
}

#product-browse-and-images {
    float: left;
    padding-top: 5px;
    padding-bottom: 10px;
    width: 310px;
}

#product-browse-and-images ul#browse
{
    margin: 2px 0 0 0;
    padding: 0;
    overflow: hidden;
}

#product-browse-and-images ul#browse li {
    display: inline;
    float: left;
    width: 20%;
}

#product-browse-and-images ul#browse #current-item {
    text-align: center;
    width: 60%;
}

#product-browse-and-images ul#browse #next-item {
    /*float: right;*/
    text-align: right;
}

#product-browse-and-images img
{
    margin: 28px 0 0 0;
    max-width: 390px; /* Adjust this value according to your content area size*/
    height: auto;
}

#product-browse-and-images ul#details
{
    padding: 0;
    margin: 5px 0 0 0;
    overflow: hidden;
}

#product-browse-and-images ul#details li {
    display: inline;
    margin: 0 12px 0 0;
    float: left;
}

/* @end */

/* @group Footer */

#footer {
    clear: both;
    width: 790px;
    margin: 25px 0 10px 0px;
    background: #fff;
    border-top:1px #ccc solid;
    color: #666;
    padding: 10px 0;
    overflow: auto;
}

#footer ul {
    list-style-type: none;
    margin: 0 0 0 0;
    padding: 0;
}

#footer li {
    display: inline;
    float: left;
    /*height: 30px;*/
    margin-right: 5px;
}

/* @end */

/* @group Contact- and comment-form (do we need these?) */

#contact, #comment {
    border-top: 1px solid #ddd;
    /*padding: 19px 0 0;*/
    background: #fff;
    margin: 0;
}

.field {
    border-bottom: 1px solid #ddd;
    padding: 0 0 12px 80px;
    margin: 0 0 20px;
}

.field-label {
}

.field-label label {
}

.field-label label span {
    color: red;
    font-size: 10px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.field-input-text {
    display: block;
    margin-right:10px;
    clear:both;
}

.field-input-text input {
    font-size: 12px;
    padding: 4px;
    background: #fff;
    width: 338px;
    border: 2px solid #B6BFB9;
}

.field-textarea {
}

.field-textarea textarea {
    width: 338px;
    height: 175px;
    border: 2px solid #B6BFB9;
    padding: 4px;
}

.field-submit {
}


.field-submit input {
    margin: 0 0 8px;
}

.field-validation-error {
    display: block;
}

#honeypot {
    display:none;
}

.required {
    vertical-align: middle;
    padding: 0 5px;
}

/* @end */

/* @group Contact-Card */

#contact-card {
    /*padding: 20px;*/
    margin: 0 0 20px;
}

#contact-card p {
    color: #666;
    font-size: 12px;
    line-height: normal;
}

#contact-card span {

}

a.organization-name {
    color: #666;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: 0;
    cursor: default;
}

.geo {
    visibility: hidden;
    height: 0;
    margin: 0;
}

/* @end */

/* @group Comment-Info */

#primary
.comment-info {
    font-size: 11px;
    margin-bottom: 0;
}

/* @end */

/* @group pager */

#pager {
    font-size: 14px;
    margin-bottom:10px;
}

/* @end */

/* @group jQuery lightBox plugin - Gallery style */

.mediaList {
    background-color: #fff;
    padding: 10px 0;
}

.mediaList ul {
    list-style: none;
}

.mediaList ul li {
    display: inline;
    margin-right:10px;
}

.mediaList ul img {
    border: 3px solid #ccc;
    border-width: 3px 3px 3px;
}

.mediaList ul a:hover img {
    border: 3px solid #666;
    border-width: 3px 3px 3px;
    color: #fff;
}

.mediaList a, #jquery-lightbox a {
    border:0;
}

/* @end */

/* @group Misc */

.hide-grid {
    visibility:hidden;
}

.nodisplay {
    display: none;
}

.debug {
    color: #aaa;    
}

/* @end */

/* @group sitemap */

#sitemap ul {
    margin-left:10px;
    margin-bottom:0;
    }

/* @end */


/* @group SHARED
======================================== */

.button-container,
.search-container {
    margin: 0 0 18px;
    padding: 1px 0;
    overflow: hidden;
}

button.button-default,
button.button-small,
input.button-default,
input.button-small,
.search-button,
.link-button {
    cursor: pointer;	
}

.button-default,
.button-small,
.button-container .button-default,
.button-container .button-small,
.search-field { 
    color: #656565;
    border: 1px solid #999;
    text-shadow: #fff 0 1px 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.button-default,
.search-button { 
    background: #cecece url(../img/buttons/button-bg-default.png) no-repeat scroll 0 -20px;
}

/* PSUEDO! */

.button-default:hover,
.button-default:focus,
.search-button:hover,
.search-button:focus {
    background-position: -1000px -20px;
    outline: none;
    outline-width: 0;
}

.button-default:active,
.search-button:active {
    background-position: -1500px -20px;
}

.button-default:active,
.button-small:active {
    border-top-color: #656565;
    background-color: #d8d8d8;	
    text-shadow: #fff 0 -1px 0;
}

.button-default:hover,
.button-default:focus,
.button-small:hover,
.button-small:focus { 
    background-color: #b9b9b9;
}

.button-default:hover,
.button-default:focus,
.button-small:hover,
.button-small:focus,
.search-field:hover,
.search-field:focus {
    outline: none;
    color: #4d4d4d;	
    border-color: #7f7f7f;
}

/* @end */
    
/* @group BUTTONS
======================================== */

.multiple-buttons .button-default { margin-right: 10px; }
.multiple-buttons .button-small { margin-right: 5px; }

.button-container  {
    padding-top:5px;
}

.button-default,
.button-small,
.button-container .button-default,
.button-container .button-small {
    -webkit-box-shadow: rgba(0,0,0,0.2) 0 1px 2px;
    -moz-box-shadow: rgba(0,0,0,0.2) 0 1px 2px;
}

button.button-default,
input.button-default { 
    height: 28px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 2;
}

a.button-default,
a.button-small { float: left; }

.button-default {	
    font-size: 14px;
    line-height: 1;
    padding: 6px 13px;
}

.button-default.button-action { 
    padding-left: 6px;
}

.button-default.button-action img { 
    position: relative;
    top: -2px;
}

.button-small {
    background: #cecece url(../img/buttons/button-bg-small.png) no-repeat scroll 0 0;
    font-size: 11px;
    line-height: 1.1;
    padding: 2px 5px 3px 5px;
}

.button-small:hover,
.button-small:focus {
    background-position: -1000px 0;
}

.button-small:active {
    background-position: -1500px 0;
}

.link-button {
    color: #375d81;
    border-bottom: 1px solid #cdd6df;
}

.link-button:hover {
    color: #375d81;
    border-bottom: 1px solid #999;
}

/* @end */


/* @group EDITOR
======================================== */

.editor-label {
    padding: 10px 0;
}

.editor-label label {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
}
    
.editor-field { 
    
}

.editor-field input[type="text"], .editor-field input[type="password"], .editor-field textarea { 
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    border: 2px solid #ddd;
    padding: 5px;
    outline: none;
    width: 300px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.editor-field input[type="text"]:focus,.editor-field input[type="password"]:focus { 
    border: 2px solid #000;
}

.editor-field .honeypot {
    display:none;
}

#Kontakt .editor-field input[type="text"], #Kontakt .editor-field textarea { 
    width: 470px;
}

/* @end */

/* @group EDITOR
======================================== */

.validation-summary-valid {
    display: none;
}

.validation-summary-errors {
    color: #c71b37;
    padding: 2px 2px 2px 9px;
    margin-bottom: 9px;
}

.validation-summary-errors span {
    font-weight: bolder;
    font-size: 1.1em;
}

/* @end */