/*----------------------
Piltti screen styles
Version: 1 (09-2009)
----------------------*/
@import "lib/reset.css";
@import "lib/typography.css";
@import "lib/forms.css";

/* force vertical scrollbar */
html, body {height: 100%;margin: 0 0 1px;padding: 0}

body {background: #fff url(../img/bg/body_bg.png) repeat-x top}
#wrapper {margin: 0 auto; width: 924px}
.container {display: block; position: absolute; min-height: 100%}
.content {display: block; padding-bottom: 100px}

/* DEV GRID
----------------------*/
.container.dev {/*background: url(../img/dev/grid.gif) repeat-y center; height: 1800px*/}

/* GRID
----------------------*/
.container {width: 924px; margin: 0 auto; padding: 0 18px}
.content {background: #fff url(../img/bg/container_bg.png) repeat-y center; float:left; width: 924px}
.content#alasivu {background: #fff url(../img/bg/container_bg_ala.png) repeat-y center; float:left}
.content#alasivu2 {background: #fff url(../img/bg/container_bg_ala2.png) repeat-y center; float:left}
.full {width: 942px; float: left}
.main, .sidebar, .s394, .s500, .s182, .s712 {margin-right: 30px;float: left; display: block; min-height: 1px;}
.main {width: 606px}
.sidebar {width: 288px}
.s394 {width: 394px}
.s500 {width: 500px}
.s182 {width: 182px}
.s712 {width: 712px}
.last {margin-right: 0 !important}

/* TOP
----------------------*/
h1#logo, h1#logo a {width: 185px; height:90px; display: block}
h1#logo {background:url(../img/bg/logo.png) no-repeat;text-indent: -9999px; float: left; margin:10px 11px 0 0; padding: 0}
#top ul {background: #DF0737 url(../img/bg/nav_bg.png) top left repeat-x; float: left; width: 922px; position: relative; margin-top:0;min-height: 35px; border-color: #800400; border-width: 1px; border-style: solid}
#top ul li {float:left; list-style: none; padding: 8px 12px 8px 10px; background: url(../img/bg/nav_border.png) repeat-y right}
#top ul li.active {background: #B20D04 url(../img/bg/nav_bg_active.png) top repeat-x}
#top ul li a {font-size: 16px; color: #fff}
#top ul li a:hover {color: #FCEDA8; text-decoration: none}
#top {margin-bottom: 20px; position: relative}
#top h1 {margin: 0}
#top h1 a {color:#fff; text-indent:-9999px; display: block; height: 50px; width: 330px}

#top #search {position: absolute; right: 25px; top: 8px}
#top #search #searchfield {padding: 5px 5px 5px 25px; border: 1px solid #7f9db9; width: 157px; background: #fff url(../img/bg/searchbg.gif) 5px 5px no-repeat}

#login {background: #fceeae url(../img/bg/login_bg.png) repeat-x; width: 726px; height: 45px; border-style: solid; border-color: #ccc485;border-width: 0px 1px 1px 1px;float:left}
#login form {padding-top: 10px}
#login input {border: 1px solid #7f9db9; padding: 4px}
#login #pwd, #uname {width: 85px; padding: 2px 3px; border: 0; border-left: 1px solid #666; border-top: 1px solid #666; background:#eee}
#login #remember {border: 0; margin-top: 3px}
#login #loggedin {padding: 5px}
#login #loggedin img {float: left; margin-right: 5px}
#login label, #login input,#login p {font-weight: normal; float: left; margin-left: 5px}

#register {width: 181px; padding: 7px; float: left; background: #fff8b3 url(../img/bg/register_bg.png) repeat-x; min-height:31px; border-color: #d9d5b8; border-width: 0px 1px 1px 0; border-style: solid}
#register p {float: left; margin: 7px 4px 0 0; font-size: 11px}

/* FOOTER
----------------------*/
#footer {padding: 10px; position: absolute; display: block; bottom: 0; left: 0; height: 20px; float:left; background: #fffeee; width: 902px;border-style: solid; border-color: #ccc485;border-width: 1px 1px 0px 1px;background: #fff8b3 url(../img/bg/register_bg.png) repeat-x; margin-left: 18px} 
#footer ul {list-style: none}
#footer ul li {float: left; display:block; margin-right: 10px}
#footer ul li a {color: #000}

/* napit */
#login #loginok, #register a, .commentform .button {background-repeat: no-repeat; height: 28px; border: 0; text-indent: -9999px}
#login #loginok {background-image: url(../img/napit/kirjaudu.png); width: 76px; cursor: pointer; margin-right: 20px}
.commentform .button {background-image: url(../img/napit/laheta.png);width: 76px}
#register a {background-image: url(../img/napit/rekisteroidy.png); width: 166px; display: block; float: left; margin-top: 2px; margin-left: 8px}
#login .links {margin-top: 5px}
#login .links label {margin-right: 20px}

/* NAVIGATION
----------------------*/
#nav {width: 959px; background: #EBEBEB url(../img/navi/navi_bg.png) bottom repeat-x; float: left; position: relative;border-right: 1px solid #969696; margin-bottom: 18px}
#nav ul {margin: 0; float: left}
#nav ul li {display: block; float: left; margin: 0; border-color:#969696; border-width: 0 1px 0 0; border-style: solid}
#nav ul li a {padding: 8px 10px; display: block;font-size: 1.25em; font-weight: bold;color: #111;border-color:#969696; border-width: 0 0 1px 0; border-style: solid}
#nav ul li.first a {padding: 8px 15px 8px 5px;border-left-width: 0}
#nav ul li a:hover, #sidenavi li a:hover {text-decoration: none; color: #ce0011}
#nav ul li#active a {background: #f5f5f5 url(../img/navi/active.png) top right no-repeat;border-right: 1px solid #c9c9c9; color: #ce0011}
#nav #search {position:absolute; right: 9px; top: 7px}
#nav #searchfield {width: 160px; padding: 2px 3px; border: 1px solid #969696}
#nav #searchfield.hint {color: #969696}

/* KOMMENTIT ETUSIVU
----------------------*/
.site_comments ul {list-style-type: none; border-right-width: 5px}
.site_comments ul li {padding: 5px 0; border-bottom-width: 5px}
.site_comments ul, .site_comments ul li {border-style: solid; border-color: #FDD8AB}
.site_comments ul li img {float: left; margin-right:5px}
.site_comments ul li, .site_comments ul li span a  {display: block}
.site_comments ul li a {font-style: italic; font-weight: normal}
.site_comments ul li span a {font-weight: bold}

/* NOSTOT
----------------------*/
/* .item styles */
.item, #tuotehaku .categorylist, .site_comments {background: url(../img/bg/item_border.png) repeat-x bottom; padding: 0 0 10px; float: left; width: 100%; margin: 0 0 9px}
.s394 .item {font-size: 14px}
.item p {margin: 0 0 1em 0}
.item img {float: left}
.item h2 {margin-bottom: 0.5em; line-height: 1.1em; clear: both}
.item h2 a, .item h3 a, .item h2 a:hover, .item h3 a:hover {color: #000}
.item.article .more {clear: both}
.item .more {margin: 0; clear: none}
.item ul {list-style-type: none; margin: 10px 0}
/* feed items */
.item.feed h2 {font-size: 1.25em; margin: 0; clear: none}
.item.feed h2, .item.feed p {margin-left: 57px}
/* comments */
.comment img {margin-top: 0; margin-right: 10px}
.comment div {width: 394px; float: right; display: block; background:; padding: 0}
.comment div p {margin: 0}
#kommentit .comment div p {margin: 0 0 1em}
.comment div h2, .comment div h4 {margin-bottom: 0.25em; font-size: 1em}
.comment h2 a {color:#003366}
/* nostojen kuvat*/
.item img.vasen {float: left; margin-right: 10px}
.item img.oikea {float: right; margin-left: 10px}
/* articles */
.item.article span {display: block}
.item.article .authoravatar {margin: 2px 9px 0 0}
/* kilpailunosto*/
.item.competition, .item.poll {padding-left: 76px; width: 212px; min-height: 220px}
.item.competition {background: url(../img/bg/kilpailu_bg.png) left top no-repeat}
.item.poll {background: url(../img/bg/gallup_bg.png) left top no-repeat}
.item.competition form ul li input, .item.poll form ul li input {margin: 5px 5px 10px 0}
.item.competition form ul li label, .item.poll form ul li label {font-weight: normal}

/* TUOTEHAKU
----------------------*/
#tuotehaku div {float: left; width: 235px; margin-right: 30px}
#tuotehaku .categorylist dd {margin: 0}
#tuotehaku .categorylist dd input {margin-right: 5px}
#tuotehaku .categorylist dd label {font-weight: normal}
#tuotehaku .submit {clear: both; float: left}

/* BLOGINOSTOT
----------------------*/
.bloginostot {width: 283px; border-right: 5px solid #DFE1AF; float: left}
.bloginostot .item {background: none; border-bottom: 5px solid #DFE1AF; padding: 5px 0; margin: 0}
.bloginostot .item a {font-size: 12px}
.bloginostot .item h4 {margin-bottom: 0}
.bloginostot .item h4 a {font-size: 1.25em}
.bloginostot .item img {margin-right: 10px}

/* KUVAT
----------------------*/
.kuvalista {list-style-type: none; margin: 10px 0 0 0; padding: 0; clear: both}
.kuvalista li {float: left; margin-right: 30px; margin-bottom: 18px; width: 76px}
.kuvalista li img {border: none}
.kuvalista li span {font-size: 10px;display:block}

/* yleisiä listatyylejä*/
ul.tagcloud, ul.nostolista, ul.filter {list-style-type: none; padding: 0; line-height: 1.5em; display: block}
ul.filter li {float: left}
#container ul.tagcloud, #container ul.nostolista {margin: 0 0 18px 0; width: 100%}

/* dokumentin tyylit */
#dokumentti {font-size: 1.2em; margin-bottom: 18px; float:left}
#dokumentti h2 {font-size:2.5em; line-height:1.1em; margin-bottom: 1em}
#dokumentti h3 {border-bottom: 0; color: #000}
#dokumentti h3, #dokumentti h4, #dokumentti h5, #dokumentti h6 {margin-top: 2em}
#dokumentti img.vasen {float: left; margin-right: 10px}
#dokumentti img.oikea {float: right; margin-left: 10px}

/* MAINOKSET
----------------------*/
#topbanner {margin: 10px 0; min-height: 90px; float: left}

/* ASSORTED
----------------------*/
.more, .clear, .footer {clear: both}
.hidden {display: none}

/* error & info */
div#error{background:#FFFFE0 url(../img/error.gif) no-repeat scroll 25px 10px;padding:10px 10px 10px 100px; width: 360px}
div#info{background:#FFFFE0; padding:10px}
.error, .form-errors {color:#FF0000; display: block}

/* SIDENAVI
----------------------*/
#sidenavi, #sidenavi li ul, #sidenavi2, #sidenavi2 li ul {list-style: none}
#sidenavi li, #sidenavi2 li {margin: 0 0 3px}
#sidenavi li a, #sidenavi2 li a {padding: 5px; width: 170px; display: block}
#sidenavi li a:hover, #sidenavi2 li a:hover {text-decoration: none}
#sidenavi li ul, #sidenavi2 li ul {margin: 0 5px}
#sidenavi li ul li a, #sidenavi2 li ul li a {width: 168px}

#sidenavi li {background: #e3073c url(../img/bg/sidenavi_bg.png) no-repeat; border: 1px solid #800400}
#sidenavi li a {color: #fff}
#sidenavi li a:hover {color: #FCEDA8}
#sidenavi li.selected {background: #b30d04 url(../img/bg/sidenavi_bg.png) 0 182px no-repeat}

#sidenavi2 li {background: #e3073c url(../img/bg/sidenavi_bg.png) no-repeat -365px 0; border: 1px solid #800400}
#sidenavi2 li a {color: #222}
#sidenavi2 li a:hover {color: #126293}
#sidenavi2 li.selected {background: #b30d04 url(../img/bg/sidenavi_bg.png) -547px 0 no-repeat}
#sidenavi2 li.selected a {color: #fff}
#sidenavi2 li.selected a:hover {color: #FCEDA8}

/* PAGINATION
----------------------*/
.pagination {margin:18px 0;display:block;clear: both}
.pagination span.page {font-size:1.0em;color:#333;display:block;margin-bottom:10px}
.pagination a {font-weight:bold;font-size:1.0em;color:#003366;text-decoration:none;padding: 6px 10px;border:1px solid #ccc;margin:0 1px 10px 1px}
.pagination a.current {font-weight: normal;color:#333;background-color:#fafafa;border:1px solid #f1f1f1}
.pagination a.previous, .pagination a.first {margin-right: 9px}
.pagination a.next, .pagination a.last {margin-left: 9px}

/* PROFILE
----------------------*/
.formparagraph label {width: 196px; float: left; display: block}
#userdata p {margin-bottom: 9px}
#userdata span {font-size: 0.9em; font-weight: normal}
#userdata input, #userdata textarea {border: 1px solid #969696; padding: 2px 3px}
#userdata textarea {margin: 9px 0; width: 432px}
#userdata legend {white-space: normal; font-size: 1.25em; padding: 0}
#userdata fieldset {padding: 18px 10px; width: 586px; border:0; background: url(../img/bg/register_bg.png) repeat-x scroll 0 0 #FFF8B3; display: block}
#userdata .sidebar fieldset {width: 268px}
#userdata .preview-thumbnail {float: left; width: 122px; text-align: center}

/* BODY SCRIPT
----------------------*/
body.script #login #passwlabel,body.script #login #userlabel {display: none}
body.script #login #passw, body.script #login #username {background-color:#fff; background-repeat: no-repeat}
body.script #login #passw.activefield, body.script #login #username.activefield, body.script #uutiskirje input.activefield {background-image: none !important}
body.script #login #passw {background-image: url(../img/bg/loginfields.gif); background-position: 5px -17px}
body.script #login #username {background-image: url(../img/bg/loginfields.gif); background-position: 5px 2px}
body.script #uutiskirje input.focusfield {background: #fff url(../img/bg/loginfields.gif) no-repeat 5px -38px}

/* Image replacement otsikot */
.blogitotsikko, .kommentitotsikko, .kuvatotsikko, #kommentoiduimmatotsikko, #luetuimmatotsikko, #uusimmatotsikko {text-indent:-9999px; clear: both; background-repeat: no-repeat; margin: 0}
.blogitotsikko a, .kommentitotsikko a, .kuvatotsikko a {display: block; height: 100%}
.blogitotsikko {background-image: url(../img/bg/blogit-otsikko.png); height: 70px}
.kommentitotsikko {background-image: url(../img/bg/kommentit-otsikko.png); height: 68px}
.kuvatotsikko {background-image: url(../img/bg/kuvat-otsikko_orig.png); height: 52px; margin: 0 0 10px 0}

#kommentoiduimmatotsikko {background-image: url(../img/bg/kommentoiduimmat-otsikko.png)}
#luetuimmatotsikko {background-image: url(../img/bg/luetuimmat-otsikko.png)}
#uusimmatotsikko {background-image: url(../img/bg/uusimmat-otsikko.png)}

#uutiskirje {background: url(../img/bg/tilaa_uutiskirje.png) no-repeat; clear: both; min-height: 40px}
#uutiskirje form {padding: 45px 0 10px 85px}
#uutiskirje form input {border: 1px #B10A04 solid; padding: 4px}
#uutiskirje form .button {margin-top: 5px}

.juttulistat {float: left; width: 394px; margin: 10px 0}
.juttulistat h2 {margin: 10px 0 5px !important}
.juttulistat ul {list-style: none; margin-bottom: 10px}
.juttulistat ul li {padding: 3px 0; border-bottom: 1px solid #F49714}

/* lomakkeet */
.commentform {margin: 18px 0}
.commentform {position: relative}
.commentform label {display: block}
.commentform textarea {margin: 0; padding: 4px; font-size:1em}
.commentform textarea {width: 470px}
.commentform .button,.commentform label {margin-top: 10px}

/* DOKUMENTIN TYYLIT
----------------------*/
.document {font-size: 14px}
.document img.vasen {float: left; margin-right: 10px}
.document img.oikea {float: right; margin-left: 10px}
.document ul {margin: 20px}

.document .asiasanat {background: url(../img/bg/register_bg.png) repeat-x scroll 0 0 #FFF8B3; font-size: 12px; padding: 5px}
.document .asiasanat a {color: #000}

/* kommentit */
.kommentit {background: url(../img/bg/register_bg.png) repeat-x scroll 0 0 #FFF8B3; float: left; padding: 10px; width: 480px}
.pictureinfo dl dt {float:left; margin-right: 5px}

/* kyselyt*/
.document fieldset {padding: 10px}
.document fieldset ul {list-style: none; margin: 0}
.document fieldset ul li label {font-weight: normal}
.document fieldset label {margin-left: 5px}

/* FILTER
----------------------*/
.filter, .filter li {border-color: #800400; border-style: solid}
.filter li {float: left;  border-left-width: 1px}
.filter {margin: 0 0 9px 0; float: left}
.filter li {background: #DF0737 url(../img/bg/nav_bg.png) repeat-x scroll left top; display: block; padding: 0; border-width: 1px; margin-left:-1px}
.filter li a {color: #fff; padding: 2px 20px; display: block}
.filter li.active {background: #B20D04 url(../img/bg/nav_bg_active.png) repeat-x bottom}
.filter li.active a {color: #fff}
#puhutuimmat_filter {margin-bottom: 9px}
#puhutuimmat_filter_aika {border-bottom: 3px solid #003265; padding-bottom: 9px; width: 100%}

/* OSTOSLISTA */
.shopping-list dd {padding: 5px 0 5px 0; border-bottom: 1px solid #bbb; margin: 5px 0 5px 0;}
.shopping-list dd.last {border: 0; text-align: right}
.shopping-list dd a.delete, p.more a.delete, .shopping-list dd a.add, .shopping-list dd a.remove, .more a.add, .more a.remove  {padding: 0 0 1px 20px; background-repeat: no-repeat; background-position: 0px 3px}
.shopping-list dd a.delete, p.more a.delete {background-image: url(../img/actions/action_delete.gif); float: right;}
.shopping-list dd a.remove, .more a.remove {background-image: url(../img/actions/minus.png)}
.shopping-list dd a.add, .more a.add {background-image: url(../img/actions/add.png)}

p.more a.delete, p.more a.add, p.more a.remove {display: inline; background-position: 0 0}
.shopping-list dt {font-size: 16px}
.shopping-list h1 {font-size: 28px}
.shopping-list {position: relative}
.shopping-list .printshoppinglist {position: absolute; right: 0; top: 0; padding-left: 20px; background: url(../img/actions/print.png) no-repeat}
.printshoppinglistpdf {position: absolute; right: 140px; top: 0; padding-left: 20px; background: url(../img/actions/pdficon_small.gif) no-repeat}
.add_shoppinglist {background: url(../img/actions/add.png) no-repeat right; padding-right: 20px; padding-bottom: 1px}
#printheader, #printlogo {display: none}

.ostos-buttons {display: block;}
.ostos-buttons a, .more a {float: left; margin-right: 4px}


/* PILTTIKASSI */

#pilttikassi {width: 206px; background: #F8F4EB; margin: 0 auto; border: 3px solid #C83F2C;text-align:center;}
.pilttikassired {font-family:"Times New Roman", Times, serif;font-size:14px; color:#C83F2C;}
.pilttikassisuuri { font-family:Arial, Helvetica, sans-serif; font-size:22px; color:#000;}

#custom_comp input, #custom_comp textarea
{
    width: 230px;
}
#custom_comp #eula_ok
{
    width: 30px;
}