@import url("reset.css");

/* =====================
	BASE STYLES
======================== */

body {
	font-size: 81.3%;
	line-height: 1.4;
	background: url(../img/bg_tile.gif) repeat-x #00102e;
	font-family: Arial, Verdana, Helvetica, 'Helvetica Neue', sans-serif;
	color: #333333;
	}
	
a,a:visited {
	color: #1481d6;
	text-decoration: underline;
	}

a:hover {
	text-decoration: none;
	}

#wrapper a:active {
	color: #1481d6 !important;
	}

#wrapper a:focus {

	}

.group {
	display: block;
	float: left;
	}

.clear, hr.clear {
	clear: both;
	width: 0;
	height: 0;
	border: 0;
	padding: 0;
	margin: 0;
	}

/* =====================
	BLOCKS
======================== */

#wrapper-main {
	width: 100%;
	border-top: solid 4px #ffce05;
	background: url(../img/bg_theme.jpg) no-repeat top center;
	}

#wrapper {
	margin: 0 auto;
	width: 940px;
	}

#header{
	position: relative;
	width: 966px;
	z-index: 50;
	}
	
#content {
	width: 920px;
	margin: 0;
	padding: 20px 23px 0 23px;
	background: url(../img/bg_content.png) repeat-y;
	}

#content-links {
	width: 168px;
	height: 246px;
	margin: 0 0 0 0;
	background: url(../img/bg_links.gif) no-repeat;
	}
	
#content-highlights {
	width: 438px;
	height: 242px;
	border: solid 2px #1482d7;
	margin: 0 10px 0 0;
	overflow: hidden;
	}
	
#content-some {
	width: 300px;
	height: 246px;
	margin: 0 0 0 0;
	}

#content-left {
	width: 210px;
	margin: 0 40px 0 0;
	}

#content-middle {
	width: 670px;
	min-height: 300px;
	padding: 20px 0 0 0;
	}

.front #content-left {
	width: 300px;
	margin: 20px 10px 0 0;
	}
	
.front #content-middle {
	width: 300px;
	margin: 0 !important;
	}
	
.front #content-right {
	width: 300px;
	margin: 20px 0 0 10px;
	}
	
.front .with_right {
	width: 300px !important;
	margin: 0 !important;
	margin-right: 10px;
	}

.with_right {
	width: 480px !important;
	margin: 0 !important;
	}


#content-right {
	width: 170px;
	margin: 20px 0 0 20px;
	}
	
#content-banners {
	clear: both;
	width: 920px;
	margin: 0 0 17px 0;
	padding: 10px 0 0 0;
	border-top: solid 1px #c8ccca;
	}
	
#content-banners #banners-left {
	float: left;
	width: 910px;
	margin: 0 10px 0 0;
	padding: 0;
	}
	
#content-banners #banners-right {
	float: right;
	width: 300px;
	margin: 0;
	padding: 0;
	}
	
#content-banners #banners-left .banner {
	display: inline;
	margin: 0 15px 0 0;
	}
	
#content-banners #banners-right .banner {
	display: inline;
	margin: 0 0 0 15px;
	}
	
#content-banners #banners-left .banner a,
#content-banners #banners-right .banner a {
	text-decoration: none;
	}

#footer {
	width: 966px;
	padding: 15px 0 40px 0;
	background: url(../img/bg_footer_top.png) no-repeat top;
	color: #fff;
	font-size: 0.923em;
	}
	
#footer a {
	text-decoration: none;
	color: #fff;
	}

#footer #copyright {
	float: left;
	}

#footer .links {
	float: right;
	}
	
#footer .links a {
	padding: 0 0 0 10px;
	text-decoration: underline;
	}
	
#footer .links a:hover {
	text-decoration: none;
	}

#footer .links a:hover {
	text-decoration: none;
	}

/* =====================
	LOGO
======================== */

#logo {
	width: 580px;
	height: 137px;
	margin: 0;
	padding: 18px 0 0 0;
	}

#logo a {
	display: block;
	width: 150px;
	height: 150px;
	margin: 0 auto;
	background: url(../img/logo.png) no-repeat;
	text-indent: -9999px;
	}

/* =====================
	NAVIGATION
======================== */

#nav_container {
	width: 960px;
	height: 41px;
	clear: both;
	margin: 0;
	padding: 3px 3px 0 3px;
	background: url(../img/bg_nav.png) no-repeat;

	}

#nav {
	width: 960px;
	height: 41px;
	clear: both;
	}


/* =====================
	SoMe TABS
======================== */

div.panes > div { display:none;} 

#content-some ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:2px solid #1481d6;	
	height:27px;
}

#content-some ul.tabs li { 
	display: inline;
	text-indent:0;
	padding:0;
	margin:0 5px 0 0 !important;
	height: 27px;
	overflow: hidden;
	list-style-image:none !important; 
	}

#content-some ul.tabs a {
	display:block;
	height: 27px;
	text-align:center;	
	text-decoration:none;
	padding: 0 0 0 4px;
	margin:0 5px 0 0 !important;
	font-weight: bold;
	cursor: pointer;
	float:left;
    background:url("../img/nav_tableft.gif") no-repeat 0px -40px;
	}

#content-some ul.tabs a span {
      float:left;
      display:block;
      height: 17px;
      background:url("../img/nav_tabright.gif") no-repeat 100% -40px;
      padding:6px 12px 4px 8px;
      margin: ;
      }

#content-some ul.tabs a:active {
	outline:none;		
	}

#content-some ul.tabs a:hover {
	background-position:  0% 0px;	
	}

#content-some ul.tabs a:hover span {
	background-position:  100% 0;
	color: #fff;	
	}
	
#content-some ul.tabs a.selected  { 
	background-position: 0px 0px;
	color: #fff;
	}
	
#content-some ul.tabs a.selected span  { 
	background-position: 100% 0px;
	color: #fff;
	}

#content-some .panes .pane {
	display:none;		
	}

#twitter {
	height: 215px;
overflow: hidden;
	}

#twitter_container {

	}

ul#twitter_update_list {	
	}
	
ul#twitter_update_list li {
	padding: 13px 0 0 0;	
	}
   	
ul#twitter_update_list li a {
	font-weight: bold;
	font-size: 0.923em !important; 
	text-decoration: none;	
	}
	
ul#twitter_update_list li a:hover {
	color: #333;	
	}

#content-some .page_stream, #content-some #stream_content {
	height: 219px !important;
	margin: 0 0 0 0;
	}

#content-some #fbConnectWidgetFooter {
	display: none !important;
	}
	

/* =====================
	SIDE MENU
======================== */

#sidemenu {
	width: 210px;
	display: block;
	margin: 0;
	padding: 0;
	}

#sidemenu li {
	display: block;
	padding: 0;
	background: #e7f2fb;
	border-bottom: solid 1px #fff;
	}
	
#sidemenu li a {
	text-decoration: none;
	color: #1482d7;
	line-height: 17px;
	padding: 10px 0 10px 0;
	display: block;
	background: url(../img/nav_sidemenu_arrow.gif) no-repeat 10px 15px;
	}
	
#sidemenu #sidemenu li {
	background: #fff;
	}
	
#sidemenu li.level1-last {
	background-image: none !important;
	}	

#sidemenu a.level1-onpath {
	color: #fff;
	background: url(../img/nav_sidemenu_arrow.gif) no-repeat #023ea9;
	background-position: 10px -15px !important;
	}
	
#sidemenu a.level1:hover {
	color: #fff;
	background: url(../img/nav_sidemenu_arrow.gif) no-repeat #023ea9;
	background-position: 10px -15px !important;
	}

#sidemenu li.level2-onpath a,
#sidemenu li.level2-onpath a:hover {
	color: #1482d7;
	}

#sidemenu li a:hover {
	color: #fff;
	}
	
#sidemenu li.level1-onpath #sidemenu li a:hover {
	color: #023ea9;
	background-color: none;
	}

#sidemenu li.level2 a,
#sidemenu li.level3 a,
#sidemenu li.level4 a {
	color: #1482d7;
	display: block;
	padding-left: 0;
	background-image: url(../img/nav_sidemenu_arrow.gif) no-repeat !important;
	background-color: #fff;
	font-size: 0.857em;
	}

#sidemenu li.level2-last a {
	margin-bottom: 0px;
	color: #1482d7;
	}

#sidemenu li.level2-first a {
	margin-top: 0px;
	}

#sidemenu li.level2-here a,
#sidemenu li.level3-here a,
#sidemenu li.level4-here a {
	font-weight: bold;
	}


/* =====================
	LANGUAGE
======================== */

#lang {
	float: left;
	width: 190px;
	height: 170px;
	margin: 0;
	padding: 15px 0 0 3px;
	}

div#trigger {
	float: left;
	display: none;
	width: 128px;
	margin: 0;
	padding: 0;
	position: absolute;
	}

p#language_trigger {
	width: 190px;
	height: 28px;
	padding: 0;
	margin: 0 0 0 0;
	cursor: pointer;
	display: block;
	background: url(../img/btn_lang.png) no-repeat;
	outline: none;
	text-indent: -9999px;
	}

p#language_trigger:hover {
	background-position: 0 -28px;
	cursor: pointer;
	}

div#language {
	width: 190px;
	background-color: #fff;
	display: none;
	margin: 1px 0 0 0;
	position: absolute;
	left: 0;
	z-index: 20;
	padding: 0px 0 0px 0;
  	}

div#language a {
  	color: #333;
	display: block;
	width: 170px;
	padding: 4px 10px 4px 10px;
	text-decoration: none !important;
	}

div#language a:hover {
	color: #1481d6 !important;
	background: #ffd905;
	}

div#language a.selected {
	color: #fff !important;
	background: #1481d6;
	}

div#language.show {
	display: block;
	}

div#language ul {
	margin: 0;
	padding: 0;
	list-style: none;
	}

div#language li {
	float: left;
	padding: 0;
	margin: 0;
	display: block;
	}

div#lang-accessible {
	float: left;
	display: block;
	}

div#lang-accessible ul {
	margin: 0;
	padding: 0;
	}

div#lang-accessible ul li {
	list-style: none;
	}

div#lang-accessible a {
    color: #ffd905;
	text-decoration: none;
	}
	
div#lang-accessible a:hover {
    color: #fff;
	text-decoration: none;
	}




/* =====================
	SEARCH
======================== */

#search {
	float: left;
	width: 190px;
	height: 170px;
	margin: 15px 3px 0 0;
	padding: 0;
	position: relative;
	}

#search .go {
	width: 37px;
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	cursor: pointer;
	overflow: hidden;
	outline: none !important;
	background: url(../img/btn_search.png);
	pointer: cursor;
	right: 0px;
	top: 0px;
	position: absolute;
	border: none;
	text-indent: -9999px;
	font-size: 1px;
	}

#search .go:hover {
	cursor: pointer;
	background
	}
	
#search .q {
	float: left;
	padding: 5px 4px 4px 4px;
	margin: 0 !important;
	background: #fff;
	border: 1px solid #1482d7;
	width: 148px;
	height: 17px;
	color: #333;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	}

#search .q:focus {
	border: 1px solid #176799;
	}

/* =====================
	TYPOGRAPHY
======================== */

p,
div.row {
	margin-bottom: 18px;
	}

h1,h2,h3,h4,h5,h6 {
	color: #4f4f4f;
	font-family: Arial, Helvetica, 'Helvetica Neue', Verdana, Sans-serif;
	font-weight: normal;
	}

h1 { 
	font-size: 2.308em; 
	line-height: 30px; 
	margin: 0 0 20px 0; 
	padding: 0;
}
h2 { 
	font-size: 1.846em;
	}
h3 { font-size: 1.385em}
h4 { 
	font-size: 1.154em;
	font-style: italic;
	}
h2,h3 { margin-bottom: 10px }

.app-News h2, .app-Events h2 {
	font-weight: bold;
	color: #1481d6;
	margin: 0 0 15px 0;
	padding: 0;
	border-bottom: solid 2px #1481d6;
	}
	
.front #content-middle h1 {
	display: none;
	}

#wrapper #content .token-Content .content-container ul {
	margin: 20px 18px;
	list-style-type: disc;
	}

#wrapper #content .token-Content .content-container ol {
	margin: 20px 24px;
	list-style-type: decimal;
	}

#wrapper #content .token-Content .content-container ul ul,
#wrapper #content .token-Content .content-container ol ul {
	margin: 0;
	list-style-type: circle;
	}

#wrapper #content .token-Content .content-container li {
	padding-left: 5px;
	line-height: 1.4;
	}

#wrapper #content .token-Content .content-container ul ul li,
#wrapper #content .token-Content .content-container ol ul li {
	margin-left: 20px;
	}

.app-Highlight {
	
	}

#content-links .app-Highlight-wrap .row {
	margin: 0;
	padding: 12px 10px 12px 15px;
	border-bottom: solid 1px #0f71cf;
	}

#content-links .app-Highlight-wrap .row a {
	color: #fff;
	text-decoration: none;
	}

#content-links .app-Highlight-wrap .row a:hover {
	color: #ffd905;
	text-decoration: none;
	}

#content-links .app-Highlight-wrap .row h4 {
	margin: 0;
	padding: 0;
	font-style: normal;
	font-weight: bold;
	font-size: 1.308em;
	}

#content-highlights .token-Content {
	position: relative;
	width: 438px;
	height: 242px;
	}
	
#content-highlights .contentImageWrap {
	width: 438px;
	height: 242px;
	overflow: hidden;
	}
	
#content-highlights .contentTextWrap {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 40;
	width: 428px;
	height: 54px;
	margin: 182px 0 0 0;
	padding: 6px 0 0 10px;
	overflow: hidden;
	background: url(../img/bg_highlight.png); 
	}

#content-highlights .contentTextWrap a {
	color: #fff;
	text-decoration: none;
	}
	
#content-highlights .contentTextWrap a:hover {
	color: #ffd905;
	}
	
#content-highlights .contentTextWrap h1,
#content-highlights .contentTextWrap h2,
#content-highlights .contentTextWrap h3,
#content-highlights .contentTextWrap h4,
#content-highlights .contentTextWrap h5 {
	color: #fff;
	margin: 0;
	padding: 0;
	font-size: 1.385em;
	font-weight: bold;
	}
	
#content-highlights .contentTextWrap p {
	color: #fff;
	margin: 0;
	padding: 0;
	}
	
#content-highlights #progress {
	position: absolute;
	z-index: 40;
	width: 433px;
	margin: 0;
	padding: 5px 5px 0 0;
	text-align: right;
}
#progress a {
	display:inline-block;
	width: 8px;
	height: 8px; 
	background: url(../img/nav_progress.png) no-repeat 0px 5px; 
	margin: 0 5px 0 0; 
	padding: 10px 0 0 0;
	font-size: 0px;
	color: #fff;
	}

#progress a:hover { 
	color: #1481d7;
	background-position: 0px -35px;
	}

#progress a.activeSlide { 
	color: #1481d7;
	background-position: 0px -35px;
	}
	
#progress a:focus { 
	outline: none; 
	}

#content-left .app-News .row {
	margin: 0;
	padding: 10px;
	border-bottom: solid 1px #fff;
	background: #c7f5cc;
	}
	
#content-middle .app-News .row {
	margin: 0;
	padding: 0 0 10px 0;
	}
	
#content-right .app-News .row {
	margin: 0;
	padding: 0;
	border-bottom: solid 1px #fff;
	background: #e7f2fb;
	}
	
#content-middle .app-News .row .img, #content-left .app-News .row .img {
	float: left;
	margin: 0;
	padding: 0;
	width: 88px;
	}
	
#content-middle .app-News .row .img img, #content-left .app-News .row .img img {
	border: solid 1px #ffd905;
	margin: 0 10px 0 0;
	padding: 0;
	}	
	
	
#content-middle .app-News .row a, #content-left .app-News .row a {
	text-decoration: none;
	font-weight: bold;
	}
	
#content-middle .app-News .row a:hover, #content-left .app-News .row a:hover {
	color: #333;
	}
	
#content-middle .app-News .row .pvm, #content-left .app-News .row .pvm {
	display: inline;
	color: #333;
	margin: 0;
	padding: 0;
	font-size: 0.846em;
	font-weight: bold;
	}
	
#content-middle .app-News .row p, #content-left .app-News .row p {
	margin: 0;
	padding: 0;
	font-size: 0.923em;
	}	
	
#content-middle .app-News .row .ingressi, #content-left .app-News .row .ingressi {
	display: inline;
	margin: 0;
	padding: 0;
	}
	
/* päivitykset 17.3.11 */
#content-highlights  {
	position: relative;
	overflow: scroll;
}

#twitter, #facebook {
	border-right: 2px solid #1482D7;
	border-left: 2px solid #1482D7;
	border-bottom: 2px solid #1482D7;
}

#twitter_container {
	padding-left: 2px;
}

.etusivulle {
	position: relative;
	float: left;
	z-index: 100;
	margin-top: -20px;
	margin-left: 4px;
}

.etusivulle a {
	color: #FFF;
	font-size: 1.1em;
	font-weight: bold;
	text-decoration: none;
}

.etusivulle a:hover {
	color: #FFD905 !important;
}

.etusivulle-nuoret a:hover {
	color: #63DE41 !important;
}

.app-Events .row {
	background: #E7F2FB;
	padding: 4px 8px;
}

.app-Events a {
	text-decoration: none;
	font-weight: bold;
}

.app-Events a:hover {
	color: #333;
}

.app-Events p {
	margin-bottom: 0;
}

.app-Events .pvm {
	font-size: 0.846em;
	font-weight: bold;
}

.app-News p {
	margin-left: 87px !important;
	padding-left: 0px !important;
}

.token-Events h1.mainTitle {
	font-size: 1.846em;
	border-bottom: 2px solid #1481D6;
	color: #1481D6;
	font-weight: bold;
	margin: 0 0 15px;
	padding-top: 4px;
}

/* sisällön tyylit */
.content-container ol, .content-container ul {
	margin: 10px;
	padding-left: 10px;
}

.content-container ul {
	list-style: disc;
}

.content-container ol {
	list-style: decimal;	
}

/* share */
#sharebox {
	float: right;
	padding-top: 4px;
}
#sharebox a.email {
	background: url("../img/spread_email.gif") no-repeat scroll left center transparent;
}
#sharebox a.email {
	vertical-align: top;
	color: #444444;
	display: block;
	float: left;
	text-decoration: none;
	padding-left: 25px;
}
.twitter-share-button {
	margin-bottom: 1px;
}
#sharebox a.email, .twitter-share-button {
	padding-right: 12px;
}