/*
## layout.css - Contains style for page layout
*/

/* Normalizes margin and padding */
* { 
  margin: 0;
  padding: 0;
}

/* Normalizes article content elements */
#content p,
#content dl.fileObject,
#content .image-box,
#content ol,
#content ul,
#content .flashContent,
#content .mediaPlayer,
#content .user-table,
#content .bordered-user-table,
#content .outlined-user-table,
#content .outlined-horizontal-user-table,
#content .horizontal-user-table,
#content .outlined-vertical-user-table,
#content .vertical-user-table,
#content .user-box,
#content form {
  margin-bottom: 12px;
}
#content h1,
#content h2,
#content h3,
#content h4,
#content h5 {
  margin-bottom:5px;
}
img, fieldset {
  border: 0;
}

a {
  text-decoration: none;
  color: #eb6e07;
}

a:hover {
  text-decoration: underline;
}

ul, ol {
  padding-left: 20px;
}

/** 75% sets medium size to 12px in standard browsers **/
body {
  font: 75% Arial, Tahoma, Verdana, Helvetica, sans-serif;
  background-color: #fff;
  color: #58585a;
}

h1, h2, h3, h4, h5 {
  color:#eb6e07;
  font-size: 100%;
  font-weight: bold;
  text-transform: uppercase;
}

h1 { 
  font-size: 167%; 
}
h2 { 
  font-size: 167%; 
}
h3 { 
  font-size: 150%; 
}
h4 { 
  font-size: 116%; 
}

img {
  display: block;
}

input {
  font-size: 100%;
}

/********************
## Framework style ##
********************/
#wrapper {
  margin: 0 auto;
  width: 905px;
  background: #fff;
}
#headerContainer {}
#header {
  margin:0 auto;
  width: 905px;
  height: 73px;
  position:relative;
}
#header img{
  display:inline;
}
#navMainContainer {
  background:transparent url(../GFX/header_bg.gif) top left repeat-x;
  height:24px;
}
#navMain {
  margin:0 auto;
  width: 783px;
  padding-left:222px;
}
#logo {
  padding-top:21px;
}
#navHelp {
  position:absolute;
  right:239px;
  top:44px;
}
#searchForm {
  position: absolute;
  width: 255px;
  top:40px;
  right:0px;
}
#instructions {
  padding-top:15px;
}
#newSearchForm label, #searchForm label {
  display:none;
}
#newSearchForm .query {
  width: 115px;
}
#searchForm .query {
  width: 148px;
  height:17px;
  border:0px solid #fff;
  background: transparent url(../GFX/search_field_bg.gif) top left no-repeat;
  margin:0px;
  float:right;
  padding:2px;
}
.searchButton {
  margin:0 0 0 5px;
  float:right;
}
div.roundedButton {
  float:left;
  clear:left;
  margin-top:5px;
}
div.roundedButton div, .searchButton div{
  background: transparent url(../GFX/button_top_right.gif) top right no-repeat;
  height:20px;
  padding-right:5px;
}

div.roundedButton, .searchButton {
  background: transparent url(../GFX/button_top_left.gif) top left no-repeat;
  padding-left:5px;
}

#content form div.roundedButton div input.button, div.roundedButton div input, .searchButton div input.button {
  height:20px;
  padding:0px 0px 2px 0px;
  margin:0px;
  line-height:20px;
  border:0px solid #fff;
  background:transparent url(../GFX/button_bg2.gif) top left repeat-x;
  font-weight:bold;
  font-size:106%;
  text-transform:uppercase;
  color:#fff;
  text-align:center;
  font-family:Arial,Tahoma,Verdana,Helvetica,sans-serif;
}

#main {
  margin-top:37px;
  background:transparent url(../GFX/main_bg.gif) 649px top repeat-y;
}

#leftColumn {
  float: left;
  width: 200px;
}

#mainColumn {
  /*background: transparent url(../GFX/main_bg.gif) top right repeat-y;*/
  float: left;
  width: 445px;
  padding-right:20px;
}
#rightColumn {
  float:left;
  width:240px;
}

#content {
  padding: 0 5px 0 5px;
}

/* TODO: add styles for customer footer */

/******************
## COMMON STYLES ##
******************/
h4.boxTitle {
  color: #fff;
  background: #a1a1a1;
  padding: 5px 20px;
  margin-bottom: 0;
}

div.box {
  border-bottom: 1px solid #f0f0f0;
}

div.box .content {
  padding: 15px 10px;
}

/*************************
## SUMMARY|ARTICLE LIST ##
*************************/
.summaryImage img {
  margin-bottom:27px;
}
#content div.summary {
  padding-bottom:10px;
}
#content .summary,
#content .article {
  width:100%;
}
.articleBg {
  margin-bottom:10px;
}
.articleBg .article-content {
 padding:10px;
}
.articleBg .article-content a{
 color:#58585a;
 text-decoration:underline;
}

#content .summary,
#content .article {
}

#content .summary h1,
#content .summary h2 {
  font-size: 150%;
}

#content .article .text {
  font-size: 100%;
  letter-spacing:-0.01em;
}
#content .readmore {
  text-transform:uppercase;
}
/*****************
## DIV ##
*****************/

/*****************
## IDIUM FOOTER ##
*****************/

.idium {
  /*width:200px;
  margin:10px auto;*/
  float:right;
  margin:5px 13px 0 0;
}

.idium a:hover,
.idium a:active {
  text-decoration: none;
}

.idium,
.idium a {
  font-family: 'Century Gothic', Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #58585A;
  text-transform: uppercase;
  text-decoration: none;
}

.idium img {
  float: left;
  margin-top: -3px;
}

.idium span {
  font-family: Century Gothic,Verdana,Arial,helvetica,sans-serif;
  font-size: 13px;
  font-weight: bold;
  margin: -8px 0 0;
  padding: 0 0 0 6px;
  text-transform: lowercase;
  word-spacing: 3px;
  color: #000;
}
/*****************
## RIGHT COLUMN ##
*****************/
#userInfo {
  position:relative;
  margin-bottom:5px;
  width:235px;
}
#userInfo #user #logoutForm div.roundedButton {
  position:absolute;
  bottom:4px;
  right:4px;
}
.pixel {
  background:#fff;
  width:1px;
  height:1px;
  position:absolute;
}
.top {
  top:0px;
}
.left {
  left:0px
}
.right {
  right:0px;
}
.bottom {
  bottom:0px;
}
#user {
  background:#f4792a;
  color:#fff;
  border:2px solid #f89d5a;
  padding:5px;
  position:relative;
}
#user a {
  color:#fff;
  font-weight:bold;
  text-transform:uppercase;
}
#user .username {
  font-weight:bold;
}
#rightColumn #userInfo h2{
  background:transparent url(../GFX/right_column_login.gif) top left no-repeat;
  height:21px;
  font-weight:bold;
  font-size:120%;
  color:#fff;
  padding:4px 4px 3px 9px;
}
#userInfo h2 a{
  color:#fff;
}
#userInfo h2 a:hover{
  text-decoration:none;
}
#userInfo span{
  font-size:90%;
  position:absolute;
  right:15px;
}
#rightColumn h2,#rightColumn .summary h2,#rightColumn .summary h1,#rightColumn .article h2,#rightColumn .article h1 {
  background:transparent url(../GFX/right_column_title.gif) top left no-repeat;
  font-size:120%;
  height:18px;
  margin-bottom:1px;
  padding:4px 4px 4px 9px;
  display:block;
  font-weight:bold;
  text-transform:uppercase;
  color:#fff;
}
#rightColumn .summary h2 a, #rightColumn .summary h1 a,#rightColumn .article h2 a,#rightColumn .article h1 a{
  color:#fff;

}
#rightColumn .summary {
  margin-bottom:5px;
}
#rightColumn p.text {
  margin-bottom:5px;
}
#rightColumn .readmore {
  text-transform:uppercase;
  font-weight:bold;
  color:#58585a;
}
#newsletter h2 {
  cursor:pointer;
}
#newsletterForm {
  padding:10px 0 0 0;
}
#newsletterForm input.text{
  width:200px;
  padding:5px;
}
#content .summary img, #rightColumn .summary img {
  margin:8px 0px;
}

#chooseCountry{
  position:relative;
  background:#d1d2d4 url(../GFX/frontpage_bg.jpg) top left repeat-x;
}
#chooseCountry table{
  width:905px;
  margin:0 auto;
  padding:0px;
  background:#d1d2d4 url(../GFX/frontpage_bg.jpg) top left repeat-x;
}
#chooseCountryDesc {
  width:150px;
}
#mapWrapper {
  position:relative;
  margin:50px auto;
}
#mapOverlay, #mapWrapper, #mapBg {
  width:398px;
  height:313px;
}
#mapOverlay, #mapBg {
  position:absolute;
  top:0;
  left:0;
}
#mapOverlay {
  z-index:1000;
}
#mapOverlay.nor {
  background:url(../GFX/kart_nor.png);
}
#mapOverlay.swe {
  background:url(../GFX/kart_swe.png);
}
#mapOverlay.fra {
  background:url(../GFX/kart_swi.png);
}
#mapOverlay.ger {
  background:url(../GFX/kart_swi.png);
}
#mapOverlay.eng {
  background:url(../GFX/kart_uk.png);
}
#mapOverlay.den {
  background:url(../GFX/kart_dan.png);
}
#mapOverlay span {
  display:none;
}
#chooseCountryList {
  width:215px;
}
#chooseCountryMap {
}
#chooseCountryMap img{
  margin:0 auto;
}
#chooseCountry #navLanguage {
  padding:20px 30px;
  border:1px solid #cccdce;
  border-bottom:0px;
  border-top:0px;
}
#navLanguage a{
  color:#58585a;
  display:block;
  padding:6px 0px;
}
#navLanguage a:hover{
  color:#f4721f;
}
/*************
## UTIL     ##
*************/
#print a, #tipafriend a {
  color:#b1b3b4;
}
#print img{
  float:left;
}
#tipafriend img{
  float:left;
}
#print {
  margin-bottom:5px;
}
#print span, #tipafriend span {
  padding-left:6px;
  float:left;
  display:block;
}
#print span {
  padding-top:8px;
}
div.senderEmail {
  width:40%;
  float:left;
}
div.recipientEmail {
  width:40%;
  float:left;
}
div.senderEmail input,div.recipientEmail input{
  width:90%;
}
div.sendTips {
  float:left;
  margin-top:12px;
  clear:none;
}
.loader {
  height:22px;
  width:22px;
  background:transparent url(../GFX/loader.gif) top left no-repeat;
  padding:10px;
}
#rightColumn .loader, #util .loader {
  width:100%;
  background:#fff;
  padding:10px;
}
.loader span{
  display:none;
}
.loader.alert {
  background:none;
  color:red;
  font-weight:bold;
}
.loader.success, .loader.success.alert {
  background:none;
  color:green;
}
#util {
  margin-top:10px;
}
/*************
## USERS    ##
*************/
h2.department {
  clear:both;
  display:block;
  width:435px;
}
ul.users li.department {
  width:100%;
  float:none;
  padding-right:0px;
}
ul.users {
  margin-bottom:10px;
}
ul.users ul li {
  width:100px;
  padding-right:10px;
  float:left;
  height:215px;
}
ul.users img{
  margin-bottom:9px;
}
ul.users a {
  color:#818285;
}
ul.users li h3 {
  font-size:90%;
  letter-spacing:-0.02em;
  line-height:100%;
  color:#58585a;
  margin-bottom:4px;
}
ul.users li div {
  color:#818285;
  font-weight:bold;
  font-size:86%;
}
ul.users li div.title {
  text-transform:uppercase;
}

/*************
## LOGIN FORM ##
*************/
#content #loginForm fieldset {
  padding:0px;
  margin:0px;
  border:0px solid #fff;
}
#content #loginForm label, #content #loginForm input, #newPasswordForm label, #newPasswordForm input{
  float:left;
  clear:both;
}
#content #loginForm .password,#content #loginForm .username, #newPasswordForm #email {
    width:200px;
}
/***************
## FRONTPAGE ##
**************/
#frontpageSlideshow {
  margin-bottom:10px;
  height:160px;
}
#frontpageSlideshow {
  width:636px;
  height:160px;
  overflow:hidden;
  position:relative;
}
#frontpageSlideshow  div.article.articleBg, #frontpageSlideshow  div.summary {
  height:150px;
  width:630px;
  background:#fff;
  padding:10px 10px 0 10px;
}
#frontpageSlideshow  .articleBg .article-content {
  padding:0px;
}
#frontpageSlideshow  .summary img {
  float:right;
  margin:0px 15px;

}
#frontpageContent {
  background: transparent url(../GFX/main_bg.gif) top right repeat-y;
  width:640px;
  float:left;
  padding-right:25px;
}
#frontpageContent #navCatalogImage{
  float:right;
  width:436px;
}
#navCatalogImage img {
  margin-bottom:8px;
}
#frontpageContent #about {
  padding:10px;
  color:#FFF;
  background:#ec7416;
  width:174px;
  margin-right:10px;
}
#frontpageContent #about h1{
  color:#FFF;
  margin-bottom:18px;
}
#about a {
  color:#fff;
  font-weight:bold;
  text-decoration:underline;
}
#frontpageImage {
  margin-bottom:10px;
}
/*************
## ZMAG     ##
*************/
#overlay {
  width:100%;
  height:100%;
  background:#000;
  position:absolute;
  z-index:100;
}
#zmagReader {
  position:absolute;
  z-index:101;
  width:100%;
  height:100%;
}
#zmagReader div.wrapper {
  width:85%;
  height:95%;
  margin:10px auto;
  padding:15px;
  background:#fff;
  position:relative;
  overflow:hidden;
}
#zmagReader iframe#zmag{
  width:100%;
  height:100%;
}
#closer {
  /*background:url(../GFX/closer.jpg) top left no-repeat;*/
  height:28px;
  position:absolute;
  right:15px;
  top:0;
  z-index:150;
}
.pdflink span{
  font-size:90%;
}
/* the overlayed element */ 
div.overlay { 
     
    /* growing background image */ 
    background-image:url(../GFX/white.png); 
     
    /* dimensions after the growing animation finishes  */ 
    width:800px; 
    height:550px;         
     
    /* initially overlay is hidden */ 
    display:none; 
     
    /* some padding to layout nested elements nicely  */ 
    padding:55px; 
} 
 
/* default close button positioned on upper right corner */ 
div.overlay div.close { 
    background-image:url(../GFX/close.png); 
    position:absolute; 
    right:5px; 
    top:5px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
} 
 
 
/* black */ 
div.overlay.black { 
    background:url(../GFX/transparent.png) no-repeat !important; 
    color:#fff; 
} 
 
/* petrol */ 
div.overlay.petrol { 
    background:url(../GFX/petrol.png) no-repeat !important; 
    color:#fff; 
} 
/*************
## CLEARFIX ##
*************/
.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
  height: 1px;
}
.clearfix {
  display: block;
 }
/* End hide from IE-mac */