/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 * kiy.css - mainframe :) tyylit näyttöasettelua varten
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

body {
  font-size: 10pt;
  margin: 1em 2em 1em 2em;
  color: black;
  background: azure url(/greysky.jpg) fixed;
  font-family: verdana, geneva, "bitstream vera sans", arial, helvetica, freesans, sans-serif;
  font-style: normal; 
  line-height: 1.3em;
  text-align: left;
}

H1, H2, H3, H4, H5 {
  color: #009; 
  line-height: 120%; 
  text-shadow: #ccf 1px 1px 3px;
}

H1, H2 { font-family: "bitstream vera serif", "times new roman", times, serif; }
H1 { text-align: center; }
H2 { font-style: italic; }

/* "LoVe/HAte" järjestys!!! */
A:link { color: #009 }
A:visited { color: #050 }
A:hover, A:focus, A:active { color: #F00}
/* microikonit linkeille */
/*a[href ^="http:"] { background: url(/qb/external.png) center right no-repeat; padding-right: 13px;}
a[href ^="http://kiy.fi/"], a[href ^="http://www.kiy.fi/"] { background: transparent; padding-right: 0px;}
a[href ^="https:"] { background: url(/qb/lock_icon.gif) center right no-repeat; padding-right: 16px;}
a[href ^="mailto:"] { background: url(/qb/mail_icon.gif) center right no-repeat; padding-right: 18px;}
*/
a[href $=".ogm"], a[href $=".OGM"], 
a[href $=".avi"], a[href $=".AVI"],
a[href $=".mpeg"], a[href $=".MPEG"], a[href $=".mpg"], a[href $=".MPG"],
a[href $=".wmv"], 
a[href $=".mp4"]
{ background: url("/qb/video.png") center right no-repeat; padding-right: 14px;}
a[href $=".xls"], a[href $=".XLS"]
{ background: url("/qb/excel.gif") center right no-repeat; padding-right: 14px;}
a[href $=".doc"], a[href $=".DOC"], a[href $=".rtf"], a[href $=".RTF"]
{ background: url("/qb/word.gif") center right no-repeat; padding-right: 17px;}
a[href $=".ppt"], a[href $=".PPT"]
{ background: url("/qb/powerpoint.gif") center right no-repeat; padding-right: 15px;}
a[href $=".pdf"], a[href $=".PDF"]
{ background: url("/qb/10px_acrobat.png") center right no-repeat; padding-right: 13px;}
a[href $=".txt"]
{ background: url("/qb/document.png") center right no-repeat; padding-right: 13px;}

/* IE & opera eivät näytä perivän fontin kokoa oikein */
table, code { font-size: 1em; }

th, td {
  empty-cells: show; /* reuna myös tyhjille ruuduille */
  padding: 0.1em 0.2em;
  vertical-align: top;
  text-align: left;
  line-height: 1.3em;
}

th { font-weight: bold; }

/* taulukohin liittyviä tyylejä*/
.shade { background-color: #EEE }

/*mm. tieto.htm */
.whtbox { background-color: white }
.heavy { font-weight: bold; }

dt {
  margin-top: 1em; /* hieman väliä edelliseen */
  font-weight: bold;
}

dd, ul, ol {
  display: block;
  margin-left: 6em;
  padding: 1px;
}

li, dt, dd {
  line-height: 1.3em;
}

li {
  margin-top: 0.2em; /* hieman väliä edelliseen */
  margin-bottom: 0;  /* ohitetaan operan oletusarvo */
  display: list-item;
}
ul {  
  list-style-type: disc;
}
/* ranskis */
/* ul li:before { content: "\b7  "; } */
ol.alpha, ol ol {  
  list-style-type: lower-alpha;
}

p.afang:first-letter {color: green; /*background: silver;*/ font-size: 200%;}

/* päävalikko */
.menu { margin: 1em; }
.menu .sfs {
  font-family: "comic sans ms", cursive;
  font-weight: bold;
  text-decoration: none;
  border-bottom: thin solid;
}
.menu hr, .menu p {
  margin-top: 4px;
  margin-bottom: 2px;
}
.menu a { display: block; }
.menu br { display: none; }

.hide { display: none }
p.center {text-align: center}
p.right {text-align: right}

img.pagetop { 
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* footer */
div.footer {
  font-size: x-small;
  width:100%;
  clear: both;
}
div.footer a img{
  border: none; 
}
div.footer a#print {
  background/* ei toimi jos ie 5 */: url(/qb/print_18b.gif) left center no-repeat;
  padding-left: 20px; 
}
div.footer a#palaute {
  background/* ei toimi jos ie 5 */: url(/qb/mail_18b.gif) left center no-repeat; 
  padding-left: 20px;
}
div.footer p.left{
  float: left;
  text-align: left;
  margin-top: 0;
  padding: 0 0 1em 0;
}
.updated {
  display: block; 
  text-align: right; 
  font-style: italic; 
  font-size: x-small
}
div.footer p.updated{
  float: right;
  margin-top: 0;
  padding: 0 0 1em 0;
}
.page {background:azure; border:solid thin gray; margin:0; padding:2em;}

/* ---------- sarakkeet ----------------------- */
div.cols {
  margin-left: 3em;
  clear: both;
  width: 100%;
  float: left;
  overflow: hidden;
  position: relative;
}
div.col2l, div.col2r {
  width: 50%;
  left: 0;
  float: left;
  overflow: hidden;
  position: relative;
}

/* ---------- galleria-jutut ----------------------- */
.gallery {
	list-style: none;
	margin: 0;
	padding: 0;
	clear:both;
}
.gallery li {
	padding: 10px;
	margin: 0;
	float: left;
	position: relative;
	width: auto; /*180px;*/
	height: auto; /*140px;*/
}
.gallery li:hover img {
	border-color: #000;
	background: #ffdb01;
}
.gallery img {
	background: #fff;
	border: solid 1px #888;
	padding: 5px;
}
.gallery em {
/*	background: #fff url(images/grey-gradient.gif) repeat-y;*/
	background: #fff;
	color: #000;
	opacity:0.7;
	font-style: normal;
	font-size: x-small;
	padding: 2px 10px;
	display: none;
/*	display: block;*/
	position: absolute;
	top: 20px;
	left: 20px;
	border: 1px solid #999;
	border-left-color: #888;
}
.gallery a {
	text-decoration: none;
}
.gallery li:hover em{
/*	background: #ffdb01 url(images/orange-gradient.gif) repeat-y;
	background: #ffdb01;
	border-color: #c25b08;*/
	display: block;
}