﻿/*general = html och body som är själva bakgrunden och pagewidth är bredden på layouten.
Ändra inte på den om du inte är mycket kunnig i css.
Med pagewidth följer nämligen en minimividd som då också särskilt måste justeras i förhållande till resten så att hela layouten håller ihop.
Ändrar du pagewidth utan att veta hur mycket du ska ändra i min-width kan layouten därför bli fel*/
#html,body
{ 
font: 65%/1.6 'Trebuchet MS', Helvetica, Times, serif;
font-size:11px;
color: #000000;
letter-spacing:1px;
 margin:0px; 
 padding:0px; 
 text-align:center; 
 margin-top: 10px;
 background-color:#3f3728; 
 background-image: url (); 
} 
#pagewidth{ 
 width:900px; /*själva layoutens storlek*/
 text-align:left; 
 min-width: 500px;
 margin:auto; 
 border: 2px dotted #a1cd6b;}/*sätt in dina egna värden på bordern här = är ramen runt HELA layouten*/
 
/* header är där du sätter in din logga eller bild. Höjden är satt till 150 px som du kan ändra till egna mått om du vill. */
 
#header{ 
 height:240px; 
 width:100%; 
 border-bottom:1px solid #000000; /*sätt in dina egna värden på bordern här*/
 text-align:center; /*vänsterställd text i header. Ändra om du vill */
 padding: 0px 0px 0px 0px; /*detta är padding i left-top--bottom-right*/
 background-color:#000000; 
 background-image: url(topjonas.jpg); background-repeat: no-repeat; 
font: 65%/1.6 'Trebuchet MS', Helvetica, Times, serif; letter-spacing:1 px;
font-size:11px;}
 
 /* En valid sida har inte scroll-listen formaterad utan den ska vara "standard" utan några modifieringar*/
 
A:link { text-decoration: none; font: 10px verdana,helvetica,sans-serif; font-style: bold; font-weight: bold; color:#a1cd6b; letter-spacing:0px; cursor:crosshair} 
A:visited { text-decoration:none; font: 10px verdana,helvetica,arial; font-style: bold; font-weight: bold; color:#a1cd6b; letter-spacing:0px; cursor:crosshair} 
A:active { text-decoration:none; font-weight: normal; color:#a1cd6b; font-style: bold; letter-spacing:0px; font: 10px verdana,helvetica,arial; cursor:dcrosshair} 
A:hover { font-weight: normal; text-decoration: none; background:#; font-style: bold; color:#789850; letter-spacing:0px; font: 10px verdana,helvetica,arial; cursor:crosshair}

/* Detta är navigationen i högra kolumnen.
Det heter container i css därför att den är byggd som en ruta/tabellcell.
Vidden på den är satt till 200 px. Du kan ändra om du vill,
men glöm då inte att också ändra vidden i "navcontainer a". Det är bredden på "rutorna" navigeringen ligger i.
Du kan bara ange left = vänsterställd navigation eller right = högerställd - detta anger INTE var texten placeras utan är rutornas placering i cellen.
Ändring göres i "float". Placeringen av din navigering anges i pixlar från headerns nedre kant. */

 /*navigeringen i rightcol*/
 
 a.vmenu, a.vmenu:link, a.hmenu, a.hmenu:link, a.vmenu:visited, a.hmenu:visited {display:block; width:175px; height:20px; background:#fff; color:#000; text-decoration:none; text-align:center; line-height:25px; border: 1px solid #e1e1e1;}

a.hmenu, a.hmenu:link, a.hmenu:visited {float:right;}

a.hmenu:hover, a.vmenu:hover {background:#B38433; color:#f191d1;}
a.hmenu:active, a.vmenu:active {background:#c00; color:#fff;}

#menua {height:20px;}


/*outer är formateringen av själva css-tabellen.
Ändra bara om du är mycket kunnig att bygga css-layouter.
Den är skapad för att undgå hacks från IE, IE mac och Netscape.*/

#outer{ 
 border:solid white 0px; 
  /*/*/ border-right-width: 225px; /* right column width. NN4 hack to hide borders */ 
border-right-color: #FFFFFF; /* right column colour */ 
border-right-style: solid; 
  background-color: #FFFFFF; /* center column colour - här i ligger sedan maincol */ 
width: auto; 
padding: 5px 0px 0px 10px ; /*detta är padding i right-top-bottom-left*/
}


/* rightcol är högra kolumnen där navigeringen ligger i. Den är satt till 225 pixlar.
Du måste därför tänka dig för om du ändrar denna och inte navcontainer. Vill du ändra storlek måste du därför göra det i alla led.
Låt den annars vara. */

#rightcol{
 /*/*/ width:225px; /* hack keeps NN4 right column right? */ 
 float:right; 
position:relative; 
  margin-right:-225px; /* måste anges samma px som width härovan - fast med minustecken framför */
 margin-left:1px; 
 text-align:left; 
 padding:0px 5px 0px 0px; /*detta är padding i left-top--bottom-right*/
 }
 



/*detta ska du INTE ändra på!*/
#inner{margin:0px; width:100%;}

/*Om du inte behärskar css 2 bör du inte ändra på något här förutom utseendet på bordern som skiljer den högra kolumnen och main/centercol*/
 
#maincol{ 
 float: left; 
 width: 100%; 
 position: relative; 
 margin: 0 -8px 0 -2px; 
border-style:dotted; border-width:0px; border-bottom:0 none inherit; border-top:0 none inherit;  border-left:0 none inherit; border-color:FFFFFF; background-color:#FFFFFF;
}

/*detta ska du INTE ändra på om du inte är kunnig inom css*/
#outer>#inner { border-bottom: 1px solid #FFFFFF;  }
/*detta ska du INTE ändra på!*/
.clr{clear:both;}
/*detta ska du INTE ändra på!*/
.content{padding:5px;} /*padding for content */ 
 /*detta ska du INTE ändra på!*/
#header .content{padding-bottom:0px;} /*padding bottom 0 to remove space in IE5 Mac*/ 
  
/*footer är den nedre delen av "tabellen" där du kan sätta in copyrighttext osv*/ 

#footer{
 height:40px; 
 width:100%; 
 background-color:#FFFFFF; 
 background-image:  url(); background-repeat: no-repeat; 
 text-align:center; 
 border-top: 2px solid #FFFFFF;
 font-family: 'Verdana', Helvetica; letter-spacing:0px; cursor: default;  font-size: 10px; color: #f191d1;}



.li 
{ font: 11px 'Trebuchet MS', Helvetica; 
color: #FFFFFF;
letter-spacing:1px;
padding: 0 5px 5px 5px;
}
a img {border:0;}


 /*printer styles - ska INTE ändras på*/ 
@media print{ 

/*hide the right column when printing - ska INTE ändras på*/
#rightcol{display:none;} 
#outer{border-right:0px;} 

/*textformateringar*/

p{
font-size: 11px;
	line-height: 180%;
	voice-family: "\"}\""; 
	voice-family:inherit;

	text-align: left;
	padding:0px 15px 0px 20px;
	color:#333;	
}