@charset "ISO-8859-1";

body, html {
	margin: 0; 
	padding: 0;
	font-family: arial, verdana, times new roman;
}

html {
	min-height: 100%;
	height: auto;
}

body {
	font-size: 62.5%;
	background: #bed700 url(../images/bg_body_green.gif) no-repeat bottom left;
	color: #343434;
}

h4 {
	font-weight: normal;
	font-size: 1.1em;
	margin: 5px 0 10px;
	color: #000000;
}

#pageWrapper {
	background: transparent url(../images/bg_head.gif) repeat-x top left;
	min-width: 1024px;
}

#utilNavi {
	float: right;
	position: relative;
	height: 43px;
	background: transparent url(../images/bg_utilnav_green.gif) repeat-x top left;
	font-size: 1.1em;
	color: #333333;
	width: 170px;
}

	#utilNavi .padding {
		padding: 12px 24px 0 10px;
	}

	#utilNavi img {
		float: left;
		padding-right: 10px;
	}
	
#utilWeather {
	float: right;
	position: relative;
	height: 43px;
}

	#utilWeather .padding {
		padding: 5px 0 0;
	}
	
	#utilWeather p {
		margin: 6px 0;
	}	
	#utilWeather span {
		font-size: 1.1em;
		float: left;
		padding-top: 7px;
	}

#utilNaviLinks {
	float: right;
	position: relative;
	height: 43px;
	background: transparent url(../images/bg_utilnav_green.gif) repeat-x top left;
}

	#utilNaviLinks .padding {
		padding: 12px 6px 0;
	}

	#utilNaviLinks a {
		padding: 0 4px;
		font-size: 1.1em;
		color: #333333;
	}

	#utilNaviLinks p {
		margin: 6px 0;
	}

#searchContainer {
	float: right;
	position: relative;
	height: 43px;
	background: #ffffff url(../images/bg_utilnav_left_green.gif) no-repeat top right;
	/*width: 210px;*/
}

	#searchContainer .padding {
		padding: 15px 21px 0;
	}
		
	#searchContainer input {
		float: right;
		position: relative;
		padding-left: 7px;
	}
	
	#searchContainer #q {
		border: none;
		padding: 5px 25px 5px;
		background: #ffffff url(../images/bg_searchbox.gif) no-repeat top left;
		width: 91px;
		font-size: 0.9em;
	}
	
	#searchContainer #q:focus {
		outline: 0;
	}
	
	#searchContainer form {
		float: right;
		position: relative;
		/*width: 185px;*/
	}
	
#pageHeader {
	float: left;
	position: relative;
	height: 99px;
	width: 100%;
}

	#logo {
		position: absolute;
		left: 0;
		top: 0;
	}
	
	#pageHeader .header {
		float: left;
		position: absolute;
		height: 99px;
		width: 100%;
		right: 0;
	}
	
	#pageHeader .headerTop {
		float: right;
		position: relative;
		height: 67px;
	}
	
	#pageHeader .headerBottom {
		float: left;
		position: relative;
		height: 32px;
		width: 100%;
	}
	
#topNavi {
	float: left;
	position: relative;
	margin-left: 266px;
}
	
	#topNavi ul {
		float: left;
		position: relative;
		margin: 0;
		padding: 0;
		padding-right: 2px;
		background: transparent url(../images/bg_navi.gif) no-repeat top right;
		
	}
		
	#topNavi li {
		float: left;
		position: relative;
		list-style-type: none;
		height: 32px;
		overflow: hidden;
	}

	#topNavi a {
		float: left;
		position: relative;
		height: 32px;
		padding: 9px 8px;
		background: transparent url(../images/bg_navi.gif) no-repeat top left;
		font-size: 1.2em;
		color:#333333;
		text-decoration: none;
	}

#topNavi a:hover, #topNavi a.menu-current, #topNavi a.menu-parent {
	background: transparent url(../images/bg_navi_active.gif) no-repeat top left;
}
	
#mainWrapper {
	background: transparent url(../images/bg_main_gradient_green.gif) repeat-x top left;
}	

#mainContent {
	background: transparent url(../images/bg_main_green.gif) no-repeat top left;
	min-height: 105px;
	width: 1024px;
}

	#mainContent .padding{
		padding: 22px 0 22px 12px;
	}

#threeColsWrapper {
	background: transparent url(../images/bg_three_cols.gif) repeat-y top left;
	float: left;
	position: relative;
}

#threeColsEnd {
	background: transparent url(../images/bg_three_cols_end.gif) no-repeat top left;
	height: 5px;
	float: left;
	position: relative;
	width: 100%;
}

#twoColsWrapper {
	background: transparent url(../images/bg_two_cols.gif) repeat-y top left;
	float: left;
	position: relative;
	width: 1017px;
}

#eventsWrapper{
	background: transparent url(../images/bg_events.gif) repeat-y top left;
	float: left;
	position: relative;
	width: 999px;
}

#twoColsEnd {
	background: transparent url(../images/bg_two_cols_end.gif) no-repeat top left;
	height: 5px;
	float: left;
	position: relative;
	width: 1017px;
}

#eventsTop {
	background: transparent url(../images/bg_events_top_green.gif) no-repeat top left;
	height: 5px;
	float: left;
	position: relative;
	width: 100%;
}

#eventsEnd {
	background: transparent url(../images/bg_events_bottom_green.gif) no-repeat top left;
	height: 5px;
	float: left;
	position: relative;
	width: 100%;
}

#footerLeft {
	float: left;
	position: relative;
	padding: 14px 4px 14px 140px;
	font-size: 0.9em;
	background: transparent url(../images/kaupungin_logo.png) no-repeat center left;
	margin-left: 3px;
}

#footerRight {
	float: right;
	position: relative;
	padding: 14px 4px;
	font-size: 0.9em;
}

#footerLeft a, #footerRight a {
	color: #333333;
}

#mainContent .sideBar {
	float: left;
	position: relative;
	width: 223px;
	font-size: 1.1em;
}

	#mainContent .sideBar .padding {
		float: left;
		position: relative;
		padding: 8px 20px;
	}

	#mainContent .sideBar .paddingNavi {
		float: left;
		position: relative;
		padding: 0px 12px 10px;
	}

	#mainContent .sideBar .paddingNoTop {
		float: left;
		position: relative;
		padding: 0px 11px 0 20px;
	}

	#mainContent .sideBar span {
		color: #484d98;
	}

	#mainContent .sideBar a {
		color: #484d98;
		font-weight: bold;
	}

	#mainContent .sideBar img.right {
		float: right;
		position: relative;
	}
	
	#mainContent .sideBar p {
		margin: 6px 0;
	}	
	
	#mainContent .sideBar p.list {
		line-height: 1.5em;
		width: 193px;
	}
	
	#mainContent .sideBar .paddingNoTop a {
		font-weight: normal;
	}
	
#fontSize {
	float: right;
	position: relative;
}

#fontSize p {
	float: left;
	position: relative;
	margin: 0;
	font-size: 1.1em;
}

#fontSize img {
	float: left;
	position: relative;
}

#fontSize .fontButtons {
	float: left;
	position: relative;
	padding: 0 27px 0 7px;
	
}

.sideBarTopFirst {
	float: left;
	position: relative;
	width: 223px;
	height: 9px;
	background: transparent url(../images/bg_sidebar_top_first_green.gif) no-repeat top left;
}

.sideBarTop {
	float: left;
	position: relative;
	width: 223px;
	height: 9px;
	background: transparent url(../images/bg_sidebar_top_green.gif) no-repeat top left;
}

.sideBarEnd {
	float: left;
	position: relative;
	width: 223px;
	height: 9px;
	background: transparent url(../images/bg_sidebar_end_green.gif) no-repeat top left;
	overflow: hidden;
}

.sideBarHeading {
	float: left;
	position: relative;
	width: 223px;
	background: transparent url(../images/bg_sidebar_heading.gif) no-repeat bottom left;
}

.sideBarHeadingNavi {
	float: left;
	position: relative;
	width: 223px;
}

.sideBarImage {
	padding: 0 1px 12px;
}

.sideBarImageLeft {
	padding: 10px 1px 5px;
	float: left;
}

	#mainContent .sideBar .sideBarImage p {
		margin: 0;
		padding: 0;
	}

	.sideBarHeading h2 {
		font-size: 1.4em;
		color: #484d98;
		margin: 0;
		padding: 0 20px 7px;
	}

	.sideBarHeadingNavi h2 {
		font-size: 1.4em;
		color: #707070;
		margin: 0;
		padding: 1px 15px 5px;
	}

	.sideBarHeading h3 {
		font-size: 1.2em;
		color: #484d98;
		margin: 0;
		padding: 0 15px 13px;
	}

#frontMain {
	float: left;
	position: relative;
	width: 563px;
}

	#frontMain .padding {
		padding: 0 20px 0 11px;
	}

	#frontMain img.right {
		float: right;
		position: relative;
		padding-left: 10px;
		
		position: absolute;
		right: 24px;
		bottom: 224px;
	}

	#frontMain .padding .padding  {
		padding: 0 7px 0 20px;
	}
	
	#frontMain p {
		font-size: 1.1em;
		color: #000;
		margin-top: 5px;
		margin-bottom: 20px;	
	}
	
	#frontMain a {
		color: #484D98;
	}
	
	#frontMain .rakennuspaivakirja p {
		padding-right: 350px;
	}
	
	#frontMain h1 {
		font-size: 1.6em;
		font-weight: bold;
		color: #54589e;
		margin-top: 25px;
		margin-bottom: 5px;
	}
	

#subMain {
	float: left;
	position: relative;
	width: 780px;
}

#subMainTop {
	width: 783px;
	height: 5px;
	background: transparent url(../images/bg_main_top_green.gif) no-repeat top left;
}

	#subMain .padding {
		padding: 0 0 10px 11px;
	}
	
	#subMain .padding .padding {
		padding: 0 0 10px 21px;
	}
	
	#subMain #placesTopArea {
		min-height: 180px;
	}
	
	#subMain p {
		font-size: 1.1em;
		color: #000;
		margin-top: 5px;
		margin-bottom: 10px;
	}
		
	#subMain blockquote {
		font-size: 1.1em;
		color: #000;
	}
	
	#subMain p.dotBorder {
		border: 1px none;
		background: transparent url(../images/bg_dots.gif) repeat-x center left;
		height: 3px;
		margin: 0 0 10px;
		color: transparent;
	}
	
	#subMain ul {
		font-size: 1.1em;
		padding-left: 14px;
	}
	
	#subMain ol {
		font-size: 1.1em;
	}
	
	#subMain h1 {
		font-size: 1.6em;
		font-weight: bold;
		color: #54589e;
		margin: 14px 0;
		background: transparent url(../images/bg_dots.gif) repeat-x bottom left;
		padding-bottom: 6px;
	}
		
	#subMain h2 {
		font-size: 1.2em;
		font-weight: bold;
		color: #000000;
		margin: 14px 0;
	}
	
	#subMain h3 { font-size: 1.2em; }
	
	#subMain img.lightbox {
		padding-right: 10px;
		margin-bottom: 10px;
	}
			
	#subMain a {
		color: #484d98;
	}
	
	#subMain .list {
		line-height: 1.7em;
	}
				
	#subMain .list a {
		color: #484d98;
		background: transparent url(../images/bg_link_bullet.gif) no-repeat center left;
		padding-left: 7px;
	}
	
	#subMain .contentLeft {
		float: left;
		position: relative;
		width: 310px;
		/*padding-bottom: 35px;*/
	}
		
	#subMain .contentRight {
		float: left;
		position: relative;
		width: 430px;
		/*padding-bottom: 35px;*/
	}
	
		#subMain .contentRight .padding{
			padding: 15px 0 0 40px;
		}
			
	#subMain .eventsLeft {
		float: left;
		position: relative;
		width: 286px;
		padding-bottom: 35px;
	}
	
		#subMain .eventsLeft img{
			border: 1px solid #959595;
		}
			
		#subMain .eventsLeft .padding{
			padding: 0 31px 0 33px;
			height: 600px;
			overflow: hidden;
			position: relative;
		}
		
		#subMain .eventsLeft .moreEvents{
			padding: 0px 21px 2px 4px;
			background: transparent url(../images/bg_arrow.gif) no-repeat center right;
		}
		
		#subMain .eventsLeft h2 {
			font-size: 1.2em;
			font-weight: bold;
			color: #54589e;
			margin: 14px 0 5px;
		}
		
	#subMain .eventsRight {
		float: left;
		position: relative;
		width: 465px;
		padding-bottom: 35px;
	}
	
		#subMain .eventsRight .padding{
			padding: 0 0 0 20px;
		}
	
	#subMain .placeArea {
		width: 100%;
		background: transparent url(../images/bg_dots.gif) repeat-x bottom left;
		padding: 14px 0;
	}
	
	#subMain .noBorder {
		background-image: none;
	}
	
	#subMain .puistoValmistuu {
		position: absolute;
		top: -17px;
		left: 35px;
	}
	
		#subMain .placeArea img {
			float: left;
			padding-right: 15px;
		}
		
		#subMain .placeArea p {
			margin: 0;
			padding-left: 144px;
		}
					
		#subMain .placeArea a.readMore {
			background: transparent url(../images/bg_link_bullet.gif) no-repeat center left;
			padding-left: 7px;
			color: #484d98;
		}
			
		#subMain .placeArea h2 {
			margin-top: 0;
			margin-bottom: 10px;
			font-size: 1.3em;
			font-weight: bold;
			color: #484d98;
		}
		
		#subMain h1.newsHeading {
			color: #333333;
			background: none;
		}
				
		#subMain h3.newsHeading {
			color: #333333;
		}
		
		#subMain p.newsItemRow {
			font-size: 1.0em;
			margin: 6px 0;
		}		
		
			#subMain p.newsItemRow a {
				font-size: 1.2em;
				float: left;
				width: 255px;
				padding: 4px 10px;
				position: relative;
			}
						
			#subMain p.newsItemRow a.active {
				color: #2e2e2e;
				font-weight: bold;
				text-decoration: none;
				background: #ecedf4 url(../images/bg_news_bottom_corner.gif) no-repeat bottom left;
			}
				
			#subMain p.newsItemRow span {
				color: #484D98;
				float: left;
				width: 75px;
				font-weight: bold;
				padding: 4px 0;
			}
			
			#subMain p.newsItemRow a.active img {
				position: absolute;
				left: 0;
				top: 0;
			}
			
		#subMain .newsShadow {
			position: absolute;
			top: 0;
			left: 378px;
			width: 14px;
			height: 100%;
			height: expression(document.getElementById("subMain").offsetHeight);
		}
		
		#subMain .eventRow {
			padding: 1px 0 2px;
			margin: 4px 0;
			font-size: 1.2em;
		}
					
		#subMain .eventRow span{
			padding: 0 24px 0 21px;
			color: #54589e;
		}
				
		#subMain .eventRowDark {
			background-color: #f5f5f5;
		}
		
		#subMain .eventsLeft .eventShadowLeft {
			position: absolute;
			top: 0;
			left: 0;
			height: 600px;
			width: 14px;
			border: none;
			height: expression(document.getElementById("eventLeftContainer").offsetHeight);
		}
				
		#subMain .eventsLeft .eventShadowRight {
			position: absolute;
			top: 0;
			right: 0;
			height: 600px;
			width: 14px;
			border: none;
			height: expression(document.getElementById("eventLeftContainer").offsetHeight);
		}
		
#subMain #placesBottomContainer {
	min-height: 460px;
}
		
#tapahtumaSlider {
	position: absolute;
	top: 185px;
	right: 12px;
	width: 67px;
	
	overflow: hidden;
}

	#tapahtumaSlider .sliderShadow {
		position: absolute;
		right: 0;
		top: 0;
		height: 475px;
	}
	
	#tapahtumaSlider .sliderBottomEnd {
		position: absolute;
		right: 0;
		bottom: 0;
	}
		
	#tapahtumaSlider .sliderTopEnd {
		position: absolute;
		right: 0;
		top: 0;
	}
	
	#tapahtumaSlider .sliderBg {
		background-color: #ffffff;
		width: 670px;
	}
	
	#tapahtumaSlider .sliderMiddle {
		position: relative;
		float: left;
		background: transparent url(../images/bg_slider.png) repeat-y top left;
		padding-left: 20px;
		
	}
		
	#tapahtumaSlider .sliderBottom {
		position: relative;
		float: left;
		width: 800px;
		height: 17px;
		background: transparent url(../images/bg_slider_bottom.png) no-repeat top left;
	}
		
	#tapahtumaSlider .sliderTop {
		position: relative;
		float: left;
		width: 800px;
		height: 17px;
		background: transparent url(../images/bg_slider_top.png) no-repeat top left;
	}
	
	#tapahtumaSlider .column {
		position: relative;
		float: left;
		width: 290px;
	}	
		
	#tapahtumaSlider .column img {
		border: 1px solid #969696;
	}	
	
	#tapahtumaSlider .column .padding {
		padding-left: 28px;
	}
	
	#tapahtumaSlider .column h2 {
		margin: 5px 0;
		font-size: 1.3em;
		font-weight: bold;
		color: #484d98;
	}
	
	#tapahtumaSlider .column p {
		margin: 5px 0;
	}
		
	#tapahtumaSlider .column a {
		color: #484d98;
	}
	
	#tapahtumaSlider .column p.ticketLink {
		padding-bottom: 10px;
	}
	
	#tapahtumaSlider .moreLink {
		float: right;
	}
	
	#tapahtumaSlider .moreLink a {
		font-size: 1.3em;
		font-weight: bold;
		color: #484d98;
	}
	
#subNavi {
	padding: 0;
	margin: 0;
	list-style-type: none;
	width: 198px;
	background: transparent url(../images/bg_dots.gif) repeat-x top left;
	padding-top: 1px;
}

	#subNavi li {
		width: 198px;
		background: transparent url(../images/bg_dots.gif) repeat-x bottom left;
		padding: 2px 0;
	}
	
	#subNavi li a {
		display: block;
		background-color: transparent;
		padding: 10px 21px 8px;
		font-weight: bold;
		font-size: 1.2em;
		text-decoration: none;
		background: transparent url(../images/bg_navi_dot_blue.gif) no-repeat left 16px;
	}
	
	#subNavi li a:hover, #subNavi li a.menu-current {
		color: #ffffff;
		background: #484d98 url(../images/bg_navi_dot_white.gif) no-repeat left 16px;
	}

img {
	border: none;
}

.clearfloat {
	clear: both;
	height:0px;
    font-size: 1px;
    line-height: 0px;
}

.borderTop {
	background: transparent url(../images/bg_dots.gif) repeat-x top left;
}

.borderBottom {
	background: transparent url(../images/bg_dots.gif) repeat-x bottom left;
}

#mapControls {
	margin-left: -5px;
}

#mapControls img {
	padding-right: 20px;
	background-image: none;
}

#mapControls a.active img {
	background: transparent url(../images/map_arrow.gif) no-repeat center right;
}

#eventSet1, #eventSet2 {
	position: absolute;
	top: 35px;
	left: 33px;
	width: 225px;
}

#eventPadding {
	padding: 0 0 0 11px;
}

/*
background-color: #ffdddd;
*/

.tooltip { position:absolute; border:1px solid #000; background-color:#ffffe1; padding:5px;display:none; }
#tooltipSe {top:40px;right:100px;}
#tooltipEn {top:40px;right:35px;}


#engSidebar a {
	text-decoration: none;
}