﻿
html {margin: 0; padding: 0; height: 100%;}

body {margin: 0; padding: 0; height: 100%; background: #ffffff; font-family: tahoma, Arial, Helvetica, sans-serif; font-size: 75%; color: #000000; text-align: left;}
/* ### vanha bgcolor #91BEF4 */

p {margin: 0 0 15px 0;}

h1 {font-size: 2em; font-weight: normal; margin: 0 0 15px 0;color: #5f5f5f;}
h2 {font-size: 1.5em; font-weight: normal; margin: 0 0 10px 0;color:#5f5f5f;}
h3 {font-size: 1.2em; font-weight: normal; margin: 0 0 5px 0;}
h4 {font-size: 1em; font-weight: bold; margin: 0 0 5px 0;}
h5 {font-size: 1.5em; font-weight: bold; margin: 0 0 5px 0; color:#5f5f5f;}


	h6 {
		font-size: 1em; font-weight: normal; 
		background: #f7f8f2 url(/images/le_cell_bg.jpg) left top repeat-x;  
		padding: 8px;
		border-left: 1px solid #cacaca; border-bottom: 1px solid #eaeaea;
		}

	h6	a {padding: 0 0 0 15px; margin: 0 0 5px 0; background: url(../images/linkbullet.gif) no-repeat 0 -18px;}

p, font, td {font-family: tahoma, Arial, Helvetica, sans-serif; font-size: 1.05em;}


/* color: #9E781D */
a {color: #005739; text-decoration: underline;}
a:hover {text-decoration: underline;}


hr {float: left; display: inline; clear: both; width: 100%; background: #cccccc; margin: 0 0 15px 0; border: #ffffff; height: 1px;}

ul {margin: 0 0 15px 0; padding: 0 0 0 20px;}

.ingress {font-size: 1.2em; line-height: 1.3em;}

.bulletlink, .bulletlinkrev {padding: 0 0 0 15px; margin: 0 0 5px 0; background: url(../images/linkbullet.gif) no-repeat 0 -18px; font-weight: bold; clear: right; color: #333333;}
.bulletlink:hover, .bulletlinkrev:hover {background-position: 0 -88px; text-decoration: none; color: #000000;}
.bulletlinkrev {background-image: url(../images/linkbulletrev.gif);}

.lightbulletlink {padding: 0 0 0 10px; font-weight: normal; background: url(../images/lightbullet.gif) no-repeat left 3px;}
 	* html .lightbulletlink {display: block; width: 50px; white-space: nowrap;}

.softhyphen {margin: 0 -3px 0 0;}

/* Separator header */
.separator {border-bottom: 1px solid #e9e9e9; margin: 20px 0 15px 0;}


/* @-character in e-mail links */
.miumau {margin: 0 0 -2px 0;padding: 0 5px 1px 1px;background: url(../images/miumau.gif) no-repeat 0 -8px;}
a:hover .miumau {background-position: 0 -50px;}

/* Active and inactive content */
.inactivecontent {display: block;}
.active .inactivecontent {display: none;}
.activecontent {display: none;}
.active .activecontent {display: block;}


/* Page elements */
#container {min-height: 800px; background-color: #ffffff;padding: 5px; position: relative; width: 960px; margin: 0px auto 0px auto; text-align: left;}
#pageheader {position: relative; width: 960px; height: 95px; overflow: hidden; padding: 0px; margin: 0px; background: url(../images/banneri.jpg) no-repeat 0 0px;}


#logo {position: absolute; left: 40px; top: 4px; float: none; border: none; margin: 0;}
#banner {display: block; border: none; margin-left: auto; margin-right: auto; margin-top: 4px;}
#flags {position: absolute; right: 10px; top: 50px; width: 100px; height: 20px;}
#flags img {margin-left: 3px;}

/* Main menu */
#mainmenu {background: #ffffff; position: relative; float: left; display: inline; width: 960px; height: 35px; list-style-type: none; margin: 0px; padding: 0px; font-size: 17px; text-transform: uppercase;}
#mainmenu li {float: left; display: inline; margin: 2px 0px 0 40px; text-align: center; height: 30px;}
#mainmenu a {display: block; padding: 6px 0 0 2px; color: #000000; outline: none; text-decoration: none; height: 28px; cursor: pointer; white-space: nowrap;}
	* html #mainmenu a {width: 10px;}
#mainmenu a:hover {text-decoration: none; color: #000000;}
#mainmenu a span {display: block; height: 30px; padding: 2px 5px 0 3px;}
	* html #mainmenu a span {height: 30px; he\ight: 30px;}
#mainmenu a:hover, #mainmenu li.active a {background: #005739; color: #ffffff;}
	
	

/* Sub menu */
.submenu {background: url(../images/sivuvalikkoBG.jpg) repeat-y; float: left; display: inline; list-style-type: none; margin: 0 0 30px 15px; padding: 0; font-size: 1em; width: 200px;
	padding-top: 30px; padding-bottom: 30px; Xmin-height: 230px;}
.submenu ul {margin: 0;}
.submenu li {float: left; display: inline; margin: 0 0 2px 0; clear: both; width: 100%;}
.submenu a {display: block; width: 100%; padding: 0; margin: 0; color: #000000; outline: none; cursor: pointer;text-decoration: none;}
.submenu a span {display: block; padding: 2px 0 2px 14px;  cursor: pointer;}
.submenu a.active, .submenu a:hover {color: #000000; text-decoration: none; background-color: #ebebeb; background-position: 0 -89px;  cursor: pointer;}
.submenu a.active span, .submenu a:hover span {background: url(../images/submenu_roundedbottom.gif) no-repeat left bottom; height: 100%;  cursor: pointer;}
.submenu a.open {background-position: 0 -159px; color: #000000;  cursor: pointer;}
.submenu a.open:hover {background-position: 0 -230px; color: #000000; background-color: #ebebeb; cursor: pointer;}

	/* Images in sub menu */
	.submenu a img {position: relative; border: 0; margin: -12px 5px 0 -20px; float: left; display: inline;}

	/* 2nd level */
	.submenu li ul {padding: 0; cursor: pointer;}
	.submenu li ul li {margin: 0;  padding-left: 8px; cursor: pointer;}
	.submenu li ul a {color: black; background-image: none; cursor: pointer;}
	.submenu li ul a.active, .submenu li ul a:hover {background: #ebebeb url(../images/submenu_roundedtop.gif) no-repeat left top; cursor: pointer;}

/* 3nd level */
	.submenu li ul li ul li {margin: 0; padding-left: 8px; cursor: pointer;}

/* 4nd level */
	.submenu li ul li ul li ul li {margin: 0; padding-left: 8px; cursor: pointer;}

/* 5nd level */
	.submenu li ul li ul li ul li ul li {margin: 0; padding-left: 8px; cursor: pointer;}



/* Page footer */
#pagefooter {position: relative; float: left; display: inline; height: 87px;
	background: url(/images/footerbg.jpg) no-repeat right top;
	margin: 0px 0px 2px 0px; 
	padding-top: 15px;
	clear: both; 
	width: 100%; 
	font-size: 0.90em; 
	color: #035642;
	}
#pagefooter div {float: left; margin: 2px 0 0 30px; width: 140px;}
#pagefooter .first {margin: 0;}
#pagefooter #contactlink {position: absolute; left: 663px; top: 0;}
#pagefooter #contactlink a {padding: 0 0 0 8px; background: url(../images/lightbullet.gif) no-repeat 0 2px; font-weight: bold;}
#pagefooter .miumau {background-image: url(../images/miumau_small.gif); padding-left: 0; margin:0;}

/* Gray box */
.graybox {background: #f1f1f1; xbackground: url(/images/sky_bg.jpg) no-repeat right top; margin: 0 0 30px 0;}
.graybox .header {width: 200px; height: 4px; overflow: hidden; background: url(../images/graybox_header.gif) no-repeat left top;}
.graybox .footer {width: 200px; height: 8px; overflow: hidden; background: url(../images/graybox_footer.gif) no-repeat left top;}
.graybox .content {padding: 2px 8px 8px 8px;}
.content .bulletlink {margin-bottom: 30px;}

	/* Content in boxes */
	.graybox h1 {font-size: 1em; font-weight: bold; margin: 0 0 15px 0; font-family: Arial, Helvetica, sans-serif;}
	.graybox img {border: 0; margin: 0 0 10px 0;}


/* Columns */
.col1 {float: left; display: inline; width: 200px; margin: 20px 30px 0 0;}
.col2 {float: left; display: inline; width: 200px; margin: 0 30px 0 0;}
.col3 {float: left; display: inline; width: 200px; margin: 0 30px 0 0;}
.col4 {float: left; display: inline; width: 200px; margin: 0; position: relative;}
.col1-4 {float: left; display: inline; width: 890px;background-color: #ffffff;}
.col1-3 {float: left; display: inline; width: 660px; margin: 0 30px 0 0;}
.col1-2 {float: left; display: inline; width: 430px; margin: 0 30px 0 0;}
.col2-3 {float: left; display: inline; width: 420px; margin: 0 30px 0 0px; min-height: 400px;position:relative;}
.col2-4 {float: left; display: inline; width: 700px; _width: 680px; margin: 0 0px 0 20px; min-height: 400px;position:relative;}
	* html .col2-3 {height: 400px;}

	/* Nested columns */
	.col2-3 .col1 {}
	.col2-3 .col2 {margin: 0;}


/* Forms */
form {margin: 0 0 15px 0; padding: 0; display: inline;}
form blockquote {margin: 0 0 0 143px;}
form br {clear: left;}

	/* Form labels */
	label {float: left; display: inline; text-align: right; width: 133px; padding: 4px 10px 0 0; overflow:hidden; font-weight: bold;}
		* html label {width: 143px; w\idth: 133px;}
	.rightsidelabel {text-align: left; padding-left: 5px; width: 244px;}
		* html .rightsidelabel {width: 250px; w\idth: 244px;}

	/* Form fields */
	input, textarea {float: left; display: inline; margin-bottom: 6px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; width: 253px; height: 13px; padding: 3px 2px 3px 2px; border: 1px solid #b2b2b2;}
		* html input, * html textarea {width: 279px; height: 21px; w\idth: 253px; he\ight: 13px;}
	textarea {height: 150px;}
		* html textarea {height: 56px;}
	select {float: left; display: inline; margin-bottom: 3px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; width: 253px; height: auto; padding: 0 0 0 2px; border: 1px solid #b2b2b2;}	
		html>body select {margin-top: 2px;}
	.checkbox, .radiobutton {width: auto; border: 0; padding: 0; margin: 2px 2px 0 0px;}
		* html .checkbox, * html .radiobutton {height: 20px; margin: 0;}

	.filefield {height: 20px;}
	
	.hidden {display: none;}

	.submitbtn {font-size: 1em; width: auto; height: 16px; white-space: nowrap; background: url(../images/linkbullet.gif) no-repeat 0 -18px; font-weight: bold; clear: both; color: #333333; padding: 0 0 0 15px; margin: 5px 0 15px 0; border: none; cursor: pointer;}
	.submitbtn:hover, * html .submitbtn.active {background-position: 0 -87px; text-decoration: none; color: #000000;}
		* html .submitbtn.active {background-position: 0 -88px;}


/* Search */
#search {position: relative; width: 450px; height: 50px;}
#searchform label {width: 27px; color: #5f5f5f; font-weight: normal; padding: 2px 0 0 0; text-align: left;}
#searchform input {border: 0px; position: absolute; left: 10px; top: 20px; float: none; width: 240px; background: url(/images/search_bg_rounded.gif) no-repeat; height: 14px; padding-left: 26px; padding-top:4px; padding-right: 6px;}
	* html #searchform input {width: 242px; w\idth: 230px;}
#searchform .submitbtn {float: none; position: absolute; left: 235px; top: 20px; width: 45px; height: 23px; padding: 0; margin: 0; background: url(../images/hakuBtn.gif) no-repeat 0 0px; color: #ffffff;}
#searchform .submitbtn:hover, * html #searchform .submitbtn.active {text-decoration: none; color: #cccccc;}


/* Page navigation */
.pagenavi {height: 20px; display: block; list-style-type: none; margin: 0 0 15px 0; padding: 0; clear: both; font-weight: bold;}
.pagenavi li {float: left; display: inline; margin: 0 1px 0 0;}
.pagenavi a {display: block; width: 20px; height: 18px; padding: 2px 0 0 0; text-align: center; text-decoration: none; color: #5c5c5c;}
	* html .pagenavi a {height: 20px; he\ight: 18px;}
.pagenavi a:hover, .pagenavi a.active {background: url(../images/pagenavi_selectedbg.gif) no-repeat 0 0; color: #000000; text-decoration: none; font-weight: bold;}
.pagenavi span {display: block; height: 18px; width: 20px; padding: 2px 10px 0 5px;}
	
	/* Previous & next buttons */
	.pagenavi .prev a {background: url(../images/pagenavi_left.gif) no-repeat center -20px;}
	.pagenavi .prev a:hover {background-position: center -62px;}
	.pagenavi .next a {background: url(../images/pagenavi_right.gif) no-repeat center -20px;}
	.pagenavi .next a:hover {background-position: center -60px;}
	.pagenavi .prev a.disabled, .pagenavi .prev a.disabled:hover, .pagenavi .next a.disabled, .pagenavi .next a.disabled:hover {background-position: center -100px;}

/* Tabs */
.tabs {list-style-type: none; margin: 0 0 15px 0; padding: 0; height: 17px; background: #e9e9e9 url(../images/tabsbg.gif) no-repeat left top;}
.tabs li {float: left; display: inline; margin: 0; padding: 0 0 0 0; height: 17px; border-right: 1px solid #ffffff; overflow: hidden;}
.tabs a, .tabs span {display: block; padding: 1px 7px 2px 7px; color: #5c5c5c;}
.tabs a.active, .tabs a:hover {background-color: #f8f8f8; color: #000000; text-decoration: none;}
.tabs span {color: #000000; font-weight: bold;}

/* Magnify-link */
.magnifylink {float: left; clear: both; display: inline; margin: 0 0 0 0; padding: 0 0 3px 17px; background: url(../images/magnify.gif) no-repeat 0 -20px; font-size: 0.92em; outline: none; color: #333333;}
.magnifylink:hover {background-position: 0 -53px; text-decoration: none; color: #000000;}



/* Teasers */
.teaser {float: left; display: inline; margin: 0px; margin-top: 10px; width: 231px;}
.teaser h3 {display: block; min-height: 20px; height: auto !important; height: 20px; width: 231px; padding: 20px 5px 3px 0px; 
	color: #000000; font-size: 1.3em; font-weight: normal;
	text-align: left;
	}
.teaser p {margin: 0 0 10px 0;}
.teaser img {float: left; display: inline; margin: 2px 8px 4px 0px !important; border: 0px solid #b2b2b2;  padding: 4px;}
.teaser table, .teaser td {display: inline; border: 0;}


/* Home page */	
	
	.homepage .col4 {float: right;}

	/* Main teaser */
	
	#mainteaser {float: left; display: inline; position: relative; width: 960px; margin: 0px; padding: 0px; font-size: 1.2em;}
		* html #mainteaser {width: 960px; w\idth: 945px;}
	#mainteaser img {float: none; display: inline; margin: 0px; border: none;}
	#mainteaser h1 {font-size: 1.6em; margin: 15px 0 15px 0; font-weight: normal;}
	

		
	/* Teasers */
	.teasers {position: relative; float: left; margin: 0px; margin-top: 10px; width: 960px; padding: 0 0 5px 0; overflow: hidden;}
	.homepage .teaser {float: left; display: inline; width: 240px; height: 100%; margin: 0 50px 0 40px;}
	.homepage .teaser a {color: black;}
	.homepage .teaser.first {margin-left: 0;}
	.homepage .teaser h1 {font-size: 1.2em; margin: 0 0 10px 0; font-weight: normal; width: 200px; padding: 0; background: none;}
	.homepage .teaser p {margin: 0 0 10px 0; color: #000000;}
	.homepage .teaser .bulletlink {position: absolute; bottom: 0; margin: 0;}
		
		/* Teaser headers on home page */
		.homepage .teasers .header {background: #e7e7e7 url(../images/teasers_header_bg.gif) no-repeat left top; overflow: hidden; padding: 0 0 5px 0; margin: 0 0 12px 0; width: 660px;}
		.homepage .teasers .header h1 {float: left; display: inline; width: 200px; margin: 2px 0 0 30px; padding: 0;}
		.homepage .teasers .header h1.first {width: 185px; margin-left: 15px;}
	
	/* News list */
	.newslist {list-style-type: none; margin: 0 0 15px 0; padding: 0;}
	.newslist li {margin: 0 0 8px 0;}

#esKirja {min-height: 120px; height: auto; width: 240px; float: left; padding: 0px 30px 0px 0px;}
#esKirjaImg {width: 100px; height: 100%; float: left;}
#esKirjaTxt {height: 100%; width: 100px; float: left; padding-top: 10px;}

.none {width: auto; border: 0px;}
.radio {float: none; margin: 0px; border: none; width: 20px;}
.Button {height: 25px; margin-right: 5px; float: none; padding: 3px; width: auto;}
input {margin-right: 3px;}

.openBlock {
	background: url(/_ACC/_components/treenet/icons/ball_glass_greenS.gif) no-repeat left top; 
	padding-left:18px;
	margin-bottom:5px;
}

.closedBlock {
	background: url(/_ACC/_components/treenet/icons/ball_glass_redS.gif) no-repeat left top; 
	padding-left:18px;
	margin-bottom:5px;	
}

/* END */
