@charset "UTF-8";
/* CSS Document */

/*  Sticky Footer Solution by Steve Hatcher */

*
{
	margin: 0;
	padding: 0;
	font-size: 12px;
}

img {
	border: 0;
	}

/* must declare 0 margins on everything, also for main layout components use padding, not vertical margins (top and bottom) to add spacing, else those margins get added to total height  and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, div#wrap {
	height: 100%;
	text-align: center;
	
}

body.kunto {
	background-image: url(layout_images/kl_body_bg.gif);
	background-repeat: repeat-y;
	background-position: center;
	
}

body > div#wrap {
	width: 958px;
	height: auto;
	min-height: 100%;
	margin-left: auto;
	margin-right: auto;
}

div#kl_main {
	padding-bottom: 47px;  /* SAMA KUIN ALATUNNISTEEN (FOOTER) Korkeus!! */
	text-align: center;
	background-image: url(layout_images/kl_main_bg.gif);
	background-repeat: no-repeat;
}

/* ******* CLEARFIX ******* */

div.kl_clearfix:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div.kl_clearfix
{
	display: inline-block;
}

/* *** Hides from IE-mac \*** */
* html div.clearfix {
	height: 1%;
}

div.kl_clearfix {
	display: block;
}
/* *** End hide from IE-mac *** */

/* ************** HEADER ******************* */


div.kl_header {
	background-image: url(layout_images/kl_header_bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	height: 101px;
	width: 958px;
	border-bottom: 1px solid #ffffff;
	clear: both;
}

/* HEADER PIKKULINKIT  */

div.kl_header .yle {
	float: left;
	margin-top: 10px;
	margin-left: 10px;
	border-left: 1px solid #ffffff;
}

div.kl_header .yle a:link, div.kl_header .yle a:visited {
	color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	line-height: -2em;
	text-decoration: none;
	height: 20px;
	display: inline-block;
	padding-left: 8px;
	padding-right: 8px;
	float: left;
	border-right: 1px solid #ffffff;

}

div.kl_header .yle a:hover {
	color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-style: normal;
	font-weight: normal;
	line-height: -2em;
	text-decoration: underline;
	height: 20px;
	display: inline-block;
	padding-left: 8px;
	padding-right: 8px;
	float: left;
	border-right: 1px solid #ffffff;
}

/*** HEADER PAANAVI  ***/

div.kl_header .nav {
	float: left;
	clear: both;
	position: relative;
	top: 50px;
	left: 18px;
	}

div.kl_header .nav ul {
	width: 900px;
	}
	
div.kl_header .nav li {
	float: left;
	list-style-type: none;
	margin-left: 0px;
	margin-right: 25px;
	}

div.kl_header .nav ul li a:link, div.kl_header .nav ul li a:visited {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-style: normal;
	line-height: 0px;
	color: #8BC7F0;
	text-decoration: none;
	}

div.kl_header .nav ul li a:hover {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-style: normal;
	line-height: 0px;
	color: #ffffff;
	text-decoration: none;
	}
	
/*** HEADER PAANAVI SELECTED ***/

div.kl_header .nav li.selected {
	float: left;
	list-style-type: none;
	margin-left: 0px;
	margin-right: 25px;
	}

div.kl_header .nav ul li.selected a:link, div.kl_header .nav ul li.selected a:visited {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-style: normal;
	line-height: 0px;
	color: #BEFA00;
	text-decoration: none;
	}

div.kl_header .nav ul li.selected a:hover {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-style: normal;
	line-height: 0px;
	color: #BEFA00;
	text-decoration: none;
	}


/* ************* ELEMENTTIEN YLEINEN ASEMOINTI ************* */

div.kl_vasen {
	width: 215px;
	border-right: 1px solid #ffffff;
	float: left;
}

div.kl_tekstit {
	width: 520px;
	float: left;
	margin: 20px;
	margin-left: 40px;
	text-align: left;
	}

div.kl_oikea {
	width: 160px;
	float: right;
	clear: right;
	}
	

div.jakaja {
	clear: both;
	}
	
/* *** VASEN PALSTA NAV *** */

/* 2. valikkotaso perustila */
div.kl_vasen .nav2 {}

div.kl_vasen .nav2 ul {
	margin: 0px;
	padding: 0px;
	clear: both;
	}

div.kl_vasen .nav2 ul li {
	list-style-type: none;
	float: left;
	clear: both;
	border-bottom: 1px solid #ffffff;
	text-align: left;
	}

div.kl_vasen .nav2 ul li a:link, div.kl_vasen .nav2 ul li a:visited {
	display: inline-block;
	padding: 10px;
	padding-left: 30px;
	width: 175px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: normal;
	color: #666666;
	text-decoration: none;
	background-image: url(layout_images/kl_nav2_bg.gif);
	background-repeat: no-repeat;
	}

div.kl_vasen .nav2 ul li a:hover {
	display: inline-block;
	width: 175px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: normal;
	color: #34b4cf;
	text-decoration: none;
	background-image: url(layout_images/kl_nav2_bg.gif);
	background-repeat: no-repeat;
	}

/* 2.valikkotaso, kun jokin kohta on valittuna */

div.kl_vasen .nav2 ul li.selected {
	list-style-type: none;
	float: left;
	clear: both;
	border-bottom: 1px solid #ffffff;
	text-align: left;
	}

div.kl_vasen .nav2 ul li.selected a:link, div.kl_vasen .nav2 ul li.selected a:visited, div.kl_vasen .nav2 ul li.selected a:hover {
	display: inline-block;
	padding: 10px;
	padding-left: 30px;
	width: 175px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: normal;
	color: #34b4cf;
	text-decoration: none;
	background-image: url(layout_images/kl_nav2_bg_over.gif);
	background-repeat: no-repeat;
	}
	
/* *******VASEN PALSTA,KANAVA 1 ******* */

div.kanava1 {
	width: 215px;
	float: left;
	margin-bottom: 16px;
	visibility: hidden;
	}

div.kanava1 div.ots a:link, div.kanava1 div.ots a:visited  {
	background-color: #cc0000;
	float: left;
	width: 205px;
	text-align: middle;
	vertical-align: middle;
	padding: 5px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #ffffff;
	text-decoration: none;
	}

div.kanava1 div.ots a:hover {
	background-color: #ff0000;
	float: left;
	width: 205px;
	text-align: middle;
	vertical-align: middle;
	padding: 5px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #ffffff;
	text-decoration: none;
	}
	
div.kanava1 #uutinen {
	float: left;
	width: 205 px;
	margin: 5px;
	}

div.kanava1 #uutinen h1, div.kanava1 #uutinen h1 a:link, div.kanava1 #uutinen h1 a:visited {
	width: 205px;
	float: left;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	line-height: normal;
	font-style: normal;
	font-weight: bold;
	text-align: left;
	font-size: 1em;
	text-decoration: none;
	color: #282828;
	}


div.kanava1 #uutinen h1 a:hover {
	float: left;
	font-size: 1em;
	text-decoration: underline;
	color: #01a1c3;
	}
	
div.kanava1 #uutinen h6 {
	width: 195px;
	margin-top: 20px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	line-height: 1.2em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #282828;
	}


/* VASEN PALSTA, KANAVA 2 */

div.kanava2 {
	width: 215px;
	float: left;
	margin-bottom: 16px;
	visibility: hidden;
	}

div.kanava2 div.ots a:link, div.kanava2 div.ots a:visited  {
	background-color: #ccAD00;
	float: left;
	width: 205px;
	text-align: middle;
	vertical-align: middle;
	padding: 5px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #ffffff;
	text-decoration: none;
	}

div.kanava2 div.ots a:hover {
	background-color: #ffEE00;
	float: left;
	width: 205px;
	text-align: middle;
	vertical-align: middle;
	padding: 5px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	color: #ffffff;
	text-decoration: none;
	}
	
div.kanava2 #uutinen {
	float: left;
	width: 205 px;
	margin: 5px;
	}

div.kanava2 #uutinen h1, div.kanava2 #uutinen h1 a:link, div.kanava2 #uutinen h1 a:visited {
	width: 205px;
	float: left;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	line-height: normal;
	font-style: normal;
	font-weight: bold;
	text-align: left;
	font-size: 1em;
	text-decoration: none;
	color: #282828;
	}


div.kanava2 #uutinen h1 a:hover {
	float: left;
	font-size: 1em;
	text-decoration: underline;
	color: #01a1c3;
	}
	
div.kanava2 #uutinen h6 {
	width: 195px;
	margin-top: 20px;
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	line-height: 1.2em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #282828;
	}

/* ******** TEKSTIPALSTA ******** */


img, div.kl_tekstit img {
	border: 0px;
	margin-right: 1px;
	margin-bottom: 1px;
	padding: 0px;
	}

h1, div.kl_tekstit h1 {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	line-height: 1.8em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	font-size: 1.6em;
	text-decoration: none;
	color: #282828;
	}

h2, div.kl_tekstit h2 {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	line-height: 1.4em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	font-size: 1.2em;
	text-decoration: none;
	color: #282828;
	margin-top: 16px;
	}

h6, div.kl_tekstit h6 /*uutisen tai tiedotteen yms. ingressi!!*/ {
	font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	line-height: 1.2em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #666666;
	
	}

p, div.kl_tekstit p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #282828;
	margin-top: 16px;
	margin-left: 16px;
	}

a, .kl_tekstit a:link, .kl_tekstit a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #cc0000;
	text-decoration: underline;
	}

a:hover, .kl_tekstit a:hover, .kl_tekstit a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	color: #cc0000;
	text-decoration: none;
	}

.paiva, div.kl_tekstit .paiva {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	font-style: normal;
	line-height: 1.2em;
	color: #34b4cf;
	}

.sub1 a:link, .sub1 a:visited, .sub2 a:link, .sub2 a:visited, .sub3 a:link, .sub3 a:visited {
	color: #282828;
	text-decoration: none;
	}

.sub1 a:hover, .sub2 a:hover, .sub3 a:hover {
	color: #282828;
	text-decoration: underline;
	}



/* ******* OIKEA PALSTA ******* */

div.kl_oikea img {
	border-bottom: 1px solid #ffffff;
	}
	
/* ************* FOOTER ************* */

div#kl_footer {
	position: relative;
	margin-top: -47px; /* negative value of footer height. MUST be the equal value in div.main padding-bottom!! */
	margin-left: auto;
	margin-right: auto;
	height: 31px;
	width: 958;
	clear:both;
	text-align: center;
	background-image: url(layout_images/kl_footer_bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	color: #ffffff;
	padding-top: 16px;
}

div#kl_footer a:link,  div#kl_footer a:visited {
	color: #ffffff;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.9em;
	line-height: 0px;
	font-style: normal;
	font-weight: normal;
	padding-right: 10px;
	padding-left: 10px;
	text-decoration: none;
	position: relative;
	
}

div#kl_footer a:hover {
	color: #ffffff;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.9em;
	line-height: 0px;
	font-style: normal;
	font-weight: normal;
	padding-right: 10px;
	padding-left: 10px;
	text-decoration: underline;
}