/* ------------------------------------------------------------------ colors */
/*
  blue:    #003399 (PMS 287)
  yellow:  #FFCC33 (PMS 123)
  beige:   #D9D5BE (Nordea)
  menubar: #A3A08E
*/
.white  { background-color: #FFFFFF; }
.blue   { background-color: #003399; color: #FFFFFF; }
.yellow { background-color: #FFCC33; }
.beige  { background-color: #D9D5BE; }
.gray   { background-color: #EEEEEE; }
/* --------------------------------------------------------------- typografy */
body, h1, td, th, input, select, textarea {
	font-family: "Helvetica Neue", Helvetica, Arial, FreeSans, sans-serif;
  font-size: 13px;
}
body, h1, h2, h3, h4, h5, h6, td, th {
  line-height: 1.6;
}
h1 { font-size: 200%; font-weight: bold; }
h2 { font-size: 170%; }
h3 { font-size: 150%; }
h4 { font-size: 125%; }
h5, h6 {
  font-size: 100%;
}
h4, h5 {
  font-weight: bold;
}
p {
  margin-bottom: .75em;
}
strong {
  font-weight: bold;
}
em {
  font-style: italic;
}
a:link,
a:visited {
  color: #003399;
}
a:hover,
a:active {
  color: #0066CC;
  text-decoration: underline;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  text-decoration: inherit;
}
dl {
  margin-bottom: .5em;
}
dt {
  width: 5em;
  padding-bottom: .25em;
  float: left;
  color: #666666;
}
dd {
  margin-left: 5em;
  padding-bottom: .25em;
}
ul,ol {
  display: block;
  margin-bottom: .5em;
}
li {
  margin-bottom: .25em; 
}
ul {
  list-style-type: disc;
}
ul li {
  margin-left: 1.25em;
}
ol {
  list-style-type: decimal;
}
ol li {
  margin-left: 2em;
}
.basin {
  overflow: hidden;
  width: 100%;
}
.two-column {
  width: 50%;
}
.two-column.left {
  float: left;
}
.two-column.right {
  float: right;
}
.clear {
  float: none;
  clear: both;
}
/* -------------------------------------------------------------------- grid */
html, body {
  width: 100%;
}
/* 12 columns, 20px gutter, 10px margin */
#frame {
  position: relative;
  width: 960px;
  margin: 0 auto;
  padding: 10px 10px 0 10px;
  overflow: hidden;
}
.grid {
  position: relative;
  float: left;
  margin: 0 10px 10px 10px;
}
.grid.stack {
  margin: 0;
}
.grid.stack .grid {
  float: none;
}
.grid.width-1  { width:  60px; }
.grid.width-2  { width: 140px; }
.grid.width-3  { width: 220px; }
.grid.width-4  { width: 300px; }
.grid.width-5  { width: 380px; }
.grid.width-6  { width: 460px; }
.grid.width-7  { width: 540px; }
.grid.width-8  { width: 620px; }
.grid.width-9  { width: 700px; }
.grid.width-10 { width: 780px; }
.grid.width-11 { width: 860px; }
.grid.width-12 { width: 940px; }
/* ----------------------------------------------------------------- rounded */
.rounded-10,
.rounded-20 {
  position: relative;
}
.tl, .tr, .br, .bl {
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  overflow: hidden;
}
.tl, .tr { top:    0; }
.tr, .br { right:  0; }
.br, .bl { bottom: 0; }
.tl, .bl { left:   0; }
.tl { background-position:   0px   0px; }
.tr { background-position: -10px   0px; }
.br { background-position: -10px -10px; }
.bl { background-position:   0px -10px; }
.rounded-10 .tl,
.rounded-10 .tr,
.rounded-10 .br,
.rounded-10 .bl {
  width:  10px;
  height: 10px;
}
.rounded-20 .tl,
.rounded-20 .tr,
.rounded-20 .br,
.rounded-20 .bl {
  width:  20px;
  height: 20px;
}
.beige .rounded-10 .tl,
.beige .rounded-10 .tr,
.beige .rounded-10 .br,
.beige .rounded-10 .bl {
   background-image: url(../img/rounded-10-D9D5BE.png);
}
.yellow .rounded-10 .tl,
.yellow .rounded-10 .tr,
.yellow .rounded-10 .br,
.yellow .rounded-10 .bl {
   background-image: url(../img/rounded-10-FFCC33.png);
}
.beige .rounded-20 .tl,
.beige .rounded-20 .tr,
.beige .rounded-20 .br,
.beige .rounded-20 .bl {
   background-image: url(../img/rounded-20-D9D5BE.png);
}
/* -------------------------------------------------------------------- menu */
.menu-x a,
.menu-y a {
  display: block;
  text-decoration: none;
  color: #000000;
}
.menu-x a {
  float: left;
}
.menu-x span,
.menu-y span {
  display: block;
  padding: 5px 10px 5px 10px;
}
/* ------------------------------------------------------------------ header */
h3.blue,   h4.blue,   h5.blue,
h3.yellow, h4.yellow, h5.yellow {
  padding: 5px 10px 5px 10px;
}
/* --------------------------------------------------------------------- box */
.box {
  margin-bottom: 10px;
}
.box.pad {
  padding: 10px;
}
.box.pad h3,
.box.pad h4,
.box.pad h5,
.box.pad h6 {
  margin: -10px -10px 0.5em -10px;
}
/* ----------------------------------------------------------------- fieldrow */
ul.fieldrow {
  display: block;
  width: 100%;
  margin: 0;
  clear: both;
  overflow: hidden;
}
ul.fieldrow li {
  display: block;
  margin: 0 10px 0 0;
  float: left;
  clear: none;
  overflow: hidden;
}
ul.fieldrow .relative {
  position: relative;
}
div.field {
  font-weight: bold;
  color: #003399;
}
em.mandatory,
label em {
  font-style: normal;
}
label em,
div.error {
  color: #DD0000;
}
/* --------------------------------------------------------------- overlabel */
label.overlabel {
  display: none;
  position: absolute;
  float: none;
  clear: both;
  padding: 2px 3px;
  z-index: 1;
  color: #DDDDDD;
}
/* ------------------------------------------------------------------- focus */
/*
input.text:focus,
select:focus,
textarea:focus {
  background-color: #FFCC33;
}
*/
/* ------------------------------------------------------------------ layout */
#logo,
#ad {
  height: 123px;
}
#menubar {
  background: #A3A08E url(/img/menubar.png) left top repeat-x;
}
#menubar .menu-x a {
  font-weight: bold;
}
#tel {
  text-align: center;
}
#zones .menu-y {
  width: 100%;
  overflow: hidden;
  font-size: 11px;
}
#zones .menu-y a {
  float: left;
  width: 50%;
}
#zones .menu-y a:hover {
  background-color: #FFD98C;
}
#map {
  position: relative;
  width: 220px;
  height: 522px;
  background: #FFCC33 url(/img/sverige.png) left top no-repeat;
}
/*
#map .dot-40 {
  position: absolute;
  width: 40px;
  height: 40px;
  background: transparent url(/img/sverige-dot-40.png) left top no-repeat;
  z-index: 1;
}
#map .dot-20 {
  position: absolute;
  width: 20px;
  height: 20px;
  margin-top: 10px;
  margin-left: 10px;
  background: transparent url(/img/sverige-dot-20.png) left top no-repeat;
  z-index: 1;
}
*/
#map .dot-10 {
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  margin-top: 15px;
  margin-left: 15px;
  background: transparent url(/img/sverige-dot-10.png) left top no-repeat;
  z-index: 1;
}