body { 
	margin: 0; 
	padding: 0; 
	font-family: Arial, Verdana, Helvetica, sans-serif; 
	text-align: center;
    background-color: #fff;
}

a img{border:0;}

/* paragraph & cell styles */
.leftAlign { text-align:left ; }
.rightAlign { text-align:right ; }
.center { text-align:center ; }
.justified { text-align:justify ; }
.allcaps { text-transform: uppercase; }
.hideFromScreen, .h { display:none ; visibility: hidden; }
.spacer { clear:both ; height:1px; overflow:hidden ; margin-bottom: -1px; }
.nopadding { padding: 0!important; }
.nomargin { margin: 0!important; }

p { line-height:1.3em ; font-size: 0.8em; }
.fatFooter p { line-height:1em !important; font-size: 0.8em; }

.w30 { width: 100px; }

.u4-image-caption { }

 /* applies to paragraphs, lists, you name it */
#siteBody { margin-top:10px; }
/*#siteBody li p { line-height: 1; }*/

 /* link styles apply unless something else is specified in css (eg. for navigation elements) */
a { 
    color: #5C7A30; 
    text-decoration: none;
} 

a:hover { color: #5C7A30; text-decoration: underline; }
a.external { color: #5C7A30; text-decoration: none; }

.fatFooter a{color:#32343E !important;}

#middle h1,
#middle h2,
#right h2,
#middle h3,
#middle h4,
#middle h5 { color: #5c7a30; }
h1,h2 { font-size: 1.3em; font-weight: normal; }
h1 b,h2 b {font-weight: normal;}
h3 { font-weight: normal; }
h4 { font-weight: normal; }
h5 { font-weight: normal; }

#siteBody label {display: block;}

/* naviList class to reduce redundancy */
ul.naviList { margin:0 ; padding:0 ; list-style:none ; } 
ul.naviList ul { margin:0 ; padding:0 ; list-style:none ; }
ul.naviList li { margin:0 ; padding:0 ; }
ul.naviList li a { background-image: none!important; }
 /* layout + columns */
 /*******************************
  #site: site container
  #siteBody: content container (under #top), .wide for 2 column layout, .widest for 1col
  #left, #middle, #right: layout columns, .column to reduce redundancy
   \     `-navigo:content
    `#docNavi
  #top: logo, top image (if applicable), #supportNavigation, #topNavi
  #footer: navigo-cms, footer slot
 *******************************/	

/* change margin:0 auto to margin:0 to have site aligned to left */
#site { 
    background-color: white;
	width: 940px;
	margin: 0 auto;
	text-align: left;
    overflow: hidden;
}

#site.editMode {
    width: 940px;
/*  overflow: visible!important; */
}

#siteBody { 
	clear:both ; 
	text-align:left ; 
}

.columns { float:left ;  }
.col240 { width: 220px; padding: 0 10px 0 10px; }
.lightText { color: #fff; /*background-color: #7596b7;*/ }
.darkText { color: #003170; /*background-color: #c9dceb;*/ }

#left { 
	margin-right: 60px; 
}
#middle { 	
	display: inline;
	margin-top: 20px; 
    	color: #32343e;
    	position: relative;
	width:540px;
}
#middle.wide { width: 910px; }
#middle.widest { }
#middle h2, #middle h1 {
	margin-top: 0px;
}
#middle p {
    margin-bottom: 0;
}
#middle a.navigo-attachment {
     font-size: 0.8em;
}

/*#middle div { display: inline; }*/
.editMode #middle div { display: block; }
/*#middle a {
    background: url(/stc/img/linkkinuoli_vaalea.jpg) no-repeat right ;
	padding-right: 20px;
}*/
/* Added ie hack to because ie cannot understand declaration above this comment 
	really?? VP
*/
* html .widest {  }
#topBanner { width: 100%; }
#topBanner img { display: block; }
#topBanner.gallery {
    padding-left: 50px;
}
* html #topBanner.gallery {
    padding-left: 0;
}
.editMode #middle div { width : 100% ;}
.editMode #topBanner div { width : 100% ; overflow: visible; position: relative; }

#footer { 
	_height: 40px;
	min-height: 40px;
	color: black;
	border-top: 2px solid #b1be30;
	margin-top:10px;
}

#footer p { display: block; color: black; font-size: 0.71em; margin-top: 12px; line-height: 2em; padding:0;margin:5px 0;}
#footer p a { text-decoration:underline;}
#footer p a:hover { color: #5C7A30; text-decoration:none;}

#footer #nccLogoBoksi {
    position: absolute;
    top: 0px;
    right: 0px;
    float: right;
}

.fatFooter {padding-top:20px;}

/* do not change ; always the same (unless logo/type is NOT on white bg) */
#navigofooter { 
	width: 940px;
	margin: 5px auto;
}
div#navigoCMS { float: right; display: block; font:10px Verdana, sans-serif ; color:#c7c9c8 ; position: relative; right:0 ; bottom: 0px ; height:18px ; /*background:#fff ;*/ width:170px ; }
div#navigoCMS strong { color:#c7c9c8 ; }
div#navigoCMS a { color: #c7c9c8 ; 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 ; }

#top { width: 100%; height:95px ; border-top: 1px solid white;  position:relative ; font-weight:bold;}
#top h1 {  margin:0 ; padding:0 ; background: url(/stc/img/logo.gif) no-repeat top left ; height: 85px; width: 191px; position:absolute ; top:10px ; }

#top h1 a { display:block ; height: 85px; width: 191px; } /* needs width & height same as h1 (logo) */
#top h1 a span { display:none ; }

#logo2 { position:absolute ; top:10px ; }

#supportNavi { float:right; margin-top:10px; white-space:nowrap;}
#supportNavi form { margin:0 ; padding:0 ; position:absolute ; top: 60px; right:0px; }
#supportNavi label { color:#b1bf2e; font-size:0.8em;}
#supportNavi select {border:1px solid #cdcdcd;width:300px;}
#supportNavi li { text-align: right; padding: 0 0 0 30px; display: inline; float:left ; font-family: Arial, Verdana, Helvetica, sans-serif;  font-size: 0.8em;}
#supportNavi li a { text-decoration: underline; font-family: Arial, Verdana, Helvetica, sans-serif; padding:1px 5px;}
#supportNavi li a:hover { color: white; text-decoration: none; background-color:#b1bf2e;}
#supportNavi li span { display:block ;} /* span only required if links require two overlaid background images */
#supportNavi li.textSize a { }

#supportNavi #nccbpkohteet p { color: #5c7a30; margin:0 ; padding:2px 0 0 0 ; float:left ;}
#supportNavi #nccbpkohteet select { margin-top:-3px ; float:left ; }

/* navigation */
#topNavi {min-height:35px; background-color: #b1bf2e;}
#topNavi li { float:left ; color: #5c7a30; font-family: Arial, Verdana, Helvetica, sans-serif;  font-size: 0.8em; border-right: 1px solid white;}
#topNavi li a {  display:block ; float:left ; color: #5c7a30; text-decoration: none; font-family: Arial, Verdana, Helvetica, sans-serif; padding: 10px 20px; font-weight:bold;}
#topNavi li a:hover {background:#5c7a30;color: #fff;}
* #topNavi li a { height:1% ; }
#topNavi li a.act {color:#fff; background:#5c7a30;}

#topNavi #extraNavi { float: right; }
#topNavi #extraNavi ul { list-style-type: none; margin: 0; padding: 0; }
#topNavi #extraNavi li { margin-right: 5px; }

#docNavi { }
#docNavi li, #docNavi2 li { border-bottom: 1px solid #cdcdcd;} /* without inline declaration ie box model bug kicks in, adding spaces between the li's */
#docNavi li a, #docNavi2 li a {color: #B1BF2E; display:block ; text-decoration: none; font-weight: bold; font-size: 0.8em; font-family: Arial, Verdana, Helvetica, sans-serif; padding:2px;}
#docNavi li a:hover, #docNavi2 li a:hover { color: #5c7a30;  }
#docNavi li a.act, #docNavi2 li a.act { color: #5c7a30;  }
#docNavi li ul { margin-bottom: 20px; margin-left: 20px; }
#docNavi li li a { font-weight: normal; }
#docNavi li li li a { } /* add more as needed... */
* html ul#docNavi a { height:1% ; }

/*
#docNavi2 { margin-left: 20px; }
#docNavi2 ul { display: inline; }
#docNavi2 ul li { display: inline; float: left; }
#docNavi2 ul li a { display: block; margin-right: 15px; padding-top: 4px; }
*/
#docNavi2 { margin-left: 20px; margin-bottom: 0; }
#docNavi2 p { color: #7596b7; display: block; float: left; margin: 5px 0 0 0; }
#docNavi2 ul { display: inline; }
#docNavi2 ul li { display: inline; float: left; }
#docNavi2 ul li a { display: block; margin-right: 15px; padding-top: 4px; color: #7596b7; }
#docNavi2 ul li a.act, #docNavi2 ul li a:hover { color: #b1bf2e; }

#inDocNavi {position: relative; margin-bottom: -50px; height: 50px; top: -45px; }
#inDocNavi ul { display: inline; font-size: 0.8em;}
#inDocNavi ul li { display: inline; }
#inDocNavi ul li a { padding-top: 4px; }

#breadcrumb {  }
#breadcrumb a { }
#breadcrumb a:hover { }
#breadcrumb a.active {  }


/* Extranet */
#supportNavi div#extranetnavi { font-size: 0.7em; color: #5c7a30;right:0;position:absolute;}
#supportNavi div#extranetSearch { font-size: 0.9em; color: #5c7a30;}
#supportNavi div#extranetSearch form { margin:0 ; padding:0 ; position:relative ; }
#supportNavi div#extranetnavi a {color: #5c7a30;}
.extranet #topNavi { background-color: #2375bb; }
.extranet #topNavi li a { color: #b5c3d1; }
.extranet #topNavi li a.act { color: white; font-weight: bold; background-color: transparent; }
/*.extranet #top { background: url(/stc/img/bg_ncc_extranet.jpg) no-repeat right top; }*/
.extranet #topBanner #extranetSlotit {padding-bottom: 5px; float: left; background: url(/stc/img/bg_ncc_extranet_dblue_lblue.jpg) repeat-y;}
.extranet #topBanner #extranetSlotit h4 { margin-top: 14px;  }



 /* content elements */
    
 /* Viritys etusivun kuvan kanssa alareunatasatulle lootalle */
.alapalkkiEtusivu {
	text-align: left;
	position: relative;
	left: 0;
    bottom: 115px;
	padding: 0 0 15px 0;
    color: white;
	width: 480px;
    _height: 100px;
    min-height: 100px;
    background: url(/stc/img/bg_sitebodyfooter_darklight.gif) repeat-y;
	margin-bottom: -180px;
	float: left;	
}
.extranet .alapalkkiEtusivu{font-size: 0.8em;}

* html .alapalkkiEtusivu { padding-top: 15px; height: 85px; }
.editMode .alapalkkiEtusivu {
    bottom: 57px;
    padding: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    background-image: none;
}
.editMode .alapalkkiEtusivu div {    
    background: url(/stc/img/bg_sitebodyfooter_darklight.gif) repeat-y;
}
.alapalkkiEtusivu p, .alapalkkiEtusivu h2, .alapalkkiEtusivu h3 {
    margin-left: 50px;
    font-size: 1.2em;
}
.alapalkkiEtusivu a {
	color: white;
	text-decoration: none;
	background: url(/stc/img/linkkinuoli_tumma.gif) no-repeat right ;
	padding-right: 20px;    
}
.alapalkkiEtusivu a:hover {
	color: white;
    text-decoration: none;
}

/* Muille sivuilla k�ytet��n n�it�, kun homma on kokoleve� ratkaisu */
.alapalkki {
	width: 910px;
	padding-left: 50px;
	margin-bottom: 0px;
	overflow: hidden;
	float: left;
    background: url(/stc/img/bg_alapalkki.gif) repeat-y;
}

.alapalkki2 {
	width: 480px;
	padding: 0px;
	background : none;
}

.alapalkki2Background {
	background-color: #7496B5;
}

.alapalkkinopadding {
	padding: 0 0 0 0!important;
	width: 960px!important;
} 
.alapalkki img { float: left; display: block; padding: 0!important; margin: 0!important; border: 0!important; }
.alapalkki h2 { color: white; margin: 15px 0 0 0; }
.alapalkki p, .alapalkki a {color: white; text-decoration: none; font-size: 0.8em; }
.alapalkki a:hover { color: white; }
.alapalkkiOikea {
	float: right;
	width: 450px;
	padding: 15px 15px 15px 15px;
	_height: 88px;
	min-height: 88px;
}
.alapalkkiVuokraus {
}
        .alapalkkiVuokraus .alapalkkivasen {
            margin-left: 50px; 
            margin-right: 341px;
            position: relative;
        }
    
        .alapalkkiVuokraus .alapalkkiOikea {
            background-color: #b1bf2e;
            color: #fff;
            margin: 0;
            padding: 0 10px 15px 10px;
            position: relative;
            width: 291px;
        }
                .alapalkkiVuokraus .alapalkkiOikea * {
                    margin-left: 15px;
                }
            
                        .alapalkkiVuokraus .alapalkkiOikea * * {
                            margin-left: 0;
                        }
.editMode .alapalkkiOikea {
    padding: 0;
}
.alapalkkiVasen {
    float: left;
    width: 420px;
}
.editMode .alapalkkiVasen {
}
.alapalkkiTumma {
	color: white;	
}
    .alapalkkiTumma a:hover {
        color: #b1bf2e;
    }
    .alapalkkiTumma a.act {
        color: #b1bf2e;
    }
.alapalkkiVaalea {
	background: url(/stc/img/bg_alapalkki.gif);
}

 
 /* news list */
.newsList { font-size: 13px; }
.newsList h4 {  }
.newsList a, div.newsList a:hover { font-size: 13px;  }
.newsList a:hover {  }
.newsList h4 a {  }
.newsList p {  }
.newsList p a { }
/*.newsList span.readMore { color: #252836; }*/
.newsLiat span.readMore { color: #cce0f1; }
 /* news document */
.newsSummary { }

 /* highlight element */
.highLight {  }
.highLight h3 {  } 

 /* 2col */
.columnContainer { }
.columnContainer .columns { width: 48%;} 
.columnContainer a { background-image: none !important; padding: 0 !important;}

 /* tables */

/* common for all tables */
#siteBody table {border-collapse: collapse;}
#siteBody table td {
    vertical-align: middle; 
    padding: 0.3em;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size:0.8em; 
}
table p {padding:0; margin:0; font-size:1em;}
.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 ; border-bottom:1px solid #ddd; }

.u4-table-stripe-header, .u4-table-stripe-odd, .u4-table-complete-header2, .u4-table-complete-even {background:#c9dceb}
.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;}

 /* sitemap */

.siteMap { width:300px ; margin:0 ; padding-bottom:2em ; }
.siteMap a { font-size: 0.8em; text-decoration:none ; display:block ; color:#333 ; margin:0 ; background-image: none!important; }
.siteMap a:hover { color:#c00 ; }
.siteMap ul li { list-style:disc ; }

.siteMapDocumentLevel0 { padding:0.2em ;  background:url(/stc/img/siteMap/sitemap_document.gif) no-repeat 0px center ; padding-left:2em ; }
.siteMapDocumentLevel1 { padding:0.2em ; background:url(/stc/img/siteMap/sitemap_subdocument.gif) no-repeat 0px center ; 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:85px ; background-position:0px center ; width:215px ; }
	
.siteMapFolderLevel1 a { background:url(/stc/img/siteMap/sitemap_folder.gif) no-repeat 5px center ; padding-left:20px ; font-weight:bold ; }
.siteMapFolderLevel2 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) no-repeat 10px center ; padding-left:33px ; }
.siteMapFolderLevel3 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) no-repeat 25px center ; padding-left:45px ; }
.siteMapFolderLevel4 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) no-repeat 40px center ; padding-left:60px ; }
.siteMapFolderLevel5 a { background:url(/stc/img/siteMap/sitemap_subfolder.gif) no-repeat 55px center ; padding-left:75px ; }

.stripe { background-color:#f9f9f9 ; }

.galleryImageSmall {
    display: block;
    float: left;
    height: 120px;
    width: 120px!important;
    overflow: hidden;
}
.galleryImageSmall a {
    color: #fff;
    border: 0;
    text-decoration: none;
    display: inline;
    float: left;
}
.galleryImageSmall img {    
    border: 0;
    padding: 0;
    margin: 0;
}
.editMode .galleryImageSmall {
    border: 1px solid gray;
    height: 120px;
    width: 120px!important;
}
.editMode .galleryImageLarge {
    border: 1px solid gray;
}
.galleryImageLarge {
    display: none;
}

/* Pohjaesittely */
#middle #switchLinks {
    clear: both;
    margin: 25px 0 25px 20px;
    padding: 0;
}
* html #middle #switchLinks {
    margin-left: 40px;
}
        #middle #switchLinks p { 
            color: #7596b7;
            margin: 0;
            padding: 0;
            display: block;
            float: left;
        }
        #middle #switchLinks a {             
            display: block; 
            float: left;
            color: #7596b7;
            margin-right: 5px;
        }
        #middle #switchLinks a.act { 
            color: #b1bf2e;
        }

#middle .pohjakuvacontainer {
    clear: both;
    float: left;
    margin-top: 30px;
    min-height: 473px;
    width: 580px;
}
        #middle .pohjakuvacontainer .pohjakuvan-otsikko {
            display: none;
            visibility: hidden;
        }
    
        #middle .pohjakuvacontainer .leipis {
            margin-left: 20px;
        }

        #middle .pohjakuvacontainer .pohjakuva {
            display: none;
            float: left;
        }
           
        #middle .pohjakuvacontainer .first {
            display: block;
        }

        .editMode #middle .pohjakuvacontainer .pohjakuva {
            display: block!important;
            visibility: visible;
        }
    
        .editMode #middle .pohjakuvacontainer .pohjakuvan-otsikko {
           display: block!important;
           visibility: visible;
        }

#rightSideBar {
    background-color: #c9dceb;
    display: block;
    float: left;
    margin: 0;
    min-height: 100%;
    overflow: hidden;
    padding-bottom: 50px;
    position: absolute;
    right: 0;
    top: 0;
    width: 311px!important;    
}

.editMode #rightSideBar div {
    width: 311px!important;
/*    overflow: visible!important; */
}

* html #rightSideBar {
    height: 100%;
    padding-bottom: 100px;
    text-align: right;
    zoom: 1!important;
}

        #rightSideBar .kuvat {
            float: right;
        }
        
        #rightSideBar p {
            color: white;
            margin-left: 25px;
            margin-right: 25px;
        } 

#leftNavi {width: 140px; float:left; padding-right:20px;}
#contentArea  {width:940px; float:left;}
#contentArea.narrow {width:780px;}

#right {width:380px; float:right;}
#right #contact {background-color: #ececec; padding:10px; margin-top:20px;}
#right #contact .form {display:none;}
.narrow #middle {width:380px;}

div.showButton a {background-color: #B1BF2E; padding:3px;width:auto; color:white; font-size:0.8em; font-weight:bold;}
div.showButton a:hover {background-color: #5C7A30; text-decoration:none;}
div.showButton {margin-bottom:5px;}
#right h2{ margin-top: 0}

#contact .form .submit {border:none; background-color:#B1BF2E;color:white; font-weight:bold; padding:3px; margin-top:5px; width:auto;}
#contact .form label {font-weight:bold; margin-top:5px;}
#contact .form input {width:300px; border: 1px solid #cdcdcd}
#contact .form textarea {width:300px; border: 1px solid #cdcdcd;height:6em;}
#contact .error-msg {color:red; display:block;}
#contact .form input.input-error {border:1px solid red;}

.readMore {height:28px; background: url(/stc/img/readMore.gif) no-repeat; padding:0 10px 0 40px; width:auto; white-space:nowrap; margin:auto;float:left;}
.readMore div div {width:50%;}
.readMore p {margin:0;padding:6px 0;color:white;}
.readMore a {color:white;}
.readMore a:hover {color:white;}
.edit_readMore {width:90%!important;}

#topNavi .home a {padding:0;margin:0;}
.home a span {background-image: url(/stc/img/frontpage_inactive.gif); width:40px; height:36px; display:block;}
.home a:hover span {background-image: url(/stc/img/frontpage_active.gif);}
.home a.act span {background-image: url(/stc/img/frontpage_active.gif);}

/* Twitter  */
.twitter-widget { width:360px; margin-top:1em; padding:10px; background:#ececec; }
#twtr-widget-1 { font-size:100% !important; font-family: Arial, Verdana, Helvetica, sans-serif !important; }
#twtr-widget-1 .twtr-doc { border-radius:0; }
.twtr-join-conv { font-size:0.8em; }
.twitter-widget .twtr-widget .twtr-tweet-wrap { padding:6px 0; }
.twitter-widget .twtr-hd { padding:0 0 10px 0; }

