* { margin:0 ; padding:0 ; }
html, body { height:100% ; }
body { text-align: center; background-color: #ffffff; }
#mainPage { margin: 0 auto; width: 1005px; height: auto; }
#bodyBg { position: absolute; left: 0; top: 0; height: 140px; width: 100%; background: transparent url(img/ylatausta_punainen.png) repeat-x left top; }
#bodyBg2 {position: absolute; left: 0; top: 138px; height:15px; width:100%; background: transparent url(img/koristeviiva_keski.jpg) repeat-x left top;}
#bodyBg2 div.left { left: 0; top: 0; position: absolute; height: 15px; width: 45px; background: transparent url(img/koristeviiva_vasen.jpg) no-repeat right top; }
#bodyBg2 div.right { right: 0; top: 0; position: absolute; height: 15px; width: 45px; background: transparent url(img/koristeviiva_oikea.jpg) no-repeat right top; }
#bodyBg2 div.center { }
/* paragraph & cell styles */
.leftAlign { text-align:left ; }
.rightAlign { text-align:right ; }
.center { text-align:center ; }
.justified { text-align:justify ; }
.ingress { font-size: 13px; font-weight: bold; color: #636877; margin: 15px 0; }
.h { display:none ; }
.spacer { clear:both ; height:1px ; overflow:hidden ; margin-bottom:-1px ;}
p { line-height:1.4 ; margin-bottom:0.5em ; }
strong { color:#636877 ; }
a img {border:none;}
/* 2col and 3cols */
div.cols { width: 100%; height: auto; margin-bottom: 15px; }
div.leftCol, div.rightCol, div.left2Col, div.right2Col, div.left3Col, div.middleCol, div.right3Col { float: left; height: auto; }
div.leftCol, div.left2Col, div.left3Col, div.middleCol { padding: 0; }
div.leftCol { width: 50%; }
div.rightCol { width: 49.9% }
div.left2Col { width: 35%; }
div.right2Col { width: 64.9% }
div.left3Col, div.middleCol, div.right3Col { width: 32%; }
div.cols-p { width: auto; height: auto; padding-right: 2px; }
/* Frame for Image */
#imageFrame img { margin-top: 20px; }
#imageFrame .frame { background:transparent url(img/raami.gif) no-repeat scroll left top; height:155px; position:absolute; width:189px; margin: -140px 0 0 -15px; }
* html #imageFrame .frame { background:transparent url(img/raami.gif) no-repeat scroll left top; height:155px; position:absolute; width:189px; margin: 5px 0 0 -175px; }
#imageFrame p { color: #0d749c; margin-top: 10px; }
#site .u4-image-caption { margin: 1px 0 1px 0; font-size: 12px; color: #636877; }
* html #site .u4-image-caption { margin-bottom: 6px; }
img.border { border: 3px solid #636877; padding: 10px;}
/* arrowlink */
.arrowLink {float:left;display:block;width:100%; }
#right .arrowLink ul, #middle .arrowLink ul {list-style-type: none; list-style-image: url(img/4_asteen_nuoli.gif); list-style-position: outside; padding-left: 8px;}
#middle .arrowLink ul {padding-left:0;}
#right .arrowLink ul a, #middle .arrowLink ul a {display: inline; font-weight:bold;}
/* applies to paragraphs, lists, you name it */
#siteBody { color:#636877 ; }
#siteBody li p { line-height:1 ; }
/* link styles apply unless something else is specified in css (eg. for navigation elements) */
a { color: #d50d3c; text-decoration: none; }
a:hover { color: #d50d3c; text-decoration: underline; }
a:visited { color: #d50d3c; text-decoration: none; }
a:visited:hover { color: #d50d3c; text-decoration: underline; }
/* a:active { color: #0d749c; text-decoration: none; font-size: 11px; font-style: italic; } */
a.external { /*background:url(/stc/img/icon_extLink.gif) no-repeat center right ;*/ padding-right:5px ; }
h1,h2,h3 { color: #636877; }
h1 { font-size: 20px; font-weight:bold; margin: 0; }
h2 { font-size:1.8em ; font-weight:normal ;}
h3 { font-size:14px ; font-weight:bold ; }
ul { margin:0; padding:0; list-style-position: inside;}
/* naviList class to reduce redundancy*/
ul.naviList {list-style:none; }
/*
ul.naviList ul { }
ul.naviList li { }
*/
/* naviListLang class to reduce redundancy
ul.naviListLang { margin-left: 68px; }
ul.naviListLang ul { }
ul.naviListLang li { }
* html ul.naviListLang { margin-left: 55px; }
*/
/* naviListNavi class to reduce redundancy */
ul.naviListNavi { margin-left: 70px; padding-top: 7px; list-style: none;}
ul.naviListNavi ul { }
ul.naviListNavi li { }
/* 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 { clear: both; float: left; width: 880px; /*background:url(/stc/img/bg_site.png) repeat-y top left;*/ min-height: 100%; position: relative; padding: 0; overflow: hidden; }
#site { font-family: georgia,serif; font-size: 0.8em; }
* html #site { height:100% ; }
#banner {
display: block;
float: left;
width:155px ;
position: relative;
margin-left: -34px;
overflow: hidden;
background: transparent url(img/banneri_border.jpg) repeat-y left top;
}
#banner .banner_border {
background: transparent url(img/ylatausta_punainen.png) repeat-x left top;
position: relative;
padding-bottom: 20px;
text-align: center;
}
#banner .no_border { border-width: 0; }
#banner .footer { font-size: 1%; position: absolute; background: transparent url(img/banner_footer.jpg) no-repeat left bottom; width: 100%; height: 11px; bottom: 0; left: 0; }
#siteBody { clear:both ; text-align:left ; /*background: transparent url(img/taustavalkoinen.jpg) repeat-y -5px 0;*/ padding: 5px 30px 20px 10px; }
#siteBodyTop { position: relative; height: 35px; }
#siteBodyTop span { padding-left: 5px; font-size: 11px; color: #636877; float:left; padding-top:5px;}
#siteBodyTop a { font-size: 11px; color: #636877; text-decoration: none; }
#siteBodyTop a:hover { text-decoration: underline; }
#siteBodyTop a.act { font-size: 13px; text-decoration: none; color: #d50d3c; }
#siteBodyTop img { padding: 0 7px; }
#siteBodyTop span.print { float: right; margin-right: 15px; margin-top: -2px; padding-top:0; }
#siteBodyTop span.print img { margin-bottom: -3px; }
#siteBodyTop span.print a { font-size: 14px; color: #d50d3c; text-decoration: none; }
#siteBodyTop span.print a:hover { text-decoration: underline; }
.columns { position:relative ; float:left ; display: inline; }
#left { width: 210px; top: 5px; height: auto; height: 450px; }
#left img { margin-left: 30px; }
#topImage { height:auto; padding: 0; width: 570px; margin: 0 20px 5px 20px; top: 12px; }
#middle { color: #636877; width:400px ; margin:0 20px ; top: 5px; height: 100%; font-size: 13px; }
#middle p { margin-bottom: 12px; color: #636877; }
#middle h2 { padding-left: 10px; margin-bottom: 15px; background: #f0f0f0 url(img/otsikkotausta.jpg) no-repeat right top; }
#middle ul { margin: 5px; }
#middle.wide { width:544px ; }
#middle.widest { width:744px ; }
#middleRight { color: #636877; width:560px ; margin:0 20px ; top: 5px; height: 100%; font-size: 13px; }
#middleRight p { margin-bottom: 12px; color: #636877; }
#middleRight h2 { padding-left: 10px; margin-bottom: 15px; background: #f0f0f0 url(img/otsikkotausta.jpg) no-repeat right top; }
#middleBlanco { width:780px ; margin:0 25px ; top: 5px; height: auto; height: 100%; }
#middleBlanco p { margin-bottom: 12px; color: #636877; }
#middleBlanco h2 { padding-left: 10px; margin-bottom: 15px; background: #f0f0f0 url(img/otsikkotausta.jpg) no-repeat right top; }
/* Added ie hack to because ie cannot understand declaration above this comment*/
* html .widest { width:744px !important; }
#right { width: 170px; top: 16px; height: 100%; }
#footer { /*background: transparent url(img/taustavalkoinen.jpg) repeat-y -5px 0;*/ text-align: center; position:relative ; font-size: 11px; color: #8c93a8; padding: 10px 50px 0 20px; }
#footer .left { text-align: left; }
#footer .right { text-align: right; margin-top: -23px; }
#footer .line { background: transparent url(img/viiva.gif) no-repeat center top; }
#bg_footer { /*background: transparent url(img/bg_footer.jpg) no-repeat -5px 0;*/ width: 880px; height: 25px; }
#bottom_footer {float:left; margin: -125px auto auto auto; background: transparent url(img/bf_center.png) repeat-x -10px top; height: 184px; min-width:1030px; width:100%;}
* html #bottom_footer {width:expression(document.body.clientWidth > 1030? "100%": "1030px" );}
#bf_left {float:left;background: transparent url(img/bf_left.png) no-repeat -10px top;height: 184px; width:355px;}
#bf_right {float:right;background: transparent url(img/bf_right.png) no-repeat right top;height: 184px; width:355px; }
/* div#navigoCMS { float: right; font:10px Verdana, sans-serif ; color:#c7c9c8 ; right:0 ; top:0 ; margin-top: -10px; height:18px ; width:170px ; } */
div#navigoCMS { position: relative; float: right; font:10px Verdana, sans-serif ; color:#c7c9c8 ; top: 65px; height:18px ; width:170px ; margin-right: 125px; }
* html div#navigoCMS { margin-right: 80px; }
div#navigoCMS strong { color:#c7c9c8 ; }
div#navigoCMS a { color:#c7c9c8 ; text-decoration:none ; padding-left:22px ; background:url(img/logo_navigo.gif) no-repeat center left ; }
div#navigoCMS acronym { text-decoration:none ;border:none ; }
#top { width:850px; }
#top h1 { width:850px; height:135px; }
/*
#top h1 a { display:block; width:850px; height:130px; }
#top h1 a span { display: none; }
*/
a.logoLink { position: absolute; left: 30px; top: 45px; width:70px; height:20px; text-decoration: none; }
a.logoLink:hover { text-decoration: none; }
a.logoLink span { visibility: hidden; }
a.homepageLink { position: absolute; width:400px; height:40px; text-decoration: none; top: 60px; left: 210px; }
a.homepageLink:hover { text-decoration: none; }
a.homepageLink span { visibility: hidden; }
#logo { width:830px ; height:135px ; position: absolute; top: 0; right: 0; background: transparent url(img/bg_logo.png) no-repeat top right; margin-right: 40px; }
* html #logo { background-image: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/stc/hirvisaari/img/bg_logo.png",sizingMethod="crop"); }
/* #middleRight .docLinks { display: none; } */
.docLinks { float:left; font-size: 13px; width: 560px; background: transparent url(img/viiva.gif) no-repeat left bottom; margin: 10px 0; padding-bottom: 5px; }
* html .docLinks { float: none; }
.docLinks a { color: #a1a0a5; text-decoration: none; }
.docLinks a:visited { color: #a1a0a5; text-decoration: none; }
.docLinks ul { list-style: none; }
.docLinks li {list-style-position: outside; }
.docLinks .linkLeft_h { float: left; }
.docLinks .linkLeft { float: left; /* background: transparent url(img/kolmio_vasen.gif) no-repeat left center;*/ }
.docLinks .linkLeft a.linkText { margin-left: 10px; }
.docLinks .linkLeft a img { margin-bottom: -5px; }
.docLinks .linkRight_h { float: right; }
.docLinks .linkRight { float: right; /* background: transparent url(img/kolmio_oikea.gif) no-repeat right center;*/ }
.docLinks .linkRight a.linkText { margin-right: 10px; }
.docLinks .linkRight a img { margin-bottom: -5px; }
#supportNavi { position: absolute; top: 0; right: 0; background: transparent url(img/ylakielen_tausta.gif) no-repeat right top; margin-right: 30px; }
#supportNavi form { padding: 15px 15px 0 0; }
*html #supportNavi form { padding: 15px 15px 0 0; background: transparent url(img/search.gif) no-repeat 0px 16px; }
#supportNavi button { margin-left: -10px;}
* html #supportNavi button { margin: -25px 0 0 -14px; }
#supportNavi #submit { border: none; vertical-align: middle; background: transparent url(img/haku.png) no-repeat left -2px; width: 60px; height: 46px; cursor: pointer; }
* html #supportNavi #submit { background-image: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/stc/hirvisaari/img/haku.png",sizingMethod="crop"); }
#supportNavi #submit { color: #0d749c; font-size: 13px; font-weight: bold; }
#supportNavi #search { border: none; background: transparent url(img/search.gif) no-repeat left top; height: 25px; width: 100px; padding: 4px 8px 0 5px; margin-right: -3px; }
* html #supportNavi #search { border: none; background: transparent url(img/search.gif) repeat-x left top; height: 25px; width: 110px; padding: 5px 0 0 0; margin-right: 15px; }
#supportNavi li { color: #ffffff; float:left; font-size: 1.1em; padding: 8px 4px 0 0px; }
#supportNavi li a { color: #ffffff; display: block; font-weight: bold; }
#supportNavi li span { display:block ; padding:2px 0 2px 5px; color: #ffffff; }
#supportNavi li.textSize a { padding:2px 0 2px 2px ; }
#supportNavi a.sitemap { margin: -19px 0 0 70px; padding-left: 20px; background: transparent url(img/sivukartan_nuoli.gif) no-repeat left center; color: #840108; }
* html #supportNavi a.sitemap { margin: -12px 0 0 55px; padding-left: 20px; background: transparent url(img/sivukartan_nuoli.gif) no-repeat left center; color: #840108; }
/* navigation */
#topNavi {height: 42px; width: 880px; background: transparent url(img/bg_menu.gif) no-repeat left top; }
#topNavi li { float:left ; }
#topNavi li a { float:left ; margin:5px 35px ; display:block ; }
* html #topNavi li a { float:left ; margin:5px 17px ; display:block ; }
* html #topNavi li a { height:1% ; }
/* #topNavi li a.act { padding: 0; } */
#docNavi { padding-left: 22px; list-style: none; list-style-position: outside; background: transparent url(img/listatausta.gif) repeat-y 22px 0; }
#docNavi ul { list-style: none; list-style-position: outside; }
#docNavi li { }
#docNavi li a { margin-top: 1px; font-size: 14px; font-weight: bold; padding: 8px 15px 0 15px; display: block; text-decoration:none ; color:#636877; }
#docNavi li a:hover { text-decoration: underline; }
#docNavi li a.act { margin-bottom: 2px; color:#d50d3c; }
#docNavi li li { }
#docNavi li li a { font-weight: normal; padding: 0 15px 0 20px; display: block; text-decoration:none ; color:#636877; }
#docNavi li li a:hover { text-decoration: underline; }
#docNavi li li a.act { text-decoration: none; color:#d50d3c; }
#docNavi li li a.act:hover { text-decoration: underline; color:#d50d3c; }
#docNavi li.start_li { background: transparent url(img/listatausta_start.gif) no-repeat left top; padding-top: 5px; }
#docNavi li.end_li { background: transparent url(img/listatausta_end.gif) no-repeat left bottom; padding-bottom: 30px; }
* html #docNavi { height: 1%; }
* html #docNavi li { height: 1%; }
* html #docNavi li li { height: 1%; }
* html #docNavi li a { font-size: 1.1em; margin-top: 1px; font-weight: bold; padding: 8px 15px 0 15px; display: block; text-decoration:none ; color:#636877; }
* html #docNavi li li a { font-size: 1.1em; font-weight: normal; padding: 0 15px 0 20px; display: block; text-decoration:none ; color:#636877; }
/*#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 */
/* right content news list */
.newsList { }
* html .newsList ul, .newsList li { height: 1%; }
.newsList li { font-size: 14px; font-weight: bold; padding-left: 15px; margin-bottom: 10px; background: transparent url(img/4_asteen_nuoli.gif) no-repeat 0 3px;}
.newsList ul { margin-bottom: 0px; list-style: none; }
.newsList li a { font-size: 14px; font-weight: bold; display: block; text-decoration:none ; color:#636877; }
.newsList li a:visited { color:#636877; }
.newsList li a:hover { text-decoration: underline; }
.newsList li a.act { color:#d50d3c; text-decoration: none; }
.newsList li a.act:hover { 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 ; }
*/
/* tables */
/* common for all tables */
#siteBody table {border-collapse: collapse;}
#siteBody table td {vertical-align: top; /*padding: 0.3em;*/}
#middle ul, #middle ol, #middle dl { padding-left:30px ; }
.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: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:#ccc; color: #fff; font-weight: bold;}
/* sitemap */
.siteMap { width:350px ; padding:0 0 2em 1em; }
.siteMap a { text-decoration:none ; display:block ; color: #636877; }
.siteMap a:hover { color:#636877; text-decoration: underline; }
.siteMap ul li { }
.siteMapDocumentLevel0 { padding:0.05em ; padding-left:2em ; }
.siteMapDocumentLevel1 { padding:0.05em ; font-size:1em ; }
* html a.siteMapDocumentLevel1:visited { color: #636877; }
.depth0 { padding-left:0px ; }
.depth1 { padding-left:10px ;}
.depth2 { padding-left:30px ; }
.depth3 { padding-left:50px ; }
.depth4 { padding-left:70px ; }
.depth5 { padding-left:90px ; }
.siteMapFolderLevel1 a { display: none; padding-left:20px ; }
.siteMapFolderLevel2 a { font-weight: bold; font-size: 14px; }
.siteMapFolderLevel3 a { padding-left:30px ; }
.siteMapFolderLevel4 a { padding-left:40px ; }
.siteMapFolderLevel5 a { padding-left:50px ; }
/*
.stripe { background-color:#f9f9f9 ; }
*/
/* search result */
#searchResults a.count { color: #636877; padding-left: 5px; font-weight: bold; font-size: 12px; }
#searchResults h3 { background-color: #f0f0f0; padding: 4px 0 4px 10px; font-size: 15px; margin-bottom: 10px; }
#searchResults h3 span {font-weight: normal; }
#searchResults ul { padding-left: 25px; list-style: square; margin-bottom: 20px; }
#searchResults li a { font-size: 12px; font-weight: bold; }
#searchResults .navigo-search-type { margin-bottom: 10px; color: #636877; font-size: 12px; padding-left: 5px; background: transparent url(img/viiva.gif) no-repeat scroll left bottom; }
#searchResults .navigo-search-title { padding-left: 5px; }
/* 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 ; }
/* e-mail form */
.emailForm {}
.emailForm p.formRow {}
.emailForm label br { display: none; }
.emailForm label span { display: block; }
.emailForm label span input {}
.emailForm label span textarea {}
.emailForm label .btnSubmit {} /* Inside label only for consistency */
.emailForm label .btnReset {} /* Inside label only for consistency */
#bookHeader { font-size: 1.8em;/*font-weight: bold; */background:#F0F0F0 url(img/otsikkotausta.jpg) no-repeat scroll right top; margin-bottom:5px; padding:5px 10px; line-height: 22px;}
#importSlotContainer #bookHeader { font-size: 1em;/*font-weight: bold; */background: url(img/otsikkotausta.jpg) no-repeat scroll right top; margin-bottom:0; padding:5px 0;}
.bookAuthor, .cart { /*color: #B3392F;*/ text-decoration: none; /*font-weight: bold;*/}
.bookImg {float: left; height: 282; width: 172px; margin-right: 20px; margin-bottom: 10px; border: 1px solid #636877; padding:0px;}
.bookIngress { font-weight: bold; margin-bottom: 10px; }
#bookLinks { text-align: right; width: 530px; height: 40px; margin-bottom: 10px; }
.bookLinks { text-align: right; /*width: 530px;*/ height: 40px; margin-bottom: 10px; }
.bookLinks a {color: #B3392F; text-decoration: underline; font-weight: bold; background: transparent url(img/verkkokauppa.gif) no-repeat right top; height: 30px; padding-top: 7px; padding-right:30px;}
#bookLinks .shopIcon { background: transparent url(img/verkkokauppa.gif) no-repeat right top; height: 30px; padding-top: 7px;}
* html #bookLinks img { }
#bookLinks a.external { color: #B3392F; text-decoration: underline; font-weight: bold; padding-right: 30px; z-index:100;}
* html #bookLinks a.external { z-index:100;}
#bookInfo { width: 525px; height: 135px; }
.bookInfoTitle { font-weight: bold; font-size: 1.1em; color: #636877; width: 100%; height: 22px; padding: 5px 0 0 20px; background-color: #F0F0F0; }
h3.test { font-weight: bold; font-size: 1.1em; color: #636877; width: 100%; height: 22px; padding: 5px 0 0 20px; background-color: #F0F0F0; }
.information, .bookISBN { padding: 5px 0 0 40px; }
.bookPublishDate {color: #636877;}
#bookTitleList, #bookTitleList li, #bookTitleList ul {list-style-position:outside; padding:0 !important; margin:0 !important; list-style-type:none;}