/* CSS för trespaltig layout med absolut positionerade sidospalter och rubrik */
/* från boken Stila med CSS av Charles Wyke-Smith, utgiven av Pagina Förlags AB, modifierad av Ingvar Esk */

body {margin:0; padding:0; font: 1.0em verdana, arial, sans-serif; }

div#container {position:relative; min-width:800px; max-width:1000px; margin-left:auto; margin-right:auto; background-color:#FFF}

 /* stilar för huvud – text-align centrerar grafik */
div#header {height:150px; background-color:#ffc; padding-top:10px; text-align:center; vertical-align=middle; border-bottom: 1px olive solid; border:0px solid; font-size:1em; font-family:verdana, sans-serif; color:olive;}
div#header h1{font-size:3.2em; font-family:Comic Sans MS, verdana, sans-serif; font-style: italic; color:olive;}

div#nav {height:60px; margin:0; padding:0; background-color:#FFC; text-align:center; border-bottom: 1px olive solid;}			
/*div#nav ul {border:0; margin:12px 1.25em 12px 1.25em; padding:0; list-style-type:none; font-weight:bold; font-size:.75em;}*/
div#nav ul {padding:20px 0; margin:0;} /* lodrätt utrymme mellan listorna */
/*div#nav li {border-bottom:2px dotted olive; margin:0; padding:.3em 0; text-indent:.5em}*/
div#nav ul li {display:inline; /* viktig CSS-kod – gör att listorna visas vågrätt */
						border-left:1px solid; /* skapar lodräta linjer till vänster om varje listpost */
						color:#C60; /* anger färgen på de lodräta linjerna – länkarnas färg anges nedan */
						padding:0px 5px 0 9px; /* vågrätt utrymme mellan länkar och lodräta linjer – krävdes olika värden för left och right för att centrera */
						position:relative;
						}
/*div#nav li:first-child {border-top:2px dotted olive;}*/
div#nav ul li:first-child {border-left:0;} /* tar bort den vänstra kantlinjen på den första listposten – fungerar inte i IE */
/* ett hack för enbart IE Win \*/	
* html div#nav ul {border-top:2px dotted olive;}
/* slut på hack */

div#nav ul li ul {display:none; position:absolute; left:0; width:10em; text-align:left; border-left:1px solid; border-right:1px solid; color:#C60; background-color:#FFC; margin-left:-1px; margin-top:0px;} /* lodrätt utrymme mellan listorna */
html>body div#nav ul li ul {margin:2.4em 1 0 -1px; padding:0 0 0 .2em;} /* lodrätt utrymme mellan listorna */
/* div#nav ul li ul {display:none; margin:2.4em 0 0 -1px; padding:.4em 0 0 .2em; position:absolute; left:0; width:10em; text-align:left; border-left:1px dotted; border-right:1px dotted; color:#C60; background-color:#FFC;} /* lodrätt utrymme mellan listorna */
div#nav ul li ul li {width:100%; border:0;}
div#nav a {text-decoration:none; color:#C60;}
div#nav a:hover {color: olive;}
div#nav ul li:hover ul {display:block;}

div#leftcolumn {position:absolute; left:0px; top:240px; width:250px; padding:2em 0 0 5px; margin:22px 0 15px 0; color:#C60;}			
div#leftcolumn p {font-size:.75em;}
div#leftcolumn h1{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive;}
div#leftcolumn h2{font-size:1em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive;}
div#leftcolumn h3{font-size:1em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive; margin:0;}
div#leftcolumn ul {border:0; margin:12px 1.25em 12px 0; padding:0; list-style-type:none; font-weight:bold; font-size:.75em;}
div#leftcolumn li {border-bottom:2px dotted olive; margin:0; padding:.3em .5em .3em .5em;}
div#leftcolumn li:first-child {border-top:2px dotted olive;}
div#leftcolumn a {text-decoration:none; color:#C60;}
div#leftcolumn a:hover {color: olive;}
/* ett hack för enbart IE Win \*/	
* html div#leftcolumn ul {border-top:2px dotted olive;}
/* slut på hack */

div#content {position:relative; margin:20px 210px 0 210px; min-height:800px; padding: 1em 1em; text-align:center; color:grey;}
div#content div#mainimage {float:left; margin:0 8px 4px 0;}
/*div#content div#mainimage img {border: 1px solid olive;} */
/*div#content div#mainimage p {font-size:.65em; margin:0px 5px; color:#C60;} */
div#content h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive; margin-bottom:2em;}
div#content h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive;}
div#content p {font-size:1em; margin-top:0; margin-bottom:.5em;}	
div#content li {font-size:.9em;}
div#content a {text-decoration:underline; color:grey;}
div#content a:hover {color: olive; text-decoration:underline;}
div#content blockquote {text-align:right; font-style:italic; font-size:.9em; margin:0.3em 10px 0 0; padding: 0 5px 0 0;}
div#content blockquote p {margin:0; padding:0; font-style:italic; font-size:100%;}
div#content div#highlight {padding:10px; width:60%; border:5px solid; border-color:lightcoral; background-color:#ffc; }
div#content div#highlight div#head{font-size:1.6em; font-variant:small-caps; font-family:verdana, sans-serif; color:#F00; margin-bottom:2em; text-align:center; font-weight:bold;}
div#content div#highlight h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F; margin-bottom:1em;}
div#content div#highlight h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F;}
div#content div#highlight-left {padding:10px; width:85%; border:2px solid; border-color:red; background-color:#ffc; text-align:left;}
div#content div#highlight-left div#head{font-size:1.6em; font-variant:small-caps; font-family:verdana, sans-serif; color:#F00; margin-bottom:2em; text-align:center; font-weight:bold;}
div#content div#highlight-left h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F; margin-bottom:2em; text-align:center;}
div#content div#highlight-left h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F;}
div#content div#newsboxhead {position:relative; left:25px; width:475px; padding:0px; text-align:left; color:grey; font-size:0.8em}
div#content div#newsbox {position:relative; left:25px; padding:10px; width:475px; height:200px; max-height:200px; border:1px solid; border-color:grey; background-color:#fff; overflow:auto;}
div#content div#newsbox div#head{font-size:1.6em; font-variant:small-caps; font-family:verdana, sans-serif; color:#F00; margin-bottom:2em; text-align:center; font-weight:bold;}
div#content div#newsbox h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#olive; margin-bottom:1em;}
div#content div#newsbox h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#olive;}
div#content div#newsbox-left {padding:10px; width:85%; border:2px solid; border-color:red; background-color:#ffc; text-align:left;}
div#content div#newsbox-left div#head{font-size:1.6em; font-variant:small-caps; font-family:verdana, sans-serif; color:#F00; margin-bottom:2em; text-align:center; font-weight:bold;}
div#content div#newsbox-left h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#olive; margin-bottom:2em; text-align:center;}
div#content div#newsbox-left h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#olive;}
div#content em {color:#00f; font-style:normal;}

div#content-left {position:relative; margin:20px 210px 0 210px; min-height:800px; padding: 1em 1em; text-align:left; color:grey;}
div#content-left div#mainimage {float:left; margin:0 8px 4px 0;}
div#content-left div#mainimage a {text-decoration:none;}
div#content-left div#mainimage-right {float:right; margin:0 8px 4px 0;}
/*div#content-left div#mainimage img {border: 1px solid olive;} */
/*div#content-left div#mainimage p {font-size:.65em; margin:0px 5px; color:#C60;} */
div#content-left h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive; margin-bottom:2em;}
div#content-left h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive;}
div#content-left p {font-size:1em; margin-top:0; margin-bottom:.5em;}	
div#content-left li {font-size:.9em;}
div#content-left div#signature {text-align:right; font-style:italic; font-size:.9em; margin:0.3em 10px 0 0; padding: 0 5px 0 0;}
div#content-left a {text-decoration:underline; color:grey; font-weight:bold;}
div#content-left a:hover {color: olive; text-decoration:underline;}
div#content-left div#highlight {padding:10px; width:100%; border:2px solid; border-color:red; background-color:#ffc; text-align:center;}
div#content-left div#highlight h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F; margin-bottom:2em;}
div#content-left div#highlight h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F;}
div#content-left div#highlight-left {padding:10px; width:85%; border:2px solid; border-color:red; background-color:#ffc; text-align:left;}
div#content-left div#highlight-left h1{font-size:1.4em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F; margin-bottom:2em; text-align:center;}
div#content-left div#highlight-left h2{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:#5A785F;}
div#content-left em {color:#00f; font-style:normal;}
div#content-left div#blog {padding:10px; width:90%; text-align:left;}
div#content-left div#blog h1{font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; font-style:italic; color:olive; margin-bottom:0.2em;}
div#content-left div#blog div#signature {text-align:left; font-style:italic; font-size:.7em; color:black; margin:0.3em 0 0 0; padding: 0 0 0 0;}
div#content-left div#blog div#addcomment {text-align:right;}
div#content-left div#blog div#comment{font-size:80%; padding:10px; margin:10px 0 0 50px; width:90%; border:1px solid; border-color:blue; color:#0aa; background-color:#eff; text-align:left;}
div#content-left div#blog div#comment div#signature {text-align:right; font-style:italic; font-size:.6em; margin:0.3em 10px 0 0; padding: 0 5px 0 0;}
div#content-left div#fors table p {font-size:0.7em; font-family:verdana, sans-serif; color:#blue; text-align:left;}

div#rightcolumn {position:absolute; width:206px; top:240px; right:0px; margin:22px 0 0 0; padding:2em 2px; color:#C60; background-color:#CCFF99 ; border:2px solid; border-color:green; text-align:center;}
div#rightcolumn p {font-size:.75em;}
/*div#rightcolumn img {border:none;}*/
/*div#rightcolumn div#newslinks ul {list-style-type:none; font-size:.7em; padding-left: 10px; margin:0 6px 0 0;}*/
/*div#rightcolumn div#newslinks li {margin-top:0; margin-bottom:.5em;}*/
div#rightcolumn h1 {font-size:1.2em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive;}
/*div#rightcolumn h3 {text-align:center; font-size:.8em; color:olive; margin-bottom:0px; padding-top:3px; border-top: 2px dotted olive;}*/
div#rightcolumn ul {border:0; margin:12px 1.25em 12px 0; padding:0; list-style-type:none; font-weight:bold; font-size:.75em;}
div#rightcolumn li {margin:0; padding:.3em .5em .3em .5em;}
div#rightcolumn a {text-decoration:none; color:#C60;}
div#rightcolumn a:hover {color: olive; text-decoration:underline;}
/*div#rightcolumn li.morelink {font-style:italic;}*/
div#rightcolumn div#signature {text-align:right; font-style:italic; font-size:.7em; margin:0.3em 10px 0 0; padding: 0 5px 0 0;}

/* stilar för sidfot */
div#footer {width:100%;  /* gör att div-elementet fyller sin behållare – vanligtvis body */
 					padding:4px 0; /* flyttar länkarna från div-elementets topp och botten */
					font-size:.9em;  /* anger teckenstorleken i alla länkar */
					text-align:center; /* centrerar ul-elementen i div-behållaren */
					background-color:#fff; /* anger div-behållarens bakgrundsfärg */
					border-top:1px solid olive; border-bottom:2px solid olive; margin-top:1.5em;}
div#footer h1 {font-size:1.8em; font-variant:small-caps; font-family:verdana, sans-serif; color:olive; margin-bottom:0;}
div#footer ul {margin:2px 0; font-size:1em;} /* lodrätt utrymme mellan listorna */
div#footer li {display:inline; /* viktig CSS-kod – gör att listorna visas vågrätt */
						color:white; /* anger färgen på de lodräta linjerna */
						border-left:1px solid; /* skapar lodräta linjer till vänster om varje listpost */
						color:#C60; /* anger färgen på de lodräta linjerna – länkarnas färg anges nedan */
						padding:0 5px 0 9px; /* vågrätt utrymme mellan länkar och lodräta linjer – krävdes olika värden för left och right för att centrera */
						font-weight:bold;}
div#footer li:first-child {border-left:0;} /* tar bort den vänstra kantlinjen på den första listposten – fungerar inte i IE */
div#footer ul li a {text-decoration:none; /* tar bort länkarnas understrykningar */
 							 color:#C60; /* länkfärg */
							 }
div#footer ul li a:hover {text-decoration:underline; color:olive} /* ger länkarna understrykning när användaren pekar på dem */
div#footer ul.fineprint li {color:#C60;} /* färg för copyright och lodräta skiljelinjer på sista raden */
div#footer ul.fineprint li a {color:#C60;} /* måste uttryckligen ange färg för dessa – i annat fall ärver de vitt från div#footer li */
div#footer ul.fineprint li a:hover {color:olive;} /* gör nedersta raden vit när användaren pekar på den */