/****************************************
************ SHOPSETUP 2010 *************
****************************************/
 
@import url("reset.css");

/*********************************************************************** FONT, RUBRIK m.m ********************************************************************************************/

/*html { width: 100%; height: 100%;}*/

body  { font: normal 12px/22px "Lucida Grande", "Lucida sans unicode", Arial, Helvetica; margin: 0 auto 0; color: #333; background: #e8e8e8; }
body.showroom  { background: url(/img/.jpg) no-repeat top #000; height: 100%; margin: 0; padding: 0 }

h1 { font-size: 22px; padding: 0 0 5px 0; color: #94a72b; }
h2 { font-size: 18px; padding: 0 0 5px 0; color: #94a72b; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; }
h1, h2, h3, h4, h5 { font-weight: normal } 

h1 a, h2 a, h3 a, h4 a { text-decoration: none; color: #94a72b; } 

p { padding: 0 0 20px 0; }
p.link { color: #94a72b } 
p.link a { text-decoration: none } 
p.ingress { font-size: 12px; font-weight: bold; }

.mt10 { margin-top: 10px; }

.left { float: left }
.right { float: right }

img.left { padding: 0 20px 0 0 }
img.right { padding: 0 0 0 20px }

#container .mr0 { margin-right: 0 }
#container .pr0 { padding-right: 0 }

a { color: #333; text-decoration: underline }
a:hover { color: #94a72b; text-decoration: none }

.link_arrow { padding-left: 20px; background: url(/img/bg_link_arrow.png) left center no-repeat; text-decoration: none }
.link_arrow:hover { background-image: url(/img/bg_link_arrow_hover.png); }

.bold { font-weight: bold }

input, select { line-height: 16px; border: solid 1px #ddd; background: url(/img/bg_input.png) repeat-x left bottom; color: #333; padding: 3px 5px; font-size: 14px }
input[type=text] { width: 200px }
select { width: 210px }

input.button { background: #94a72b url(/img/bg_button.png) repeat-x; color: #fff; min-width: 120px; _width: 120px; text-align: center; height: 25px; cursor: pointer; border: none }
input.button:hover { background-position: left -16px }

/************************ Clearfix ****************************/

.clearfix:after { display: block; clear: both; height: 0; visibility: hidden; content: "."; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1px; }
.clearfix { display: block; }

/************************************************************************ CONTAINER *************************************************************************************************/

#container { width: 980px; margin: 0px auto; /*border-top: solid 10px #94a72b;*/ padding-top: 10px }

/************************************************************************ TOPPEN ****************************************************************************************************/
#top { width: 978px; height: 43px; background: url(/img/bg_media.png) left -87px repeat-x; border: solid 1px #ddd; }

#top ul { float: left; width: 976px; height: 42px; font-size: 12px; text-transform: uppercase; border: solid 1px #fff; border-top: none /*solid 10px #004283*/ }
#top ul li { float: left; line-height: 21px }
#top ul li a { float: left; text-decoration: none; padding: 10px 20px; margin: 1px 1px 0 0; /*width: 128px;*/ text-align: center }
#top ul li:first-child { width: 55px; padding-left: 15px }
/*#top ul li a:first-child { width: 35px; border: none }*/
#top ul li a.home, #top ul li a.home:hover { background: url(/img/home.png) no-repeat center; border: none }
#top ul li a:hover, #top ul li a.active { color: #fff; background: #004283 url(/img/bg_top_nav_active.png) repeat-x; height: 21px; }
/*#top ul li a:hover { background: #eee; color: #333 }*/
#top ul li.end { float: right }
#top ul li input { width: 120px; float: right; padding: 2px 5px; margin: 10px 20px 0 0; background: #fff url(/img/search.png) no-repeat right }

/************************************************************************ SHOWROOM MENY ********************************************************************************************/

#showroom_menu { width: 1000px; height: 10%; margin: 0 auto; background: url(/img/showroom_top.jpg) no-repeat #000;  }

#showroom_menu ul { float: right; padding: 50px 30px 30px 0; font-size: 14px; text-transform: uppercase }
#showroom_menu ul li { display: inline; padding: 0 10px 30px; /*border-right: solid 1px #e0e0e0*/ }
#showroom_menu ul li a { text-decoration: none; color: #666 }
#showroom_menu ul li a:hover, #showroom_menu ul li a.active { color: #fff; border-bottom: solid 3px #94a72b }
/*#showroom_menu ul li.end { border: none }*/

#showroom_menu p { color: #fff; padding: 0 40px 5px 205px; text-align:justify; line-height: 140%; font-size: 11px }

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

#footer { float: left; font-size: 11px; line-height: 16px; width: 980px; padding: 10px 0 0 0 }
#footer a { text-decoration: none; color: #333 }
#footer a:hover { color: #94a72b }
#footer .link_arrow { padding-left: 12px; background-position: left 2px }

/************************ Kontaktinfo ****************************/

#footer ul { width: 960px; padding: 0 10px; }
#footer ul li { float: left; width: 190px; margin: 0 25px; }
#footer ul li.first { width: 185px; _margin-left: 12px; /*background: url(/img/logo.png) center no-repeat; */}
#footer ul.copy li.end { border-right: none }
#footer h5 { border-bottom: solid 1px #ccc; color: #94a72b }

/************************ Copy ***********************************/

#footer ul.copy { font-size: 10px; padding: 10px 0 0; float: right; text-align: center; color: #999 }
#footer ul.copy li { float: none; display: inline; width: auto; border-right: solid 1px #ccc ; margin: 0; padding: 0 14px 0 10px }
#footer ul.copy img { margin: 0 5px 0 -10px; padding: 0 0 0 15px }
#footer ul.copy a { color: #999; }
#footer ul.copy a:hover { text-decoration: underline }

/************************************************************************ Startsida ************************************************************************************************/

#media { width: 978px; height: 580px; background: #fff url(/img/bg_media.png) bottom repeat-x; border: solid 1px #ddd; margin: 10px 0; position: relative; overflow: hidden }
#media h1, #media h2 { font-size: 34px; padding-bottom: 20px; color: #94a72b }
#media #media_content h1, #media #media_content h2 { line-height: 40px; }
#media h2 { font-size: 26px; }
#media h2 span { font-size: 20px; }
#media_content { width: 978px; height: 580px; background: #fff; /*border-bottom: solid 1px #ddd;*/ overflow: hidden }
#nav { position: relative; z-index: 20; margin: -60px 0 0 -1px; padding: 0; height: 59px; left: 0; /*bottom: -200px;*/ background: #fff url(/img/bg_gradient_bottom.png) repeat-x center bottom; border-top: solid 1px #ddd; }
#nav a { font-size: 8px; color: #94a72b; text-decoration: none; text-align: center; margin-top: -1px; background: url(/img/bg_media_tab.png) center bottom no-repeat; height: 60px; width: 80px; line-height: 50px; float: left; overflow: hidden }
/*#nav a:first-child { width: 98px; background: url(/img/bg_media_tab_first.png) center bottom no-repeat; }*/
#nav a img { padding: 5px 15px;  }

#nav p {  float: left; height: 50px; font-size: 10px; border-left: solid 1px #ddd; border-right: solid 1px #fff; line-height: 13px; }
#nav p.ref { padding-left: 55px; width: 127px;  }

#nav p span { display: block; height: 30px; text-align: center; padding: 16px 10px 14px 20px; margin-right: 20px; color: #b3b3b3; background: url(/img/bg_ref_arrow.png) right center no-repeat; font-family: Georgia, "Times New Roman", Times, serif }
/*#nav a:hover img { border: solid 1px #004283;*//* margin: 0; background: url(/img/bg_media_tab_hover.png) center bottom no-repeat;}*/
/*#nav a:first-child:hover {  background: url(/img/bg_media_tab_first_hover.png) center bottom no-repeat; }*/
#nav a.activeSlide { /*background: none; border: solid 1px #eee;*/ background: url(/img/bg_media_tab_active.png) center bottom no-repeat;}
/*#nav a.activeSlide:first-child img { border: none; margin: 3px; background: url(/img/bg_media_tab_first_active.png) center bottom no-repeat; }*/
/*#nav a.activeSlide:last-child {background: url(/img/bg_media_tab_last_active.png) center bottom no-repeat; border-right: solid 1px #ddd }*/
#nav a.end { border-right: solid 1px #ddd }

#output { border: solid 1px red; width: 200px; height: 40px; }

#remote_wrapper { position: absolute; bottom: 18px; right: 25px; z-index: 100; }
#remote { cursor: pointer; float: right}

#media_content p.type { position: absolute; top: 65px; right: 1px; line-height: 24px; padding: 0 10px; color: #fff; background: #94a72b; }

#media_content div { position: relative; width: 978px; height: 560px; }
#media_content div.start { color: #004283 }

#media_content div div { position: absolute; width: 260px; right: 25px; top: 55px; }
#media_content div.start div { width: 360px; top: 210px; right: 50px }

#media_content div img { display: block }
#media_content p.link a { color: #94a72b }

#news { width: 978px; height: 100px; padding: 20px 0; background: #fff url(/img/bg_news.png) bottom repeat-x; border: solid 1px #ddd; margin-bottom: 10px }
#news div { float: left; width: 284px; height: 100px; padding: 0 20px; margin-right: 5px; }
#news div.right { border: none; width: 278px; margin: 0 } 
#news p { padding: 0; font-size: 12px } 

.col_3 { float: left; width: 278px; height: 180px; padding: 20px; margin: 0 10px 10px 0; background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x; border: solid 1px #ddd; } 
/*.col_3.right { margin-right: 0; width: 278px; position: relative }*/
.right img { position: absolute; right: 0; bottom: 1px; width: auto; height: auto }
.col_3 p { font-size: 12px; position: relative; padding: 0 0 15px }
.col_3 h3 { font-size: 16px; color: #94a72b }
.left p, .right p { padding: 0 }
.right p.ingress { padding-top: 15px; font-style: italic; font-weight: bold; font-size: 11px }
.col_3 input.button { float: right; min-width: 100px; width: 100px }
.col_3 input { width: 140px }
.col_3 p.right { width: 100px; line-height: 16px; font-size: 11px }
.col_3 span.error, .col_3 span.success { width: 84px; height: 56px; line-height: 16px; font-size: 11px; font-weight: normal; float: right; padding: 5px }
.col_3_right { margin-right: 0; width: 278px; position: relative; float: right }

/************************************************************************ Vänstermeny ************************************************************************************************/

#left_menu { float: left; width: 227px; padding: 0 0 20px 0; position: relative; min-height: 480px; _height: 480px; }
#left_menu ul { border-bottom: solid 1px #ddd; margin: 40px  0px 0 20px; }

#left_menu ul li { line-height: 20px; border-top: solid 1px #ddd; padding: 0; /*background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x;*/ }
#left_menu ul li:first-child { border-top: none }
#left_menu ul li a { display: block; padding: 10px 0 10px 20px; width: 187px; text-decoration: none; color: #333; border: none; background: url(/img/bg_link_arrow.png) left center no-repeat;  }
#left_menu ul li a.active { color: #94a72b; background: url(/img/bg_link_arrow_hover.png) left center no-repeat; text-decoration: none;   }
#left_menu ul li a:hover { background: #eee url(/img/bg_link_arrow_hover.png) left center no-repeat; color: #333 }
#left_menu ul li a.active {  font-weight: bold; width: 187px; color: #004283; /*background: #004283; */}

/************************************************************************ Content ************************************************************************************************/

#content { padding: 40px; min-height: 480px; _height: 480px; background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x; border: solid 1px #ddd; margin-bottom: 10px }
/*#content.right { float: right; width: 651px; margin-bottom: 10px; }*/

#content.col_right { float: right; width: 670px; border: none; border-left: solid 1px #ddd; margin: 0 }
#content.col_right h1 { padding: 0 0 20px 0 }
#content.col_right h2 { color: #333; font-size: 16px; padding: 0 }
#content.col_right h3 { color: #333; font-size: 14px; } 
.fixed h1, .fixed h2, .fixed h3, .fixed h4, .fixed p { width: 420px; } 
/*#content.fixed p { width: 440px }*/
#content.col_right p.ingress { margin-top: -15px }
#content h1 { padding-bottom: 20px; position: relative }

#content.col_right #accordion li div { width: 630px; padding: 0 20px; }
#content.col_right #accordion li img.right { margin-right: -20px }
h1 span { font-size: 14px }

#content img.header { margin-bottom: 30px; display: block; }

/* Dela */
.addthis_button, #accordion.newsletter li div a.addthis_button { width: auto; height: auto; line-height: normal; border: none !important; padding: 0 }
.news_link { font-style: italic; font-size: 11px; line-height: normal; padding-top: 10px }
.news_link a { font-style: normal }

/************************************************************************ ToppRubrik ************************************************************************************************/

#header { padding: 15px 20px 0; margin-top: 10px; height: 42px; background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x; border: solid 1px #ddd; border-bottom: none; /*margin-bottom: 10px*/ }
#header.m10 { margin-bottom: 10px; border-bottom: solid 1px #ddd }
#header p, #header h1 { position: relative; float: left; font-size: 18px; color: #94a72b }
#header .link_arrow { padding: 0 0 0 20px; }
#header a { text-decoration: none }
#header ul li a { margin: 0 0 0 20px }
#header ul li img {  margin: -5px 0 0 5px; }
#header h1 span { position: absolute; right: 0px; font-size: 11px; color: #666; font-style: italic; }
#header ul { float: right }
#header ul li { float: left }

/************************************************************************ Infosida ************************************************************************************************/

#info_wrapper { background: #f8f8f8 /*url(/img/logo.png) bottom left no-repeat*/; border: solid 1px #ddd; margin-bottom: 10px }

#top_img { border-bottom: solid 1px #ddd }
#top_img img { border: solid 10px #fff; width: 958px; height: 190px }

#col_right { float: right; width: 170px; padding: 15px; margin: 0 0 40px 20px; background: #f8f8f8; font-size: 11px; line-height: 18px; border-top: solid 5px #94a72b; border-bottom: solid 5px #94a72b }

/* Högerspalt */
#content.col_right #col_right h3 { color: #94a72b; padding-bottom: 20px }
#content.col_right #col_right h4, #content.col_right #col_right h5 { color: #94a72b; font-size: 12px }
#content.col_right #col_right p, #content.col_right #col_right h1, #content.col_right #col_right h2, #content.col_right #col_right h3, #content.col_right #col_right h4 { width: auto }

/* Karta */
#map { float: right; width: 420px; }

#map_canvas { width: 420px; height: 420px; border: 1px solid #c0c0c0; }
#startover { width: 410px; display: none; border: solid 1px #c0c0c0; background: #eee; padding: 5px; margin: 5px 0 0 0 }
#route { width: 421px; display: none; margin: -4px 0 0 -4px }
#route p { padding: 5px }

#map_info { width: 220px; height: 100px; font-size: 11px; }
#map_info img { margin-bottom: -15px; float: right }
#map_info input { width: 198px; height: 14px; color: #333; font-size: 11px }
#map_info input.button { min-width: 60px; width: 60px; height: auto; float: right; color: #fff; font-size: 14px; margin: 10px 0 -30px 0 }
#content.col_right #map_info p { padding: 0; width: 210px; }

/* Felmeddelande */
.error, .success { padding: 10px; margin-bottom: 20px; border: solid 3px #cc0000; color: #cc0000; width: 414px; font-weight: bold }
.error p, .success p { padding: 0 }
.success { color: #94a72b; border-color: #94a72b }

/* Formulär */
ul.form { padding-bottom: 20px }
ul.form span { color: #cc0000 }

 /************************************************************************ Referens lista ************************************************************************************************/
#reference_wrapper {  background: url(/img/bg_reference_bottom.png) right 100% no-repeat; margin: 0 0 10px 0; min-height: 709px; _height: 709px }
#reference { float: right; width: 326px; min-height: 550px; _height: 550px; padding: 40px 30px; background: url(/img/bg_reference_top.png) top no-repeat; margin: 0 0 10px 0 }
#reference.info { min-height: 550px/* 1353px*/; _height: 550px /*1353px*/ }

#reference h2 { font-size: 14px; padding-bottom: 20px;  }
#reference.info ul { list-style-type: disc; padding: 0 0 20px 15px }
#reference.info ul li { list-style-position: outside }
 
#reference_list { width: 594px; float: left }
#reference_list li { float: left; height: 250px; width: 166px; padding: 10px; margin: 10px 10px 0 0; background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x; border: solid 1px #ddd; }
#reference_list li.img { width: 562px; height: auto }

#reference_list li.img div { position: relative }
#reference_list li.img div div { position: absolute; width: 200px; }
#reference_list li.img div div.right { right: 40px; top: 40px; width: 200px; }
#reference_list li.img div div.left { left: 40px; top: 10px; }

#reference_list li img { display: block }
#reference_list li h3 { font-size: 12px; padding: 5px 0 0 0 }
#reference_list li h3 a { color: #94a72b;}
#reference_list li p { padding: 0; font-size: 12px; color: #999 }

 /************************************************************************ Referens fullpost ************************************************************************************************/
#reference #ref_nav { list-style-type: none; color: #94a72b; text-align: left; padding: 0 0 20px 0; float: left; width: 100% }
#reference #ref_nav li { float: left; padding-right: 20px }
#reference.info #ref_nav li { display: inline; width: 166px; padding: 0; text-align: center}
#reference.info #ref_nav li.left { float: left; width: 80px; text-align: left }
#reference.info #ref_nav li.right { float: right; width: 80px; text-align: right; padding-right: 0 }

#ref_nav li a { text-decoration: none; padding: 5px 10px }
#ref_nav li a:hover, #ref_nav li a.active { /*font-weight: bold;*/ color: #fff; background: #004283 }

/************************************************************************ TOPPMENY 2 **************************************************************************************************/

#top_menu { height: 179px; background: #fff url(/img/bg_gradient_bottom.png) bottom repeat-x; border: solid 1px #ddd; margin-bottom: -1px }
#top_menu ul li { float: left; width: 162px; height: 180px; text-align: center; border-right: solid 1px #ddd; }

#top_menu ul li a { float: left; width: 141px; padding: 0 10px 10px; border-left: solid 1px #fff; font-size: 14px; font-weight: normal; color: #333; text-decoration: none }
#top_menu ul li a:hover { color: #94a72b }
#top_menu ul li a.active { background: url(/img/bg_top_nav.png) 0px -22px no-repeat; color: /*#94a72b*/#004283; font-weight: bold; border-right: solid 1px #fff; width: 140px }

#top_menu ul li.first a.active, #top_menu ul li.first a.active:hover { background-position: 0 -22px; }
#top_menu ul li.first a { border-left: solid 1px #fff }
#top_menu ul li.first a:hover { background-position: 0 -1px; }

#top_menu ul li.last { border-right: none; width: 163px }
#top_menu ul li.last a { width: 141px }

#top_menu ul li a img { display: block; padding-bottom: 5px }

/************************************************************************ Accordion ************************************************************************************************/

/* Nyhetsarkiv */
#accordion { width: 100% }
#accordion li { border-bottom: solid 1px #ddd; position: relative; }
#accordion li.header { margin-top: 20px; }
#accordion select { height: 20px; width: 60px; border: solid 1px #ddd; background: url(/img/bg_input.png) repeat-x left bottom; color: #333; padding: 1px; _padding: 0; font-size: 12px; /*margin-top: -2px*/ }
#accordion select option { background: #fff }

#accordion li h1, #accordion li h2 { height: 22px; color: #94a72b; padding-bottom: 5px; font-size: 18px }
#accordion li h3 { font-size: 14px; font-weight: normal; color: #333; cursor: pointer; padding-top: 5px; padding-bottom: 5px; height: 22px; width: auto }
#accordion li h3:hover { background: #f8f8f8 url(/img/bg_link_arrow_hover.png) left center no-repeat; }
#accordion li h3.selected { font-weight: bold; line-height: 30px; font-size: 20px; margin-top: 10px; background-position: left 15px }
#accordion li h3.selected:hover { background-color: #fff }
#content.col_right #accordion li h3.selected { line-height: 22px; font-size: 14px; margin-top: 0 }
#content.col_right #accordion li div { display: block }
#accordion li h3.selected span { font-size: 14px; color: #999 }

#content.col_right #accordion li h1, #content.col_right #accordion li h2 { color: #94a72b; padding-bottom: 5px; font-size: 18px }
#accordion li h3 span, #accordion li h1 span, #accordion li h2 span { position: absolute; right: 2px; top: 4px; font-size: 11px; color: #555; width: 200px; text-align: right; display: block }
#accordion li h1 span, #accordion li h2 span { top: 2px; right: 0 }

/* Årsnavigering */
#accordion li h1 div, #accordion li h2 div { padding: 0; display: inline }
#accordion li h1 span, #accordion li h2 span { font-size: 14px }
#accordion li span a, #accordion li span a:hover { border: none; display: inline; color: #94a72b; text-decoration: none; font-size: 11px; }
#accordion li span a:hover { color: #94a72b; text-decoration: underline }
#accordion li span.bold { font-size: 11px; position: static; display: inline; padding: 0 5px; margin: 0 5px; border-left: solid 1px #ddd; border-right: solid 1px #ddd }
#accordion li h1 a, #accordion li h2 a {  }

/* Nyhetspost */
#accordion li div:after { display: block; clear: both; height: 0; visibility: hidden; content: "."; }
#accordion li div { display: inline-block; }
* html #accordion li div { height: 1px; }
#accordion li div { display: block; }
#accordion li div div.img { float: right; width: 300px; text-align: center }
#accordion li div div.img img { }
#accordion li div div.img p { width: 300px; font-size: 11px; font-style: italic; line-height: normal }

#accordion li div { width: 858px; padding: 0 20px 20px; height: auto; overflow: visible; display: none }
#accordion li.selected div { display: block }

#accordion li h3 span { font-style: italic }
#accordion li div h4, #accordion li div strong { font-weight: normal; font-size: 12px; font-weight: bold }
#accordion li div strong a, #accordion li div a strong { font-size: 12px; font-weight: normal }
#accordion li div p { width: 480px; padding-bottom: 20px }
#accordion li div a { text-decoration: none; color: #94a72b; font-weight: normal }
#accordion li div a:hover { text-decoration: underline }
#accordion li div img { margin-top: 20px }
#accordion li div ul { list-style-type: disc; padding: 0 0 20px 15px }
#accordion li div li { list-style-position: outside; border: none }

/* Nyhetsbrev */
#content h1.newsletter { padding-bottom: 5px; margin-bottom: 20px;  }
#accordion.newsletter li h2 { font-size: 16px }

#accordion.newsletter li div p.link { /*padding-bottom: 20px;*/ }
#accordion.newsletter li div p { width: auto; padding: 0 }
#accordion.newsletter li div a { /*text-decoration: underline;*/ color: #333; padding: 0 8px 0 3px; border-right: solid 1px #666; /*color: #94a72b*/ }
#accordion.newsletter li div a:last-child { border: none }
#accordion.newsletter li div a:hover { color: #94a72b }
#accordion.newsletter li div p.link a { padding: 0; margin: 0; color: #333 }