@import url(button.css);
@import url(ie-hacks.css);
html {background:url(/static/images/html-bg.png) repeat-x;}

body {
	color: #333;
	font-family: verdana,arial,helvetica,sans-serif;
	font-size: 76%;
	margin: 0;
	padding: 0;
}
a {
	color: #1c8aaf;
	font-weight: bold;
	text-decoration: underline;
}
a:link {
}
a:visited {
}
a:active {
}
a:hover {
	text-decoration: underline;
	color:#26b4e4;
}
h1 {
	font-size: 2.0em;
	font-weight: normal;
	margin-bottom: 0em;
	margin-top: 0em;
}
h2 {
	font-size: 1.3em;
	font-weight: bold;
	margin: 0 0em 1.0em 0em;
	
}
h3 {
	font-size: 1.4em;
	font-weight: normal;
	margin: 0.8em 0em 0.8em 0em;
}
h4 {
	font-size: 1.2em;
	font-weight: bold;
	margin: 1.0em 0em 1.0em 0em;
}
h5 {
	font-size: 1.0em;
	font-weight: bold;
	margin: 0.8em 0em 0.8em 0em;
}
h6 {
	font-size: 0.8em;
	font-weight: bold;
	margin: 1.0em 0em 1.0em 0em;
}
img {
	border: 0;
}
p {
	font-size: 90%;
	line-height: 1.4em;
	margin: 0em 0em 1.2em 0em;
}
li>p {
	margin-top: 0.2em;
}
pre {
	font-family: monospace;
	font-size: 1.0em;
}
strong,b {
	font-weight: bold;
}

input {padding:0; margin:0;}

/* STRUCTURE */

#wrap {
	margin:0 auto;
	min-width:980px;
	max-width:1300px;
	
}

#main {
	background:url(/static/images/wrap-w-bg.png) repeat-y left transparent;
}

#main-inner {background:url(/static/images/wrap-w-bg.png) repeat-y right transparent;}

#content {
	margin:0 200px 0 200px;
	padding:0 5px;
	background:white;
}

#container {margin:0 13px 0 14px ; background:white;}

#left {
	float:left;
	margin-left:10px;
}
	

#right {
	float:right;
	margin-right:10px;
}

#footer {
	background:url(/static/images/footer-bg.png) no-repeat;
	height:40px;
	padding:0 0 0 0;
	text-align:center;
	color:#333;
}

#footer p {margin:0; padding:20px 0;}

#footer #f-right {width:30px; height:40px; float:right; background:url(/static/images/footer-bg.png) right top no-repeat;}

.column {
	width:178px;
	margin:0;
	background:white;
}

.column a {
	color:#333;
	text-decoration:none;
	font-weight:normal;
}

.column a:hover {
	text-decoration:underline;
}
.left {float:left; margin: 0 1%;}
.right {float:right; margin: 0 1%;}
.half {margin: 48%;}
.full {width: 100%;}

/* HEADER */
#header {
	margin-top:20px;
	height:174px;
	background:url(/static/images/header-bg.png) repeat-x #0cade1;
	color:white;
	padding:0;
}
#header #h-left {background:url(/static/images/header-left-bg.png) no-repeat; float:left; width:30px; height:174px;}
#header #h-right {background:url(/static/images/header-right-bg.png) no-repeat #0cade1; float:right; width:500px; height:174px;}
#header a {color:white; display:block; margin:0 0 0 35px; padding:21px 0 0 0;}



/* NAVIGATION */

.column ul, .column li {
	list-style-type:none;
	line-height:1.3em;
	
}
#menu li a {font-weight:bold;}
#menu li.selected a {font-weight:normal;}
#menu li.selected {background:none; padding:0; border:0; margin:0 2px 0 0;}

#menu .selected a.selected {
	border:0;
	display:block;
	background:url(/static/images/menu-selected-bg.png) no-repeat #0cade1;
	padding-left:20px;
	color:white;
	font-weight:bold;
	margin:0;
}


#menu li ul {
	margin:0 0 0 3px;
}
#menu li { padding-top:0.4em; padding-bottom:0.4em;}
#menu li ul a {padding-left:10px; display:block; background:url(/static/images/bullet-grey.gif) no-repeat center left; }
#menu li ul li {
	border-bottom:1px solid #ccc;
	background:transparent;
	padding:0.4em 2px;
	color:#ccc;
	line-height:1.5em;
}
#menu li ul li ul li {border-bottom:0; border-top:1px solid #ccc; padding:6px 2px 2px 0; font-size:0.90em;}

/* BLOCKS */

.block {
	background:url(/static/images/block-title-bg.png) no-repeat #a3d921;
}
.block ul a {font-weight:bold;}

.block h3 {
	margin:0;
	padding:5px 0 0 35px;
	height:29px;
	background-repeat:no-repeat;
	background-position:5% 50%;
	color:white;
}

.block .bottom {
	width:178px;
	margin-bottom:10px;
	padding: 0 0 5px 0;
	background:url(/static/images/block-bottom-bg.gif) no-repeat bottom left white;
}

.block .bottom > * {
	margin-right:2px;
	margin-left:4px;
}

.block .top {
	margin:0 0 0 0;
	padding:6px 5px 0 5px;
	background: url(/static/images/block-top-bg.gif) no-repeat top left white;
	width:171px;
}

.block ul li {
	background:url(/static/images/arrow-right-icon.gif) 0% 50% no-repeat transparent;
	border-bottom:1px solid #ccc;
	padding:2px 0 2px 10px;
}


#cart table {width:100%; font-size:90%;}
#cart th {text-align:left;}
#cart h3 {background-image:url(/static/images/cart-icon.gif);}

#myinfo h3 {background-image:url(/static/images/me-icon.gif);}
#myinfo h5 {margin-left:10px;}
#products h3 {background-image:url(/static/images/block-arrow-icon.gif);}

#search h3 {background-image:url(/static/images/search-icon.gif);}

#community h3 {background-image:url(/static/images/block-arrow-icon.gif);}

#info h3 {background-image:url(/static/images/block-arrow-icon.gif);}

#payment {text-align:center;}
#payment img {vertical-align:top; padding:5px 2px 5px 2px;}
#payment a {display:block; width:120px; margin:0 auto;}

/* FILTERS */

#filter dl {margin:0 0 1em 0; padding:10px 0 0 10px;}
#filter dt {float:left; padding:0; font-weight: bold; padding:0; margin:0 0.5em 0 0; }
#filter dd {padding:0; margin:0; }

#filter h2 a {color:#fff; font-size:80%;}
#tags dt {float:none;}
#nav #applied {color:#eee; background:url(/static/images/group-sub-bg.png) no-repeat #0cade1;}

/* SLIDING DOORS */
.group {
	background: url(/static/images/group-left-bg.png) left top no-repeat #0cade1;
	height:34px;
	padding:0;
	margin:0 0 0 0;
	color:white;
}

.group h2 {
	background: url(/static/images/group-right-bg.png) right top no-repeat ;
	margin:0;
 	padding:8px 0 5px 10px;
	height:26px;
}

.notice {
	background: url(/static/images/msg-box-bg.png) left top no-repeat;
	padding:0;
	margin:20px 0;
	text-align:center;
}

.notice span {
	background: url(/static/images/msg-box-right-bg.png) right top no-repeat;
	margin:0;
 	padding:15px 10px 5px 10px;
	display:block;
}


/* PRODUCT TABLE */
.productlist {width:100%;}

.productlist th {text-align:center; cursor: pointer; color:#1c8aaf;}

.productlist td {
	height:60px;
	border:1px solid #e5e5e5;	
	text-align:center;
	background:url(/static/images/prod-td-bg.png) repeat-x;
	padding:2px 2px;
	color:#333;
}
.productlist tr {}

.productlist td {width:60px;}

.productlist .product {
	width:300px;
	text-align:left;
	padding:0 10px;
}

.productlist .img {
	width:64px;
	background:none;
	padding:0;
}

.productlist .buy {
	background:none;
	text-align:center;
}
.productlist .buy a {margin:0 5px; float:none;}


/* SEARCH */

#search #searchfield {
	width:100px;
	float:left;
	height:20px;
	margin:3px 2px 5px 2px;
	background:url(/static/images/searchfield-bg.png) no-repeat #eee;
	border:0;
	padding:4px 5px 0 5px;
	color:#333;
	font-weight:bold;
}

#search p {margin:0;}

/* TAGS */
.koko0 {
font-size:80%;
}
.koko1 {
font-size:90%;
}
.koko2 {
font-size:100%;
}
.koko3 {
font-size:120%;
}
.koko4 {
font-size:130%;
}
.koko5 {
font-size:140%;
}
.koko6 {
font-size:160%;
}

.button {
	background:#eee;
	color:#333;
	border:1px solid #999;
	padding:5px 5px;
	text-decoration:none;
	margin-top:20px;
	width:auto;
	display:block;
}

/* CLEARFIX */

.bottom:after, #wrap:after, #main:after, #container:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

.bottom, #wrap, #main, #container {
	display: inline-block;
}
* html #wrap, * html #main, * html .bottom, * html #container {
	height: 1%;
}
#wrap, #main, .bottom, #container {
	display: block;
}

/*
Omia sovelluksia
*/
ol,ul,li {
	font-size: 1.0em;
	line-height: 1.8em;
	margin: 0.2em 0;
}
.column ol, .column ul, .column li {
	padding: 0;
}


#frontpage td.boksi {
  width: 50%;
  vertical-align: top;
}

.flash {
  font-weight: bold;
  font-size: medium;  
  width: 50%;
  text-align: center;
  padding: 10px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #ccc;
}
.smallprint {
  font-size: x-small;
  color: #999;
}
.smallprint a {
  text-decoration: none;
}
.noticebox {
  font-size: x-small;
}
.noticebox a {
  text-decoration: none;
}

div.etusivuboksi div.left {
  margin-right: 10px;
}

/* Siirretty omista 
*/
#loginBox {
  font-size: small;
  width: 40%;
  margin: auto;
}

#loginBox td.label {
  text-align: right;
}

#loginBox td.buttons {
  text-align: right;
}

img.right, img.left {
  padding: 5px;
}

.invisible {
  display: none;
}
#kelluke {
  position: fixed;
  opacity: 0;
  display: none;
  z-index: 50;
  background-color: #169cc9;
  padding: 5px;
  top: 10px;
  left: 400px;
}
/* UGLY IE6 hack */
* html #kelluke { /*\*/position: absolute; top: expression((10 + (ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop)) + 'px'); left: expression((400 + (ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft)) + 'px');/**/ }
/* UGLY IE6 hack ends */

.listform ul {
  list-style: none;
}

.listform li {
  margin-bottom: 5px;
}

.listform .even {
  color: inherit;
  background-color: #EEE;
}

.listform label {
  font-weight: bold;
}

.listform input, .listform select, .listform textarea, .listform label.label {
  padding: 0;
  margin-left: 100px;
  display: block;
}

.listform .radiobuttonlist input, .listform .checkboxlist input {
  margin-left: 60px;
  display: inline;
}

.listform .fieldhelp, .listform .fielderror {
  padding: 0;
  margin-left: 100px;
  display: block;
}

.listform .fielderror {
  color: red;
  background-color: inherit;
}

.listform .requiredfield {
}

pre.resepti {
  font-family: "Trebuchet MS", Verdana, sans-serif;
}


/* Omat tyylit, ei enää käytössä */
/*
body {
  color: black;
  background-color: white;
  margin: 0;
  padding: 0;
  font-size: small;
  font-family: "Trebuchet MS", Verdana, sans-serif;
}

h1, h2, h3 {
  color: #539959;
  background-color: inherit;
  font-weight: bold;
  font-variant: small-caps;
}

#header {
  margin: 5px;
  padding: 0;
  height: 96px;
  background: white;
  color: black;
}

#header img {
  position: absolute;
}

.todo {
  text-align: center;
  font-weight: bold;
  color: black;
  background-color: #ddd;
  border: 2px solid black;
  padding: 2em;
  margin: 1em;
  width: 50%;
}

a img {
  border: none;
}

#alapalkki, #ylapalkki {
  height: 32px;
  border-bottom: 2px solid #539959;
  color: black;
}

p.footer {
  text-align: center;
}

#ylapalkki {
  margin-top: -32px;
  background: #8aff94 URL('/static/images/ylapalkki.png') no-repeat bottom right;
}

#alapalkki {
  clear: both;
  background: #8aff94 URL('/static/images/alapalkki.png') no-repeat center left;
}

.intro {
  text-align: center;
}

div.tagit a, ul.alikategoriat a{
  text-decoration: none;
}
div.tagit a:hover, ul.alikategoriat a:hover {
  text-decoration: underline;
}

div.polku {
  color: #539959;
  background-color: inherit;
  margin-top: 0.6em;
  margin-bottom: 0.2em;
  font-size: medium;
}
span.polku {
  font-weight: bold;
  font-variant: small-caps;
}

.box { 
  border-left: 1px solid #539959;
  border-top: 1px solid #539959;
  border-bottom: 2px solid #539959;
  border-right: 2px solid #539959;
  margin: 0.5em;
  padding: 0.0;
  font-size: small;
}

.box h2 {
  color: black;
  font-size: medium;
  background-color: #8aff94;
  text-align: center;
  margin: 0;
  padding: 2px;
}

.box input {
  font-size: xx-small;
}

.tuotetieto th {
  text-align: left;
}

.tuotetieto td {
  padding-left: 0.5em;
  vertical-align: top;
}

.tuotelaatikko {
  height: 128px;
  width: 128px;
  padding: 10px;
  display: table-cell;
  cursor: pointer;
  overflow: hidden;
}

.tuotelaatikko td {
  vertical-align: top;
}

.tuotelaatikko td.kuva {
  width: 64px;
  height: 64px;
}

.tuotelaatikko td.hinta {
  text-align: right;
}

.tuotelaatikko .ykshinta {
  padding-top: 0.3em;
}

td.half {
  width: 50%;
}

#main {
  margin-left: 21%;
  margin-right: 21%;
  padding: 5px;
}

.sitefront {
  text-align: center;
  margin-left: 0;
  margin-right: 0;
  font-size: large;
}

.sidebar {
  width: 21%;
}

.sidebar h2 {
  margin-top: 0;
  font-size: 120%;
  font-weight: bold;
}

.sidebar ul {
  margin-left: 0.4em;
  list-style-position: inside;
  padding-left: 0.2em;
}

ul.action, ul.tuotelista {
  list-style-type: none;
  padding: 0;
}

ul.action li, ul.tuotelista li {
  display: inline;
}

.even {
  background-color: #caffcf;
}
.odd {
}

table.kategoriat {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

table.kategoriat td {
  padding-left: 5px;
}

table.kategoriat .caption {
  font-size: xx-small;
}

table.kategoriat img {
  padding: 2px;
  border-top: 1px solid #8aff94;
  border-left: 1px solid #8aff94;
  border-bottom: 2px solid #539959;
  border-right: 2px solid #539959;
}

#sortable_table th {
  cursor: pointer;
}

.center {
  text-align: center;
}

.sidebar .action a, .sidebar a.action {
  font-size: inherit;
}

a, a:link, a:visited { 
  color: #055229;
  background-color: inherit;
}

.sidebar a, .box a {
  text-decoration: none;
}

a:hover { 
  text-decoration: underline;
}

.action a, a.action {
  color: black;
  background-color: #caffcf;
  font-weight: bold;
  border-top: 2px solid #8aff94;
  border-left: 2px solid #8aff94;
  border-bottom: 2px solid #539959;
  border-right: 2px solid #539959;
  padding: 3px;
  line-height: 2.5em;
  text-decoration: none;
  white-space: nowrap;
}

.action a:hover, a.action:hover {
  padding: 3px 4px 3px 2px;
  border-top: 2px solid #8aff94;
  border-left: 1px solid #8aff94;
  border-bottom: 2px solid #539959;
  border-right: 3px solid #539959;
}

.action a:active, a.action:active {
  padding-left: 4px;
  padding-top: 4px;
  border-top: 1px solid #8aff94;
  border-left: 1px solid #8aff94;
  border-bottom: 1px solid #539959;
  border-right: 1px solid #539959;
}

ul.puu {
  font-size: medium;
  font-weight: bold;
  list-style-type: disc;
}

ul.puu ul.puu {
  font-weight: normal;
  list-style-image: none;
  list-style-type: circle;
  padding-left: 0px;
}

ul.puu ul.puu ul.puu{
  font-size: small;
  list-style-type: square;
  padding-left: 0px;
}

ul.puu ul.puu ul.puu ul.puu{
  font-size: x-small;
  list-style-type: circle;
  padding-left: 0px;
}

h1 a, h2 a, h3 a {
  text-decoration: none;
}

table.ostoskori tr {
  margin: 0;
  padding: 0;
  font-size: x-small;
}

table.tilaukset td, table.tilaukset th {
  padding: 0.3em;
}

.sidebar table.ostoskori tr {
  font-size: xx-small;
}

table.ostoskori th {
  text-align: left;
}

table.isokori {
  padding: 2em 1em 3em 1em;
}

table.isokori th {
  text-align: left;
}

table.isokori tr {
  font-size: medium;
}

.tagit {
}

.tag {
  padding: 2px;
  white-space: nowrap;
}
.koko0 { font-size: 50%; }
.koko1 { font-size: 60%; }
.koko2 { font-size: 70%; }
.koko3 { font-size: 80%; }
.koko4 { font-size: 90%; }
.koko5 { font-size: 100%; }
.koko6 { font-size: 110%; }

.hinta {
  border: 1px solid #539959;
  font-size: medium;
  text-align: right;
  padding-left: 5px;
  padding-right: 5px;
}

.ykshinta {
  font-size: small;
}
.yksyks {
  font-size: x-small;
}
.koko {
  text-align: left;
}

ul.alikategoriat {
  font-size: small;
}

table.tuotelista th {
  text-align: left;
}

table.tuotelista td.koriin, table.tuotelista th.koriin {
  padding-left: 3em;
  text-align: left;
}

table.tuotelista tr {
  margin-bottom: 10px;
  border-bottom: 1px solid #539959;
}

table.ostoskori td, table.ostoskori th {
  padding-left: 0.5em;
  padding-right: 0.5em;
  white-space: nowrap;
}

table.ostoskori td:first-child, table.ostoskori th:first-child {
  white-space: normal;
  padding-left: 0;
  border-left: none;
}

.info {
  background: #8aff94;
  border: 1px solid #539959;
  padding: 2px;
}

.alert {
  background: #f65;
}

a.poista, a.muokkaa {
  font-weight: bold;
  text-decoration: none;
  font-size: x-small;
  padding: 1px;
  background-color: inherit;
}

a.poista {
  color: red;
  border: 1px solid red;
  background-color: inherit;
}

div.haku {
  padding-left: 5px;
  padding-right: 5px;
}

img.maksulogo {
  vertical-align: top;
  padding-bottom: 5px;
}

.smallprint {
  color: #555;
  background-color: white;
  font-size: x-small;
  text-align: right;
  padding-right: 5px;
}

table.lasku {
  margin-top: 1em;
  margin-left: 1em;
  border-collapse: collapse; 
}
table.lasku td {
  border: 1px solid black;
}
table.plain td {
 border: none;
}

*/
