body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #ECE2CF;
	line-height: 1.4em;
	font-size: 0.9em;
}


/* slut på footer-formateringen */
.divGoogle {
	background-color:#ECE2CF;
	color: #ECE2CF;
	position: relative;
	padding-top: 1px;
	float: right;
	top: 1px;
	right: 1px;
}

h1, h2, h3, p     {
	margin-top: 0em;

}
h1 {
	font-size: 170%;
	margin-bottom: 0.5em;
	font-weight: bold;
	color: #9A3133;
	line-height: 1.2em;
}

h2 {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 0.3em;
	text-transform: uppercase;
	padding-bottom: 0.1em;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #B69969;
	color: #9A3133;
}
h3 {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 0px;
	padding-bottom: 0.1em;
	color: #9A3133;
}
th {
	padding: 3px;
	background-color: #859107;
	color: #FFFFFF;
	font-size: 0.9em;
	text-align: left;
	font-weight: 500;
}
td {
	font-size: 0.9em;
	padding: 3px;
	text-align: left;
	vertical-align: text-top;
}
caption {
	font-weight: 600;
	text-align: left;
	padding-left: 5px;
	line-height: 1.5em;
}
th.dag {
	width: 17%;
	overflow: visible;
}
th.tid {
	text-align: right;
	width: 20%;
	overflow: visible;
}
th.ovrigt {
	width: 63%;
	overflow: visible;
}
tr.uddaRader {
	background: #CCCCCC;
}
tr:hover {
	background: #B69969;
	cursor: default;
}
td.tid {
	text-align: right;
}

#container/* Tips för denna hybridlayout
1. Eftersom sidokolumnernas måttbaserade storlek är baserad på användarens standardteckensnittsstorlek bör du se till att bakgrundsgrafiken i kolumnerna tar hänsyn till detta. Om den är skapad på rätt sätt blir den lättare att komma åt för de som behöver större teckensnittsstorlek, eftersom bredden på kolumnerna blir proportionerlig. Om du inte vill ha så i din design ändrar du bara bredden till en pixelstorlek och ser till att ändra marginalerna på #mainContent div därefter.
2. Eftersom storleken på sidokolumnerna i denna layout baseras på den hundraprocentiga teckensnittsstorleken i body-elementet om du minskar teckensnittsstorleken totalt genom att använda en teckensnittsstorlek: 80 % av body-elementet eller #container, ska du komma ihåg att kolumnbredderna kommer att minska proportionerligt. Du kan öka deras bredder och storleken på sidomarginalerna för #mainContent div för att kompensera för det.
3. Om teckensnittsstorleken ändras i olika belopp för varje div istället för på den totala designen (d.v.s. #sidebarLeft får en teckensnittsstorlek på 70 % och #mainContent får en teckensnittsstorlek på 85 %), kommer detta att ändra den totala storleken på varje div proportionerligt. Du kan göra justeringar baserat på din slutgiltiga teckensnittsstorlek.
4. #container-diven behövs inte för denna layout vid en bredd på 100 %. Du kan använda den för att skapa faux-kolumner eller begränsa bredden på layouten.
5. Du behöver inte ha en bredd på 100 % på #container-diven eftersom en div av naturliga skäl tar upp 100 % av det tillgängliga utrymmet. Om du vill så kan du minska storleken på den totala containern och kanske lämna lite marginal på varje sida. Detta är redan tillgängligt för justering.
*/
  {
	width: 800px;
	/*marginal: 0 auto; automarginalerna (i samband med en bredd) centrerar sidan om det behövs */
	text-align: left;
	padding: 0px;
	border: 1px solid #999999;
	left: auto;
	right: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: #F4EFE9;
}  
#header  {
	padding: 0;  /* denna utfyllnad matchar vänsterjusteringen av elementen i de divar som visas under den. Om en bild används i #header istället för text kan du ta bort utfyllnaden. */
	height: 88px;
	width: 798px;
	background-color: #F4F0E9;
	position: relative;
	overflow: hidden;
} 

/*Menykolumn*/
#sidebarLeft
  {
	float: left;
	width: 200px; /* utfyllnad i över- och nederkant skapar visuellt utrymme inom denna div */
	padding-top: 0px;
	padding-bottom: 15px;
	padding-left: 0;
	margin-top: 12px;
	position: relative;
}
#sidebarLeft  h2, #sidebarRight  p, #sidebarRight   h2    {
	margin-left: 5px; /* vänster- och högermarginalen ska anges för varje element som kommer att placeras i sidokolumnerna */
	margin-right: 5px;
	padding-bottom: 0px;
	border-bottom-style: none;
	padding-top: .5em;
}
#sidebarLeft   div#meny,#sidebarLeft   div#omOss  {
	padding:0;
	margin: 0;
	position: relative;
}
#sidebarLeft #meny ul, #sidebarLeft #omOss ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#sidebarLeft #meny ul li, #sidebarLeft #omOss ul li {
	margin: 0;
	padding: 0;
}
#sidebarLeft #meny ul a, #sidebarLeft #omOss ul a {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFFFFF;
	text-decoration: none;
	margin: 0;
	border-bottom: 1px solid #F4EFE9;
	line-height: 25px;
	width: 168px;
	padding-left: 30px;
	display: block;
	background: url(../bilder/menyBg_600x25.png) no-repeat left center;
}
#sidebarLeft #meny ul a.last, #sidebarLeft #omOss ul a.last {
	border-bottom: none;
}
#sidebarLeft #meny ul a:hover, #sidebarLeft #omOss ul a:hover {
	background-position: -200px 0px;
	color: #FFFFFF;
}
#sidebarLeft #meny ul a.current, #sidebarLeft #omOss ul a.current {
	background-position: top right;
	color: #000066;
	cursor: default;
}
#sidebarLeft #meny ul a.lastCurrent, #sidebarLeft #omOss ul a.lastCurrent {
	background-position: top right;
	color: #000066;
	cursor: default;
	border-bottom: none;
}
#meny {
	background-color: #B69969;
	border: 1px solid #000000;
	overflow: hidden;
}
#omOss {
	background-color: #859107;
	border: 1px solid #000000;
}
#kontakt {
	margin: 0px;
	padding: 0px;
	width: 200px;
	text-align: center;
}
#sidebarRight  {
	float: right;
	width: 185px; /* bakgrundsfärgen kommer att visas för längden på innehållet i kolumnen, men inte längre */
	padding: 0px 2px 2px 2px; /* utfyllnad i över- och nederkant skapar visuellt utrymme inom denna div */
	text-align: center;
	background-color: #B69969;
	border: 1px solid #000000;
	margin-top: 15px;
}
#sidebarRight img {
	padding-top: 4px;
}

#mainContent {
	background-color: #F4EFE9;
	width: 340px;
	position: relative;
	/*float: none;*/
	margin-top: 0;
	margin-right: 13.5em;
	margin-bottom: 0;
	margin-left: 210px;
	padding-top: 1em;
	padding-right: 1em;
	padding-bottom: 0;
	padding-left: 1em;
} 
#mainContent table#utanBild {
	width: 500px;
	padding: 3px;
	margin-top: 3px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #792C18;
	border-bottom-color: #792C18;
	border-left-color: #792C18;
}
#mainContent table#medBild {
	width: 370px;
	padding: 3px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #792C18;
	border-bottom-color: #792C18;
	border-left-color: #792C18;
	margin-top: 10px;
}
#mainContent ul {
	padding-left: 1em;
}
/* sidorna efter indexfilen med endast två kolumner sidebarLeft och mainContent2 */
#mainContent2 {
	background-color: #F4EFE9;
	position: relative;
	width: 500px;
	margin-left: 210px;
	padding-top: 1em;
	padding-right: 1em;
	padding-left: 1em;
}
#mainContent2 img {
	padding: 0px;
	left: -5px;
	top: -4px;
	position: relative;
}
#mainContent2 table#utanBild {
	width: 500px;
	padding: 3px;
	margin-top: 10px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #792C18;
	border-bottom-color: #792C18;
	border-left-color: #792C18;
}
#mainContent2 table#medBild {
	width: 350px;
	padding: 3px;
	margin-top: 10px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #792C18;
	border-bottom-color: #792C18;
	border-left-color: #792C18;
}

/* bakgrundskugga till bilderna på alla sidor utom index */
.skugga {
	float: right;
	position: relative;
	padding-right: 0px;
	padding-bottom: 0px;
	background-image: url(../bilder/skugga_900x900.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	margin-top: 25px;
	margin-left: 10px;
	margin-bottom: 5px;
}
/* bakgrundskugga till bilderna på alla sidor utom index */
.skuggaLeft {
	float: left;
	position: relative;
	padding-right: 0px;
	padding-bottom: 0px;
	background-image: url(../bilder/skugga_900x900.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	margin-top: 25px;
	margin-left: 10px;
	margin-bottom: 5px;
}

/* footer */
#footer  {
	background-color: #9A3234;
	text-align: center;
	position: relative;
	float: left;
} 
#footer  p  {
	margin: 0; /* genom att nollställa marginalerna i det första elementet i sidfoten undviker du att marginaler komprimeras, d.v.s. att det blir ett utrymme mellan divar */
	padding: 10px 0; /* utfyllnad på detta element skapar utrymme precis som marginalen skulle göra, utan problemet med att marginaler komprimeras */
	font-weight: bold;
	color: #ECE2CF;
}
/* slut på tabell-formateringen */
/* används till att formatera text under bilder */
.vText {
	text-align: center;
	float: left;
	font-size: 0.8em;
	font-style: italic;
}
.hText {
	text-align: center;
	float: right;
	font-size: 0.8em;
	font-style: italic;
}

.mText {
	text-align: center;
	font-size: 0.8em;
	font-style: italic;
}
.hImg {
	float: right;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 5px;
	background: #F4EFE9;
}

.vImg {
	float: left;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	background: #F4EFE9;
}
.mImg {
	text-align: center;
	margin: 5px;
	border: 0px solid #000000;
}

/* Våra Djur */
#div_VDContent225 {
	width: 450px;
	padding-top: 25px; 
	padding-bottom: 25px; 
	text-align: left;
	font-size: 0.8em;
	font-style: italic;	
}
#div_VDContent450 {
	width: 450px;
	padding-top: 25px; 
	padding-bottom: 0px; 
	text-align: left;
	font-size: 0.8em;
	font-style: italic;	
}
#div-VDmText {
	float: left;
	clear: all;
	width: 450px;
	text-align: left;
	font-size: 0.8em;
	font-style: italic;
	padding-top: 0px;
	padding-bottom: 25px;
}

/* Slut Våra Djur */

/* slut används till att formatera text under bilder */
/* Övriga klasser för återanvändning */
.fltrt { /* denna klass kan användas för att flytta ett element till höger på sidan. Det flytande elementet måste komma före elementet som det ska ligga bredvid på sidan. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* denna klass kan användas för att flytta ett element till vänster på sidan */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* denna klass ska placeras på en div eller break-element och ska vara det sista elementet innan en container som helt ska innehålla ett flyttal stängs */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
fieldset {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 1em;
	margin-left: 0px;
}
legend {
	font-weight: 600;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 1em;
	color: #9A3133;
}
fieldset ol {
	margin: 0em;
	padding: 1em;
	list-style-type: none;
}
fieldset li {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 1em;
	margin-left: 0px;
}

label {
	text-align: right;
	width: 4em;
	float: left;
	padding-right: 0.5em;
}
.option label {
	text-align: left;
	float: none;
	width: auto;
}
.forklaring label {
	display: block;
	text-align: left;
	float: none;
	width: auto;
}
.font_09em textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .9em;
}
.offleft {
	margin-left: -9000em;
	position: absolute;
	visibility: hidden;
}

#skipLinks {
	font-size: 80%;
}
#skipLinks ul {
	margin: 0px;
	padding: 0px;
}
#skipLinks li {
	background-image: none;
	margin: 0px;
	position: absolute;
	list-style-type: none;
}
#skipLinks a {
	color: #FFFFFF;
	position: absolute;
	margin-left: -9000px;
}
#skipLinks a:focus, #skipLinks a:active {
	display: block;
	width: 18em;
	margin-left: 130px;
}