/*
	* **********************************
	* Stylesheet for common webbrowsers
	* **********************************
*/

/* clears all the margins and paddings for elements, expect for tables */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,  caption { margin: 0;padding:0;}

/* clearfix */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

sup,sub {margin: 0px 0 0 -2px;}

body {
	font: 12px/1.5em arial, verdana, sans-serif;
	background: transparent url(/pics/esteeton/bg.jpg) repeat-x;
	font-family: arial, verdana, sans-serif;	
	}

	h1, h2, h3, h4, h5, h6, p { color: #000; }

	#skipToContent { display: none; }


/* Header   ----------------------------------------------    */

#wrapper { position: relative; width: 931px; margin: 0 auto;}
	#header { height: 184px; position: relative; width: 931px;margin: 0 auto; z-index: 100;}
	
	#logo {
		position: absolute;
		text-indent: -10000px;
		background: transparent url(/pics/esteeton/logo.gif) no-repeat;
		left: 26px;
		top: 29px;
		width: 159px;
		height: 16px;	
		z-index: 101;
		display: block; height: 16px; width: 159px; text-decoration: none;	
		z-index: 100000;
		}	
		
		#header h1 a {  }			
		
	 #selectLang {
		position: absolute;
		left: 19px;
		top: 150px;
		color: #1887C8;
		}	

		#selectLang a {
			color: #1887C8;
			font-weight: bold;
			font-size: 110%;
			margin-right: 7px;
			margin-left: 7px;			
			}
			
	#headerWrapper { position: absolute; top: 0px; left:0px; width: 931px; height: 184px;  z-index: 1000;}	
		#headerContainer { position: relative; width: 931px; height; 184px;}	
		#tools { position: absolute; width: 931px; height: 89px; left:0px; top: 50px; background:#1899d1  url(/pics/esteeton/header.jpg) 0px 0px no-repeat; }		
		#navigationHelp { position: absolute; right: 8px;top: 16px;}		
		#navigationHelp li {  list-style-type: none; display: inline; margin-left: 6px;}
			#navigationHelp a {  color: #fff; text-decoration: none; border-right: solid 1px #fff; padding-right: 6px;}
				#navigationHelp a:hover { text-decoration: underline; }
			#navigationHelp li#contact a { border: none; }	
		
		
	 #searchBox {
		position: absolute;
		right: 11px;
		top: 45px;
		text-align: right;
		}	
		
		#searchBox input { 
			border: solid 1px #348CC9; 
			font: normal normal 12px/12px tahoma,arial,verdana,sans-serif;	
			color: #737373;
			padding: 3px 0px;	
			width: 150px;	
			}
		
		#searchBox #SearchButton {
			background: transparent url(/pics/esteeton/submitButton.gif) no-repeat;
			color: #fff;
			width: auto;
			padding: 4px 10px;
			border: none;
			font-weight: bold;
			}
		
		#searchBox fieldset { border: none; }
		#searchBox legend { display: none; }
		
		
		
	 #resizeText {
		position: absolute;
		right: 13px;
		top: 145px;
		color: #737373;
		padding-right: 4.0em;
		font-size: 110%;
		font-weight: bold;
		}	
		
		#largerText, #smallerText {
			/* text-indent: -10000px; */
			display: block;
			position: absolute;
			top: 0px;
			float: left;
			height: 18px;
			width: 19px;
			text-align: center;
			color:#1d9cd6;
			font-size: 20px;
			cursor: pointer;
			}
		
		#largerText { background: transparent url(/pics/esteeton/changeTextSize.gif) top left no-repeat; right: 19px;}	
		#smallerText { background: transparent url(/pics/esteeton/changeTextSize.gif) no-repeat; right: 0px; }		
			#smallerText span { position: absolute; top:-2px; right: 5px;}
			
		#largerText:hover, #smallerText:hover { background-position: left bottom;}	
		 { background: transparent url(/pics/esteeton/smallerTextHover.gif) no-repeat; right: 0px;}		
			
/* Navigation  -------------------------------------------    */		
		
#nav {
	position: absolute;
	top: 22px;
	right: 23px;
	}		
	
	#nav ul { list-style-type: none; }
	
	#nav li { padding-left: 4px; float: left;}	
		
	#nav a {
		display: block;
		padding: 7px 15px 4px 15px;
		color: #fff;
		text-decoration: none;
		font-size: 110%;
		font-weight: bold;
		background: #277EB6;
		}	

	#nav li#tieto-osio { background: #90b600 url(/pics/esteeton/li-tieto-osio.gif) top left no-repeat; } 	
	#nav li#ajankohtaista { background: #923968 url(/pics/esteeton/li-ajankohtaista.gif) top left no-repeat; }
	#nav li#toimijaverkosto { background: #4c7f5e url(/pics/esteeton/li-toimijaverkosto.gif) top left no-repeat; }
	#nav li#esteettomyysprojektit { background: #157ba3 url(/pics/esteeton/li-esteettomyysprojekti.gif) top left no-repeat; }
	#nav li#eske { background: #df9236 url(/pics/esteeton/li-vyp.gif) top left no-repeat; }
	#nav li#linkit { background: #d12a00 url(/pics/esteeton/li-linkit.gif) top left no-repeat; }					
		
		
	#nav li#tieto-osio a { background: #90b600 url(/pics/esteeton/li-tieto-osio.gif) top right no-repeat; } 	
	#nav li#ajankohtaista a { background: #923968 url(/pics/esteeton/li-ajankohtaista.gif) top right no-repeat; }
	#nav li#toimijaverkosto a { background: #4c7f5e url(/pics/esteeton/li-toimijaverkosto.gif) top right no-repeat; }
	#nav li#esteettomyysprojektit a { background: #157ba3 url(/pics/esteeton/li-esteettomyysprojekti.gif) top right no-repeat; }
	#nav li#eske a { background: #df9236 url(/pics/esteeton/li-vyp.gif) top right no-repeat; }
	#nav li#linkit a { background:  #d12a00 url(/pics/esteeton/li-linkit.gif) top right no-repeat; }									
		
	#nav a:hover { text-decoration: underline; }	
		
/* Frontpage ---------------------------------------------    */

#container {
	position: relative;
	width: 931px;
	margin: 0 auto;
	}		
		
	#quickLinks {
		float: left;
		width: 225px;		
		}
		
		#quickLinks ul { list-style-type: none; margin-bottom: 20px;}
		
		#quickLinks li a {
			display: block;
			background: #F3F9FD;
			padding: 15px 25px;
			margin-bottom: 5px;
			color: #7F7F7F;
			text-decoration: none;
			height: 1%;
			line-height: 110%;
			border-bottom: solid 1px #fff;
			}
			
			#quickLinks a strong {
				font-family: tahoma;
				font-size: 125%;
				display: block;
				margin-bottom: 11px;
				}
			
		#quickLinks li a:hover { color: #1888C9; border-bottom: solid 1px #1888c9; }
		
		#quickLinks img { margin: 12px 0px 20px 8px; border: none;}
		
	
	#introduction {
		float: left;
		width: 436px;
		padding: 0px 18px;
		}
		
		#introduction h2 {
			font: normal bold 125% tahoma;		
			color: #1887C8;
			}
			
		#introduction p {
			font-size: 110%;
			line-height: 1.4em;
			margin: 10px 0px;
			}	
		
		#introduction a { color: #1A92D9; text-decoration: underline; }
		
	#currentNews {
		float: left;
		width: 225px;
		}			
		
		#currentNews h3 {
			color: #F47834;
			font: normal bold 125% tahoma;
			background: transparent url(/pics/esteeton/currentNews-h2.gif) bottom right no-repeat;
			padding-bottom: 13px;
			}
			
		#currentNews p { line-height: 120%; margin: 0px 0px 15px 0px;}	
		
		#currentNews .message { margin-bottom: 20px; }
		
		#currentNews a {
			color: #2190D2;
			margin: 8px 0px 15px 0px;
			font-size: 115%;
			font-weight: bold;
			text-decoration: none;
			}
			
		#currentNews a:hover { text-decoration: underline; }	
		
		
/* Subpage   ---------------------------------------------    */

#subNavigation {
	width: 225px;
	padding-left: 0px;
	float: right;
	}		
	
	#subNavigation #quickLinks { width: auto; }

	#subnav h3 {
		border: solid 1px; 
		background: #ccc;
		color: #fff;
		padding: 5px 5px 7px 22px;
		margin-top: 8px;
		background: #7EA800 url(/pics/esteeton/nav-title-tieto-osio.gif) no-repeat;
		font: normal bold 115% tahoma,arial,verdana,sans-serif;
		word-wrap: break-word;
		}

	#subnav ul { list-style-type: none; margin: 10px 0px 35px 0px;}

	#subnav li { background: transparent url(/pics/esteeton/li-li-tieto-osio.gif) 10px 6px no-repeat; }

	#subnav li a {
		font-weight: bold;
		color: #737373;
		font-size: 110%;
		border-bottom: solid 1px #D0D0D0;
		display: block;
		text-decoration: none;
		padding: 6px 10px 4px 28px;		
		height: 1%;
		}
		
		#subnav li li a { color: #000; }
		
		#subnav ul ul { margin: 5px 0; }
		#subnav ul ul ul { margin: 5px 0px 5px 10px; }
		
		#subnav li li { background: none; }
		
		#subnav li li a {
			font-weight: normal;
			border: none;
			padding: 3px 10px 3px 28px;
			}

		#subnav li a:hover { border-bottom: solid 1px #969696; }
		#subnav li li a:hover { border: none; color: #000;}


	#columncontent-wide, #columncontent { 
		float: right; 
		width: 665px;
		margin-left: 15px;
		margin-bottom: 25px;
		}
		
		#columncontent { float: left; width: 480px; }
		#column { float: left; width: 200px; overflow: hidden; }
		
		#content{ width: 680px; float: left; padding: 10px;}
		#content h2 { padding: 0px 0px 10px 0px; }
		#content ul { margin: 5px 0px 5px 2em; }
		
		#columncontent-wide h2, #columncontent h2 { padding: 0px 10px 10px 10px; }
		
		#columncontent-wide ul, #columncontent ul { margin: 0px 0px 0px 30px; }
		#columncontent-wide ol, #columncontent ol { margin: 0px 0px 0px 30px; }		
		
	#columncontent-wide h2.title, #columncontent h2.title, #column h2.taustavari {
		font: normal normal 210% tahoma,arial,verdana,sans-serif;
		background: transparent url(/pics/esteeton/title-tieto-osio.gif) bottom right no-repeat;
		padding: 0px 10px 16px 10px;
		margin-bottom: 10px;
		}
	
	#contentwrapper {float:right; width:706px;}
	
	#contentwrapper h3, #column h3 {
		font: normal bold 130% tahoma,arial,verdana,sans-serif;
		margin: 8px 10px;
		}	
		
	#contentwrapper p {
		font-size: 110%;
		margin: 8px 10px;
		}	
		
	#column p { margin: 8px 10px; }	
		
		

	p.taustavari {
		background: #F4F9FC;
		border: solid 1px #D0E2EF;
		padding: 10px;
		}		
		
	blockquote { margin-left: 20px; }	
		
#topOfPage {
	display: block;
	float: left;
	width: 100%;
	background: transparent url(/pics/esteeton/topOfPage.gif) 50% 0% no-repeat;
	text-align: center;
	font: normal bold 110% tahoma,arial,verdana,sans-serif;
	color: #54AADC;
	padding-top: 10px;
	text-decoration: none;
	margin-bottom: 10px;
	}
	
	#topOfPage:hover { 	background: transparent url(/pics/esteeton/topOfPageHover.gif) 50% 0% no-repeat;}		
		
/* Footer   ----------------------------------------------    */
		
#footer {
	position: relative;
	width: 931px;
	margin: 10px auto;	
	clear: both;
	border-top: solid 2px #1D9FED;
	font-size: 110%;
	padding-top: 5px;
	padding-bottom: 30px;
	}	
		
	#footer p { float: left; padding-left: 10px;}	
	
	#footer address { 
		float: right; 
		padding-right: 10px;
		color: #666;
		font-style: normal;
		}			
	
	#footer a { color: #1887C8 }	
	#footer hr { display: none; }
	
	
/* Sitemap ------------------------------------------------- */

#sitemap { padding-bottom: 30px; padding-top: 10px; float: left; width: 620px;}

#sitemap h2 {
	font: normal normal 210% tahoma,arial,verdana,sans-serif;
	background: transparent url(/pics/esteeton/title-tieto-osio.gif) bottom right no-repeat;
	padding: 0px 10px 16px 10px;
	margin-bottom: 10px;
	}

#sitemap div.col {
	float: left;
	width: 100%;
	margin: 0px 5px 0px 4px;
	}
	
#sitemap a { font-size: 12px; color: #1A92D9; }	

#sitemap ul { background: #fff; margin: 0; padding: 0; }

#sitemap li { 
	list-style-type: none;
	background: #F9F9F9;
	border: solid 1px #DEDEDE;
	margin: 0px 0px 10px 0px;
	padding: 5px;
	}

#sitemap ul ul { padding: 10px 0px 20px 5px; }
#sitemap ul ul ul { margin: 0px; padding: 0px; margin: 0px 0px 5px 0px;}

#sitemap li li { 
	padding: 0;
	background: #fff;
	border: none;
	margin: 10px 0px 0px 0px;
	}
#sitemap li li li { margin: 0px 0px 0px 8px; padding: 2px 0px 2px 0px; }
#sitemap li li li li { margin: 0px 0px 0px 15px; }

#sitemap li a { font-weight: bold; font-size: 14px;}
#sitemap li li a { font: normal bold 12px arial,verdana,helvetica;}
#sitemap li li li a { font: normal normal 11px arial,verdana,helvetica; }


/* Bulletin --------------------------------------------- */

#bm {
	float: left; 
	width: 610px;
	margin-left: 15px;
	margin-bottom: 25px;	
	}

#bm #msg h4, #bm h2 {
	font: normal normal 210% tahoma,arial,verdana,sans-serif;
	background: transparent url(/pics/esteeton/title-ajankohtaista.gif) bottom right no-repeat;
	padding: 0px 10px 16px 10px;
	margin-bottom: 10px;
	color: #832C58;
	}
	
#list ul { list-style-type: none; margin-left: 10px; }
#list a { font-weight: bold; color: #993366; font-size: 110%; text-decoration: none;}
#list span { display: block; }
	
#msg p { margin-left: 10px; }	
	
/* NaviPath --------------------------------------------- */

#naviPath {
	position: relative;
	top: -10px;
	margin-left: 10px;
	font: normal normal 110% tahoma,arial,verdana,sans-serif;	
	}	
	
	#naviPath p, #naviPath a { color: #729A3F; }
	#naviPath a { font-weight: bold; text-decoration: none;}
	#naviPath a:hover { text-decoration: underline; }