html, body { height:100%; }
body, div, p, img, dl, ul, ol, form, img, h1, h2, h3, h4, h5, span, label, hr, fieldset, img{margin: 0; padding: 0;}
body { background: #EBE8E3; font-size:76% ; font-family: Arial, Verdana, sans-serif ;  text-align: center;}
a img{border: 0;}
li{margin-left: 2.5em;}


 /* paragraph & cell styles */
.leftAlign { text-align:left ; }
.rightAlign { text-align:right ; }
.right{float: right;}
.center { text-align:center ; }
.justified { text-align:justify ; }
.h { display:none ; }
.spacer { clear: both; height: 1px; overflow: hidden; margin: 0; padding: 0;}
.u4-image-caption { font-size:0.8em ; color:#666 ; margin-left:0.5em ; }
p.indent{padding: 0 15px 0 15px;}

div.hr{ height: 15px; background: url(/stc/img/hr.gif) 0 50% repeat-x; margin: 0 8px 0 8px;}


#siteBody { color: #004C76; }
#siteBody li p {}
#asuntoFrame{height: 350px; border: 0; margin: 0; padding: 0;}
#forumFrame{height: 800px; border: 0; margin: 0; padding: 0;}
#asuntoFrame, #forumFrame{margin-bottom: 1em;}
.AsuntomessutRSSFrame { width : 100%; overflow : hidden; height: 160px;}


a.thumb img{padding-bottom: 1px;}
/* Link styles */
a{color: #0aa0c0; text-decoration: none;}
a:hover { color: #0c839d; text-decoration: underline;}
p.contact{padding: 0 15px 0 15px;}

h2,h3,h4,h5 { color: #333;}

h2 { color : #000; font-size:1.7em ; font-family: 'Trebuchet MS', serif ; font-weight:normal ; letter-spacing:0.1em ; margin-bottom:1em ; }

h3 { color : #fff; font-size: 1.1em ; font-family:  'Trebuchet MS', serif ; font-weight: bold ; margin-bottom: 0.5em ; background: url(/stc/img/bg_h3.gif) center left repeat-x  ; text-transform: uppercase; padding : 2px 10px;}


h4 { color : #009FDD;  font-size: 1.1em ; font-family:  'Trebuchet MS', serif ; font-weight: bold ; margin-bottom: 0.5em ; text-transform: uppercase; }
h5 { font-size:1.1em ; font-weight:bold ; margin-bottom:0.5em ;}

/* naviList class to reduce redundancy */
ul.naviList { margin:0 ; padding:0 ; list-style:none ; } 
ul.naviList ul { list-style:none ; }
ul.naviList li { }



/* Bottom margins*/
p {margin-bottom: 1em;}
p { padding: 0 15px 15px 15px;}
#middle.wide p{padding: 0;}
#middle.widest p{padding: 0;}


/*Div positioning*/

#site{ width: 955px ; margin:0 auto ; min-height:100% ; position:relative ; padding:0; }
* html #site{height: 100%;}



#mainSite{width: 810px; float: left; text-align: left; overflow:hidden}
        #topBanners{padding: 0 0 5px 0; height : 90px;}
        #logoArea{float: left; width: 100%; }
                #logoArea h1 { width: 235px; height: 134px ; background:url(/stc/img/bg_logo.gif) no-repeat top left ; }
                #logoArea h1 a { display:block ; width: 235px; height: 134px;}
                #logoArea h1 a span { display:none ; }
                #logo{float: left; width: 235px; }
                #topNaviCont{background: url(/stc/img/bg_topNavi.gif) bottom left repeat-x; float: left; padding: 28px 0 0 0;}
        #indent{padding: 0 2px; background: #fff; float: left; min-height: 500px;}
                #top{background: #fff; width: 805px; overflow: hidden; margin: 0; padding: 0;}
                        #topLeft{width: 390px; height: 200px; background: url(/stc/img/topLeft2.jpg) 0 0 no-repeat;}
                        #topRight{width: 416px; height: 200px; background: url(/stc/img/topRight2.jpg) 0 0 no-repeat;}
                #siteBody {text-align: left; background: #fff; float: left; padding: 12px 0 0 0; margin: 0; width: 100%; float: left; overflow: hidden;}
                #siteBody.widest{background: url(/stc/img/bg_body_shadow.gif) 0 0 no-repeat;}
                        #colContainer{background: transparent url(/stc/img/bg_siteBodyGrad.gif) bottom left no-repeat; margin: 0; padding: 0 0 12px 0; }
                        #colLines{background: url(/stc/img/bg_colLines.gif) 0 0 repeat-y; }
                        .columns {float:left ; display: inline;}
                        #left { width: 235px; overflow: hidden;}
                                #left p{padding-bottom: 15px;}
                        #middle { width: 335px ; overflow: hidden;}
                        #middle.wide { width: 532px; float: left; }
                          #midContainer{ padding: 0 10px 0 10px; }
                        #middle.widest { width: 806px ; background: none;}
                        * html .widest{width: 806px !important; background: none;}
                        #right { width: 236px; overflow: hidden;}
                        #siteBody.wideBody #right{float: left; width: 274px;}
                          #rightContainer{ padding: 0 15px 0 0; }
                                #right p{padding: 0 15px 15px 15px;}
                                #mainSite.front #right p{padding: 0;}
                        #siteBody.widest #right p{padding: 0;}

        #footer { position: relative; float: left; width: 100%; background: #004D77; font-size: 11px; }
                #footer a{color: #fff;}
                #footerBR{background: url(/stc/img/footerBR.gif) bottom right no-repeat; color: #fff; padding: 7px 14px;}
                #footerBR a {  border-left : 1px solid #FFF; padding: 0 4px ;  }
                #footerBL{background: url(/stc/img/footerBL.gif) bottom left no-repeat; height: 100%;}
                #footerB{background: url(/stc/img/footer_dot.gif) bottom left repeat-x; height: 100%; }
                #footerL{background: url(/stc/img/footer_dot.gif) top left repeat-y; height: 100%;}
                #footerR{background: url(/stc/img/footer_dot.gif) top right repeat-y; height: 100%;}
                
                div#navigoCMS { font:10px Verdana, sans-serif; color: #ACACA8; position:absolute ; right:0 ; bottom: -25px ; height:18px ; width:170px ;}
                div#navigoCMS strong { color: #ACACA8;}
                div#navigoCMS a { color: #ACACA8; text-decoration:none ; padding-left:22px ; background:url(/stc/img/logo_navigo.gif) no-repeat center left ;}
                div#navigoCMS acronym { text-decoration: none; border: none;}
                
#frontBanner { width:300px ; margin:0 auto ; }
#rightBanners{ float: left; width: 145px; min-height: 100%; text-align: left;}
#bannerPad{padding-left: 5px; padding-top:128px ; }

* html #rightBanners{height: 100%; width: 145px !important;}

#supportNavi { position:absolute ; top:10px ; right:0 ; }
#supportNavi form { }
#supportNavi li { float:left ; }
#supportNavi li a { display:block ; padding:2px 5px ; }
#supportNavi li span { display:block ; padding:2px 0 2px 5px; color:#0aa0c0 ;}
#supportNavi li.textSize a { padding:2px 0 2px 2px ; }

/* navigation */
ul#topNavi {list-style: none; margin: 0; padding: 2px 19px 0 0;float: left; background: url(/stc/img/bg_topNaviR.gif) top right no-repeat;}
#topNavi li { float: left; margin: 0 15px 0 0; padding: 0; display: inline;}
#topNavi li a.topNaviLink { margin: 0; float: left; background: none; text-decoration: none; display: block; width: 124px; height: 104px; color: #fff;}
#topNavi .topNaviText{display: none;}

#topNavi a#aanesta{background: url(/stc/img/topNavi_aanesta.gif) 0 0 no-repeat;}
#topNavi a#televisio{background: url(/stc/img/topNavi_televisio.gif) 0 0 no-repeat;}
#topNavi a#rakennuskohde{background: url(/stc/img/topNavi_kohde.gif) 0 0 no-repeat;}
#topNavi a#tietoa{background: url(/stc/img/topNavi_uutiset.gif) 0 0 no-repeat;}



/*DocNavi*/

#docNavi { float: left; width: 100%; padding-top: 4px; background : #fff; }
#docNavi ul { float: left; list-style: none; width: 794px; padding-left: 10px; margin : 0 2px; }
* html #docNavi ul { width : 792px; } 
#docNavi ul li { float: left; margin : 0; }

.docNaviSpace{ padding-left: 10px; float: left; }

#docNavi.yellow ul {background: #DE9416 url(/stc/img/bg_docNaviY.gif) center left repeat-x; border-right : 1px solid #DE9416; border-left : 1px solid #DE9416; float: left;  }

#docNavi.blue ul {background: #4F93C9 url(/stc/img/bg_docNaviB.gif) center left repeat-x; border-right: 1px solid #4F93C9 ; border-left: 1px solid #4F93C9; float: left;   }

#docNavi.red ul {background: #C93C79 url(/stc/img/bg_docNaviR.gif) center left repeat-x;  border : 1px solid #C93C79; float: left;   }

#docNavi.green ul {background: #86A93A url(/stc/img/bg_docNaviG.gif) center left repeat-x; border : 1px solid #86A93A; float: left;   }

#docNavi.default ul {background: #004D77 url(/stc/img/bg_docNaviD.gif) center left repeat-x; border : 1px solid #004D77; float: left;   }

#docNavi a { color: #fff; text-decoration: none; font: bold 11px Verdana, sans-serif; display: block; padding : 1px 10px; }
* html #docNavi a { padding : 3px 10px; margin : 0px; }

 

#docNavi.yellow a.act, #docNavi.yellow a:hover { background : url(/stc/img/bg_docNaviY_act.gif) center left repeat-x; }
#docNavi.blue a.act,   #docNavi.blue a:hover { background : url(/stc/img/bg_docNaviB_act.gif) center left repeat-x; }
#docNavi.red a.act,    #docNavi.red a:hover { background : url(/stc/img/bg_docNaviR_act.gif) center left repeat-x; }
#docNavi.green a.act,  #docNavi.green a:hover { background : url(/stc/img/bg_docNaviG_act.gif) center left repeat-x; }



#breadcrumb { margin-top:5px ; font-size:0.9em ; color:#000 ;  }
#breadcrumb a { color:#666 ; }
#breadcrumb a:hover { color:#777 ; text-decoration:none ; }
#breadcrumb a.active { font-weight:bold ; }

/* content elements */

/* news list */
.newsList p{margin:0; padding: 0;}
.newsList h4 { font-size: 1em; font-weight: normal; margin: 0; padding: 0 15px 0 15px;}
.newsList a { text-decoration:none ; color: #014C76;}
.newsList a:hover {color: #1E78AB; text-decoration: underline;}
.newsList h4 a {}
.newsItem td { vertical-align : top; }

#left a{text-decoration:none ; color: #014C76;}
#left a:hover {color: #1E78AB; text-decoration: underline;}

/* news document */
.newsSummary { font-style:italic ; }

/* highlight element */
.highLight { border:5px solid #b5c4cf ; padding:5px ; margin-bottom:0.5em ; }
.highLight h3 { margin:0 ; border-bottom:1px solid #ddd ; padding-bottom:5px ; }

/*Round highlight*/	
div.roundHigh, div.optionHigh, div.greenHigh{clear: both; width: 100%; float: left;}
.b, .l, .r, .bl, .br, .tl, .tr{margin: 0; padding: 0;}
div.roundHigh { margin-bottom : 1em; }
.roundHigh .t {background: url(/stc/img/high/highT.gif) 0 0 repeat-x; padding: 0;}
.optionHigh .t {background: url(/stc/img/high/optT.gif) 0 0 repeat-x; padding: 0;}
.greenHigh .t {background: url(/stc/img/high/greenT.gif) 0 0 repeat-x; padding: 0;}

.b {background: url(/stc/img/high/highB.gif) 0 100% repeat-x;} 
.greenHigh .b {background: url(/stc/img/high/greenB.gif) 0 100% repeat-x;} 

.l {background: url(/stc/img/high/highL.gif) 0 0 repeat-y;}
.greenHigh .l {background: url(/stc/img/high/greenL.gif) 0 0 repeat-y;}

.r {background: url(/stc/img/high/highR.gif) 100% 0 repeat-y;}
.greenHigh .r {background: url(/stc/img/high/greenR.gif) 100% 0 repeat-y;}

.bl {background: url(/stc/img/high/highBL.gif) bottom left no-repeat}
.greenHigh .bl {background: url(/stc/img/high/greenBL.gif) bottom left no-repeat}

.br {background: url(/stc/img/high/highBR.gif) bottom right no-repeat}
.greenHigh .br {background: url(/stc/img/high/greenBR.gif) bottom right no-repeat}

.tl {background: url(/stc/img/high/highTL.gif) 0 0 no-repeat}
.optionHigh .tl {background: url(/stc/img/high/optTL.gif) 0 0 no-repeat}
.greenHigh .tl {background: url(/stc/img/high/greenTL.gif) 0 0 no-repeat}

.tr {background: url(/stc/img/high/highTR.gif) 100% 0 no-repeat; padding: 19px 11px; }
.optionHigh .tr {background: url(/stc/img/high/optTR.gif) 100% 0 no-repeat; padding: 0;}
.greenHigh .tr {background: url(/stc/img/high/greenTR.gif) 100% 0 no-repeat; padding: 19px 11px;}

/* 2col equal sized*/
.columnContainer { width:100% ; }
.columnContainer div {  margin : 0; }
.columnContainer .columns { width: 49%;}
.rightcol { float: right; }
.columnContent { width: 100%; }

.columnContainer div.twoCol { width : 519px; float: left;}
.columnContainer div.oneCol { width : 252px;  float: left;}
.columnContainer .colMargin { margin-right : 15px; }

.editMode .columnContainer .colMargin { margin-right : 5px; }

.columnContainer .colNarrow { width : 24%; float : left; }
.columnContainer .colWide { width : 75%; float : left; }

.colWide p { margin-bottom : 0; }
.colWide p strong { font-weight : normal; width : 6em; display: block; float:left; }
/* include_partners.jsp */

#partnersContainer { padding : 0 12px; }
.partners .colMargin { width : 259px; padding-right: 7px; margin-right : 7px; border-right : 1px solid #59BEE8; min-height : 100px; }
* html .partners .colMargin { height : 100px; }
.columnContainer div.partners { margin-bottom : 1em; }


/*4col*/

.fourCol{margin:0; padding: 0; width: 100%; margin-right:10px ;}
.topl, .topr{border-bottom: 1px solid #59BEE8;}
.fourCol td{padding: 10px !important;}

.topl{background: url(/stc/img/high/highDot.gif) top right repeat-y; }
.botl{background: url(/stc/img/high/highDot.gif) top right repeat-y;}



/* tables */

/* common for all tables */
#siteBody table {border-collapse: collapse;}
#siteBody table td {vertical-align: top; padding: 0.3em;}
.u4-table-default, .u4-table-visible-borders, .u4-table-stripe {margin:0 0 10px 0}
.u4-table-visible-borders td, .u4-table-complete td {border-top:1px solid #ddd ; background:#fff url(/stc/img/bg_table_borders_td.gif) repeat-x top left ; }

.u4-table-stripe-header, .u4-table-stripe-odd, .u4-table-complete-header2, .u4-table-complete-even {background:#f3f3f3}
.u4-table-stripe-header2, .u4-table-stripe-even, .u4-table-complete-odd {background:#ffffff}

.u4-table-complete-header td {background:#e8eff8; color: #fff; font-weight: bold;}

#siteBody .u4-table-empty td{padding: 2px;}

td.u4-table-empty-blueBorder { border-left:1px solid #59beea ; padding-left:10px !important ; }

 /* sitemap */

.siteMap { width:300px ; padding-bottom:2em ; }
.siteMap a { text-decoration:none ; display:block ; color:#333 ; }
.siteMap a:hover { color:#c00 ; }
.siteMap ul li { list-style:disc ; }

.siteMapDocumentLevel0 { padding:0.2em ; background:url(/stc/img/siteMap/sitemap_document.gif) 0px center no-repeat ; padding-left:2em ; }
.siteMapDocumentLevel1 { padding:0.2em ; background:url(/stc/img/siteMap/sitemap_subdocument.gif) 0px center no-repeat ; font-size:0.9em ; }

.depth0 { padding-left:25px ; background-position:5px center ; width:275px ; }
.depth1 { padding-left:40px ; background-position:20px center ; width:260px ; }
.depth2 { padding-left:55px ; background-position:35px center ; width:245px ; } 
.depth3 { padding-left:70px ; background-position:50px center ; width:230px ; }
.depth4 { padding-left:85px ; background-position:65px center ; width:215px ; }
.depth5 { padding-left:100px ; background-position:80px center ; width:200px ; }
	
.siteMapFolderLevel1 a { background:url(/stc/img/siteMap/sitemap_folder.gif) 5px center no-repeat ; padding-left:20px ; font-weight:bold ; }
.siteMapFolderLevel2 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) 20px center no-repeat ; padding-left:40px ; }
.siteMapFolderLevel3 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) 35px center no-repeat ; padding-left:55px ; }
.siteMapFolderLevel4 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) 50px center no-repeat ; padding-left:70px ; }
.siteMapFolderLevel5 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) 65px center no-repeat ; padding-left:85px ; }

.stripe { background-color:#f9f9f9 ; }

/* following styles apply to navigo top tools */


table.u4-em-ie { border-collapse:collapse ; }
table.u4-em-ie td { font-size:11px ; padding:2px ; border:none ; }
table.u4-em-ie td.styleSelector-active { background:#efefef ; border:none ; cursor:pointer ; }


/* 2 and 3 col elements */

div.ce-c {width: 747px; height: auto;}
div.ce-l, div.ce-r, div.ce-lt, div.ce-mt, div.ce-rt {float: left; height: auto}
div.ce-l, div.ce-lt, div.ce-mt {padding-right: 2%}
div.ce-l, div.ce-r {width: 49%}
div.ce-lt{width: 28%;}
div.ce-mt {width: 39%;}
div.ce-rt {width: 28%}
div.ce-p, div.ce-pb {width: auto; height: auto; padding-right: 5px}
div.ce-pb {border-right: 1px solid #59BEE8;}
div.ce-rt div.ce-pb{border:0; background: none;}
.ce-b{clear: both;}

#top { height:200px ; background:url(/stc/img/bg_topSlot.jpg) no-repeat top left; }




/*ImageList*/

div.imageListContainer {
			width: 400px;
			margin: auto;
			/* border : 1px solid #59BEE8; */
			padding : 5px;
			background : #f8fbff;
}

div#bigImageDiv {
			background: white; 
			width: 395px; 
			text-align: center; 
			vertical-align: middle;
			background : #f8fbff;
}
div.smallListImage {	
			background: #f8fbff; 
			float: left; 
			height: 80px;
			margin-top: 1em; 
			width: 112px; 
}

div.smallImageMargin { margin-right: 30px; } 

div.smallListImage a {
			display: table-cell; 
			height: 80px; 
			text-align: center; 
			vertical-align: middle;
			width: 112px; 
}

span#bigImageCaption {	font-style: italic; display : block; overflow : hidden; text-align : center; width : 100%;}
div.smallListImage { 
			text-align:center; 
			vertical-align:middle; 
}


/*
div.imageListContainer {
			width: 400px;
}

div#bigImageDiv {
			background: white; 
			width: 395px; 
			text-align: center; 
			vertical-align: middle;
}
div.smallListImage {	
			background: white; 
			float: left; 
			height: 80px;
			margin-bottom: 2px; 
			margin-right: 2px; 
			width: 112px; 
}
div.smallListImage a {
			display: table-cell; 
			height: 80px; 
			text-align: center; 
			vertical-align: middle;
			width: 112px; 
}

span#bigImageCaption {	font-style: italic; }
div.smallListImage { 
			text-align:center; 
			vertical-align:middle; 
}

*/

/* Latest posts */
		.latestPostsFrame { width: 100%; overflow : hidden; height: 180px; border: none; }
		
		.latestPosts { text-align : left; background : #fff; height : 100%; margin : 0; padding : 0; }
		
		
		.latestPosts .topicTitle, 
		.latestPosts .topicWriter,
		.latestPosts .topicViews,
		.latestPosts .topicReplies,
		.latestPosts .topicTime  { overflow : hidden; display: block; float : left; white-space: nowrap; margin-right: 2%;}
		
		.latestPosts .topicTitle {width : 48%; }
		
		.latestPosts .topicWriter {width : 20%; }
 		* html .latestPosts .topicWriter {width : 15%; }
 		
		.latestPosts .topicViews {width : 9%; }
		.latestPosts .topicReplies { display: none;}
		.latestPosts .topicTime {width : 15%; }
		.latestPostRow { width : 100% ; clear: both;}
		.latestPostTitleRow { font-weight : bold; }
/* ce_voteResults */

.columnContainer div.voteOption { clear: both; margin-bottom : 5px; }
.voteOptionTitle { float: left; width : 50%; }
.votePercent 	  { float: left; width : 10%; }
.votePercentBarArea  { float: right; width : 30%; height : 100%; }

.voteOptionTitle .voteOptionTitle, .votePercent .votePercent, .votePercentBar .votePercentBar { width : 100% }
.votePercentBar { background : #FBB034; border : 1px solid #F1A321; height : 10px; float : right;}

/* php-RSSfeed reader */
.taloussanomatLogo { width : 85px; float: right; }
.TalousuutisetFrame { width: 80%; overflow : auto; height: 100px; border: none; background : #FFF; float : left; }


/* .newsPubDate, .newsTitle, .newsItem{ margin: 0; padding: 0;} */
.newsList { width : 100%; text-align : left; background : #fff; height : 100%;  border-collapse: collapse; margin: 0; padding: 0; }
.newsPubDate { vertical-align : top; padding-right : 5px;}


/* ce_taloussanomat_korot */
.TalousuutisetKorot .graafi {float : left; margin-right : 45px; }

/* voteFrame */
#voteFrameNarrow { width : 100%; height : 430px;   }

/* feedback form */
.emailForm .textInputTd { width : 150px; }
input.emailForm  { margin-left : 160px; }

#inviteFriend { margin-bottom : 10px; }

.flashRelative {position: relative; height:765px;}
.flashAbsolute {position: absolute; left:-160px;}