/* -------------------------------------------------------------- 
   Master.css  
-------------------------------------------------------------- */

@import "base.css";
@import "base.forms.css";
@import "tb.css";

/* Widgets
-------------------------------------------------------------- */

.clearfix:after, .FormItem:after, .CheckWrap:after, .Checks:after, #LoginForm:after,
#page-header:after, .ProductList:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix, .FormItem, .CheckWrap, .Checks, #LoginForm, #page-header, .ProductList { display: inline-block; }
/* IE-mac \*/ .clearfix, .FormItem, .CheckWrap, .Checks, #LoginForm, #page-header, .ProductList { display: block; } /* IE-mac */

/* Layout
-------------------------------------------------------------- */

body { text-align: center; background: #d7cab9 url(../i/bodybg.jpg) repeat left top; padding: 0; }

/* Add these lines if you want your AdminTools to be fixed on the top of the page */
body.adminLoggedIn { padding: 36px 0 0; }
body.adminLoggedIn #AdminTools { position: fixed; z-index: 2; top: 0px; left: 0px; }
body.adminLoggedIn #container { z-index: 1; }
* html body.adminLoggedIn #adminTools { position: relative; }
* html body.adminLoggedIn { padding: 0; }

#container {
	position: relative; margin: 0 auto 80px; padding: 80px 30px 0;
	height: auto; width: 911px; overflow: hidden;
}
#buttons {
	position: absolute; z-index: 998;
	height: 48000px; width: 81px; top: 85px; left: 55px;
	background: url(../i/napit.jpg) left top;
}
#header {
	position: relative; margin: 0 auto;
	width: 911px; height: 221px; padding: 0; text-align: left;
	background: url(../i/header.jpg) repeat-y left top;
}
#logo {
	position: absolute; left: 0px; top: 50px;
	z-index: 999;
}
#basket {
	position: absolute; top: 30px; left: 480px;
	width: 371px; height: 76px; color: #ba7a6c;
	background: url(../i/basket.jpg) no-repeat left top;
	font-size: 18px; text-align: center; line-height: 24px;
	padding: 10px 0;
}
#basket a { color: #9e2e15; padding: 0 10px; }

#MiniMaksut { position: absolute; left: 50px; bottom: 12px; }

#main {
	position: relative; margin: 0 auto; height: auto;
	width: 911px; padding: 0 0 90px; text-align: left;
	background: url(../i/repeat.jpg) repeat-y left -550px;
}
#navi {
	float: left; width: 250px; padding: 0; margin: -54px 0 50px 112px; line-height: 27px;
	background: url(../i/navi-repeat.jpg) repeat-y left -180px; text-align: center;
}
#navi ul {
	list-style: none outside; margin: 0 0 5px; padding: 0 0 40px;
	background: url(../i/navi-erotin.gif) no-repeat 50% bottom;
}
#navi h2#FirstHeader {
	padding: 140px 0 0; margin: 0;
	background:  url(../i/navi-top.jpg) no-repeat left top;
}
#navi ul#LastList, #navi div#LastList {
	padding: 0 0 20px; margin: 0;
	background: url(../i/navi-bottom.jpg) no-repeat left bottom;
}
#navi #LastList ul { background: none; padding: 0; }

#navi label, #navi input { clear: left; text-align: left; }
#navi form { padding: 0 26px 30px; margin-bottom: 20px; background: url(../i/navi-erotin.gif) no-repeat 50% bottom; }

#content {
	position: relative; float: left;
	width: 500px; overflow: visible;
	padding: 8px 10px 0;
}
#kehys {
	width: 503px; height: 430px; position: relative;
	background: url(../i/kehys.jpg) no-repeat left top;
}
#kehys img {
	position: relative; padding: 98px;
}
#kehys-over {
	position: absolute; top: 98px; left: 98px; width: 41px; height: 133px;
	background: url(../i/kehys-over.png) no-repeat left top;
}

.Tuotelista { padding: 20px 0; }
.Tuote {
	position: relative; float: left; width: 159px; height: 225px;
	background: url(../i/tuotebg.jpg) no-repeat left top;
	text-align: center; margin: 0 11px 15px 0; overflow: hidden;
}
.Tuotelista .Ekatuote { margin-left: 0; clear: left; }
.Tuotelista .Viimeinentuote { margin-right: 0; }

.Tuote img { display: block; margin: 8px auto 0; border: 1px solid #cdbca4; }
.Tuote h2 { font-size: 11px; font-weight: bold; line-height: 15px; }
.Tuote h2 span.Hinta { position: relative; top: 5px; }

#footer {
	position: relative; margin: -40px auto -5px;
	width: 911px; height: 73px; padding: 0; text-align: left;
	background: url(../i/footer.png) no-repeat left top;
	text-align: center;
}
#footer * { position: relative; }
#footer img {  margin: -60px auto 5px; }

#etusivu {
	position: relative; width: 750px;
	margin: 0 0 50px 122px; padding: 30px 0 0;
}
#FrontLeft { float: left; width: 421px; padding-bottom: 40px; text-align: center; }
#FrontRight { float: left; width: 324px; padding-bottom: 40px; }

#fronthaku {
	width: 302px; height: 48px; background:  url(../i/hakubg.png) no-repeat left top;
	margin: 0 0 10px; padding: 10px;
}
#fronthaku form { padding: 12px 10px; }
#fronthaku label { display: none; }
#fronthaku input {
	padding: 3px; height: 18px; width: 215px;
	background: #d4be9c;
	border-top: 1px solid #96866e;
	border-right: 1px solid #dac7a9;
	border-bottom: 1px solid #dfceb5;
	border-left: 1px solid #ae9c80;
}
#fronthaku button { top: -1px; }

#Runolaari, #Tietoa, #Blogi { display: block; margin: 0; padding: 0; }
#Runolaari img, #Tietoa img, #Blogi img { display: block; margin: 0; padding: 0; }
#Runolaari { margin: 0 0 20px; }

#FrontImage {
	width: 382px; height: 248px;
	margin: -7px; padding: 15px; text-align: center;
	background: url(../i/etusivukuva.jpg) no-repeat left top;
}
#FrontImage img { margin: 0 auto; }

.KategoriaLista {
	margin-right: -8px; width: 758px;
	clear: both;
}
.Kategoria {
	position: relative; float: left; width: 242px; height: 340px;
	text-align: center; margin: 0 8px 0 0;
}
#etusivu .pikkukehys {
	width: 242px; height: 207px; position: relative;
	background: url(../i/pikkukehys2.jpg) no-repeat left top;
	margin: 0;
}
#etusivu .Kategoria h3 { font-size: 14px; line-height: 18px; margin: 0; padding: 9px 0; }
#etusivu .Kategoria p { font-size: 11px; margin: 0; padding: 0 0 6px; }
#etusivu .Kategoria p a { font-size: 12px; font-weight: bold; }
#etusivu .pikkukehys img {
	position: relative; padding: 47px 48px 49px 47px;
}
#etusivu .pikkukehys .pikkukehys-over {
	position: absolute; top: 47px; left: 47px; width: 20px; height: 64px;
	background: url(../i/pikkukehys-over2.png) no-repeat left top;
}


#ProductBuy {
	border: 1px solid #d9b0a3; background: #f8e3db;
	padding: 9px 9px 0; width: 480px; overflow: hidden;
	margin: 0 0 18px;
}
#ProductBuy dl { margin: 0; padding: 0; display: inline; }
#ProductBuy dt, #ProductBuy dd { display: inline; margin: 0 3px 0 0; padding: 0; }
#ProductBuy dd { margin: 0 9px 0 0; }


#ProductBuy label { width: auto; }
#ProductBuy .BuyForm { padding: 9px 0 0; }
#ProductBuy .FormItem { float: left; clear: none; margin: 0 9px 0 0; padding-bottom: 9px; }
#ProductBuy .SubmitButton { margin: 0; padding: 0; margin-bottom: -7px; top: -3px; }

#ProductImages { list-style: none outside !important; margin: 0 !important; padding: 0 !important; }
#ProductImages li { list-style: none outside !important; margin: 0 0 6px !important; padding: 0; border: 1px solid #cdbca4; }
#ProductImages li img { display: block; margin: 0; padding: 0; }

#etusivu #CatNavId14, #CatNavId14 { display: none; }
#etusivu #CatNavId15, #CatNavId15 { display: none; }

/* News
-------------------------------------------------------------- */

.NewsDate {
	background: #fafafa; border: 1px solid #f2f2f2;
	float: right; width: 54px; padding: 9px; text-align: center;
	margin: -1px 0 17px 17px; font-size: 10px;
}
.NewsOverview { font-size: 14px; font-weight: bold; color: #666; }
.NewsDate span { display: block; margin: 0; padding: 0; }
.NewsHeader { font-size: 10px; color: #aaa; }
.NewsDay { font-size: 20px; letter-spacing: 1px; color: #888; }
.NewsYear { font-size: 12px; letter-spacing: 2px; font-weight: bold; color: #aaa; }


/* Account pages
-------------------------------------------------------------- */

#OrderStatus { margin: 18px 0; font-size: 14px; }
#OrderStatus dd+dd { margin-left: -6px; }

#OrderHistoryTable { margin: 18px 0; }

dl#AccountInformation { margin: 18px 0; width: 100%; overflow: hidden; padding: 0; border-bottom: 1px solid #d9d9d9; }
dl#AccountInformation dt, dl#AccountInformation dd { position: relative; float: left; margin: 0; padding: 0; width: auto; }
dl#AccountInformation dt { width: 125px; padding: 4px 9px; border-top: 1px solid #d9d9d9; clear: left; }
dl#AccountInformation dd { width: 265px; padding: 4px 9px; border-top: 1px solid #d9d9d9; }
dl#AccountInformation dd.AccountLogout, dl#AccountInformation dd.AccountEdit {
	width: 102px; padding: 4px 9px; border-top: 1px solid #d9d9d9;
}
dl#AccountInformation dd a { position: absolute; right: 0px; top: 4px; font-size: 11px; font-weight: bold; }
dl#AccountInformation dd address { margin-bottom: 0; }

/* Cart
-------------------------------------------------------------- */

#CartForm { margin: 18px 0 0; }

table .FormItem, table .FormItem:hover { float: none; margin: 0; padding: 0; border: 0; background: none; }
table input, table button { float: none; display: block; }

.CartTotal, .CartShippingCost, .CartPaymentCost { text-align: right; }
td.CartTotal { font-weight: bold; }
.CartPrice, .CartQuanity { text-align: center; }
.CartQuantity input { top: 3px; margin: -4px auto 0; }
.CartQuantity .CartRemove {
	font-size: 10px; font-weight: bold; color: #c00;
	line-height: 18px; text-align: center; display: block;
}

table .ProductName { padding: 0; font-size: 12px; }

.CartPic a {
	display: block; position: relative;
	text-align: center; background: #FFF;
	width: 34px; height: 34px; line-height: 30px;
	border: 1px solid #d9d9d9; vertical-align: middle;
}
.CartPic a:hover { border-color: #09f; }
.CartPic a img {
	vertical-align: middle; display: inline;
	line-height: 28px; margin: auto;
	padding: 0; border: 0;
}
#CartTable tfoot th, #CartTable tfoot td,
#PreviewTable tfoot th, #PreviewTable tfoot td { text-align: right; }

#UpdateCart button { padding: 1px 2px; font-size: 11px; line-height: 15px; float: right; margin: -9px 0 0; }

#ContinueToCheckout { margin: 0; padding: 0; border: 0; background: none; }
#ShoppingCartSubmit { padding: 0 0 18px; }
#ShoppingCartSubmit .ToCheckout { float: right; margin: 0; }
#ShoppingCartSubmit .ContinueShopping { float: left; margin: 0; padding: 0; }
#ShoppingCartSubmit .ContinueShopping a {
	float: left; margin: -36px 0 0; padding: 0 9px; background: #f2f2f2; border: 1px solid #d9d9d9;
	line-height: 18px; height: 18px; text-decoration: none; color: #069; font-size: 11px;
	font-weight: bold;
}