* { padding: 0; margin: 0; }

body {
 font-family: Tahoma, Arial, Helvetica, sans-serif;
 font-size: 12px;
 background-color:#3E3E3E;
 color:#3F1414;
}

#wrapper { 
position:relative;
margin: 0 auto;
padding:0;
width: 1022px;
height:680px;
}

#header {
 color: #333;
 width: 100%;
 padding:0px;
 border-bottom: 10px solid white;
 height: 120px;
 margin: 0px 0 20px 0;
 background: #DADADA;
}

#header img {
float:left;
}

/* Headers */

#header h1 {
margin:0px;
padding:20px;
max-width:900px;
}

p {
margin:15px;
line-height:1.5em;
}

h1 {
margin:1em 1.5em 1em 1.5em;
}

.alavasen h1 {
margin:1em 1.5em 1em 0em;
}


.pod {
margin-left:300px;
border:10px solid white;
}


#mycustomscroll {
border: 10px solid white;
background-color:#DDDDDD;
margin: 0px 0px 50px 0px;
width: 498px;
position:relative;
float:right;
height:540px;
overflow: auto;

}

.mainos { 
border-right: 10px solid white;
border-bottom: 10px solid white;
border-left: 10px solid white;
background-color:#DDDDDD;
margin: 10px 0px 20px 0px;
width: 468px;
display: inline;
float: left;
height:80px;
}

.menu {
background-color:white;
height:40px;
}

#footer { 
 width: 990px;
 clear: both;
 border: 10px solid white;
 background:#DDDDDD;
 margin: 0px 0px 10px 0px;

} 

.banner {
margin:0px 0 5px 0;
}

img {
border:0;
}
.kuvat a {
color:#dddddd;
}
.kuvat a:hover {
color:red;
}

.kuvat td {
padding:15px;
border:1px solid #dddddd;
}

.kuvat td:hover {
border:1px solid red;
}


#navlist
{
text-align:right;
margin:0;
float:right;
width:500px;
background:transparnet;
padding: 0;
margin-left: 0;
//border-bottom: 1px solid #778;
font: bold 12px Arial, sans-serif;
}

#navlist li
{
list-style: none;
margin: 0;
display: inline;
}

#navlist li a
{
font-family: Arial, Helvetica, sans-serif;
ont-size: 10px;
padding:1em;
margin-left: 3px;
background: white;
text-decoration: none;
}

#navlist li a:link { color: #448; }
#navlist li a:visited { color: #667; }
#navlist li a:hover

{
color: #000;
background: #EFEFEF;
//border-color: #227;
}

#navlist li a#current
{
background: #DDDDDD;
//border-bottom: 1px solid #DDDDDD;
}


/* THE STRIPVIEWER (LEFT Column) */
		
/* These 2 lines specify style applied while slider is loading */

.svw {width: 50px; height: 20px; background: #fff; overflow: hidden;}

.svw ul {position: relative; left: -999em;}

.stripViewer { /* This is the viewing window */
position: relative;
overflow: hidden; 
width: 468px; /* Also specified in  .stripViewer .panelContainer .panel  below */
height: 440px;
clear: both;
color:#3F1414;
border: 10px solid white;
background-color:#dddddd;
margin: 0px ;
float: left;
}
.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
position: relative;
left: 0; top: 0;
width: 100%;
list-style-type: none;
		}

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
float:left;
width: 468px; /* Also specified in  .stripViewer  above */
height: 100%;
}

.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
padding: 0px;
}

.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
margin: 0;
background:transparent;
width:508px;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
				background:transparent;
				width:508px;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in slideviewer.js */
			
		}
		
		.stripNav a { /* The nav links */
		 font-family: Arial, Helvetica, sans-serif;
			font-size: 10px;
			font-weight: bold;
			text-align: center;
			line-height: 32px;
				background:#9F9F9F;
			color: #000;
			text-decoration: none;
			display: block;
			padding: 0 15px;
		}
		
		.stripNav a:hover {
			background: #9cf;
		}
		
		.stripNav a.current {
			background: white;
			color: #3F1414
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 230px;
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 40px;
			width: 40px;
		}
		
		.stripNavL {
			left: 0;
		}
		
		.stripNavR {
			right: 0;
		}
		
		.stripNavL {
			background: url("images/arrow-left.gif") no-repeat center;
		}
		
		.stripNavR {
			background: url("images/arrow-right.gif") no-repeat center;
		}
		


/* Scroll Bar Master Styling Starts Here */

.scrollgeneric {line-height: 1px;font-size: 1px;position: absolute;top: 0; left: 0;}
.vscrollerbar {width: 15px;background: #EDEDED url(scrollbar.png) -36px 0px repeat-y;}
.vscrollerbarbeg {height: 15x !important;width: 36px;background: url(scrollbar.png) -108px -32px no-repeat;}
.vscrollerbarend {height: 15px;width: 36px;background: url(scrollbar.png) -108px 0px no-repeat;}
.vscrollerbase {width: 15px;background: #355469 url(scrollbar.png) 0px 0px repeat-y;}
.vscrollerbasebeg {width: 15px;height: 28px !important;background: url(scrollbar.png) -72px -28px no-repeat;}
.vscrollerbaseend {height: 15px;width: 36px;background: url(scrollbar.png)  -72px 0px no-repeat;}
.hscrollerbase {height: 16px; background-color: white;}
.hscrollerbar {height: 16px; background-color: black;}
.vscrollerbar, .hscrollerbar {padding: 28px;z-index: 2;}
.scrollerjogbox {width: 36px;height: 16px;top: auto; left: auto;bottom: 0px; right: 0px;background: #37917A;}

/* Scroll Bar Master Styling Ends Here */
	

/* ALAREUNAN TYYLIT*/	

.alareuna {
clear:both;
position:relative;
width:100%;
height:650px;
padding:90px 0 0 0 ;
margin:0px;
background-image:url(alareuna.png);
background-repeat:repeat-x;
 background-color: #DADADA;
}

.alavasen {
float:left;
 margin: 10px 0px 50px 0px;
 width: 498px;
font-size:14px;
}

.alaoikea {
margin: 10px 0px 0px 560px;
width: 425px;
font-size:14px;
}

.alaoikea img {
padding:3px;
border:solid 1px white;
}