@charset "utf-8";

html {
	width: 100%;
	height: 100%;
	}

body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: black;
	font-size: 100%;
	background: #2f74a3 url('../images/bg_masthead_gradient.jpg') repeat-x 0% 0%;
	}

#masthead {
	width: 920px;
	height: 245px;
	margin: 0 auto;
	background: url('../images/bg_masthead.jpg') no-repeat 0% 100%;
	}
	
	#masthead ul {
		display: inline;
		float: left;
		height: 31px;
		margin: 210px 0 0 74px;
		padding: 0;
		text-align: center;
		}
		
		#masthead ul li {
			display: inline;
			margin: 0 ;
			padding: 0;
			}
			
			#masthead ul li a:link, #masthead ul li a:visited, #masthead ul li a:active {
				display: inline;
				float: left;
				width: 150px;
				height: 31px;
				margin: 0 2px;
				padding: 0;
				line-height: 31px;
				vertical-align: middle;
				font-size: 12px;
				color: black;
				font-weight: bold;
				text-decoration: none;
				background: url('../images/topnav_link.jpg') no-repeat 0% 0%;
				}
			
			#masthead ul li a:hover, #masthead ul li a.current {
				background: url('../images/topnav_link.jpg') no-repeat 0% 100%;
				color: #fff;
				}
				
			#masthead ul li a:link.current, #masthead ul li a:visited.current, #masthead ul li a:active.current {
				background: url('../images/topnav_link.jpg') no-repeat 0% 100%;
				color: #fff;
				}
							
#container {
	width: 100%;
	background: #fff url('../images/bg_content_gradient.jpg') repeat-x 0% 100%;
	}

	#inner-container {
		position: relative;
		width: 920px;
		margin: 0 auto;
		padding: 0;
	/*	line-height: 0;	*/
		background: url('../images/bg_content.jpg') repeat-y;
		}
		
		.left_overlaylogo {
			position: absolute;
			left: 20px;
			bottom: 110px;
			}
					
		.left_shadow {
			position: absolute;
			left: 0;
			bottom: 100px;
			}
			
		.right_shadow {
			position: absolute;
			right: 0;
			bottom: 100px;
			}
	
		#content {
			width: 840px;
			padding: 30px 40px 30px 40px;
			margin: 0;
			}
			
			#left_column {
				display: inline;
				float: left;
				width: 200px;
				}
				
			#right_column {
				display: inline;
				float: left;
				width: 606px;
				margin: 0 0 30px 34px;
				padding: 0;
				}
				
				#right_column .box {
					width: 180px;
					height: 250px;
					display: inline;
					float: left;
					margin: 0 0 20px 0;
					padding: 0;
					}
				
				#right_column .middlebox {
					width: 180px;
					height: 230px;
					display: inline;
					float: left;
					margin: 0 30px 20px 30px;
					padding: 0;
					}
					
					#right_column .box table p, #right_column .middlebox table p {
						margin: 10px 0 0 0;
						font-size: 13px;
						}
			
			#sidenav {
				width: 200px;
				margin: 0;
				padding: 0;
				background: url('../images/bg_sidenav.jpg') repeat-y;
				}
				
				#sidenav a:link, #sidenav a:visited, #sidenav a:active {
					float: left;
					display: inline;
					width: 180px;
					height: 30px;
					margin: 0;
					padding: 0 10px 0 10px;
					line-height: 30px;
					vertical-align: middle;
					color: black;
					text-decoration: none;
					font-weight: bold;
					font-size: 12px;
					background: url('../images/sidenav_link_default.jpg') no-repeat 0% 0%;
					}
				
				#sidenav a:hover {
					width: 180px;
					height: 30px;
					background: url('../images/sidenav_link_hover.jpg') no-repeat 0% 0%;
					}
				
				#sidenav a:link.current, #sidenav a:visited.current, #sidenav a:active.current {
					width: 180px;
					height: 30px;
					background: url('../images/sidenav_link_active.jpg') no-repeat 0% 0%;
					color: #fff;
					}
				
				#sidenav a:link.tall, #sidenav a:visited.tall, #sidenav a:active.tall {
					display: inline-block;
					width: 180px;
					height: 40px;
					margin: 0;
					padding: 0 10px;
					line-height: 20px;
					vertical-align: middle;
					color: black;
					text-decoration: none;
					font-weight: bold;
					font-size: 12px;
					background: url('../images/sidenav_link_tall_default.jpg') no-repeat 0% 0%;
					}
				
				#sidenav a:hover.tall {
					width: 180px;
					height: 40px;
					background: url('../images/sidenav_link_tall_hover.jpg') no-repeat 0% 0%;
					}
				
				#sidenav a.current.tall {
					width: 180px;
					height: 40px;
					background: url('../images/sidenav_link_tall_active.jpg') no-repeat 0% 0%;
					color: #fff;
					}
									
				#sidenav img {
					display: inline;
					float: left;
					clear: both;
					margin: 0;
					padding: 0;
					}
	
		#footnote {
			clear: both;
			width: 920px;
			height: 100px;
			background: url('../images/bg_footnote.jpg') no-repeat;
			
			}
			
			#footnote p.copyright {
				display: inline;
				float: right;
				margin: 15px 40px 0 0;
				padding: 0;
				font-size: 11px;
				color: #A3D0E9;
				}

/* SISÄLLÖN ULKOASU */

h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	font-weight: bold;
	color: #7dc40a;
	padding: 0 0 0.5em 0;
	margin: 0;
/*	line-height: 1em; */
	}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	color: #333;
	padding: 0.1em 0 0.5em 0;
	margin: 0;
}

h3 {
	font-family:  georgia, trebuchet ms, verdana, arial, sans-serif;
	font-size: 0.9em;
	font-weight: bold;
	margin: 0 0 0 0;
	padding: 5px 0 0 0;
	font-style: italic;
	color: black;
}
	
p {
	font-size: 0.9em;
	padding: 0 0 1.1em 0;
	margin: 0;
	line-height: 1.25em;
	}

.middlebox p, .box p {
	font-size: 0.8em;
	color: #555;
	}

.middlebox p a, .box p a {
	font-size: 1.1em;
	}

#right_column a:link, #right_column a:visited, #right_column a:active, a:link.nro, a:visited.nro, a:active.nro  {
	color: #3366ff;
	}

#right_column a:hover, a:hover.nro {
	color: #7dc40a;
	}

a.nro {
	text-decoration: none;
	}

.clr {
	clear: both;
	}

#right_column img.right {
	float: right;
	display: inline;
	margin: 0 0 1em 2em;
	}

#right_column .right {
	float: right;
	display: inline;
	margin: 0 0 15px 15px;
}

#right_column img.left {
	float: left;
	display: inline;
	margin: 0 2em 1em 0;
	}
	
	#right_column ul, #right_column ol {
	margin: 0 8px 0.8em 20px;
	padding: 0;
}

#right-column ul {
	list-style: disc;
	}

/* Unordered list li styling */
#right_column ul li, #right_column ol li {
	margin: 0;
	padding: 0 0 0 5px;
	font-size: 0.9em;
	line-height: 1.25em;
	font-weight: normal; 
}

#right_column form { 
	margin: 0;
	padding: 0;
	}
	
	#right_column form p {
	line-height: 1.2em;
	padding-bottom: 0.3em;
	}

input, textarea {
	font-family: Arial, Helvetica, Sans-serif;
	font-size: 0.9em;
	color: #222;
	
	}
	
	input.tuotteet, textarea.tuotteet {
	font-family: Arial, Helvetica, Sans-serif;
	font-size: 0.9em;
	color: #222;
	border: 1px solid #7dc40a;
	}