body {
  font-family: helvetica, sans-serif;
  background-color: #EEE;
  background-image: none;
  margin: 0px;
  padding: 0px;
  height: 100%;
  color: #22408f;
}

A:link { color: #0000e4; text-decoration: none; }
A:visited { color: purple; text-decoration: none; }
A:hover { color: red; text-decoration: underline; }

P, LI, TD { font-size: 100%; }
H5 { font-size: 14px; font-family: helvetica, sans-serif; }
H4 { font-size: 16px; font-family: helvetica, sans-serif; }
H3 { font-size: 18px; font-family: helvetica, sans-serif; }

/* H1, H2, H3, H4, H5 { zmargin-bottom: 0px;  }*/

UL LI { margin-left: -12px; }
UL LI LI {
  margin-left: -20px;
  list-style-type: circle;
}

/* hr { width: 1px; color: #ddd;  } */
hr { width: 1px; color: #000;  } 

DIV { border: none; text-align: left; }

DIV#kokosivu { 
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
 /* max-width: 923px; */
  max-width: 1043px;
  height: 100%;
  z-index: 0; 
  background-color: white;
  visibility: visible;
}

/* ------------------------------------------------------------------------ */
/* Vasen puoli sivusta:		*/

DIV#vasen { position: absolute; left:0px; top:0px; width:183px;  z-index:1;
	overflow: visible; 
	height: 100%; background-color: white; 	
	background-color: #eee; visibility: visible; font-size: 12px; 
	/*background-image:  url("/grafiikka/vasentausta.gif");*/
        margin: 0px; }

#vasen INPUT { font-size: 11px; }

DIV#vasenylalinkit { height: 105px; background-color: #22408f;
	padding: 1px; color: white; font-size: 11px;}
#vasenylalinkit P { padding: 6px; margin: 0px;} 
#vasenylalinkit IMG { margin: 0px 4px 2px 0px; }
#vasenylalinkit A:link { color: white; text-decoration: none; }
#vasenylalinkit A:visited { color: white; text-decoration: none; }
#vasenylalinkit A:hover { color: yellow; text-decoration: none; }

/*
DIV#vasenalalinkit { background-image: url("/grafiikka/vasentausta.gif") }
*/
#vasenalalinkit P { padding: 6px; margin: 0px;}
#vasenalalinkit p { color: #22408f; }
#vasenalalinkit h4 { color: #22408f; text-align: center; margin-top: 5px; margin-bottom: 5px}
#vasenalalinkit h5 { color: #22408f; text-align: center; margin-top: 5px; margin-bottom: 5px; }
#vasenalalinkit a:link { color: #22408f; text-decoration: none }
#vasenalalinkit a:visited { color: #22408f; text-decoration: none }
#vasenalalinkit a:hover { color: #22408f; /*background-color: #bbb*/ }
#vasenalalinkit a:active { color: #ff0; text-decoration: none }

DIV#vasenruudut { height: 53px; background-color: #eee; padding: 0px; margin: 0px;}

/* Oma menutext menualueelle : */
DIV#menutext { position: absolute; margin-top: 0px; margin-left: 0px; 
	width: 183px; padding: 0; padding-top: 10px;
	/*background-image: url("/grafiikka/vasentausta.gif");*/
	font-size: 1.1em;
        font-family: sans-serif; }

#menutext ul { list-style-type:none; }
#menutext p { color: #22408f; font-size: 1.2em; 
              padding-left: 13px; padding-right: 13px; line-height: 1.2em }
#menutext li { color: #22408f; }
#menutext hr { margin-left: 13px; width: 150px; }
#menutext p.flag { font-size: 1.0em; margin-left: 13px; padding-right: 13px;}
#menutext img.flag { height: 17px; width: 28px; }
#menutext a:link { color: #22408f; text-decoration: none }
#menutext a:visited { color: #22408f; text-decoration: none }
#menutext a:hover { color: #22408f; background-color: #bbb }
#menutext a:active { color: #ff0; text-decoration: none }


DIV#vasenalaosoite { position:absolute; bottom:2px; left:5px; 
		width: 183px; padding-top: 10px; color: #999999; font-size: 11px; }

/* ---------------------------------------------------------------------------------------------- */
/* Oikea puoli sivusta:		*/

DIV#oikea { position: absolute; left:183px; top:0px; overflow: visible; 
	width: 100%; max-width:740px; background-color: white; 
	font-family: helvetica, sans-serif; 
	font-size: 90%; font-weight: bold; 
	background-color: #22408f; color: white;
	padding: 0px 0px 0px 0px; margin: 0px;
	width: 100%; max-width: 860px; z-index:2; 
	background-color: white; visibility: visible;}

#oikea P { margin: 4px 0px 8px 0px; }
#oikea H4 { margin: 4px 0px 8px 0px; }
#oikea H5 { margin: 4px 0px 8px 0px; }

DIV#logokentta { position: relative; left:0px; top:0px; 
  width: 100%; height: 80px; z-index:2; 
  /*background-image: url("/grafiikka/ylamosaiikki.gif");*/
  background-color: #FFFFFF; visibility: visible; background-repeat: no-repeat; 
  background-position: left; border: 1px none #000000; 
  font-family: helvetica, sans-serif; 
  color: #22408f; font-size: 20px;
}
#logokentta .center { text-align: center; }
#logokentta .full { width: 100%; }

DIV#otsikkopalkki { font-family: helvetica, sans-serif; 
  font-size: 16px; font-weight: bold; position: relative; left:0px; top:0px; 
  width: 100%; height: 20px; overflow: hidden; z-index:2; 
  background-color: #22408f; visibility: visible; 
  /* background-image:  url("/grafiikka/otsikkotausta.gif"); */
  background-repeat: repeat; border: 1px none #000000; padding: 5px 0px 0px 12px;
}

DIV#kuvakentta { position: relative; left:0px; top:0px; 
  width: 100%; height: 162px; z-index:2; 
  background-color: #fff; visibility: visible; background-repeat: no-repeat; 
  background-position: center;  padding: 0px; margin: 0px;
}


DIV#blankalue { position: relative; left:0px; top:0px; 
  font-family: helvetica, sans-serif; 
  font-size: 16px; font-weight: bold;  text-align: center; 
  width: 100%; height: 24px; z-index:2; 
  background-color: #fff; visibility: visible; background-repeat: no-repeat; 
  background-position: right;  padding: 0px; margin: 0px; 
  font-family: helvetica, sans-serif; color: #22408f;
}
#blankalue h1 { font-size: 16px; font-weight: bold; text-align: center; padding-left:10px; }
#blankalue p { font-size: 12px; text-align: center; padding-left:10px; }

DIV#leivanmurupolku {  position: relative; left:0px; top:0px;  
	height: 24px; z-index:2; background-color: #FFFFFF; visibility: visible;  
	border: 1px none #000000; padding: 2px 30px 0px 8px; 
	font-family: helvetica, sans-serif; font-size: 100%; font-weight: normal; 
	background-color: white; color: black; }

#leivanmurupolku P { border-bottom: 1px solid #aaa; padding-bottom: 3px; }


DIV#sisalto { position: relative; left:0px; top:0px; 
	width: 97%; z-index:2; 
	background-color: white; visibility: visible; border: 1px none #000000; 
	font-family: helvetica, sans-serif; font-weight: normal; color: black; margin-right: 20px; }

DIV#vasensisalto { position: relative; left:0px; top:0px; 
	width: 100%; z-index:2; 
	background-color: white; visibility: visible; overflow: auto;  padding: 4px 16px 4px 12px; 
	font-family: helvetica, sans-serif; color: #22408f}
 
DIV#oikeasisalto {position: absolute; left: 65%; top:0px;  z-index:2; 
	width: 35%; max-width:280px; height: 100%;
	visibility: visible; overflow: visible; padding: 4px 16px 4px 12px; 
	font-family: helvetica, sans-serif; font-size: 90%; color: #22408f}
#oikeasisalto .center {text-align: center; padding-right:20px } 

SPAN#hae1 { color: white; font-size: 12px; font-weight: bold; border: 1px solid white; 
	background-color: navy; margin: 8px 4px 4px 2px; padding: 2px; }

DIV#taustamosaiikki { position: absolute; left: 100%; top:0px; width:32px; height: 100%; 
	background-color: #CCC; background-color: #EEE; visibility: visible; z-index: 3; 
	/* background-image:   url("/grafiikka/taustat/harmaa1.gif"); */
	background-repeat: repeat; border: 1px none #000000; }

/* ---------------------------------------------------------------------------------------------- */
/* Tästä eteenpäin omat määrittelyt: */

DIV#etusivu { position: relative; left:0px; top:0px; width: 63%; max-width:460px; z-index:2; 
	visibility: visible; overflow: hidden;  padding: 4px 16px 4px 12px; 
	border-right: 1px solid #ddd;
	font-family: helvetica, sans-serif; color: #22408f}
	
#sisalto .center { text-align: center }
#sisalto .right { text-align: right }
#sisalto .left { text-align: left }
#sisalto .justify { text-align: justify}
#sisalto .top { vertical-align: top; }
#sisalto .framed { border: 1px solid }
#sisalto .full { width: 100% }
#sisalto .top { vertical-align: top }
#sisalto .middle { vertical-align: middle }
#sisalto .big { font-size: 130% }
#sisalto .large { font-size: 150% }
#sisalto .small { font-size: 80% }
#sisalto .error { color: red }
#sisalto .grey { color: #606060 }
#sisalto .centerred { text-align: center; color: red; }

#sisalto h1 h2 h3 h4 h5 h6 { font-weight: normal; margin-left: 10px; margin-top: 20px; }

/* THESE WERE ADDED FOR SEISMO SUBSITE 2020-01-13 */
#sisalto .seismo_header { font-size: 16px; font-weight: bold; text-align: center; }
#sisalto .seismo_station { font-size: 13px; font-weight: normal; text-align: center; }


#sisalto h1 { font-size: 130% }
#sisalto h2 { font-size: 110% }
#sisalto h3 { font-size: 100% }
#sisalto h4 { font-size: 90% }
#sisalto h5 { font-size: 80% }
#sisalto h6 { font-size: 76% }

#sisalto hr { width: 100%; color: #22408f }

#sisalto p { text-align: left; padding-left: 0px }
#sisalto em { font-size: 95%; font-weight: bold }

#sisalto p.note { border-style: double; text-align: justify; font-style: italic; margin-right:20px;
					padding-left: 10px; padding-right: 20px; padding-top: 3px; padding-bottom: 3px; }

#sisalto table { padding: 1px;  padding-left: 1px; border: 0; margin-left: auto; margin-right: auto;}
#sisalto table.data { padding: 1px;  border: 1px; border-style: solid; }
#sisalto table.asc { border: 1px; border-style: solid; padding: 3px;}
#sisalto table.scroll { padding: 1px;  border: 1px; border-style: solid; overflow: auto}

/*
 #sisalto tr { vertical-align: top; background-color: #ffffff; }
*/
#sisalto th.big { font-size: 150% }
#sisalto th.large { font-size: 120% }
#sisalto th.w30 { width: 30px; }
#sisalto th.w150 { width: 150px; }		
#sisalto th.w450 { width: 450px; }		
#sisalto th.data { border: 1px; border-style: solid; 
		text-align: center; vertical-align: bottom; font-size: 0.8em; }	

#sisalto td { text-align: left; vertical-align: middle; background-color: #ffffff; }
#sisalto td.small { font-size: 70% }
#sisalto td.w100 { width:100px; }
#sisalto td.w200 { width:200px; }
#sisalto td.w300 { width:300px; }
#sisalto td.w120right { width:120px; text-align: right; }
#sisalto td.w200right { width:200px; text-align: right; }
#sisalto td.data { border: 1px; border-style: solid;
		text-align: center; vertical-align: middle; }
#sisalto td.dataleft { border: 1px; border-style: solid; 
		text-align: left; vertical-align: middle; background-color: #ffffff; }
#sisalto td.topleft { vertical-align: top; padding-left: 0px; padding-right: 1em; }

#perustaulu td { vertical-align: top }

/* image määrittelyt */

#sisalto img.full { width: 100%; }
#sisalto img.half { width: 50%; }
#sisalto img.third { width: 30%; }

#sisalto img.ion1 { width: 640px; height: 410px; border-width: thin; border-style: solid; }
#sisalto img.ion2 { width: 420px; height: 545px; border-width: thin; border-style: solid; }

#sisalto img.mag1 { width: 607px; height: 412px; margin: 0.5em; padding: 0.5em; }
#sisalto img.mag2 { width: 610px; height: 426px; margin: 0.5em; padding: 0.5em; }
#sisalto img.mag3 { width: 800px; height: auto; margin: 0.5em; padding: 0.5em; }
	
#sisalto img.sky1 { width: 256px; height: 300px; margin: 0em; padding: 0em; }
#sisalto img.sky2 { width: 650px; height: 200px; margin: 0.5em; padding: 0.5em; }
#sisalto img.sky3 { width: 256px; height: 256px; margin: 0em; padding: 0em; }
#sisalto img.skyi { width: 500px; height: 500px; margin: 0em; padding: 0em; }

#sisalto img.ucl  { width: 439px; height: 448px; margin: 0.5em; padding: 0.5em; }
#sisalto img.ucl2 { width: 294px; height: 300px; margin: 0em; padding: 0em; }
	
#sisalto img.temp { width: 607px; height: 412px; margin: 0.5em; padding: 0.5em; }
#sisalto img.tomo { width: 200px; height: 300px; margin:0; }

#sisalto img.msk { width: 600px; height: 600px; margin:0; }
#sisalto img.vlf { width: 150px; height: 200px; margin:0; }

/* -- Submenu styles -- */

DIV#submenu { font-family: helvetica, sans-serif; 
	position: relative; left:0px; top:0px; 
	width: 99%; height: 22px; overflow: hidden; z-index:2; 
	background-color: #22408f; visibility: visible; 
	/*background-image:  url("/grafiikka/otsikkotausta.gif");*/
	background-repeat: repeat; border: 1px none #000000; padding: 5px 0px 0px 12px}
	
#submenu table { width: 100%; height: 100%; padding: 0; vertical-align: middle; margin-right: 20px;} 
#submenu th { font-size: 100%;  font-weight: bold; text-align: left; vertical-align: bottom; color: #fff;  }
#submenu td { font-size: 90%;  font-weight: bold; text-align: left; vertical-align: bottom; color: #fff;  }

#submenu a:link 	{ color: #fff; text-decoration: none }
#submenu a:visited 	{ color: #fff; text-decoration: none }
#submenu a:hover 	{ color: yellow; text-decoration: none}
#submenu a:active 	{ color: yellow; text-decoration: none }	

/* -- Bottommenu styles -- */

DIV#botttommenu { font-family: helvetica, sans-serif; 
	position: relative; left:0px; top:0px; 
	width: 100%; height: 22px; overflow: hidden; z-index:2; 
	background-color: #FFFFFF; visibility: visible; 
	background-image:  url("/grafiikka/otsikkotausta.gif"); 
	background-repeat: repeat; border: 1px none #000000; padding: 5px 0px 0px 12px}
	
#bottommenu table { width: 100%; height: 100%; padding: 0; vertical-align: middle} 
#botttommenu th { font-size: 100%;  font-weight: bold; text-align: left; vertical-align: bottom; color: #fff;  }
#botttommenu th { font-size: 90%;  font-weight: bold; text-align: left; vertical-align: bottom; color: #fff;  }

#botttommenu a:link 	{ color: #fff; text-decoration: none }
#botttommenu a:visited 	{ color: #fff; text-decoration: none }
#botttommenu a:hover 	{ color: yellow; text-decoration: none }
#botttommenu a:active 	{ color: yellow; text-decoration: none }

/* Trailer styles */

DIV#trailer { position:relative; padding-left:10px; padding-right:20px;
	width: 100%; font-family: helvetica, sans-serif; font-size: 0.7em; color: #22408f; }
#trailer hr { width: 100%; color: #22408f }
#trailer p.center { text-align: center }
#trailer p.right { text-align: right; padding-right: 25px; }

/* Outreach list styles */
#outreach p { text-align: justify; text-indent: -2em; margin-left: 2em; }
