/* =========================================================== Default colors

Text: #666, Rubriker: #303030, Orange-länkfärg: #b86e00, 
Produktmenylänkar: #6a6a6a, blå länkfärg: color: #5ba5f8;

========================================================================== */


/* =========================================================== General */

* {
  margin: 0;
  padding: 0;
}

body {
  /* 10px / 21px */
  font: 62.5%/1.75 "Lucida Sans Unicode", "Lucida Grande", Tahoma, Helvetica, sans-serif; 
  background: #eeece7;
  color: #555;
}

a img {
  border: 0;
}

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

li {
  list-style: none;
}

.img-border {
  border: 4px solid #f2f2f2;
}

/* =========================================================== General elements */
#wrap {
  font-size: 1.2em;
}

#header, #navigation, #template, #footer, #footer-text {
  width: 944px;
  margin: 0 auto 0 auto;
}

#header #user {
  float: right; 
  margin: 79px 30px 0 0;
}

#header #language {
  float: right;
  margin: 79px 4px 0 0;
}

#header #language img {
  margin-bottom: -2px;
}

#header #language a {
  color: #fff;
}

#header-container {
  background: #fff url('/images/formomiljo/headerbg.gif') repeat-x;
  width: 100%;
  height: 120px;
  margin-bottom: 60px;
}

#template {
  background: #eeece7 url(/images/formomiljo/template-background.gif) repeat-y;
  width: 864px;
  padding: 25px 40px 40px 40px;
}

#template-wrap {
  width: 900px;
  float: left;
  margin-bottom: 30px
}

#footer-text {
  font-size: 0.916em;
  text-align: center;
  background: #fff url(/images/formomiljo/template-background.gif) repeat-y;
  width: 944px;
}

#footer {
  background: #eeece7 url(/images/formomiljo/footer-background.gif) no-repeat;  
  height: 15px;
  margin-bottom: 20px;
}


/* =========================================================== Text styles */

h1 { 
  font-weight: normal;
  font-size: 2.416em;
  color: #303030;
  line-height: 25px;
  margin-bottom: 0.25em;
}

h2 {
  font-size: 1em;
  color: #303030;
}


h3 {
  color: #303030;
  line-height: 1.33em;
  margin-bottom: 0.6em;
}

h4 {
  color: #303030;
}

strong {
  color: #000;
}

/* =========================================================== 404 */
.dialog-404 h1 {
  font-size: 18px;
  color: #af0000;
}


/* =========================================================== Index */
#start #left {
  width: 560px;
}

#start #left img {
  margin-bottom: 2em;
}

#start #right {
  width: 265px;
  float: right;
  margin-right: 30px;
}

#start #right #cert {
  margin-top: 30px;
}

#start #catalogues-container {
  float: left;
  width: 570px;
}

#start #catalogues-container p {
  font-size: 0.916em;
}

#start #catalogues-container #catalogues {
  width: 320px;
  padding-left: 0px;
  margin-top: 30px;
  float: left;
}

#start #catalogues-container h3 {
  margin: 30px 0 0 0;
}

#start #catalogues-container h3 img {
  margin-top: -15px;
  position: absolute;
}

#start #catalogues-container #puff {
  margin: 35px 0 0 0px;
  float: right;

}


/* =========================================================== Index - News */

#start #right #news {
  width: 260px;
  background: #F1EFEF; 
}

#start #right #news .round-content {
  padding: 0px 11px 0px 17px; 
  margin: 0;
  float: left;
  line-height: 1.2em;
}

#start #right #news .entry {
  position: relative;
  margin: 0px 0 15px 0;
  float: left;
}

#start #right #news .date {
  float: left; 
  padding: 8px 4px 0 0; 
  margin: 0px 10px 0 0;
  background: url(/images/formomiljo/date-bg.gif) no-repeat; 
  width: 48px; 
  height: 40px; 
  text-align: center; 
}

#start #right #news .date a {
  font-family: Georgia, sans-serif;
  color: #333;
}

#start #right #news .month {
  margin: 0; 
  color: #707274; 
  text-transform: uppercase;
  line-height: .95em;
}

#start #right #news .day {
  font-size: 1.5em;
  line-height: .95em; 
  color: #707274; 
  margin: 2px 0 0 0; 
  padding: 0; 
}

#start #right #news .news-item {
  width: 170px;
  float: right;
}

#start #right #news h3 {
  font-size: 1em;
  color: #b86e00;
  padding: 0;
}

#start #right #news .round-top {
  background: url("/images/formomiljo/news-tr.gif") no-repeat top right; 
  height: 14px;
}

#start #right #news .round-bottom {
  background: url("/images/formomiljo/news-br.gif") no-repeat top right; 
  clear: both;
  margin-top: 10px;
  height: 15px;
}

#start #right #news .older-news {
  font-size: 0.916em;
  float: left;
  clear: both;
  width: 100%;
}


/* =========================================================== News */
#news .post {
  width: 600px;
  margin-bottom: 60px;
  padding-bottom: 60px;
  border-bottom: 1px solid #ccc;
}

#news .date {
  font-size: 10px;
}
#news .post .post-thumbnails li{
  float: left;
  margin-right: 3px;
}

#news .post .post-body {
  padding-top: 10px;
  clear: both;
}

#news #older-news {
  float: right;
  width: 270px;
  margin-top: -20px;
}

#news #older-news ul {
  font-size: 10px;
}

#news .all-news {
  margin-top: 10px;
}
/* =========================================================== Company */
#company {
  width: 880px;
  float: left;
}

#company img {
  margin-bottom: 2em;
}

#company div {
  width: 400px;
  float: left;
  margin-right: 40px;
}

#company div p {
  margin-bottom: 1em;
}


/* =========================================================== Products - General */

#products {
  width: 650px;
  float: left;
}

#products li {
  font-size: 0.916em;
  color: #000;
}

#products li a {
  color: #000;
}

/* =========================================================== Products - Index */
#products.index h1 {
  margin-top: 0.5em;
}

#products.index p {
  width: 590px;
}

/* =========================================================== Products - Menu */
#product-menu {
  width: 204px;
  float: left;
  margin: -5px 25px 10px -10px;
}

#product-menu a {
  color: #6a6a6a;
}

#product-menu a:hover {
  color: #303030;
  text-decoration: underline  ;
}

#product-menu #categories {
  width: 204px;
}

#product-menu #categories #main {
  background: url(/images/formomiljo/product-menu.gif);
  width: 169px;
  padding: 7px 20px 5px 15px;
  font-size: 0.916em;
  float: left;
}

#product-menu #categories #top {
  width: 204px;
  height: 6px;
  background: url(/images/formomiljo/product-menu-top.gif) no-repeat;
  padding: 0;
  margin: 0;
  float: left;
}

#product-menu #categories #bottom {
  background: url(/images/formomiljo/product-menu-bottom.gif) no-repeat;
  width: 204px;
  float: left;
}

#product-menu #categories li {
  padding: 2px 0 2px 0;
  border-top: 1px solid #e9e9e9;
}

#product-menu #catalogue-order {
  width: 204px;
  margin: 20px 0 0 15px;
  float: left;
  font-size: 0.916em;
}

#product-menu #catalogue-order img {
  margin-top: 10px;
}

#product-menu .navigation-item {
  width: 204px;
  margin: 20px 0 0 15px;
  float: left;
  font-size: 0.916em;
}


/* =========================================================== Products - Category view */
#products.list ul, #products #series-list {
  margin-top: 30px;
}

#products.list, #products #series-list {
  width: 640px;
  color: #303030;
}

#products.list a, #products #series-list a {
  color: #303030;
}

#products.list li, #products #series-list li {
  line-height: 1.2em;
  width: 150px;
  height: 190px;
  margin: 0 10px 0px 0;
  float: left!important;
  position: relative;
}

#products.list li .image, #products #series-list .image {
  height: 120px;
  margin-bottom: 10px;
  position: relative;
}

#products.list li .image img, #products #series-list img {
  position: absolute;
  bottom: 0;
}
  
#products.list .variation {
  font-size: 9px;
  color: #5ba5f8;
  margin-top: 0px;
  position: absolute;
  float: left;
}

#products.list .variation a {
  color: #5ba5f8;
}

/* =========================================================== Products - Category - material and colours */
.material-and-colours-container {
  width: 652px!important;
}

.material-and-colours-container h1 {
  margin-bottom: 40px;
}

.material-and-colours-container h2 {
  width: 100%;
  clear: both;
  font-size: 14px;
}

.materials-and-colours li {
  width: 142px!important;
  margin: 0 28px 0 0!important;
  padding: 0!important;
}

.materials-and-colours li p {
  margin-top: 4px;
}

.materials-and-colours li.forth {
  margin: 0!important;
  padding: 0!important;
}

/* =========================================================== Products - Category view - Series */

#products.list #series  {
  width: 640px;
  margin: 15px 0 30px 0;
  padding: 25px 0 20px 0;
  float: left;
  border-top: 1px solid #e9e9e9;
  border-bottom: 1px solid #e9e9e9;
}

#products.list #series li {
  height: 270px;
}

#products.list #series li.last {
  clear: left;
}

#products.list .series .image {
  background: url('/images/formomiljo/series-bg.gif') no-repeat;
  width: 132px;
  height: 166px!important;
  margin-bottom: 3px;
  position: relative;
  float: none;
}

#products.list .series .image img {
  padding: 0;
  margin-left: 14px;
  bottom: 12px;
  position: absolute;
}
  

#products.list .series .info {
  float: left;
}

#products.list .series p.brief-info {
  color: #666;
  font-size: 0.818em;
  margin-top: 3px;
}

#products.cad h2 {
  clear: both;
  margin-top: 40px;
}

#products.cad ul {
  margin-top: 0;
  clear: both;
}

/* =========================================================== Products - Show */

#products.show h1 {
  font-size: 1.5em;
  font-weight: normal;
  margin: 0px 0 10px 0;
}

#products.show h2 {
  font-weight: normal;
  font-size: 12px;
  margin: 5px 0 9px 0!important;
  padding: 0;
}

#products.show h3 {
  font-weight: normal;
  font-size: 12px;
  margin: 0px 0 14px 0!important;
  padding: 0;
}

#products.show #images {
  float: right;
}

#products.show #images img {
  margin-bottom: 15px;
  float: left;
  clear: both;
}

#products.show hr {
  clear: both;
  margin-top: 30px;
  border-top: 1px dotted #ccc;
  border-bottom: 0;
  border-left: 0;
  border-right: 0;
}

#products.show .breaker {
  width: 100%;
  float: left;
  clear: both;
  border-bottom: 1px dotted #ccc;
  margin-bottom: 20px;
}

#products.show .top-breaker {
  margin-top: 10px;
  margin-bottom: 0px!important;
}

#products.show #product-wrap {
  width: 100%;
  background: #fff url('/images/formomiljo/product-info.gif');    
  margin: 20px 0 0px 0;
  float: left;
  position: relative;
  padding-bottom: 20px;
}

#products.show #info {
  width: 300px;
  margin: 0px 0 15px 0;
  padding: 0px 15px 15px 0;
  float: left;

}

#products.show #product-info {
  font-size: 11px;
}

#products.show #extras {
  float: left;
  padding: 0px 0 0 26px;
}

#products.show .article-number {
  margin-top: 10px;
  font-size: 0.916em;
}


#products h3.measurements {
  margin-bottom: 10px!important;
}

#products #measurements {
  width: 305px;
  text-align: left;
  font-size: 11px;
  color: #303030;
}

#products #measurements th {
  padding-right: 20px;
}

#products #measurements th.fillout, #products #measurements td.fillout {
  width: 100%;
}

#products #measurements th, #products #measurements td {
  padding-left: 0px;
}

#products #measurements tr.m-odd td {
  background: #f0f0f0;
}

#products #measurements tr.m-even td {
  background: #fafafa;
}

#products #measurements td.extra {
  padding-right: 10px;
}


#products.show #assets {
  border-top: 1px dotted #ccc;
  padding: 11px 0 18px 0;
  margin-top: 20px;
}

/* =========================================================== Products - Show - Variations */

#products.show #variations {
  width: 640px;
  margin-top: 15px;
  padding-top: 15px;
  float: left;
  clear: both;
}

#products.show #variations h4 {
  padding-bottom: 10px;
}

#products.show #variations li {
  width: 160px;
  margin-bottom: 20px;
  float: left;
  position: relative;
}


#products.show #variations li .image {
  height: 120px;
  margin-bottom: 5px;
  position: relative;
}

#products.show #variations li .image img {
  position: absolute;
  bottom: 0;
}


#products.show #variations li strong {
  font-weight: normal;
}


/* =========================================================== Products - Accessories */

#products.show #accessories {
  width: 100%;
  clear: both;
  padding-bottom: 10px;
  float: left;
  border-bottom: 1px dotted #ccc;
}

#products.show #accessories li .accessory {
  width: 160px;
  float: left;
}

#products.show #accessories li .accessory .image {
  position: relative;
  height: 100px;
}

#products.show #accessories li .image img {
  position: absolute;
  bottom: 0;
}


/* =========================================================== Products - Show Series */
#products.show #series {
  width: 640px;
  padding-top: 15px;
  clear: both;
  float: left;
}

#products.list #series .brief-info a {
  color: #5ba5f8!important;
  font-weight: bold;
}

#products.show-series #image {
  margin-bottom: 20px;
}

#products.show-series #info {
  padding-bottom: 10px;
  border-bottom: 1px solid #f0f0f0;
}

#products.show-series #info p {
  margin-bottom: 1em;
}

/* =========================================================== Products - CAD login */

#products.login fieldset {
  width: 160px;
}


#products.register-user form, #products.login fieldset { 
  background: #f4f4f4;
  border: 2px solid #eaeaea;
  border-top: 2px solid #f0f0f0;
  border-left: 0;
  padding: 20px;
}

#products.register-user form {
  width: 220px;
}

#products .errorExplanation {
  padding: 20px 0 20px 0;
}

#products .errorExplanation h2 {
  color: #af0000;
}

#products.login .submit, #products.register-user .submit {
  margin: 20px 0 0 0;
}

#products.downloads h1 {
  margin-bottom: 1em;
}
/* =========================================================== Contact */


#contact #offices-container {
  margin-top: 20px;
}


#contact #offices-top {
  height: 6px;
  width: 865px;
  background: url(/images/formomiljo/contact-menu-top.gif) no-repeat;
  padding: 0;
  margin: 0;
  float: left;
}

#contact #offices {
  background: url(/images/formomiljo/contact-menu.gif);
  width: 825px;
  padding: 20px 20px 20px 20px;
  float: left;
}

#contact #offices h1 {
  font-size: 1.545em;
  margin-bottom: 0.7em;
}

#contact #offices li {
  font-size: 0.916em;
  float: left;
  width: 195px;
  margin-right: 10px;
}

#contact #offices li.last {
  margin-right: 0;
}

#contact #offices-bottom {
  width: 865px;
  height: 14px;
  background: url(/images/formomiljo/contact-menu-bottom.gif) no-repeat;
  float: left;
}

#contact #resellers {
  margin: 20px 0 0 20px;
  float: left;
}

#contact #resellers h2 {
  font-size: 1.416em;
  font-weight: normal;
}

#contact #resellers h3 {
  color: #000;
  font-size: 1.416em;
  font-weight: normal;
  margin: 15px 0 5px 0;
}

#contact #resellers h4 {
  color: #000;
}

#contact #resellers ul {
  width: 840px;
  float: left;
  clear: both;
  margin-bottom: 25px;
}

#contact #resellers ul li {
  width: 205px;
  font-size: 0.916em;
  float: left;
}



/* =========================================================== Catalogue order */
#catalogue-order #order-header {
  width: 860px;
  float: left;
  margin-bottom: 30px;
}

#catalogue-order #order-header #left {
  width: 440px;
  margin-right: 40px;
  float: left;
}

#catalogue-order #order-header #right {
  float: left;
}

#catalogue-order #order-header #container {
  position: relative;
  float: left;
  width: 860px;
  margin-top: 20px;
  background: transparent;
}

#catalogue-order #form {
  float: left;
  width: 357px;
  margin-right: 40px;
  padding: 20px 40px 20px 40px;
  background: #f9f9f9;
}

#catalogue-order #form label {
  color: #000;
  font-weight: bold;
}

#catalogue-order #form li {
  margin-bottom: 4px;
}

#catalogue-order #form input, #catalogue-order #form select {
  border: 1px solid #ccc;
  background: #fff;
  padding: 2px;
}

#catalogue-order #form select {
  width: 255px;
}

#catalogue-order #form input:focus {
  background: #e0f6de;
}

#catalogue-order #form input.checkbox {
  border: 0;
}

#catalogue-order #form a {
    color: #b86e00;
}

#catalogue-order #form a:hover {
    color: #b86e00;
    text-decoration: underline;
}

#catalogue-order #form .emailDetails {
  margin: 1em 0 0 1.7em;
  font-size: 0.9em;
}

#catalogue-order #form .email-news {
  margin-top: 20px;
}

#catalogue-order #form input.submit {
  margin-top: 10px;
	background: url('../images/formomiljo/kaiburr/fade-butt.png');
	border: 4px double #999;
	border-left-color: #ccc;
	border-top-color: #ccc;
	color: #333;
	padding: 0.25em;
  margin: 20px 3px 0 0;
}

#catalogue-order #form #errorExplanation {
  background: #fff;
  border: 1px solid #ccc;
  padding-bottom: 10px;
  margin: 20px 0 20px 0;
}

#catalogue-order #form #errorExplanation h2 {
  padding: 6px;
  margin-top: 0;
  background: #c82b1f;
  font-size: 1.2em;
  color: #fff;
}

#catalogue-order #form #errorExplanation p {
  font-size: 0.9em;
  color: #000;
  font-weight: bold;
  margin-bottom: 0;
}

#catalogue-order #form #errorExplanation p, #catalogue-order #form #errorExplanation ul {
  font-size: 0.9em;
  padding-left: 20px;
}

#catalogue-order #form #errorExplanation ul {
  padding: 2px 0 5px 35px;
  list-style: disc;
}

#catalogue-order #form #errorExplanation li {
    margin-bottom: 0;
}

#catalogue-order #form .fieldWithErrors input {
  background: #f2d4d4;
  border: 1px solid #af0000;
}


#catalogue-order h4 {
  font-size: 1.4em;
  color: #000;
  margin: 40px 0 2px 0;
}

#catalogue-order h4.first {
  margin: 10px 0 2px 0;
}

#catalogue-order p {
  font-size: 1em;
  color: #777;
  line-height: 1.3em;
}

#catalogue-order .catalogues {
  margin-top: 20px;
}

#catalogue-order .pdf {
  width: 300px;
  padding: 20px 40px 20px 40px;
  background: #f9f9f9;
  float: left;
}

#catalogue-order .pdf a {
    color: #b86e00;
}

#catalogue-order .pdf p {
  background: #f6eeee;
  padding: 10px;
  height: 78px;
  position: relative;
}

#catalogue-order .pdf p span {
  top: 30%;
  width: 200px;
  position: absolute;
}

#catalogue-order .pdf p img {
  float: left;
  margin-right: 15px;
}

#catalogue-order #english {
  margin-top: 20px;
  border: 1px #000;
}

/* =========================================================== Catalogue order  - Sent */
#catalogue-order.sent h1 {
  margin-bottom: 20px;
}

#catalogue-order.sent #your-info {
  margin-top: 20px;
}


