body {background: #fff url("img/bg.jpg") top center no-repeat; margin:0} 

/* font specs */

body {font-family: Corbel, "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif}
h1{ font-size:1.4em; font-weight:normal; margin-top:10px}
h2, #rightCol H1{ font-size:1em; font-weight:normal; margin-bottom: 0}
p, #rightCol ul{font-size:0.9em; color:#666}
#leftCol ul.content_list{font-size:0.9em; color:#666;}
#nav ul{font-size:1.2em}
#caseDescription h1{color:#3e3e3e; font-size:1.1em}
#caseDescription p{color:#010101;}
#yhteyslomake p, #rekrytointilomake p, #kontaktilomake p{color:#010101; font-weight:bold}

a {color:#3a0; text-decoration:none}
a:hover {text-decoration:underline}
a img{border:none}

.clear{clear:both; height:0px; overflow:hidden;}

#main{margin:0 auto; width:820px; position:relative;}

#nav{width:820px; height:67px; overflow:hidden; background:url(img/bg_navigation.png) no-repeat;}
#nav a{text-decoration:none}
#nav ul {list-style:none; margin:0; padding:0;}
#nav li{float:left;}
#nav li a{display:block; height:67px; background-repeat:no-repeat;}
#nav li a:hover{background-position: 0 -67px;}
#nav li a.on{background-position: 0 -134px;}

.hide {visibility:hidden}

li.logo {display:block; background: url("img/brandson.gif") 20px 27px no-repeat; width:205px; height:67px;}
#nav li.logo a:hover{background-position:20px 27px;}
li.nav1 a{background: url("img/navi_01.jpg"); width:62px;}
li.nav2 a{background: url("img/navi_02.jpg"); width:77px;}
li.nav3 a{background: url("img/navi_03.jpg"); width:78px;}
li.nav4 a{background: url("img/navi_04.jpg"); width:59px;}
li.nav5 a{background: url("img/navi_05.jpg"); width:115px;}
li.nav6 a{background: url("img/navi_06.jpg"); width:68px;}
li.nav7 a{background: url("img/navi_07.jpg"); width:100px;}

#illustration{position:absolute; top:67px; left:375px; background:url(img/bg_b.png) no-repeat; width:491px; height:464px; display:block; z-index:-1;}

#stage{width:820px;overflow:hidden;}

#flash {width:615px; height:264px;}

#leftCol{float:left; width:615px;}
#leftCol .main{ width:600px;}
#leftCol .main p{ font-style:italic; color:#666; padding-right:20px; margin:0; float:left;}
#leftCol hr{border:none; border-top:1px dashed #ddd; width:600px; margin-top:10px;}
#leftCol .third{width: 180px}
#leftCol .brandson p{color:#666; padding-right:20px; margin:0; width:370px}
#leftCol .brandson H1{background: url("img/title_brandson.gif") top left no-repeat;height:30px; padding:0; margin:0;}
#leftCol a#dlLink, #leftCol a#daLink, #leftCol a#dmLink{width:174px; height:77px; display:block; background-position:bottom left; background-repeat:no-repeat; text-decoration:none;} 
#leftCol a#dlLink{background-image:url(img/img_dl.png);}
#leftCol a#dmLink{background-image:url(img/img_dm.png);}
#leftCol a#daLink{background-image:url(img/img_da.png);}
#leftCol a:hover#dlLink, #leftCol a:hover#daLink, #leftCol a:hover#dmLink{background-position:top left;}

#content {width: 375px; margin-top:64px; float:left; background: url("img/semi.gif"); padding: 0 20px}
#content p{margin:3px 0 12px 0; padding:0}

#subnav { margin-top:64px; width:180px; float:left}
#subnav ul{list-style:none; margin:0; padding:0}
#subnav li{padding:5px; margin:0}
#subnav .on{color:#000}
#subnav .ylataso{font-size:1.2em;}

#subsubnav li{font-size:0.9em; padding-left:10px; margin:0;}

#wideBox{width:615px; margin-top:64px; float:right;}
#wideBoxTop{width:615px; height:27px; background:url(img/wide_box_top.png) no-repeat; display:block;}
#wideBoxTop2{width:513px; height:22px; background:url(img/wide_box_top2.png) no-repeat; display:block; padding:5px 0 0 102px;}
#wideBoxContent{width:615px; background:url(img/wide_box_content_bg.png) repeat-y; padding-top:10px;}
#wideBoxContent2{width:615px; background:url(img/wide_box_content_bg.png) repeat-y;}
#wideBoxContent .nosto{ width:205px; float:left; overflow:hidden;}
#wideBoxContent p{color:#464646; padding:5px 15px; margin:0;}
#wideBoxContent ul{margin:0; padding:0;}
#wideBoxContent li{margin:0 15px 0 30px; padding:0; font-size:0.9em; color:#464646}
#wideBoxBottom{width:615px; height:14px; background:url(img/wide_box_bottom.png) no-repeat;}

.case_otsikko{width:527px; height:28px; background:url(img/bg_case_otsikko.png) no-repeat; float:right; margin-right:1px; overflow:hidden; position:relative;}
.logos_icon{position: relative; float:left; width:81px; height:81px; display:block; margin:35px 6px 0 0;}
.logos_icon2{float:left; width:81px; height:81px; display:block; margin:15px 6px 0 0;}
.case_logot{float:left; height:100px; background:#ebebeb; border:1px solid #c3c8ca;}
a.curved{float:left; width:84px; height:84px; display:inline; overflow:hidden; background:url(img/bg_case_logo_link.jpg) no-repeat left top; margin:8px 0 0 10px; padding-right:10px; border-right:dashed 1px #ccc;}
a:hover.curved{ background-position: left bottom;}
.no_link{float:left; lwidth:84px; height:84px; display:block; overflow:hidden; margin:8px 0 0 8px; padding-right:8px; border-right:dashed 1px #ccc;}
a.last_case, img.last_case{border:none;}
.case_otsikko img{position:absolute; top:10px; left:15px;}
.case_otsikko img.mainonta{position:absolute; left:auto; right:145px;}
img.mainonta_ikoni{position:absolute; top:0; left:310px;}
div.mainonta{float:right; margin-right:6px;}

#loadCaseArea{float:left; width:513px; display:block;}
#caseArea{float:left; width:513px; margin-left:1px;}

/*ei carouselia käyvttävät case-kuvat*/
#caseImgManual{width:507px; height:275px; overflow:hidden; padding:3px;}
#flashContainer{width:507px; height:275px; overflow:hidden; padding:3px;}
#numbersArea{width:100%; height:30px; background:url(img/bg_numbersArea.jpg) repeat-x; overflow:hidden; text-align:center; border-top:1px solid #d4d4d4;}
#centerNumbers{float:left; position:relative; left:50%;}
#centerNumbers2{position:relative; left:-50%;}
#numbersArea a{float:left; width:28px; height:25px; display:block; overflow:hidden; margin-right:5px; background:url(img/bg_caseImg_numbers.jpg) no-repeat bottom left; color:#555; text-decoration:none; padding-top:3px; cursor:pointer;}
#numbersArea a:hover{background-position:top left; color:#FFF; text-decoration:none;}
#numbersArea a.active{background-position:top left; color:#FFF; text-decoration:none;}

/*muut case-kuvia säätävät tyylit on jquery.carousel.css -tiedostossa*/

#caseDescription .logos_icon3{float:left; width:81px; height:81px; display:block; margin-top:-20px; margin-right:10px;}
#caseDescription h1{float:left; margin-top:5px; margin-bottom:25px; width:420px;}
#caseDescription p{margin-left:91px; margin-right:50px;}
#caseLinks{float:left; width:94px; background:#ebebeb; border:1px solid #ced2d4; padding:3px 0;}
#caseLinks a.curved{border:none; margin:3px 5px; padding:0;}
#caseLinks a.selected{border:5px solid #5dc600; margin:0; padding:0;}

#content p.ajankohtaista_date{margin:10px 0 0 0; padding:0;}
h1.ajankohtaista{margin:0; padding:0;}

#yhteyslomake p{margin:0; padding:0;}
#yhteyslomake textarea{width:377px; height:75px;background:#d7eec2; border: 1px solid #a7b1b5; margin-top:2px; margin-bottom:15px;}
#yhteyslomake input{height:20px; background:#d7eec2; border: 1px solid #a7b1b5; margin-top:2px; margin-bottom:10px;}
#yhteyslomake input.short{width:127px; margin-right:10px;}
#yhteyslomake input.long{width:232px;}
#yhteyslomake input.submit{width:115px; height:32px; display:block; overflow:hidden; background:url(img/btn_laheta.jpg) no-repeat top left; cursor:pointer; border:none;}
#yhteyslomake input:hover.submit{background-position:bottom left; cursor:pointer;}


#rekrytointilomake td.rekry{width:150px;}
#rekrytointilomake p{margin:0; padding:0;}
#rekrytointilomake p.wordup{margin-top:5px;}
#rekrytointilomake textarea{width:230px; height:75px;background:#d7eec2; border: 1px solid #a7b1b5; margin:5px 0;}
#rekrytointilomake input{width:230px; height:20px; background:#d7eec2; border: 1px solid #a7b1b5; margin:5px 0;}
#rekrytointilomake input.submit{width:115px; height:32px; display:block; overflow:hidden; background:url(img/btn_laheta.jpg) no-repeat top left; cursor:pointer; border:none;}
#rekrytointilomake input:hover.submit{background-position:bottom left; cursor:pointer;}

#kontaktilomake p{margin:0; padding:0;}
#kontaktilomake input{width:230px; height:20px; background:#d7eec2; border: 1px solid #a7b1b5; margin:5px 20px 5px 0;}
#kontaktilomake #checkboxes p{font-weight:normal; margin:10px 0;}
#kontaktilomake #checkboxes input{width:auto; height:auto; margin:0 10px 0 0; padding:0;}
#kontaktilomake input.submit{width:115px; height:32px; display:block; overflow:hidden; background:url(img/btn_laheta.jpg) no-repeat top left; cursor:pointer; border:none;}
#kontaktilomake input:hover.submit{background-position:bottom left; cursor:pointer;}

.dotted_lines{width:615px; height:100%; background:url(img/wide_box_dotted_lines.png) repeat-y top center;}
.no-border{border:none;}

#rightCol{ width:205px; background: url("img/rightCol_bottom.png") bottom left no-repeat; float:left; margin-top:64px; padding-bottom:20px;}
#rightCol .visible{overflow:visible;}
#rightCol H1{height:30px; padding:0; margin:0;}
#rightCol .top { background: url("img/rightCol_top.png") no-repeat}
#rightCol .top2 { background: url("img/rightCol_top2.png") no-repeat;}
#rightCol .top h1{ padding:12px 8px 0 12px}
#rightCol h1.justText{ padding:5px 0 5px 12px; font-size:1em; height:auto;}
#rightCol .top ul{ background: url("img/rightCol_bg.gif") repeat-y; margin:0; padding:5px 10px 5px 30px}
#rightCol .top li{padding-bottom: 5px}
#rightCol .top p{ background: url("img/rightCol_bg.gif") repeat-y; margin-top:0px}
#rightCol p{padding: 10px 10px 10px 14px; margin:0}
#rightCol em{}
#rightCol .bg{background: #e6e6e6 url("img/title_bg.gif")}
#rightCol .kuva {padding: 0px}
#rightCol .content{background: url("img/rightCol_bg.gif") repeat-y;}
#rightCol .content ul{margin:0; padding:5px 10px 0 30px; color:#000000; font-size:0.9em;}
#rightCol .content .icon{float:left; width:81px; height:81px; margin:20px 1px 0 1px;}
#rightCol .content .case{width:84px; height:84px; background:#ebebeb; border:1px solid #c3c8ca; float:left; margin:5px 0; padding: 8px 15px;}
#rightCol a.curved{width:84px; height:84px; display:inline; overflow:hidden; background:url(img/bg_case_logo_link.jpg) no-repeat left top; margin:0; padding-right:0; border:none;}
#rightCol a:hover.curved{background-position: left bottom;}
#rightCol .content #map_canvas{width:194px; height:180px; margin:0 0 2px 6px; overflow:hidden;}
#rightCol a.on{color:#000}

/*etusivun oikeapalsta*/
#rightCol .caset { background: url("img/rightCol_top.png") no-repeat}
#rightCol .caset h1{ background: url("img/title_caset.gif") 8px 8px no-repeat}
#rightCol .news { background: url("img/rightCol_bg.gif") repeat-y; margin-top:-15px}
#rightCol .news h1{ background: url("img/title_news.gif") 8px 8px no-repeat; margin:10px 0 0 0}
#rightCol .news p{ background:url("img/rightCol_bg.gif") repeat-y; padding:2px 10px 8px 14px }
#rightCol .tuotteet { background: url("img/rightCol_bg.gif") repeat-y; margin-top:-15px}
#rightCol .tuotteet h1{ background: url("img/title_tuotteet.gif") 8px 8px no-repeat; margin:10px 0 0 0}
#rightCol .tuotteet p{padding-bottom:20px}
#rightCol .blog { background: url("img/rightCol_bg.gif") repeat-y; margin-top:-15px}
#rightCol .blog h1{ background: url("img/title_blog.gif") 8px 8px no-repeat;margin:10px 0 0 0}
#rightCol .blog p{ padding-bottom:0px; background: #e6e6e6 url("img/rightCol_bg.gif") repeat-y;}
#rightCol .newsletter { background: url("img/rightCol_bg.gif") repeat-y; margin-top:-15px}
#rightCol .newsletter h1{ background: url("img/title_uutiskirje.gif") 8px 8px no-repeat;margin:10px 0 0 0}
#rightCol .newsletter p{ padding-bottom:0px; background: #e6e6e6 url("img/rightCol_bg.gif") repeat-y;}
#rightCol .newsletter input.field{width:166px; margin:0  0 10px 0; padding:2px; background:#d7eec2; border: 1px solid #a7b1b5;}
#rightCol .newsletter input.btn_tilaa{width:59px; height:32px; display:block; background:url(img/btn_tilaa.jpg) no-repeat left top; border:none;}
#rightCol .newsletter input:hover.btn_tilaa{background-position: left bottom;}


#caseOpenWrap{position:relative; width:200px; height:215px; margin-left:2px; overflow:hidden;}
#caseOpen {position:absolute; left:0px; width:756px; height:172px; padding:20px 20px 20px 25px; background:url("img/img_case_bg.jpg") no-repeat top left; overflow:hidden;}
#caseOpen .words{float:left; width:280px; margin: 0 30px 0 20px}
#caseOpen img{float:left;}
#caseOpen .words h1{font-size:1.4em; font-weight:normal; margin-top:0; background:none;}
#caseOpen p{padding-left:0px;}
#caseOpen ul{ list-style:none; margin:0; padding:10px 0 10px 5px; float:left; color:#000; font-size:1em;}
#caseOpen li{padding: 5px}
#caseOpen a.on{color:#000}

#caseOpen a.toggleCase{position:absolute; top:90px; left:3px; width:35px; height:35px; display:block; overflow:hidden;}
#caseOpen a:hover.toggleCase{cursor:pointer;}


#footer {width:800px; height:31px; background:#eee url("img/footer_bg.gif") no-repeat; float:left; color:#666; padding: 0 0 0 20px; margin-top: 10px}
#footer p{ padding: 10px 0 0 0; margin:0; text-transform:uppercase; text-align:center; font-size:11px;}