/*Element som är nollställda för kompabilitet
och attribut som inte är ifyllda. Anpassa till ert sätt så ni kan jobba snabbare.*/

/*-----START på nollställning-----*/

body {
margin:0;
padding:0;
border:0;
height:100%;
background:  url("bilder/bakgrund.jpg") repeat-x top left;
}

html {
margin:0;
padding:0;
border:0;
}

img, p, a, h1, h2, h3, h4, ul, ol, li, br,
form, table {
margin:0;
padding:0;
border:0;
}

a {
text-decoration:none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

/*------SLUT på nollställning-----*/

.wrapper {
margin: 0 auto 0 auto;
padding:0;
width:900px;
height:auto;
}

.head {
margin:0;
padding:0;
width:auto;
min-height:316px;
}

.menu {
display:inline;
float:right;
margin:25px 0px 0px 0px;
padding:0;
width:auto;
height:auto;
}/*En container till ul (den riktiga menyn) för att enklare placera ut och flytta den. */

.menu ul {
display:inline;
float:left;
margin:0;
padding:0;
width:auto;
height:40px;
border:0;
}


.menu li {
display:inline;
float:left;
margin:0;
padding:0;
}/*Ingen storlek på li, låt detta styras av a-länk*/


.menu li a {
display:block;
float:left;
margin:0;
padding:10px 15px 10px 15px;
font:normal 13px Arial;
color:#1b82b0;
width:auto;
height:auto;
}
/**a-länk görs till ett block-element för enklare hantering och kompabilitet./
/*Sätt width:auto eftersom textens längd påverkar knappens längd.*/ 
/*Kom ihåg att sätta height för att reglera höjden.*/
/*Det du ökar i padding-top ska du minska med i height. padding-bottom behövs ej.*/


.menu li a:hover {
text-decoration:underline;
}

.logo {
display:inline;
float:left;
margin:0;
padding:0;
width:278px;
height:75px;
/*background: url("bilder/logo.jpg") no-repeat top left;*/
}

.header {
display:inline;
float:left;
margin:0;
padding:0;
width:900px;
height:240px;
background: url("bilder/head.jpg") no-repeat top left;
}

.main {
margin:26px 0px 0px 0px;
padding:0;
width:900px;
height:auto;
}


.main img {
margin:5px 0px 5px 0px;
border:2px solid #d2d2d2;
}

.main h1 {
font:bold 20px Arial;
color:#448530;
margin:0px 0px 10px 0px;
}

.main h2 {
font:bold 18px Arial;
color:#448530;
margin:0px 0px 10px 0px;
}

.main p {
margin:0px 0px 20px 0px;
font:normal 12px Arial;
color:#575757;
}


.left_content {
display:inline;
float:left;
margin:0;
padding:0;
width:485px;
height:auto;
}

.right_content {
display:inline;
float:right;
margin:0;
padding:0;
width:340px;
height:auto;
}


.main {
margin:26px 0px 0px 0px;
padding:0;
width:900px;
height:auto;
min-height:650px;
}


.main img {
margin:5px 0px 5px 0px;
border:2px solid #d2d2d2;
}

.main h2 {
font:bold 20px Arial;
color:#448530;
margin:0px 0px 10px 0px;
}

.main p {
margin:0px 0px 20px 0px;
font:normal 12px Arial;
color:#575757;
}


.floated {
display:inline;
width:152px;
height:137px;
float:left;
margin:-2px 10px 0px 0px;
}

.floated-mat {
display:inline;
width:152px;
height:180px;
float:left;
margin:-2px 10px 0px 0px;
}

a.article {
display:block;
width:auto;
height:auto;
margin:0px 0px 1px 0px;
min-height:62px;
background:#f6f6f6;
border-top:1px solid #dddddd;
border-bottom:1px solid #dddddd;
background: #f6f6f6 url("bilder/date.jpg") no-repeat top left; 
cursor:pointer;
}

a.article:hover {
background:#dceaef url("bilder/date2.jpg") no-repeat top left;
}

.article .date {
display:inline;
float:left;
margin:5px 0px 0px 5px;
padding:7px 0px 0px 14px;
width:39px;
height:43px;
}

.article .date .month {
font:bold 13px Arial;
color:#2a708e;
margin:0px 0px 5px 0px;
padding:0;
}

.article .date .datum {
display:block;
margin:2px 0px 0px 5px;
padding:0;
font:normal 13px Arial;
color:#2a708e;
}

.article .contain {
display:block;
float:left;
margin:5px 0px 0px 9px;
padding:0;
width:250px;
height:45px;
}

.article .title {
display:block;
height:auto;
width:auto;
font:bold 12px Arial;
color:#2a708e;
margin:0px 0px 3px 0px;
padding:0;
}

.article .line {
display:block;
font:normal 10px Arial;
color:#575757;
margin:0;
padding:0;
}



.bildbox {
margin:0;
padding:0px 0px 0px 0px;
width:340px;
height:285px;
border:0px solid #cecece;
}

.bildbox .contain {
display:inline;
float:left;
margin:0px 4px 35px 23px;
padding:0;
width:130px;
height:100px;
text-align:center;
}

.bildbox .contain a {
font:normal 12px Arial;
color:#2a708e;
margin:0;
}

.bildbox .contain img {
border:1px solid #7f7f7f;
margin:0;
}

/*I HTML-koden brukar jag skriva ut right_content före left_content. Detta eftersom den trycks ner till samma höjd som
left_content.
*/



.bottom {
float:left;
margin:0px 0px 10px 0px;
padding:0px 30px 0px 30px;
width:840px;
height:150px;
background: url("bilder/bottom.jpg") no-repeat top left;
}

.bottom .left {
display:inline;
float:left;
margin:18px 22px 0px 20px;
padding:0px 20px 0px 0px;
width:202px;
height:auto;
min-height:100px;
border-right:1px solid #a9def6
}

.bottom .middle {
display:inline;
float:left;
margin:18px 32px 22px 0px;
padding:0px 20px 0px 0px;
width:190px;
height:auto;
min-height:100px;
border-right:1px solid #a9def6
}


.bottom .middle a {
display:block;
float:left;
margin:0px 0px 5px 0px;
padding:0;
height:auto;
width:160px;
border-bottom:1px solid #a9def6;
}

.bottom .middle a:hover {
background:#7cbcd8;
}

.bottom .middle a .date {
display:block;
margin:0;
padding:0;
font:normal 10px Arial;
color:#ffd97e;
}

.bottom .middle a .line {
display:block;
margin:0px 0px 3px 0px;
padding:0;
float:left;
clear:left;
font:normal 10px Arial;
color:#fff;
}


.bottom .right {
display:inline;
float:left;
margin:18px 0px 22px 0px;
padding:0px 00px 0px 0px;
width:auto;
height:auto;
min-height:100px;
}

.bottom .right .contain {
display:inline;
float:left;
margin:0;
padding:9px 10px 5px 10px;
width:290px;
height:auto;
background:#649eb8;
}

.bottom .right .contain img {
margin:0px 10px 0px 8px;
}

.bottom h2 {
font:bold 15px Arial;
color:#fff;
margin:0px 0px 10px 0px;
}

.bottom p {
font:normal 10px Arial;
color:#fff;
}

.bottom .right a {
display:block;
float:left;
margin:0px 0px 5px 0px;
padding:0;
height:auto;
width:180px;
border-bottom:1px solid #a9def6;
}

.bottom .right a:hover {
background:#7cbcd8;
}

.bottom .right a .date {
display:block;
margin:0;
padding:0;
font:normal 10px Arial;
color:#ffd97e;
}

.bottom .right a .line {
display:block;
margin:0px 0px 3px 0px;
padding:0;
float:left;
clear:left;
font:normal 10px Arial;
color:#fff;
}