html, body {
	margin: 0;
	padding: 0;
	background-image: url(images/tausta.jpg);
	background-repeat: repeat;
	background-color: transparent;
	overflow-x: hidden;
	

}

.container_main {

	left: 0px;
	top: 0px;
	width: 842px;
	margin: 0;
	
	
}

.logo {
	position: relative;
	left: 0px;
	top: 0px;
	width: 554px;
	height: 128px;
	background-image: url(images/logo.png);
	background-repeat: no-repeat;
	background-color: transparent;
	
}

.sytylogo {
	position: absolute;
	left: 710px;
	top: 800px;
	width: 126px;
	height: 61px;
	background-image: url(images/syty_logo_web_278.png);
	background-repeat: no-repeat;
	background-color: transparent;
	
}

.gslogo {
	position: absolute;
	left: 850px;
	top: 770px;
	width: 126px;
	height: 112px;
	background-image: url(images/greenstar.png);
	background-repeat: no-repeat;
	background-color: transparent;
	
}


/* Ylänavigaatio */

#ylanavi {

height: 40px;
width: 704px;
position: relative;
top: 0px;
left: 0px;

}


#ylanavi ul {
position: relative;
margin: 0;
padding: 0 0 0 0;
list-style: none;
left: 0px;
font-family: Georgia, Times;
}

#ylanavi li {
float: left;
height: 40px;
margin: 0px;
padding: 0px 0px 0px 0px;
white-space: nowrap;
display: inline;
overflow: hidden;
outline:0;
}

#ylanavi li a {
float: left;
display: block;
height: 40px;
width: 100%;
overflow: hidden;
outline:0;
text-indent: -9999px;
text-decoration: none;
}


#n1, #n1 a { background:transparent url("images/navi/navi.png") 0 0 no-repeat; width:65px;}
#n2, #n2 a { background:transparent url("images/navi/navi.png") -65px 0 no-repeat; width:105px;}
#n3, #n3 a { background:transparent url("images/navi/navi.png") -170px 0 no-repeat; width:60px;}
#n4, #n4 a { background:transparent url("images/navi/navi.png") -230px 0 no-repeat; width:50px;}
#n5, #n5 a { background:transparent url("images/navi/navi.png") -280px 0 no-repeat; width:60px;}
#n6, #n6 a { background:transparent url("images/navi/navi.png") -340px 0 no-repeat; width:80px;}
#n7, #n7 a { background:transparent url("images/navi/navi.png") -420px 0 no-repeat; width:120px;}
#n8, #n8 a { background:transparent url("images/navi/navi.png") -540px 0 no-repeat; width:164px;}

#n1a, #n1a a, #n1 a:hover { background:transparent url("images/navi/navi.png") 0 -40px no-repeat; width:65px;}
#n2a, #n2a a, #n2 a:hover { background:transparent url("images/navi/navi.png") -65px -40px no-repeat; width:105px;}
#n3a, #n3a a, #n3 a:hover { background:transparent url("images/navi/navi.png") -170px -40px no-repeat; width:60px;}
#n4a, #n4a a, #n4 a:hover { background:transparent url("images/navi/navi.png") -230px -40px no-repeat; width:50px;}
#n5a, #n5a a, #n5 a:hover { background:transparent url("images/navi/navi.png") -280px -40px no-repeat; width:60px;}
#n6a, #n6a a, #n6 a:hover { background:transparent url("images/navi/navi.png") -340px -40px no-repeat; width:80px;}
#n7a, #n7a a, #n7 a:hover { background:transparent url("images/navi/navi.png") -420px -40px no-repeat; width:120px;}
#n8a, #n8a a, #n8 a:hover { background:transparent url("images/navi/navi.png") -540px -40px no-repeat; width:164px;}

#dropdown_1 {
	position: absolute;
	width: 100px;
	top: 168px;
	left: 230px;
	height: auto;
	background-color: #000;
	
}

#dropdown_2 {
	position: absolute;
	width: 100px;
	top: 168px;
	left: 420px;
	height: auto;
	background-color: #000;
	
}


ul, li{margin:0; padding:0; list-style:none;}

.menu_body1, .menu_body2 {display:none; width:100px;border: none;}
.menu_body1 li, .menu_body2 li{background:#333;}
.menu_body1 li.alt, .menu_body2 li.alt{background:#555;}

.menu_body1 li a, .menu_body2 li a{font-family: Georgia, serif; font-size: 10px; color:#FFFFFF; text-decoration:none; padding:5px; display:block;}

#selite_1 {
	position: absolute;
	width: 50px;
	top: 123px;
	left: 12px;
	height: 13px;
	background-color: #fff;
	font-family: Georgia, serif; font-size: 10px; color:#000; text-decoration:none; padding:1px; display:block;
	text-align: center;
	display: none;
}

#selite_2 {
	position: absolute;
	width: 50px;
	top: 123px;
	left: 90px;
	height: 13px;
	background-color: #fff;
	font-family: Georgia, serif; font-size: 10px; color:#000; text-decoration:none; padding:1px; display:block;
	text-align: center;
	display: none;
}

#selite_3 {
	position: absolute;
	width: 80px;
	top: 123px;
	left: 160px;
	height: 13px;
	background-color: #fff;
	font-family: Georgia, serif; font-size: 10px; color:#000; text-decoration:none; padding:1px; display:block;
	text-align: center;
	display: none;
}

#selite_4 {
	position: absolute;
	width: 50px;
	top: 123px;
	left: 355px;
	height: 13px;
	background-color: #fff;
	font-family: Georgia, serif; font-size: 10px; color:#000; text-decoration:none; padding:1px; display:block;
	text-align: center;
	display: none;
}


.content_container {
	position: relative;
	left: 0px;
	top: 0px;
	width: 704px;
	height: auto;
	background-image: url(images/content_tausta.png);
	background-repeat: repeat-y;
	background-color: transparent;
	padding-bottom: 50px;
	
}





.kuvitus {
	
	position: absolute;
	left: 0px;
	top: 20px;
	width: 157px;
	height: px;
}

.otsikko{
	
	position: relative;
	left: 157px;
	top: 20px;
	width: 360px;
	height: 32px;
}

.sisalto{
	
	margin-left: 207px;
	margin-top: 70px;
	width: 420px;
}



.flash {
	position: absolute;
	left: 710px;
	top: 30px;
	width: 200px;
	height: 850px;
	background-color: transparent;
	
}

.purkkaviritys {
	position: fixed;
	bottom: 0px;
	right: 0px;
	width: 100px;
	height: 45px;
	background-color: transparent;
	text-align: center;
}

img {

	border: none;

}

/* Tyylit */

td {

	font-family: Georgia, serif;
	font-size: 11px;
	font-weight: normal;
	line-height: 14px;
	text-align: left;
	padding: 2px 7px 4px 4px;
	vertical-align: top;
	margin: 0;
	background-color: #ddd;

}

p {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: normal;
	width : 420px;
	line-height: 18px;
	color: #000;
	text-align: left;
	margin-top: 0px;

}

.sisalto li {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: normal;
	width : 420px;
	line-height: 24px;
	color: #000;
	text-align: left;
	margin-top: 0px;
	margin-left: 10px;

}

h1 {

	font-family: Georgia, serif;
	font-size: 16px;
	font-weight: bold;
	width : 420px;
	line-height: 18px;
	color: #000;
	text-align: left;
	margin-top: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;

}

h2 {

	font-family: Georgia, serif;
	font-size: 12px;
	font-weight: bold;
	width : 420px;
	line-height: 18px;
	color: #000;
	text-align: left;
	margin-top: 15px;
	letter-spacing: 2px;
	text-transform: uppercase;

}

.taulukko a {

	font-family: Georgia, serif;
	font-size: 11px;
	font-weight: normal;
	text-decoration: underline;
	color: #000;
	text-align: center;
	margin-top: 0px;

}

.taulukko a:hover {

	font-family: Georgia, serif;
	font-size: 11px;
	font-weight: normal;
	text-decoration: underline;
	color: #555;
	text-align: center;
	margin-top: 0px;

}

.sisalto a {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: bold;
	text-decoration: underline;
	width : 420px;
	line-height: 18px;
	color: #000;
	text-align: left;
	margin-top: 0px;

}

.sisalto a:hover {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: bold;
	text-decoration: underline;
	width : 420px;
	line-height: 18px;
	color: #555;
	text-align: left;
	margin-top: 0px;

}

.linkkilista a {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: normal;
	text-decoration: underline;
	width : 420px;
	line-height: 18px;
	color: #000;
	text-align: left;
	margin-top: 0px;


}

.linkkilista a:hover {

	font-family: Georgia, serif;
	font-size: 13px;
	font-weight: normal;
	text-decoration: underline;
	width : 420px;
	line-height: 18px;
	color: #555;
	text-align: left;
	margin-top: 0px;


}
