@charset "ISO-8859-1";

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

body {
	font-size: 62.5%;
	color: #333333;
	background: #000000 url(../images/bg_stripes.gif) no-repeat center 470px;
}

img {
	border: none;
}

p, h1, h2, h3, h4 {
	margin: 0 0 10px;
}

/***********************************************
*** COMMON
***********************************************/

img.right {
	float: right;
	padding: 0 0 5px 5px;
}

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

#bgWrapper {
	width: 100%;
	overflow: hidden;
	position: absolute;
	min-width: 940px; /* TODO IE */
	height: auto !important;
	height: 940px;
	top: 0;
	left: 0;
}

#background {
	background: transparent url(../images/bg_yellow.jpg) no-repeat center top;
	margin: 10px 0 0 50%;
	width: 1219px;
	height: 450px;
	left: -610px;
	position: relative;
}


#blue #background {
	background: transparent url(../images/bg_blue.jpg) no-repeat center top;
}

#page {
	position: relative;
	width: 940px;
	margin: 0 auto;
}

#header {
	position: relative;
}

	#logo {
		position: absolute;
		background: transparent url(../images/logo_yellow.png) no-repeat left top;
		width: 334px;
		height: 163px;
		text-decoration: none;
		left: -56px;
		top: 10px;
	}
	
	#blue #logo {
		background: transparent url(../images/logo_blue.png) no-repeat left top;
	}
	
		#logo span {
			visibility: hidden;
		}

	#header .rightCol {
		
		width: 700px;
		position: relative;
		float: right;
	}
	
		#navi {
			background: transparent url(../images/bg_navi_yellow.png) no-repeat left top;
			height: 31px;
			margin: 28px 0 0;
			overflow: hidden;
		}
			
		#blue #navi {
			background: transparent url(../images/bg_navi_blue.png) no-repeat left top;
		}
		
			#navi .padding { padding: 0 0 0 10px; }
		
			#navi a {
				display: block;
				float: left;
				padding: 10px 5px 10px 5px;
				color: #ffffff;
				text-decoration: none;
				font-size: 1.2em;
				font-weight: bold;
				font-family: helvetica;
			}
			
			#navi a:hover {
				text-decoration: underline;
				color: #000000;
			}
					
			#navi a.current, #navi a.section {
				text-decoration: underline;
				color: #000000;
			}
			
			#navi a.langEn {
				position: absolute;
				top: 28px;
				right: 12px;
				
			}
			
			#navi a.langFi {
				position: absolute;
				top: 28px;
				right: 34px;
			}
		
		#themes {
			height: 35px;
			text-align: right;
		}
		
			#themes .padding { padding: 2px 2px 0 0; }
			
		#subNavi {
			float: left;
			padding: 9px 0 0 6px;
		}
		
			#subNavi a {
				float: left;
				color: #ffffff;
				font-size: 1.2em;
				font-family: helvetica;
				padding: 0 5px 0 8px;
				text-decoration: none;
				font-weight: bold;
			}
			
			#subNavi a:hover {
				text-decoration: underline;
				color: #000000;
			}
				
			#subNavi a.current {
				text-decoration: underline;
				color: #000000;
			}
	
		#slideShow {
			height: 321px;
		}
		
			#numbers {
				height: 19px;
				background-color: #4ba5ff;
				position: absolute;
				bottom: 6px;
				left: 6px;
				overflow: hidden;
				display: none;
			}
			
				#numbers a {
					display: block;
					font-size: 1.2em;
					font-weight: bold;
					float: left;
					padding: 2px 7px 2px 6px;
					color: #ffffff;
					text-decoration: none;
				}
				
				#numbers a.active {
					color: #000000;
				}
		
			#offer {
				width: 472px;
				height: 46px;
				position: absolute;
				bottom: 6px;
				right: 0;
				background: transparent url(../images/bg_offer_yellow.png) no-repeat left top;
			}
					
			#blue #offer {
				background: transparent url(../images/bg_offer_blue.png) no-repeat left top;
			}
			
				#offer .padding { padding: 0 10px 0 15px; }
				
				#offer h1 {
					font-weight: bold;
					color: #000000;
					font-size: 1.8em;
					margin: 11px 0 3px;
					float: left;
				}
							
				#blue #offer h1 {
					color: #ffffff;
				}
			
				#offer .button_fi {
					float: right;
					margin: 11px 0 3px;
					display: block;
					width: 140px;
					height: 24px;
					background: transparent url(../images/button_ota_yhteytta_yellow.gif) no-repeat left top;
					text-decoration: none;
				}
							
				#blue #offer .button_fi {
					background: transparent url(../images/button_ota_yhteytta_blue.gif) no-repeat left top;
				}
							
				#offer .button_en {
					float: right;
					margin: 11px 0 3px;
					display: block;
					width: 140px;
					height: 24px;
					background: transparent url(../images/button_ota_yhteytta_yellow_en.gif) no-repeat left top;
					text-decoration: none;
				}
							
				#blue #offer .button_en {
					background: transparent url(../images/button_ota_yhteytta_blue_en.gif) no-repeat left top;
				}
				
				#offer .button_fi span, #offer .button_en span {
					display: none;
				}
				
#wideContent {
	min-height: 472px; /* TODO IE */
	height: auto !important;
	height: 472px;
	background-color: #ffffff;
}			

		#wideContent .padding { padding: 10px 10px 5px; }
		
#contactContent {
	min-height: 472px; /* TODO IE */
	height: auto !important;
	height: 472px;
	background: #ffffff url(../images/bg_contact.gif) repeat-y right top;
}		
		
	#mapColumn {
		float: left;
		width: 578px;
	}			

		#mapColumn .padding { padding: 39px 39px; }
	
		#mapColumn .col {
			float: left;
			width: 202px;
			font-size: 1.2em;
			line-height: 1.6em;
		}
				
		#mapColumn #map {
			width: 501px;
			height: 292px;
			background: #eeeeee;
			margin: 33px 0 0; 
		}
				
	#contactColumn {
		float: left;
		width: 330px;
	}		

		#contactColumn .padding { padding: 43px 1px 43px 31px; }
		
		#contactColumn h2 {
			font-size: 1.4em;
			font-weight: bold;
			font-family: helvetica;
			margin: 0 0 14px;
		}
		
		#contactColumn .row {
			padding: 0 0 6px;
		}
		
		#contactColumn form .left { 
			float: left;
			width: 69px;
			font-size: 1.2em;
			padding: 5px 0 0;
		}
				
		#contactColumn form .right { 
			float: left;
			width: 220px;
		}
								
			#contactColumn form .right input, #contactColumn form .right textarea { 
				width: 100%;
				
			}
			
			#contactColumn form .right textarea {
				margin: 0;
				padding: 0;
				border: 0 none;
				height: 110px;
				font-family: arial;
				font-size: 12px;
				background: transparent;
			}
						
		#contactColumn form .buttonRow { 
			text-align: right;
			width: 289px;
			padding: 11px 0 0;
		}
								
		#contactColumn form .textarea { 
			background: transparent url(../images/bg_textarea.gif) no-repeat left top;
			width: 220px;
			height: 124px;
		}
		
			#contactColumn form .textarea .padding { padding: 5px; }
		

#weekProgram {
	width: 920px;
	overflow: hidden;
	position: relative;
	min-height: 457px; /* TODO IE */
	height: auto !important;
	height: 457px;
}		

	#weekProgram #columns {
		position: absolute;
		left: 0;
		right: 0;
		height: 100px;
		width: 1610px;
	}
		
	#weekProgram .column {
		width: 230px;
		float: left;
		height: 100%;
	}		
			
		#wideContent .column .padding { padding: 0 10px 0 0; }		
		
		#wideContent .column h2 {
			background: transparent url(../images/bg_program_header.png) repeat-x left top;
			text-align: center;
			margin: 0;
			padding: 10px 0 7px;
			font-size: 1.4em;
			font-weight: bold;
		}
		
		#blue #wideContent .column h2 {
			background: transparent url(../images/bg_program_header-b.png) repeat-x left top;
		}
		
		#wideContent .column .hour {
			border: 1px solid #feedac;
			padding: 5px 6px 8px;
			background-color: #f8f8f8;
			font-size: 1.2em;
			color: #000000;
			display: block;
			text-decoration: none;
			margin: 10px 0 0;
		}
		
		#blue #wideContent .column .hour {
			border: 1px solid #3399ff;
			/* 99ccff */
		}
				
		#wideContent .even .hour {
			border: 1px solid #fcd330;
			background-color: #eeeeee;
		}
		
			#wideContent .column .hour strong {
				text-decoration: none;
				font-weight: bold;
			}
					
			#wideContent .column .hour span {
				text-decoration: underline;
			}
			
			#wideContent .column .hour .content {
				display: none;
			}
			
#programBottom {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 41px;
	overflow: hidden;
	width: 910px;
}

	#programControls {
		float: left;
	}

	#programBottom .downloadProgram {
		padding: 13px 0 15px 0; 
		background: transparent url(../images/bg_download.gif) no-repeat left top;
		color: #000000;
		font-size: 1.2em;
		font-weight: bold;
		float: left;
		width: 230px;
		text-decoration: none;
	}
	
	#programLinks {
		float: left;
		width: 230px;
		text-decoration: none;
	}
	
	#programLinks .go span {
	font-size: 1.2em;
	font-weight: bold;
	color: #C30;
	text-decoration: underline;
	}
	
	#blue #programBottom .downloadProgram {
		background: transparent url(../images/bg_download-b.gif) no-repeat left top;
	}
	
	#programBottom .downloadProgram span {
		margin: 0 0 0 47px;
		text-decoration: underline;
	}
	
	#controlsHead span {
		float: left;
		display: block;
		padding: 5px 0;
		background: #ffcc00;
		font-size: 1.2em;
		font-weight: bold;
		font-family: helvetica;
		width: 80px;
		text-align: center;
	}
	
	#blue #controlsHead span {
		background: #3399ff;
	}
	
	#controlsHead .active { background: #ffe680; }
	
	#blue #controlsHead .active { background: #99ccff; }
	
	#controlBar {
		position: relative;
		width: 560px;
		height: 18px;
	}
		
	#controlBarWide {
		position: relative;
		width: 910px;
		height: 18px;
	}
	
		#controlBar .bar {
			position: absolute;
			width: 320px;
			height: 15px;
			left: 0px;
			top: 3px;
			cursor: pointer;
			cursor: hand;
		}
			
		#controlBarWide .bar {
			position: absolute;
			width: 320px;
			height: 15px;
			left: 0px;
			top: 3px;
			cursor: pointer;
			cursor: hand;
		}
		
#programPopup {
	background: #ffffff;
	border: 1px solid #000000;
	color: #333333;
	position: absolute;
	top: 133px;
	left: -270px;
	width: 540px;
	height: 380px;
	margin-left: 50%;
	display: none;
}		

	#programPopup .padding { padding: 27px 30px 17px; }
	
	#programPopup h1 {
		font-size: 1.8em;
		font-weight: bold;
		font-family: helvetica;
		color: #000000;
	}
			
	#programPopup p {
		font-size: 1.2em;
		font-weight: normal;
		font-family: georgia;
		color: #333333;
	}
				
	#programPopup .closeButton {
		position: absolute;
		right: 6px;
		top: 6px;
	}
				
#subContent {
	min-height: 472px; /* TODO IE */
	height: auto !important;
	height: 472px;
	background-color: #ffffff;
}

	#subContent .padding { padding: 20px 35px 25px 30px; }
	
	#yellow #subContent h1, #yellow #subContent h2, #yellow #subContent h3 {
		color: #ffcc00;
	}
	
	#subContent img.right {
		float: right;
		padding: 0 0 10px 10px;
	}
	
	#subContent img.left {
		float: left;
		padding: 0 10px 10px 0;
	}
		
	#subContent h1 {
		color: #0099ff;
		font-size: 2.0em;
		font-weight: bold;
		margin: 0 0 15px;
		padding: 5px 0 0;
	}
	
	#subContent h2 {
		color: #0099ff;
		font-size: 1.6em;
		font-weight: bold;
	}
	
	#subContent h3 {
		color: #0099ff;
		font-size: 1.0em;
		font-weight: normal;
		margin: 0 0 9px;
	}
	
	#subContent p {
		color: #333333;
		font-size: 1.2em;
		font-weight: normal;
		font-family: georgia;
		margin: 0 0 7px;
		line-height: 1.5em;
	}
	
	#subContent a {
		color: #0099ff;
	}
		
	#subContent table {
		font-size: 1.2em;
		font-weight: normal;
		font-family: georgia;
		color: #333333;
		line-height: 1.5em;
	}
		
	#subContent ul {
		font-size: 1.2em;
		padding: 0 0 0 15px;
		font-family: georgia;
	}
	
	#subContent .pagination {
		text-align: center;
		font-size: 1.4em;
	}
	
	#subContent .pagination a {
		font-weight: bold;
		color: #0099ff;
		text-decoration: none;
		padding: 0 2px;
	}
		
	#subContent .pagination a.text {
		font-weight: normal;
		text-decoration: underline;
		visibility: hidden;
	}
	
	#subContent .pagination a.vis {
		visibility: visible;
	}
			
	#subContent .pagination a.active {
		font-weight: normal;
		color: #000000;
		font-weight: bold;
	}
	
	#subContent .comments {
		background-color: #eeeeee;
		border: 1px solid #cccccc;
		padding: 0 13px 0 15px;
		font-size: 1.2em;
		color: #666666;
		margin: 19px 0 16px;
		height: 34px;
	}
	
		#subContent .comments .left { float: left; margin: 10px 0 9px; }
		#subContent .comments .right { float: right; margin: 10px 0 9px; }
		
	#subContent #pagination {
		text-align: center;
		font-size: 1.2em;
	}
	
		#subContent #pagination a {
			text-decoration: none;
			font-weight: bold;
		}
	
		#subContent #pagination .textLink {
			text-decoration: underline;
			font-weight: normal;
		}
	
		#subContent #pagination a.active {
			color: #000000;
		}
		
#leftBlock {
	position: absolute;
	width: 220px;
	bottom: 0;
	left: 0;
}

	#leftBlock .top {
		background: transparent url(../images/bg_cloud_top.png) no-repeat left top;
		float: left;
		padding: 9px 0 0;
		width: 100%;
	}
		
	#leftBlock img {
		float: left;
	}
	
	#leftBlock h2 {
		color: #ffffff;
		font-size: 2.0em;
		font-weight: bold;
		padding: 0 9px 0 9px;
	}
	
	#leftBlock p {
		color: #ffffff;
		padding: 0 9px 0 9px;
		min-height: 65px; /* TODO IE */
		height: auto !important;
		height: 65px;
	}
	
	#leftBlock p span {
		color: #ffffff;
		font-size: 1.2em;
	}
	
	#leftBlock p span.size2 {
		font-size: 1.4em;
	}
	
	#leftBlock p span.size3 {
		font-size: 1.6em;
		font-weight: bold;
	}

#blocks {
	padding: 20px 0 0 0;
}

	#blocks .block {
		background: transparent url(../images/bg_block_yellow.png) no-repeat left top;
		width: 240px;
		float: left;
		height: 131px;
		position: relative;
		text-decoration: none;
	}
	
	#blue #blocks .block {
		background: transparent url(../images/bg_block_blue.png) no-repeat left top;
	}

	#blocks .lastBlock {
		width: 220px;
		background: transparent url(../images/bg_block_blue.png) no-repeat left top;
	}
	
	#blue #blocks .lastBlock {
		background: transparent url(../images/bg_block_yellow.png) no-repeat left top;
	}
	
	#yellow #blocks .yellow {
		display: none;
	}
		
	#blue #blocks .blue {
		display: none;
	}
	
		#blocks .block h1 {
			color: #ffffff;
			font-size: 3.6em;
			font-weight: bold;
			margin: 0;
			position: absolute;
			left: 12px;
			top: 9px;
			line-height: 1.0em;
		}
	
		#blocks .block h2 {
			color: #ffffff;
			font-size: 1.6em;
			font-weight: normal;
			margin: 0;
			position: absolute;
			left: 12px;
			bottom: 16px;
		}

#bottomColumns {
	color: #ffffff;
	padding: 0 0 22px;
}

	#bottomColumns .newsLetter {
		margin: 21px 0 0;
		float: left;
		width: 240px;
	}
	
		#bottomColumns .newsLetter h2 {
			margin: 0 0 7px;
		}
			
		#bottomColumns .newsLetter p {
			margin: 10px 0 7px;
		}
		
		#bottomColumns .newsLetter form { width: 220px; }
		
		#bottomColumns .newsLetter form ul li a {
			color: #000000;
		}
		
		#bottomColumns .newsLetter form .sendButton {
			float: left;
			padding: 0 0 0 7px;
		}

	#bottomColumns .faceBook {
		margin: 19px 0 0;
		float: left;
		width: 360px;
	}
	
		#bottomColumns .faceBook .padding { padding: 0 40px 0 0; }
		
		#bottomColumns .faceBook img {
			float: left;
			padding: 4px 9px 0 0;
		}

	#bottomColumns .blog {
		margin: 21px 0 0;
		float: left;
		width: 330px;
	}
	
	#bottomColumns h2 {
		color: #3399ff;
		font-size: 1.2em;
		font-weight: bold;
		margin: 0 0 3px;
	}
		
	#bottomColumns p {
		font-size: 1.2em;
		line-height: 1.6em;
	}
			
	#bottomColumns strong {
		font-weight: bold;
		color: #3399ff;
	}
	
	#bottomColumns p {
		margin: 0 0 5px;
	}
		
	#bottomColumns p.moreLink {
		color: #ffcc00;
	}
	
	#bottomColumns a {
		color: #ffcc00;
	}

#footer {
	border-top: 1px solid #424242;
	padding: 21px 0 0;
	text-align: center;
	position: relative;
}

	#footer p {
		color: #ffffff;
		font-size: 1.2em;
		margin: 0 0 7px;
	}

		#footer p span {
			color: #ffcc00;
			padding: 0 5px;
		}

	#footer p.grey {
		color: #666666;
		font-size: 1.0em;
	}

		#footer p.grey a {
			color: #666666;
		}
		
	#footer .koiteli {
		position: absolute;
		top: 18px;
		left: 32px;	
	}

#fbLike {
	position: absolute;
	right: 0;
	top: 23px;
}

#twitter_update_list {
	display: inline;
	padding: 0;
	margin: 0;
}

#twitter_update_list li {
	display: inline;
}

#twitter_update_list li a {
	display: none;
}

#twitter_update_list li span a {
	display: inline;
}

.last-row { display: none !important; }