/*
 * CSS
 * (c) Logium Oy
 */


/* leipäteksti */
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#666666; /*fontin väri*/
	line-height: 1.5; /*riviväli*/
	margin:0px 0px 0px 0px;
	padding:0px;
	/*seuraavat tehdään sen takia että saadaan sivut keskitettyä keskelle selainta*/
	margin:50px 0px; /*yläpuolelle vähän tilaa*/
	padding:0px; /* Need to set body margin and padding to get consistency between browsers. */
	text-align:center; /* Hack for IE5/Win */
}

/* normaalissa sisältötekstissä käytettävät linkit */
a:link {text-decoration:none; color:#f58025;} /*oranssi*/
a:visited {text-decoration:none; color:#f58025;} /*oranssi*/
a:active {text-decoration:none; color:#767E85;} 
a:hover{text-decoration:none; color:#f58025; text-decoration: underline;} /*alleviivattu oranssi*/

/* boldaus */
b {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight:bold;
}

/* ensimmäisen tason otsikko*/
h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight:bold;	
	color:black;
	margin-bottom: 5px;
}

/* toisen tason otsikko*/
h2 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight:normal;	
	color:black;
	line-height: 1.5;
	margin-bottom: 5px;
}

/* sivuhuomautus pienellä fonttikoolla*/
.smallfont {
	font-size: 9px;
}

/* center: tämän sisällä on kaikki sivujen elementit ja tämän avulla sisältö voidaan keskittää selaimen keskelle*/
#center {
	position: relative;
	width:780px; /*780 px on default leveys, joka toimii myös läppäreillä (=pienellä näytöllä)*/
	margin:0px auto; /* Right and left margin widths set to "auto"  - ei toimi jos käytetään tiettyjä spry efektejä!*/
	text-align:left; /* Counteract to IE5/Win Hack */
	padding:15px;
	z-index:0;
	overflow:visible;
}


/* Sisältö */
.container {
	width:460px;
	height:auto;
	position:absolute;
	top:210px;
	left:70px;
	z-index:5;
	overflow:visible;
}


/*Sivun yläosan grafiikka*/
.graphics {
	position: absolute;
	top:0px;
	left:15px;
	width:810px;
	height:320px;
	background: url(graphics.jpg) left top no-repeat;
	z-index:0;
	overflow:visible;
}

#footer {
	color:#ccc;
	text-align: right;
	line-height: 0.5;
}

/*tämä on kikka kolmonen, jolla saadaan headerikuva näkymään myös tulostettaessa*/
#title {                            
	letter-spacing: -10em;          
	font-size: 1pt;                  
/*	color: white; */
}

/* menupalkin sijainti */
.menu {
	position:absolute;
	top:0px;
	left:440px;
	width:500px; /*tämä pitää olla, koska muuten ei toimi oikein IE6:lla (säätää leveyksiä ja korkeuksia väärin)*/
	z-index:1000;
}
/* menupalkin ulkoasu*/
ul#menu { margin:0; padding:0; list-style-type:none; }
ul#menu li { position:relative; float:left; border-top:3px solid #efefef; margin-right: 5px; padding-right: 10px; padding-top: 5px;} /*palkit vaal. harmaita*/
ul#menu .current { border-top:3px solid #f58025;} /*oranssi palkki sen päällä missä ollaan*/
ul#menu li:hover { border-top:3px solid #f58025;} /*oranssi palkki hover*/
ul#menu li a { padding:2px 2px; text-decoration:none; font:bold 12px Verdana, Arial, Helvetica, sans-serif; color:#767E85;} /*tekstit harmaita*/
ul#menu li a:hover { color:black; border:none; } /*hover-tekstit mustia*/
ul#menu li span{ display:none; position:absolute; top:20px; left:2px; width:160px; font:normal 9px Verdana, Arial, Helvetica, sans-serif; line-height: 15px; }
ul#menu li a:hover span {margin-top: 14px; display:block; color: #f58025; background-color:white;} /*seliteteksti oranssilla*/


.black_links {
	position:relative;
	left:550px;
	top:60px;
	width:250px;
}
.black_links a:link {text-decoration:none; color:black;} /*musta*/
.black_links a:visited {text-decoration:none; color:black;}
.black_links a:active {text-decoration:none; color:#767E85;}
.black_links a:hover{text-decoration:none; color:#f58025;} /*oranssi*/


/* inforuutu = ruutu jossa yhteystiedot sekä linkit M2, Tiima ja Extranettiin */
.info_box {
	position:absolute;
	width:235px;
	z-index:10;
	top:0px;
	left:0px;
	background-color:white;
	border-color:#f58025;
	border-width: 2px;
	border-style: solid;
}
/* uutisruutu = täällä näkyy viimeisimmät uutiset */
.news_box {
	position:relative;
	width:235px;
	z-index:15;
	top:255px;
	left:0px; /*pitää korjata sijaintia hieman, koska 2px reunus*/
	overflow:visible;
	background-color:white;
	border-color:#f58025;
	border-width: 2px;
	border-style: solid;
}
/* info ruudun tekstin asemointi ja muotoilu*/
.info_box_text {
	text-align:left;
	vertical-align:middle;
	width:230px;
	height:100%;
	margin: 10px 0px 5px 10px;
	line-height: 1.5; /*riviväli*/
	font-size: 11px;
	color:black;
	z-index:15;
}
/* uutis ruudun tekstin asemointi ja muotoilu*/
.news_box_text {
	text-align:left;
	vertical-align:middle;
	width:230px;
	height:100%;
	margin: 10px 10px 10px 10px; /*marginaalit joka puolella*/
	line-height: 14px; /*riviväli*/
	font-size: 11px;
	z-index:15;
}

.news_box_text_highlight {
	font-size: 10px;
	font-style: bold;
}

/* kielivalikko */
.language_menu {
	position: absolute;
	bottom:-40px;
	right:0px;
	z-index:15000;
}



/* käytetään, jotta saadaan kuva asemoitua vasemmalle ja teksti kiertämään kuvaa*/
.picture {
	float:left;
	margin:0px 5px 0px 0px;
	padding:0px 5px 0px 0px;
	border:0px;
}
/* käytetään, jotta saadaan kuva asemoitua oikealle ja teksti kiertämään kuvaa*/
.picture_right {
	float:right;
	margin:0px 0px 0px 5px;
	padding:0px 0px 0px 0px;
	border:0px;
}

/* käytetään linkitettyjen kuvien yhteydessä poistamaan reunat*/
.link_img {
	margin:0px 0px 0px 0px;
	border:0px;
}

/* käytetään ikonien yhteydessä poistamaan reunat*/
.icon_img {
	margin:0px 0px 0px 0px;
	border:0px;
	float:left;
}

/* kuvan suurentaminen viemällä hiiri kuvan päälle*/
.thumbnail_1 span{
	position: absolute;
	padding: 10px;
	background-color:white;
	visibility: hidden;
	color: black;
	text-decoration: none;
}
.thumbnail_1 span img{ 
	border-width: 0;
	padding: 2px;
}
.thumbnail_1:hover span{
	visibility: visible;
	top: 25px;
	left: -5px; /*position where enlarged image should offset horizontally */
	z-index: 50;
}

/* kuvan suurentaminen viemällä hiiri kuvan päälle*/
.thumbnail_2 span{
	position: absolute;
	padding: 5px;
	background-color:white;
	visibility: hidden;
	color: black;
	text-decoration: none;
}
.thumbnail_2 span img{ 
	border-width: 0;
	padding: 2px;
}
.thumbnail_2:hover span{
	visibility: visible;
	top: 340px;
	left: 0px; /*position where enlarged image should offset horizontally */
	z-index: 50;
}