/***********************************************************************/
/* Tonin Louhinta css - last edited 13.12.2006 (by H Hurme/MediaSPREA) */
/***********************************************************************/


body {
	margin: 0;
	padding: 0;
	font-family: arial, verdana, sans-serif;
	background: #404040;
	font-size: 100%;
}

/**********************/
/* Layout begins here */
/**********************/
#preload {
	display: none;
	}

#container {
	position: relative;
	margin: 3% auto 0 auto;
	width: 900px;
}

#masthead {
	background:  url('images/bg_masthead.jpg') no-repeat;
	width: 900px;
	height: 183px;
	margin: 0;
	padding: 0;
}

#content {
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
	width: 900px;
	background: white url('images/bg_content.jpg') repeat-x; 
}	

#left-column {
	display: inline;
	float: left;
	width: 230px;
	margin: 0 0 0 20px;
	padding: 0;
}

#right-column {
	display: inline;
	float: right;
	text-align: left;
	width: 510px;
	margin: 18px 70px 0 70px;
	padding: 0;
	
}

.images {
	display: inline;
	float: left;
	width: 170px;
	height: 140px;
	text-align: center;
	vertical-align: top;
	margin: 0;
	padding:0;
	font-size: 12px;
}

.float_right {
	display: inline;
	float: right;
	margin: 35px 0 0 50px;
	padding: 0;
	border: 1px solid black;
}

#footnote {
	clear: both;
	padding: 0;
	width: 900px;
	height: 30px;
	margin: 0 auto 0 auto;
	background: url('images/bg_footnote.jpg') no-repeat;
}

#navigation {
	margin: 18px 0 20px 0;
	padding: 0;
	width: 230px;
	border-top: 2px solid black;
	border-bottom: 2px solid black;
}
	

/*** Navigation */
#left-column #navigation ul {
	margin: 5px 0 10px 0;
	padding: 0;
}

#left-column #navigation ul li {
	margin: 0;
	padding: 0;
	list-style: none;
}

#left-column #navigation a {
	display: block;
	width: 230px;
	height: 26px;
	text-decoration: none;
}

#left-column #navigation em {
	visibility: hidden;
}

a:link.etusivu, a:visited.etusivu, a:active.etusivu  {
	background: url('images/nav_etusivu_01.jpg') no-repeat;
}

a:hover.etusivu {
	background: url('images/nav_etusivu_02.jpg') no-repeat;
}

a:link.palvelut, a:visited.palvelut, a:active.palvelut {
	background: url('images/nav_palvelut_01.jpg') no-repeat;
}

a:hover.palvelut  {
	background: url('images/nav_palvelut_02.jpg') no-repeat;
}

a:link.kalusto, a:visited.kalusto, a:active.kalusto {
	background: url('images/nav_kalusto_01.jpg') no-repeat;
}

a:hover.kalusto  {
	background: url('images/nav_kalusto_02.jpg') no-repeat;
}

a:link.kuvia, a:visited.kuvia, a:active.kuvia {
	background: url('images/nav_toita_01.jpg') no-repeat;
}

a:hover.kuvia {
	background: url('images/nav_toita_02.jpg') no-repeat;
}

a:link.yhteystiedot, a:visited.yhteystiedot, a:active.yhteystiedot {
	background: url('images/nav_yhteys_01.jpg') no-repeat;
}

a:hover.yhteystiedot {
	background: url('images/nav_yhteys_02.jpg') no-repeat;
}


/*** Content styling */ 
a, a:link, a:visited, a:active {
	color: #00479E; /* tai #0000CC */
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.images img, .images img a  {
	border: 1px solid black;
}

.images a, .images a:link, .images a:visited, .images a:active {
	color: #00479E;
	text-decoration: none;
}

.images a:hover {
	color: black;
	text-decoration: none;
}


p {
	font-size: 12px;
	margin: 0 0 1em 0;
	padding: 0;
	line-height: 1.3em;
}

h1 {
	font-size: 16px;
	font-family: verdana;
	font-weight: bold;
	margin: 0 0 0.8em 0;
	letter-spacing: 0.03em;
}

h2 { 
	font-size: 14px;
	margin: 0;
	padding: 4px 0 3px 0;
	color: #800000;
	font-weight: bold;
}

/*** list styling */
#content ul, .content ol {
	margin: 0 0 10px 25px;
	padding: 0;
}


/* Unordered list li styling */
#content ul li {
	margin: 0;
	padding: 0 0 12px 5px;
	font-weight: normal; 
	font-family: arial; 
	font-size: 12px; 
	line-height: 1.3em;
	list-style: disc; 
}

#content ol li {
	margin: 0;
	padding: 0 0 0 5px;
	font-weight: normal; 
	font-family: arial; 
	font-size: 12px; 
	line-height: 1.3em;
} 


/*** Footer */
#footnote p.mediasprea {
	display: inline;
	font-size: 10px;
	color: gray;
	float: right;
	margin: 32px 13px 0 0;
	padding: 0;
}

#footnote a:link, #footnote a:visited, #footnote a:active {
	color: gray;
	text-decoration: none;
}

#footnote a:hover  {
	text-decoration: none;
	color: silver;
}