body {
	background-color: "#C0C0C0";
	font-family: verdana, trebuchet;
	color: 00000;
	text-align: left;
	font-size: 10pt;
	font-style: bold;
	text-decoration: none;
	border: 0;
	line-height: 12pt;
	list-style-type: circle;
}

.navigaatio {
	width: 542px;
	height:38px;
	position: absolute;
	text-align:left;
	margin-left:165px;
	margin-top:0px;
 }


#logo  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 120px;
  	height: 110px;
      background: url(images/logo.gif) no-repeat;
  	position: absolute;
      margin-top:13px;
	margin-left:588px;
 }

#SILMA  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 120px;
  	height: 120px;
      background: url(images/SILMA.gif) no-repeat;
  	position: absolute;
      margin-top:18px;
	margin-left:62px;
 }

#Ropeli  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Ropeli.gif) no-repeat;
  	position: absolute;
      margin-top:579px;
	margin-left:227px;
 }

#Tervetuloa-CMY  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Tervetuloa-CMY.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }



#R-alas-1  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/R-alas-1.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#G-alas-1  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/G-alas-1.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }
 
 #B-alas-1  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/B-alas-1.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 } 
#Katso-ristia  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Katso-ristia.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }
#Kaanteis-alas  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Kaanteis-alas.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#Aivokeskeinen  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Aivokeskeinen.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-yhdentekevaa  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-yhdentekevaa.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-varinmuodostus  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-varinmuodostus.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }


#INFO-additiivinen  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-additiivinen.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-optinen  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-optinen.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-subtra  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-subtra.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-rakenne  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-rakenne.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-varjot  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-varjot.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-kontrastit  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-kontrastit.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-EI-illuusio  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-EI-illuusio.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-sini {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-sini.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#INFO-puhreat  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-puhreat.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#menu  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 130px;
  	height: 28px;
  	position: absolute;
        margin-top:234px;
	margin-left:0px;
}
#menu span {
  display: none;
  position: absolute;
}

#menu a {
  display: block;
  text-indent: -900%;
  position: absolute;
  outline: none;
}

#menu a:hover {
  background-position: left bottom;
}
#menu a:hover span {
  display: block;
}

#menu a#selected, #menu a#selected:hover {
  background-position: left bottom;
}


#menu .alkuun {
  width: 60px;
  height: 21px;
  background: url(images/alkuun.jpg) no-repeat;
  left: 52px;
  top: -130px;
}

#menu .alkuun span {
  width: 68px;
  height: 23px;
  left: 50px;
  top: -140px;
}



#menu .E-alkuun { 
  width: 62x;
  height: 21px;
  background: url(images/E-alkuun.jpg) no-repeat;
  left: 65px;
  top: -129px;
}

#menu .E-alkuun span {
  width: 62px;
  height: 23px;
  left: 110px;
  top: -140px;
}


#menu .oppihistoriaa {
  width: 95px;
  height: 21px;  
  background: url(images/oppihistoriaa.jpg) no-repeat;
  left: 126px;
  top: -130px;
}

#menu .oppihistoriaa span {
  width: 69px;
  height: 23px;
  left: 104px;
  top: -140px;
}


#menu .E-oppihistoriaa { 
  width: 91px;
  height: 21px;  
  background: url(images/E-oppihistoriaa.jpg) no-repeat;
  left: 127px;
  top: -129px;
}

#menu .E-oppihistoriaa span {
  width: 91px;
  height: 23px;
  left: 104px;
  top: -140px;
}


#menu .E-animaatio {
  width: 90px;
  height: 20px;
  background: url(images/E-Jalkikuvat.jpg) no-repeat;
  left: 218px;
  top: -128px;
}

#menu .E-animaatio span {
  width: 90px;
  height: 23px;
  left: 253px;
  top: -160px;
}


#menu .animaatio {
  width: 78px;
  height: 21px;
  background: url(images/Jalkikuvat.jpg) no-repeat;
  left: 235px;
  top: -130px;
}

#menu .animaatio span {
  width: 78px;
  height: 19px;
  left: 183px;
  top: -140px;
}


#menu .luelisaa {
  width: 69px;
  height: 21px;
  background: url(images/luelisaa.jpg) no-repeat;
  left: 328px;
  top: -130px;
}
#menu .luelisaa span {
  width: 69px;
  height: 20px;
  left: 328px;
  top: -142px;
}


#menu .E-luelisaa {
  width: 62px;
  height: 20px;
  background: url(images/luelisaa.jpg) no-repeat;
  left: 320px;
  top: -128px;
}
#menu .E-luelisaa span {
  width: 62px;
  height: 20px;
  left: 380px;
  top: -142px;
}


#menu .E-yhteys {  
  width: 60px;
  height: 20px;
  background: url(images/E-yhteys.jpg) no-repeat;
  left: 392px;
  top: -128px;
}

#menu E-yhteys span {
  width: 60px;
  height: 19px;
  left: 390px;
  top: -130px;
}


#menu .yhteys {
  width: 69px;
  height: 21px;
  background: url(images/yhteys.jpg) no-repeat;
  left: 396px;
  top: -130px;
}

#menu .yhteys span {
  width: 69px;
  height: 19px;
  left: 300px;
  top: -130px;
}


#menu .engl { 
  width: 23px;
  height: 21px;
  background: url(images/englanti.jpg) no-repeat;
  left: 456px;
  top: -130px;
}

#menu .engl span {
  width: 26px;
  height: 19px;
  left: 450px;
  top: -130px;
}


#menu .facebook {
  width: 22px;
  height: 21px;
  background: url(images/FB-2.jpg) no-repeat;
  left: 486px;
  top: -130px;
}

#menu .facebook span {
  width: 22px;
  height: 21px;
  left: 482px;
  top: -130px;
}


#menu .varioppia {
  width: 93px;
  height: 21px;
  background: url(images/varioppia.jpg) no-repeat;
  left: 508px;
  top: -130px;
}
#menu .varioppia span {
  width: 93px;
  height: 19px;
  left: 100px;
  top: -140px;
}


#menu .E-varioppia { 
  width: 105px;
  height: 21px;
  background: url(images/E-varioppia.jpg) no-repeat;
  left: 510px;
  top: -129px;
}
#menu .E-varioppia span {
  width: 105px;
  height: 19px;
  left: 520px;
  top: -140px;
}


#menu .edelliseen {
  width: 174px;
  height: 20px;
  background: url(images/edelliseen.jpg) no-repeat;
  left: 64px;
  top: 321px;
}

#menu .edelliseen span {
  width: 68px;
  height: 23px;
  left: 174px;
  top: -140px;
}


#menu .luetama {
  width: 119px;
  height: 20px;
  background: url(images/luetama.jpg) no-repeat;
  left: 210px;
  top: 321px;
}

#menu .luetama span {
  width: 50px;
  height: 35px;
  left: 183px;
  top: -145px;
}

#menu .seuraavaan {
  width: 150px;
  height: 20px;
  background: url(images/seuraavaan.jpg) no-repeat;
  left: 329px;
  top: 321px;
}
#menu .seuraavaan span {
  width: 69px;
  height: 20px;
  left: 329px;
  top: -142px;
}


#menu .E-edelliseen {
  width: 174px;
  height: 20px;
  background: url(images/E-edelliseen.jpg) no-repeat;
  left: 64px;
  top: 321px;
}

#menu .E-edelliseen span {
  width: 68px;
  height: 23px;
  left: 174px;
  top: -140px;
}


#menu .E-luetama {
  width: 119px;
  height: 20px;
  background: url(images/E-luetama.jpg) no-repeat;
  left: 210px;
  top: 321px;
}

#menu .E-luetama span {
  width: 50px;
  height: 35px;
  left: 183px;
  top: -145px;
}

#menu .E-seuraavaan {
  width: 150px;
  height: 20px;
  background: url(images/E-seuraavaan.jpg) no-repeat;
  left: 329px;
  top: 321px;
}
#menu .E-seuraavaan span {
  width: 69px;
  height: 20px;
  left: 329px;
  top: -142px;
}


.navi-2 {
	width: 206px;
	height:422px;    
	position: absolute;
	text-align:left;
      background: url(images/RGB-navi.jpg) no-repeat;
	margin-left:11px;
	margin-top:126px; 
 }


#menu-2 a {
  display: block;
  text-indent: 0;
  position: absolute;
  outline: none;

}

#menu-2 a:hover {
  background-position: left bottom;

}

#menu-2 a:hover span {
  display: block;
}

#menu-2 .R {        
  width: 140px;
  height: 142px;  
  left: 55px;
  top: 14px;
}

#menu-2 .R span { 
  width: 140px;
  height: 142px;
  background: url(images/R-hiiri.jpg) no-repeat;
  left: 55px;
  top: 14px;
}

#menu-2 .R-paalla {        
  width: 200px;
  height: 142px;  
  background: url(images/R-paalla.jpg) no-repeat;
  left: 0px;
  top: 0px;
}

#menu-2 .G {          
  width: 140px;
  height: 134px;
  left: 55px;
  top: 148px;
}

#menu-2 .G span {
  width: 140px;
  height: 134px;
  background: url(images/G-hiiri.jpg) no-repeat; 
  left: 55px;
  top: 148px;
}

#menu-2 .G-paalla {          
  width: 200px;
  height: 134px;
  background: url(images/G-paalla.jpg) no-repeat;
  left: 0px;
  top: 145px;
}
       
#menu-2 .B {            
  width: 140px;
  height: 140px;
  left: 56px;
  top: 285px;
}

#menu-2 .B span {
  width: 150px;
  height: 140px;
  background: url(images/B-hiiri.jpg) no-repeat;
  left: 56px;
  top: 285px;
}

#menu-2 .B-paalla {            
  width: 200px;
  height: 140px;
  background: url(images/B-paalla.jpg) no-repeat;
  left: -1px;
  top: 279px;
}


.navi-3 {
	width: 153px;
	height:590px;    
	position: absolute;
	text-align:left;
      background: url(images/BANNERIT.jpg) no-repeat;
	margin-left:642px;
	margin-top:133px; 
 }

#menu-3 a {
  display: block;
  text-indent: 0;
  position: absolute;
  outline: none;

}



#menu-3 a:hover {
  background-position: left bottom;

}

#menu-3 a:hover span {
  display: block;
}
 
#menu-3 .BoD-BANN {
  width: 186px;
  height: 89px;
  left:   0px;
  top:   12px;
}

#menu-3 .BoD-BANN span {            
  width: 186px;
  height: 94px;
  background: url(images/BoD-BANNER.gif) no-repeat;
  left:   0px;
  top:   12px;
} 

#menu-3 .NOKIA {            
  width: 146px;
  height: 35px;
  left: 0px;
  top: 80px;
}

#menu-3 .NOKIA span {
  width: 146px;
  height: 35px;
  background: url(images/NOKIA.gif) no-repeat;
  left: 0px;
  top: 80px;
}
      
#menu-3 .PORI {            
  width: 146px;
  height: 35px;
  left: 0px;
  top: 120px;
}

#menu-3 .PORI span {
  width: 146px;
  height: 35px;
  background: url(images/PORI.gif) no-repeat;
  left: 0px;
  top: 120px;
}

#menu-3 .OPERA {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 157px;
}

#menu-3 .OPERA span {
  width: 146px;
  height: 40px;
  background: url(images/OPERA.gif) no-repeat;
  left: 0px;
  top: 157px;
}

#menu-3 .SEITA {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 195px;
}

#menu-3 .SEITA span {
  width: 146px;
  height: 40px;
  background: url(images/SEITA.gif) no-repeat;
  left: 0px;
  top: 195px;
}

#menu-3 .TEKNOS {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 235px;
}

#menu-3 .TEKNOS span {
  width: 146px;
  height: 40px;
  background: url(images/TEKNOS.gif) no-repeat;
  left: 0px;
  top: 235px;
}

#menu-3 .IITTALA {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 275px;
}

#menu-3 .IITTALA span {
  width: 146px;
  height: 40px;
  background: url(images/IITTALA.gif) no-repeat;
  left: 0px;
  top: 275px;
}


#menu-3 .MARIMEKKO {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 319px;
}

#menu-3 .MARIMEKKO span {
  width: 146px;
  height: 40px;
  background: url(images/MARIMEKKO.gif) no-repeat;
  left: 0px;
  top: 319px;
}


#menu-3 .SANTACLAUS {            
  width: 146px;
  height: 40px;
  left: 0px;
  top: 360px;
}

#menu-3 .SANTACLAUS span {
  width: 146px;
  height: 40px;
  background: url(images/SANTACLAUS.gif) no-repeat;
  left: 0px;
  top: 360px;
}

#menu-3 .ANGRYBIRDS {            
  width: 146px;
  height: 35px;
  left: 0px;
  top: 399px;
}

#menu-3 .ANGRYBIRDS span {
  width: 146px;
  height: 35px;
  background: url(images/ANGRYBIRDS.gif) no-repeat;
  left: 0px;
  top: 399px;
}

#menu-3 .YLIOPISTO {            
  width: 146px;
  height: 49px;
  left: 0px;
  top: 436px;
}

#menu-3 .YLIOPISTO span {
  width: 146px;
  height: 49px;
  background: url(images/YLIOPISTO.gif) no-repeat;
  left: 0px;
  top: 436px;
}


<!--

#keskus {
        width: 860px;    
	height: 652px;
        text-align:left;
        margin:auto;  
	background-image: url('images/pohja.jpg');
	background-repeat:no-repeat;
 }


#keskus-e-BOOK {
        width: 860px;    
	height: 652px;
        text-align:left;
        margin:auto;  
	background-image: url('images/pohja.jpg');
	background-repeat:no-repeat;
 }



#keskus-NOKIA {
        width: 860px;    
	height: 680px;
        text-align:left;
        margin:auto;  
	background-image: url('images/pohja.jpg');
	background-repeat:no-repeat;
 }


#keskus-IITTALA {
        width: 860px;    
	height: 680px;
        text-align:left;
        margin:auto;  
	background-image: url('images/pohja.jpg');
	background-repeat:no-repeat;
 }



#keskus-IITTALA {
        width: 860px;    
	height: 680px;
        text-align:left;
        margin:auto;  
	background-image: url('images/pohja.jpg');
	background-repeat:no-repeat;
 }


#keskus_2 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-1.jpg');
	background-repeat:no-repeat;
 }

#keskus_3 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-2.jpg');
	background-repeat:no-repeat;
 }

#keskus_4 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-3.jpg');
	background-repeat:no-repeat;
 }

#keskus_5 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-4.jpg');
	background-repeat:no-repeat;
 }

#keskus_6 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-4.jpg');
	background-repeat:no-repeat;
 }

#keskus_7 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-4.jpg');
	background-repeat:no-repeat;
 }

#keskus_8 {
	width: 854px;
	height: 580px;
	text-align:left;
	margin:auto;
	background-image: url('images/pohja-4.jpg');
	background-repeat:no-repeat;
 }

-->

<!--  **************************************  -->

ul
  {
  margin-left: 5px;
  padding-left: 1em;
  }
li
  {
  margin: 0;
  padding: 0;
  }

.sisalto_1{
	width: 386px;
	height: 398px;
	text-align:left;
	position:absolute;
	margin-left:240px;
	margin-top:144px;
	overflow: auto;
	padding-top: 0px;
	padding-right:9px; 
 }

.sisalto_2{
	width: 398px;
	height: 418px;
	text-align:left;
	position:absolute;
	margin-left:236px;
	margin-top:130px;
	overflow: auto;
	padding-top: 0px;
	padding-right: 14px;
}

.sisalto_3{
	width: 380px;
	height: 396px;
	text-align:left;
	position:absolute;
	margin-left:246px;
	margin-top:144px;
	overflow: auto;
	padding-top: 1px;
	padding-right: 6px;
 }
.sisalto_4{
	width: 376px;
	height: 396px;
	text-align:left;
	position:absolute;
	margin-left:256px;
	margin-top:130px;
	overflow: auto;
 }


.sisalto_5{
	width: 369px;
	height: 396px;
	text-align:left;
	position:absolute;
	margin-left:246px;
	margin-top:109px;
	overflow: auto;

 }


.sisalto_R_1{
	width: 400px;
	height: 396px;
	text-align:left;
     
	position:absolute;
	margin-left:233px;
	margin-top:144px;
	overflow: auto;
	padding-top: 0px;
	padding-right:18px; 
 }

.sisalto_R_2{
	width: 400px;
	height: 396px;
	text-align:left;
      background: url(images/Optinen_sekoitus-R.gif) no-repeat;
	position:absolute;
	margin-left:235px;
	margin-top:144px;
	overflow: auto;
	padding-top: 0px;
	padding-right:18px;
 }

.sisalto_G_1{
	width: 400px;
	height: 396px;
	text-align:left;
      background: url(images/kennot-G.gif) no-repeat;
	position:absolute;
	margin-left:233px;
	margin-top:104px;
	overflow: auto;

 }

.sisalto_G_2{
	width: 400px;
	height: 396px;
	text-align:left;
      background: url(images/Optinen_sekoitus-G.gif) no-repeat;
	position:absolute;
	margin-left:235px;
	margin-top:144px;
	overflow: auto;
	padding-top: 0px;
	padding-right:18px; 

 }

.sisalto_B_1{
	width: 400px;
	height: 396px;
	text-align:left;
	background: url(images/kennot_1-G.gif) no-repeat;
	position:absolute;
	margin-left:233px;
	margin-top:104px;
	overflow: auto;
	padding-top: 0px;
	padding-right:18px;
 
 }

.sisalto_B_2{
	width: 400px;
	height: 396px;
	text-align:left;
      background: url(images/Optinen_sekoitus-B.gif) no-repeat;
	position:absolute;
	margin-left:235px;
	margin-top:144px;
	overflow: auto;
	padding-top: 0px;
	padding-right:18px;

}



#INFO-1-alas  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/INFO-1-alas.jpg) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }

#animaatio-alas-1  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/animaatio-alas-1.jpg) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }



#Kirjan-kannesta  {
	list-style: none;
  	padding: 0;
  	margin: 0;
  	width: 443px;
  	height: 50px;
      background: url(images/Kirjan kannesta.gif) no-repeat;
  	position: absolute;
      margin-top:578px;
	margin-left:225px;
 }



p    {
	font-size: 10pt;
     }

p.two  {
	font-weight: 100;
	font-size: 10pt;
      }

A:link {font-family: verdana, trebuchet; text-decoration: none; color: #0000FF}

A:visited {font-family: verdana, trebuchet; text-decoration: none; color: #006600}


A:active {font-family: verdana, trebuchet; text-decoration: underline; color: #000099}

A:hover {font-family: verdana, trebuchet; text-decoration: underline; color: #000000}