/* Bodyyn kannattaa määritellä myös kaikki palikat, joissa tausta jatkuu eli backgroud-repeat:repeat. Tällöin palikalle voidaan määritellä repeat horisontaalisesti tai vertikaalisesti. */

body {
	background-image: url(kuvat/tausta.jpg);
	background-repeat: no-repeat;
	background-position: top;
	margin: 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	}

 #container {
	width: 780px;
	overflow: hidden;
	margin: 0px auto; 
  }

#header {
	width: 780px;
	height: 100px;
	margin: 0px;
	top: 0px;
	padding: 0px;
}

#header img {
	float: left;
}

/* NAVIKKOMÄÄRITTELYT ALKAA TÄSTÄ */
#navi {
	width: 120px;
	margin: 0px;
	padding: 0px;
	float: left;
	position: relative;
	z-index: 100;
}

#navi ul{
	margin: 0;
	padding: 0 0 0 0px;
	position: relative;
}

#navi a.otsake {
	display:block;
	width: 120px;
	height: 30px;
	margin: 0px;
	padding: 0px;
}

a img {
	border: none;
	}
	
#historia {background-image: url(kuvat/navihistoria.gif);}

#historia_aktiivinen {background-image: url(kuvat/navihistoria_B.gif);}

#historia:hover {background-image: url(kuvat/navihistoria_Y.gif);}
	

#talo_aktiivinen {background-image: url(kuvat/navitalo_Y.gif);}


#kievari_aktiivinen {background-image: url(kuvat/kievari_Y.gif);}


#otsake1 {background-image: url(kuvat/navivaakuna.gif);}

#otsake1_aktiivinen {background-image: url(kuvat/navivaakuna_B.gif);}
	
#otsake1:hover {background-image: url(kuvat/navivaakuna_Y.gif);}

	

#otsake2 {background-image: url(kuvat/navisukupuu.gif);}

#otsake2_aktiivinen {background-image: url(kuvat/navisukupuu_B.gif);}

#otsake2:hover {background-image: url(kuvat/navisukupuu_Y.gif);}



#otsake3 {background-image: url(kuvat/navitapahtumat.gif);}

#otsake3_aktiivinen {background-image: url(kuvat/navitapahtumat_B.gif);}

#otsake3:hover {background-image: url(kuvat/navitapahtumat_Y.gif);}



#otsake4 {background-image: url(kuvat/naviyhteys.gif);}

#otsake4_aktiivinen {background-image: url(kuvat/naviyhteys_B.gif);}

#otsake4:hover {background-image: url(kuvat/naviyhteys_Y.gif);}



#otsake5 {background-image: url(kuvat/navipalaute.gif);}

#otsake5_aktiivinen {background-image: url(kuvat/navipalaute_B.gif);}

#otsake5:hover {background-image: url(kuvat/navipalaute_Y.gif);}



#otsake6 {background-image: url(kuvat/navisivuk.gif);}

#otsake6_aktiivinen {background-image: url(kuvat/navisivuk_B.gif);}

#otsake6:hover {background-image: url(kuvat/navisivuk_Y.gif);}


#navi ul li ul.tokataso {
	width: 120px;
	margin: 0 0 0 0px;
	padding: 0px;
	display: block;
	float: inherit;
}

#navi ul li ul.tokataso li{
 	height:30px;
}


ul {list-style-type: none;}



/*#navi a.otsake:hover ul.tokataso a.otsake {
	display: block;
}*/

/* NAVIKKOMÄÄRITTELYT LOPPUU TÄHÄN */

/* SISÄLLÖN MÄÄRITTELY ALKAA TÄSTÄ */

#content {
	width: 660px;
	position: relative;
	padding: 0px;
	float: right;
	z-index: 1
}
/*
#content img.oikea {
	float: right;
	margin: 0 0 30px 20px;

}*/

h1 {
	font-family: "Times New Roman", Times, serif;
	font-size: 24px;
	font-weight: bold;
	color: #000000;
	text-align: center;
	margin-top: 25px;
}

h3 {
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	font-weight: bold;
	color: #000000;
	font-style: italic;
	text-align: center;
	padding-top: 10px;
}

p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #000000;
	text-align: left;
	margin-left: 30px;
	margin-right: 100px;
	line-height: 18px;
}

/* SISÄLLÖN MÄÄRITTELY LOPPUU TÄHÄN */

#footer { 
	width: 780px; /* Kun footerille annetaan arvoksi 100%, footer levittäytyy äärettömyyksiin */
	height: 20px;
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	text-align: center;
	color: #FFFFFF;
	background-color: #0e5b71;
	overflow: hidden;
	padding-top: 4px;
	margin: 0 auto;
}
