body {
  /*Background-image defineras nedan*/
  background-color: #555;
  color:#222;
  font-family:"lucida grande", tahoma, verdana, arial, sans-serif;
  font-size:100%;
}

h1 {
  font-size:1.625em;
}

h2 {
  font-size:1.5em;
}

h3 {
  font-size:1.25em;
}

h4 {
  font-size:1em;
}

h5 {
  font-size:.875em;
  font-weight:400;
}

h6 {
  font-size:.8125em;
  font-weight:400;
}

p {
  font-size:.6875em;
  margin:0;
}

/*Overrida screen.css*/
p img {
  float: none;
  margin:0 0 0 0;
}

.bold {
  font-weight:700;
}

.padding-top-1 {
  padding-top:5px;
}

.padding-top-2 {
  padding-top:10px;
}

.padding-top-3 {
  padding-top:15px;
}

.padding-top-4 {
  padding-top:20px;
}

.padding-bottom-1{
  padding-bottom:5px;
}

.padding-bottom-2{
  padding-bottom:10px;
}

.padding-bottom-4{
  padding-bottom:20px;
}


label{
  font-weight:normal;
}

.right {
  float: right;
}

.left{
  float: left;
}

.space{
  padding-left: 3px;
}

/***
  Standardlänkar
***/  

a {
  /*Color defineras nedan*/
  text-decoration:none;
  outline:none;
}

input {
 outline:none;
}

a:hover {
  /*Color defineras nedan*/
  text-decoration:underline;
}


.link {
  font-size:.6875em;
}

.link a {
  /*Color defineras nedan*/
  text-decoration:none;
}

.link a:hover {
  /*Color defineras nedan*/
  text-decoration:underline;
}

/*Ger de något större länkarna*/
.large-link a{
  /*Color defineras nedan*/
  font-size:14px;
  text-decoration:none;
}


textarea{
  font-family:"lucida grande", tahoma, verdana, arial, sans-serif;
  font-size:.6875em;
}

input{
    font-family:"lucida grande", tahoma, verdana, arial, sans-serif;
}

.input-label {
  font-size:.6875em;
}  


.input-field{
  float:left;
}

.input-field input,
.input-field select{
  margin-top:0;
}

.star{
  color:#FF0000;
  font-size:.6875em;
  padding-left: 2px;
}

.red{
  color:#FF0000;
}


/***
  header. 
***/

#header {
  /*background-image nedan*/
  height:104px;
  margin:0 0 10px;
  position:relative;
}

/***
  menu. 
***/

#menu,
#menu li a {
  /*background-color defineras nedan*/
}

#menu,
#menu ul,
#menu li,
#menu li a {
  margin:0;
  padding:0;
}

#menu {
  background-image:url(../img/common/menu/bar.png);
  background-position:bottom right;
  background-repeat:repeat-x;
  margin-bottom:10px;
}

#menu li {
  list-style: none;
  float: left;
}

#menu li a {
  display: block;
  float: left;
  padding: 5px 22px 7px 22px;
  background-image: url('../img/common/menu/button.png');
  background-position: bottom right;
  background-repeat: repeat-x;
  color: white;
  text-decoration: none;
  font-size: 0.75em;
}

#menu li a:hover {
  background-image: url('../img/common/menu/button-hover.png');
  background-position: bottom right;
  background-repeat: repeat-x;
}

/***
  content 
***/

.content {
  overflow:hidden;
}

#main .content {
  float:left;
  padding-left:15px;
  padding-right:15px;
}

/***
  sub-menu 
***/

#sub-menu {
  background-image:url(../img/common/innermenu/menubar.png);
  height:21px;
  margin:28px -1px 0;
  width:912px;
}

#sub-menu a {
  color:#000;
  font-weight:400;
  text-decoration:none;
}

#sub-menu .link {
  float:left;
  font-size:12px;
  margin:0 5px;
  padding-top:2px;
}

#sub-menu .selected {
  background-color:#FFF;
  border-color:#dedede;
  border-style:solid;
  border-width:1px 1px 0;
  float:left;
  font-size:14px;
  margin:-3px 5px 0;
  padding:2px 10px 0;
  /*max-width:200px;*/
}

#sub-menu a:hover {
  /*color defineras nedan*/
}

/***
  sub-content 
***/

.sub-content {
  border-color:#dedede;
  border-style:solid;
  border-width:0 1px 1px;
  float:left;
  margin:0 -1px;
  min-height:440px;
  width:910px;
}


/***
  Button och färger för knappar
***/

.submit-button input{
  background:url(../img/common/button_right.png) no-repeat scroll right 0;;
  border:none;
  font-size:.7em;
  margin:0;
  padding:0 13px 0 0;
  width:9em;/* knappens bredd */
}


.submit-button{
  background:url(../img/common/button_left.png) no-repeat scroll 0 0;
  float:left;
  padding:0 0 0 13px;
}

.submit-button,
.submit-button input{
  /*background-color, color defineras nedan*/
  cursor:pointer;
  display:block;
  height:25px; /* Höjden på bilden */
  line-height:25px; /* Höjden på bilden */
}

.submit-button:hover{
  background-image:url(../img/common/button_left.png);
  background-position:left bottom;
}

.submit-button:hover input{
  background-image:url(../img/common/button_right.png);
  background-position:right bottom;
}


.link-button a{
  background:url(../img/common/button_right.png) no-repeat scroll right 0;
  border:none;
  text-decoration:none;
  font-size:.7em;
  margin:0;
  padding:0 13px 0 0;
  text-align:center;
  min-width:7em;
}

.link-button {
  background:url(../img/common/button_left.png) no-repeat scroll 0 0;
  float:left;
  padding:0 0 0 13px;
}


.link-button,
.link-button a {
 /*background-color, color defineras nedan*/
  cursor:pointer;
  display:block;
  height:25px; /* Höjden på bilden */
  line-height:25px; /* Höjden på bilden */
  outline:none;

}

.link-button:hover {
  background-image:url(../img/common/button_left.png);
  background-position:left bottom;
}


.link-button:hover a{
  background-image:url(../img/common/button_right.png);
  background-position:right bottom;
}


/***
  Page navigation. 
***/

.back a {
  display:block;
  width:14px;
  height:14px;
  background-image:url(../img/common/pagenav/normal/back.png);
  background-repeat:no-repeat;
  /*background-color defineras nedan*/
  cursor:pointer;
}

.back a:hover,
.back-back a:hover,
.forward a:hover,
.forward-forward a:hover {
  /*background-color defineras nedan*/
  background-color:#d97500;
}

.back-back a {
  display:block;
  width:17px;
  height:14px;
  background-image:url(../img/common/pagenav/normal/back-back.png);
  background-repeat:no-repeat;
  background-color:#FE8900;
  cursor:pointer;
}


.current-page {
  color:#bbbbbb;
  font-size: .6875em;
  padding-right:25px;
  float:left;
  margin-top: -1px;
}

.forward a {
  display:block;
  width:14px;
  height:14px;
  background-image:url(../img/common/pagenav/normal/forward.png);
  background-repeat:no-repeat;
  /*background-color defineras nedan*/
  cursor:pointer;

}

.forward-forward a {
  display:block;
  width:17px;
  height:14px;
  background-image:url(../img//common/pagenav/normal/forward-forward.png);
  background-repeat:no-repeat;
  /*background-color defineras nedan*/
  cursor:pointer;
}


/***
Dynamisk dropshadow oavsett storlek och form på bilden.
Fungerar för vita bakrunder. (I annat fall måste bilderna nedan göras om).
Går inte att kasta skugga för transparenta bilder.
***/

.dropshadow-wrap1, .dropshadow-wrap2, .dropshadow-wrap3 {
  display:inline-table;
  display:block;
}
  
.dropshadow-wrap1 {
  float:left;
  background:url(../img/common/shadow-effects/dropshadow.gif) right bottom no-repeat;
}
  
.dropshadow-wrap2 {
  background:url(../img/common/shadow-effects/dropshadow-corner_bl.gif) left bottom no-repeat;
}
  
.dropshadow-wrap3 {
  padding:0 4px 4px 0;
  background:url(../img/common/shadow-effects/dropshadow-corner_tr.gif) right top no-repeat;
}
  
.dropshadow-wrap3 img {
  display:block;
}
  

/***
  CSS för att ordna rundade hörn i main, sidebar samt footer. 
***/

.top-left {
  background-image:url(../img/common/content/background-ffffff.png);
  background-repeat:no-repeat;
  font-size:1px; /* så inte IE 6/5 gör större radhöjd än 9px */
  height:9px; /* Bildens höjd, så hela bildens höjds syns */
  margin-right:9px; /* Skapar plats för högerbilden som finns i .top-right */
  margin-left:-1px; /* Kompensera margin -1px på sidebar .content */
}

#main .top-left {
  margin-right:19px; /* Skapar plats för högerbilden som finns i .top-right, behövs mera margin här eftersom #main .content har mera padding */
}

.top-right {
  background-image:url(../img/common/content/background-ffffff.png);
  background-position:right 0;
  background-repeat:no-repeat;
  font-size:1px; /* Fixar så inte IE 6/5 gör större radhöjd än 9px */
  height:9px; /* Bildens höjd */
  margin-left:9px; /* Skapar plats för vänsterbilden som finns i .top-left */
  margin-top:-9px; /* Flyttar upp raden så höger bilden ligger ovanpå vänsterbilden i y-led */
  margin-right:-1px; /* Kompensera margin-right -1px på "sidebar .content" */
}

#main .top-right {
  margin-right: 9px; /* eftersom #main .bottom-right har 9px för göra större springa mellan boxarna, samma som på main .top-left */
}

.bottom-left {
  background-image:url(../img/common/content/background-ffffff.png);
  background-position:left -10px;
  background-repeat:no-repeat;
  clear:both;
  font-size:1px;
  height:25px;
  margin-right:18px; /* eftersom #main .bottom-right har 9px + 9px för skapa utrymme för bilden och göra större springa mellan boxarna, samma som på main .top-right */
  margin-left:-1px; /* Kompensera margin -1px därför att .content har en border, ingen border inte -1px */
}

.bottom-right {
  background-image:url(../img/common/content/background-ffffff.png);
  background-position:right -10px;
  background-repeat:no-repeat;
  clear:both;
  font-size:1px;
  height:25px;
  margin-left:9px;
  margin-top:-25px;
  margin-right:-1px; /* Kompensera margin-right -1px på "sidebar .content" */
}

#main .bottom-right {
  margin-right:9px; /* eftersom #main .top-right har 9px för göra större springa mellan boxarna */
}


/***
Fel/Rätt-meddelanden
***/

.error-message{
  color:#FF0000;
}

.error-border{
  border:solid #FF0000 1px;
}

.error, .notice, .success {
  padding:.3em;
  padding-left:1.5em;
  margin-bottom:1em;
  border:1px solid #ddd;
}

.error img, .notice img, .success img{
  float: right;
  cursor: pointer;
  padding-top: 3px;
}


.error {
  background:#FBE3E4;
  color:#8a1f11;
  background-image:url(../img/common/message-icons/error.png);
  background-repeat:no-repeat;
  background-position:3px;
  border-color:#ff0000;
}

.success {
  background:#ebfae4;
  color:#264409;
  background-image:url(../img/common/message-icons/success.png);
  background-repeat:no-repeat;
  background-position:3px;
  border-color:#009900;
}

.notice {
  color:#333300;
  border-color:#d0cb4b;
  background-image:url(../img/common/message-icons/notice.png);
  background-repeat:no-repeat;
  background-position:3px;
}

/***
  Hintar
***/

/* The  to Hide and Show */
.hint {
  display: none;
  position: absolute;
  right: 250px;
  width: 200px;
  margin-top: -4px;
  border: 1px solid #868178;
  padding: 10px 12px;
  /* to fix IE6, I can't just declare a background-color,
    I must do a bg image, too!  So I'm duplicating the pointer.gif
    image, and positioning it so that it doesn't show up
    within the box */
  background: #f3f3d8 url(../img/common/pointer.gif) no-repeat -10px 5px;
  text-align:left;
}

/* The pointer image is hadded by using another span */
.hint .hint-pointer {
  position: absolute;
  left: -10px;
  top: 5px;
  width: 10px;
  height: 19px;
  background: url(../img/common/pointer.gif) left top no-repeat;
}



/***
   Drag and drop
   Används för att ragnordna inlagd information.
***/
ul.drag-drop-list {
  list-style-type:none;
  margin:0;
  padding:0;
}

ul.drag-drop-list li {
  cursor:move;
  padding:4px;
  float: left;
}


ul.drag-drop-list li.over {
  background-color:#fcb;
}

ul.drag-drop-list li img {
  float:left;
  margin-right:8px;
}

div.dropmarker {
  height:6px;
  width:200px;
  background: url(../js/sortscript/dropmarker.png) left top;
  margin-top:-3px;
  margin-left:-5px;
  z-index:1000;
  overflow: hidden;
  behavior: url(../js/iepngfix.htc);
}


/***
  Färger
***/

/***
  Loggan längst upp på sidan
***/

#header {
  background-image:url(../img/common/header/header.png);
  background-repeat: no-repeat;
}

/***
Bakrundsbilden
***/
body{
  background-image:url(../img/common/background/background.jpg);

}

/***
  Tonad text, 
  Ex: tid, datum
***/
.time-stamp p, 
.fade {
  color:#bbbbbb;
}

/***
  Huvudmenyn
***/
#menu,
#menu li a {
  background-color:#43d5ff;
  color:#FFFFFF; /*Textfärg*/
}


/***
  Länkar
***/
a,
.link a,
.large-link a{
  color:#548bf1;
}


/***
  Länkar-hover, 
  Undermeny-hover 
***/
a:hover,
.link a:hover,
.large-link a:hover,
#sub-menu a:hover{
  color:#548bf1;
}

/***
  Länkar-active
***/
a:active,
.link a:active,
.large-link a:active{
  color:#fe8900;
}

/***
  Knappar. 
  Submitknappar, 
  Länkknappar, 
  Bläddringsknappar
***/
.submit-button,
.submit-button input,
.link-button,
.link-button a,
.back a,
.back-back a,
.forward a,
.forward-forward a,
.forward-small a,  /*Används i forum för att komma till senaste inlägget*/
.status-unread a   /*Används i Pm för att symbolisera oläst PM */
{
  background-color: #43d5ff; 
  color:#FFFFFF; /*Färg på texten på knappen*/
}

/***
  Bläddringsknappar-hover/
***/
.back a:hover,
.back-back a:hover,
.forward a:hover,
.forward-forward a:hover,
.forward-small a:hover {
  background-color:#cc6600;
}

/***
  Mörkare bakgrundsfärg
  Ex: Platsannonser
***/
.dark{
  background-color:#eeeeee;
}

/***
  Innehåller på sidan
***/
.content {
  background-color:#FFFFFF; 
}


/***
  "Negativa"-färgen
  Avbryt/Ta bort knappar.
***/
.negative-button, 
.negative-button a, 
.negative-button input{
  background-color:#FF0000; /*Knappens färg*/
  color:#FFFFFF; /*Knappens text*/
}

/***
  "Positiva"-färgen
   Ex: Lägg till vän/Gå med i grupp knapparna
***/
.positive-button, 
.positive-button a, 
.positive-button input{
  background-color:#95d400; /*Knappens färg*/
  color:#FFFFFF; /*Knappens text*/
}

.positive-color,
.positive-link,
.positive-link a,
.positive-link a:hover{
  color:#95d400;
}

/***
  Negativa färgen
  Ta bort länkar
***/
.negative-color,
.negative-link,
.negative-link a,
.negative-link a:hover{
  color:#FF0000;
}

/***
  Bakgrundsfärgen på alla inputs och select
  som inte blev ifyllda ordentligt
***/
.redback_100{
  background-color: #FBE3E4;
}