@charset "utf-8";

/* CSS imports. Tried to keep in minimum. */

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

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

html, body { height: 100%; }
body { background: #1f1f1d; }

#Ads { color: #1f1f1d; position: absolute; left: 980px; top: 90px; }
#Ads a { display: block; margin: 0 0 10px; padding: 0; }
#Ads img { display: block; }

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; }

#Wrapper {
	position: relative; min-height: 100%; height: auto;
	width: 920px; padding: 0 40px 0 20px; margin: 0;
	background: #FFF url(../i/edge.gif) repeat-y right top;
}
#TopBar {
	width: 920px; height: 60px; margin: 0 0 30px;
	background: #d6d5d2 url(../i/topbar.gif) no-repeat left top;
	overflow: hidden;
}
#TopBar a { font-weight: bold; }
#SearchForm, #Customer, #Basket {
	height: 40px; float: left;
	padding: 7px 0 0 55px;
	overflow: hidden;
}
#SearchForm { width: 275px; }
#SearchForm .FormItem { margin: 0; padding: 0; }
#SearchForm input {
	border: 0;
	padding: 5px 3px 6px; height: 15px; width: 198px;
	background: #f0efeb url(../i/hakukentta.gif) no-repeat left top;
}
#SearchForm button {
	border: 0; padding: 0; height: 26px; width: 45px; line-height: 26px;
	background: #f0efeb url(../i/hakunappi.gif) no-repeat left top;
	cursor: pointer; top: -1px;
}
#SearchForm button span { display: none; }
#Customer { width: 235px; }
#Basket { width: 245px; }

#SearchForm .FormItem { padding: 12px 0 0; }
#SearchForm label { display: none; }

#Primary #SearchForm { height: auto; float: none; padding: 0 0 20px; width: 100%; }
#Primary #SearchForm input { font-size: 13px; }

#Main {
	background: url(../i/sp.gif) repeat-y 610px top;
}
#Footer {
	clear: both; position: relative; width: 920px; margin: 40px 0 0;
	background: #d6d5d2 url(../i/footer.gif) no-repeat left top;
}
#Footer .Col {
	width: 260px; float: left;
	padding: 20px 20px 0;
	overflow: hidden;
}
#Footer .Col h2 { background: none; margin: 0 0 10px; padding: 20px 0 10px; color: #FFF; }

#Footer .Kumppanit a { width: 130px; height: 50px; float: left; margin: 10px 0; padding: 0; }
#Footer .Kumppanit a img { display: block; margin: 0; padding: 0; }

#Copyright { text-align: center; color: #a6a59f; margin: 0; padding: 0 20px 20px; }
#Copyright a:link, #Copyright a:visited { color: #a6a59f; }


/* Primary content
----------------------------------------------------------- */

#Primary {
	width: 580px; float: left;
	padding: 0 30px 0 10px;
	font-size: 12px;
}
#CatFrontImg {
	float: right; width: 262px; margin: 0 0 0 20px;
	background: url(../i/front-img-bg.gif) no-repeat left top;
	padding: 10px 9px 30px; text-align: center;
}
#CatFrontImg img { margin: 0 auto; }

#CatDesc { margin-right: 300px; }
#CatDesc h2 { padding-top: 0; }

ul.Breadcrumb {
	width: auto; height: auto;
	margin: -20px 0 20px; padding: 0;
	list-style: none outside;
	font-size: 11px;
}
ul.Breadcrumb li, ul.Breadcrumb ul { display: inline; margin: 0; padding: 0; list-style: none outside; }

.FullList { position: relative; width: 600px; margin: 0 -10px; }
.FullList .Product {
	float: left; margin: 0 10px 22px; position: relative;
	width: 162px; height: 202px; padding: 16px 9px 0;
	background: url(../i/polaroid-small.jpg) no-repeat left top;
}
.FullList .Product .ProductType { display: none; }
.FullList .NewProduct .ProductType {
	display: block; position: absolute;
	top: -5px; left: -5px;
	width: 64px; height: 64px;
	background: url(../i/star-uutuus.png) no-repeat left top;
}
.FullList .DiscountProduct .ProductType {
	display: block; position: absolute;
	top: -5px; left: -5px;
	width: 64px; height: 64px;
	background: url(../i/star-tarjous.png) no-repeat left top;
}
.FullList .Product .ProductImage {
	display: block; width: 162px; height: 157px;
	margin: 0; padding: 0; vertical-align: middle;
	text-align: center; line-height: 153px;
}
.FullList .Product .ProductImage img { display: inline; vertical-align: middle; line-height: 153px; margin: 0 auto; }
.FullList .Product .PriceWrapper {
	float: left; width: 45px; height: 36px;
	border-right: 1px dotted #999; text-align: center; line-height: 12px;
	margin: 5px 0 0; padding: 0 3px 0 0;
}
.FullList .Product .PriceWrapper .Only { font-size: 9px; font-style: italic; color: #777; }
.FullList .Product .PriceWrapper .Price { font-size: 11px; font-weight: bold; color: #b11e1d; }

.FullList .Product dl {}
.FullList .Product dt { display: none; margin: 0; padding: 0; }
.FullList .Product dd { display: block; font-size: 11px; font-weight: bold; color: #b11e1d; margin: 0; padding: 0; }
.FullList .Product dd.ListPrice { color: #888; text-decoration: line-through; font-weight: normal; }

.FullList .Product .ProductName {
	float: left; width: 108px; height: 36px; overflow: hidden;
	font-weight: normal; letter-spacing: 0; font-size: 11px;
	margin: 5px 0 0; padding: 0 0 0 3px; background: none;
	text-transform: none; line-height: 12px;
}
.FullList .Product .ProductName a { text-decoration: none; color: #000; display: block; width: 100%; height: 36px; }
.FullList .Product .ProductName a:hover { color: #b11e1d; }

#Primary .TnList { position: relative; width: 600px; margin: 0 -10px; }
#Secondary .TnList { position: relative; width: 300px; margin: 0 -10px; }

.TnList .TnProduct {
	position: relative; width: 80px; height: 80px;
	float: left; margin: 0 10px 10px; padding: 0;
	overflow: visible;
}
.TnList .TnProduct a.TnProductImage {
	background: url(../i/tnlist-bg.gif) no-repeat left top;
	display: block; position: absolute; top: 0px; left: 0px;
	width: 70px; height: 70px; padding: 5px; margin: 0;
	z-index: 998; line-height: 66px; text-align: center;
	vertical-align: middle;
}
.TnList .TnProduct a.TnProductImage:hover {
	background: url(../i/tnlist-hoverbg.gif) no-repeat left top;
	width: 106px; height: 106px; top: -18px; left: -18px;
	padding: 5px; z-index: 999; line-height: 102px;
	vertical-align: middle;
}
.TnList .TnProduct a.TnProductImage .SmallTn { display: inline; }
.TnList .TnProduct a.TnProductImage .BiggerTn { display: none; }

.TnList .TnProduct a.TnProductImage:hover .SmallTn { display: none; }
.TnList .TnProduct a.TnProductImage:hover .BiggerTn { display: inline; }
.TnList .TnProduct a.TnProductImage .SmallTn img { display: inline; vertical-align: middle; margin: 0 auto; line-height: 66px; }
.TnList .TnProduct a.TnProductImage .BiggerTn img { display: inline; vertical-align: middle; margin: 0 auto; line-height: 102px; }


/* Profiles
.AvatarList .ProfileList { list-style: none outside; margin: 0 -10px;}
.AvatarList .ProfileList li { float: left; margin: 0 10px 10px 0;}
.AvatarList .ProfileList li h3 { display:none; }
#Primary .UserPictures { position: relative; width: 600px; margin: 0 -10px; }

.UserPictures li {
	position: relative; width: 80px; height: 80px;
	float: left; margin: 0 10px 10px; padding: 0;
	overflow: visible; list-style-type: none;
}
.UserPictures li a.UserPicture {
	background: url(../i/tnlist-bg.gif) no-repeat left top;
	display: block; position: absolute; top: 0px; left: 0px;
	width: 70px; height: 70px; padding: 5px; margin: 0;
	z-index: 998; line-height: 66px; text-align: center;
	vertical-align: middle;
}
 */
 
#UserPicturesCount-0 { display: block; } /* Näytetään käyttäjäkuvamainos, jos ei ole yhtään kuvaa. */
#CommentsCount-0 { display: none; } /* Piilottaa "Käyttäjien kommentit" otsikon, jos ei ole kommentteja */

.SplitWrap {
	width: 600px; margin: 0 -10px;
}
.SplitWrap .SplitCol {
	float: left;
	width: 300px; margin: 0;
}
.SplitWrap .SplitCol h2 { width: 280px; margin: 0 0 10px; padding: 10px 10px 5px; }

#ProductRatingWrapper {
	position: relative; width: 280px; height: 100px; float: right;
	margin: 0; padding: 0 0 20px; overflow: hidden; clear: right;
	background: #fff url(../i/ratingbg.gif) no-repeat left top;
}

.ProductRater {
	position: relative; list-style: none outside;
	margin: 40px 27px 0 28px; padding: 0; border: 0;	
	width: 225px; height: 40px; float: right;
	background: url(../i/stars.gif) no-repeat top left;
}
.ProductRater li {
	padding: 0px; margin: 0px;
	width: 45px; border: 0;
	float: left;
}
.ProductRater li a {
	display: block;
	width: 45px; height: 40px;
	text-decoration: none;
	text-indent: -1000em;
	z-index: 20; position: absolute;
	padding: 0px; border: 0;
}
.ProductRater li a:hover {
	background: url(../i/stars.gif) left -40px;
	z-index: 2; left: 0px; border: 0;
}
.ProductRater .Rate-1 a { left: 0px; }
.ProductRater .Rate-1 a:hover { width: 45px; }
.ProductRater .Rate-2 a { left: 45px; }
.ProductRater .Rate-2 a:hover { width: 90px; }
.ProductRater .Rate-3 a { left: 90px; }
.ProductRater .Rate-3 a:hover { width: 135px; }
.ProductRater .Rate-4 a { left: 135px; }	
.ProductRater .Rate-4 a:hover { width: 180px; }
.ProductRater .Rate-5 a { left: 180px; }
.ProductRater .Rate-5 a:hover { width: 225px; }

.ProductRater li.CurrentRating-0, .ProductRater li.CurrentRating-1, .ProductRater li.CurrentRating-2, .ProductRater li.CurrentRating-3,
.ProductRater li.CurrentRating-4, .ProductRater li.CurrentRating-5 {
	background: url(../i/stars.gif) left -80px;
	position: absolute; height: 40px;
	display: block; text-indent: -1000em;
	z-index: 1; border: 0; margin: 0;
	padding: 0; top: 0px; left: 0px;
}
.ProductRater li.CurrentRating-0  { width: 0px; }
.ProductRater li.CurrentRating-1 { width: 45px; }
.ProductRater li.CurrentRating-2 { width: 90px; }
.ProductRater li.CurrentRating-3 { width: 135px; }
.ProductRater li.CurrentRating-4 { width: 180px; }
.ProductRater li.CurrentRating-5 { width: 225px; }

#ProductImageWrapper {
	position: relative;
	width: 280px; height: auto; float: right;
	margin: 0 0 0 20px; padding: 0;
}
#CurrentProductImage {
	position: relative; display: block; vertical-align: middle; line-height: 242px;
	width: 254px; height: 315px; margin: 0 0 20px 0; padding: 25px 13px 0;
	background: url(../i/polaroid-big.jpg) no-repeat left top;
}
#CurrentProductImage img { display: inline; vertical-align: middle; line-height: 242px; margin: 0 auto; padding: 0; border: 0;}

#ProductThumbnails { width: 300px; margin: 0 0 0 -20px; padding: 0; list-style: none outside; }

#ProductThumbnails li {
	position: relative; width: 80px; height: 80px;
	float: left; margin: 0 0 20px 20px; padding: 0;
	overflow: visible;
}
#ProductThumbnails li a {
	background: url(../i/tnlist-bg.gif) no-repeat left top;
	display: block; position: absolute; top: 0px; left: 0px;
	width: 70px; height: 70px; padding: 5px; margin: 0;
	line-height: 66px; text-align: center;
	vertical-align: middle;
}

#ProductThumbnails li a img { display: inline; vertical-align: middle; margin: 0 auto; line-height: 66px; }

/*
#ProductImageWrapper ul, #ProductImageWrapper li {
	margin: 0; padding: 0; list-style: none outside;
	width: 254px; height: 246px;
	overflow: hidden; text-align: center;
}
#ProductImageWrapper li { display: block; vertical-align: middle; line-height: 242px; }
#ProductImageWrapper li img { display: inline; margin: 0 auto; vertical-align: middle; line-height: 242px; }

#ProductImageWrapper a.ImgChanger {
	display: block; position: absolute; top: 0px;
	width: 105px; height: 50px; padding: 290px 0 0;
	color: #535353; line-height: 20px;
	text-decoration: none; font-weight: bold;
}
#ProductImageWrapper a.ImgChanger:hover { color: #b11e1d; text-decoration: underline; }
#ProductImageWrapper a#PrevImg {
	left: 0px; text-align: left; padding-left: 35px;
	background: url(../i/prev-img.gif) no-repeat 20px 298px;
}
#ProductImageWrapper a#NextImg {
	right: 0px; text-align: right; padding-right: 35px;
	background: url(../i/next-img.gif) no-repeat 117px 298px;
}
#ProductImageWrapper a#PrevImg:hover { background-image: url(../i/prev-img-hover.gif); }
#ProductImageWrapper a#NextImg:hover { background-image: url(../i/next-img-hover.gif); }
#ProductImageWrapper a.Disabled { color: #c6c6c6; background-image: url(../i/next-img-disabled.gif); cursor: default; }
#ProductImageWrapper a#NextImg.Disabled, #ProductImageWrapper a#NextImg.Disabled:hover {
	background-image: url(../i/next-img-disabled.gif); color: #c6c6c6; text-decoration: none;
}
#ProductImageWrapper a#PrevImg.Disabled, #ProductImageWrapper a#NextImg.Disabled:hover {
	background-image: url(../i/prev-img-disabled.gif); color: #c6c6c6; text-decoration: none;
}
*/
#ProductBuy {
	float: left;
	width: 300px; margin: 0 -10px 20px; padding: 0; overflow: hidden;
	background: #e5e4df url(../i/buy-top.gif) no-repeat left top;
}
#ProductBuy .PriceWrapper {
	float: none; width: auto; height: auto;
	text-align: left; line-height: 18px;
	margin: 0; padding: 20px 0 20px 73px;
}
#ProductBuy .PriceWrapper .Only { display: block; font-size: 14px; font-style: italic; color: #777; }
#ProductBuy .PriceWrapper .Price { display: block; font-size: 24px; font-weight: bold; color: #b11e1d; }

/*
#ProductBuy dl dt { display: none; }
#ProductBuy dl dd { display: block; margin: 0; padding: 0; display: block; font-size: 24px; font-weight: bold; color: #b11e1d; }
*/

#ProductBuy dl.Availability {
	float: none; width: auto; height: auto;
	text-align: left; line-height: 18px;
	margin: 0; padding: 0 0 20px 73px;
}
#ProductBuy dl.Availability dt { display: none; }
#ProductBuy dl.Availability dd { display: block; margin: 0; padding: 0; color: #b11e1d; font-weight: bold; }


#ProductBuy form { margin: 0; padding: 0; border: 0; }
.BuyForm label, .BuyForm .CheckWrap .label { width: 60px; }
.BuyForm .Checks label { width: auto; }
.BuyForm .Checks { margin-left: 44px; }

.BuyForm fieldset {
	margin: 0; padding: 0 10px 20px; width: auto;
	background: url(../i/buy-bottom.gif) no-repeat left bottom;
}
.BuyForm .FormSubmit .SubmitButton {
	width: 140px; height: 45px; border: 0; margin: 0 0 0 63px; padding: 0;
	background: #e5e4df url(../i/buy-btn.gif) no-repeat left top;
	cursor: pointer;
}
.BuyForm .FormSubmit .SubmitButton:focus, .BuyForm .FormSubmit .SubmitButton:active, .BuyForm .FormSubmit .SubmitButton:hover { background-position: left -45px; }
.BuyForm .FormSubmit .SubmitButton span { position: absolute; left: -9999em; }

/* Secondary content
----------------------------------------------------------- */

#Secondary {
	width: 280px; float: left;
	padding: 0 0 0 20px;
}
#Logo {
	display: block;
	margin: 30px 50px;
}
#Navi {
	position: relative; left: -20px; padding: 5px 0 0;
	width: 320px; margin: 0 -20px 40px -20px;
	background: url(../i/nav-sp.gif) no-repeat left top;
}
#Navi ul, #Navi ul li { margin: 0; padding: 0; list-style: none outside; }
#Navi ul li {
	background: url(../i/nav-sp.gif) no-repeat left bottom; padding-bottom: 5px;
}
#Navi ul li ul li {
	background: none; padding: 0;
}
#Navi ul li ul { display: none; }
#Navi ul li.Current ul {
	background: url(../i/current-ul.gif) no-repeat left 50%;
	padding: 0 0 10px; display: block;
}
#Navi ul li ul li ul { display: none; }
#Navi ul li.Current ul li.Current ul { padding: 5px 0; background: none; display: block; }

#Navi ul li a {
	display: block; padding: 10px 0;
	margin-left: 90px; text-transform: uppercase;
	color: #a6a59f; text-decoration: none;
	font-weight: bold; letter-spacing: 2px;
}
#Navi ul li.Current a { color: #b11e1d; }
#Navi ul li.Current ul li a {
	padding: 0 0 0 20px;
	text-transform: none;
	color: #535353;
	letter-spacing: 0;
}
#Navi ul li.Current ul li.Current a {
	color: #b11e1d;
	background: url(../i/current-li.gif) no-repeat 10px 50%;
}
#Navi ul li.Current ul li.Current ul li a {
	padding-left: 40px; font-weight: normal;
	background: none; color: #535353;
}
#Navi ul li.Current ul li.Current ul li.Current a { color: #b11e1d; }
#Navi ul li a:hover, #Navi ul li.Current a:hover, #Navi ul li.Current ul li.Current a:hover { color: #b11e1d; }

#VarmaSerti {
	display: block; text-align: center; margin: 10px 0 0; text-decoration: none; font-size: 11px; color: #a6a59f;
	text-transform: uppercase;
	color: #a6a59f; text-decoration: none;
	font-weight: bold; letter-spacing: 2px;
}
#VarmaSerti img { display: block; margin: 5px auto 0; }

#NaytaTietoa, #NaytaKauppa {
	display: block; width: 280px; height: 80px;
	background: url(../i/showinfo.gif) no-repeat left top;
	overflow: hidden; text-indent: -1000em; margin: 0 0 40px;
}
#NaytaKauppa { background-image: url(../i/backtoshop.gif); }
#NaytaTietoa:hover, #NaytaKauppa:hover { background-position: left -80px; }

#UpdateCart { float: right; }
#ShoppingCartSubmit { float: right; clear: right; }
#ShoppingCartSubmit .FormAltAction  { display: none; }


/* Shipping Methods
-------------------------------------------------------------- */

#SelectShippingMethod .ShippingMethodWrapper .DefineShippingMethod {
	float: none; clear: none;
	overflow: auto; margin: 0 0 0 18px;
	padding: 8px; border: 1px solid #d9d9d9;
	background: #ffffcc; font-size: 11px;
}
#SelectShippingMethod .ShippingMethodWrapper .DefineShippingMethod label { float: left; width: auto; clear: none; margin-right: 9px; }
#SelectShippingMethod .ShippingMethodWrapper .DefineShippingMethod select { font-size: 11px; }

#SelectShippingMethod .ShippingMethodWrapper .DefineDisabled { background: #f8f8f8; border: 1px solid #f2f2f2; }
#SelectShippingMethod .ShippingMethodWrapper .DefineDisabled label { color: #ccc; }

#SelectShippingMethod .CheckWrap {}
#SelectShippingMethod .CheckWrap p.label { display: none; }
#SelectShippingMethod .CheckWrap .ShippingMethodWrapper {
	clear: both; width: 100%; overflow: hidden;
	padding: 0 0 9px 108px; margin: 0 0 8px -108px;
	border-bottom: 1px dotted #d9d9d9;
} 
#SelectShippingMethod .CheckWrap .ShippingMethodWrapper .FormHelp { padding: 5px 0 4px 18px; }
.ShippingMethodWithLogo {}
.ShippingMethodWrapper .ShippingMethodLogo {
	position: relative; float: left; width: 90px;
	margin: 0 0 0 -126px; padding: 3px 3px 4px 4px;
	background: #FFF; border: 1px solid #d9d9d9;
	text-align: center;
}
.ShippingMethodWrapper .ShippingMethodLogo img { display: block; margin: 0 auto; }
.ShippingMethodWithLogo .FormHelp { width: 100%; margin: 0; padding: 0; clear: none; }

/* Payment Methods
-------------------------------------------------------------- */

#SelectPaymentMethod .CheckWrap {}
#SelectPaymentMethod .CheckWrap p.label { display: none; }
#SelectPaymentMethod .CheckWrap .PaymentMethodWrapper {
	clear: both; width: 100%; overflow: hidden;
	padding: 0 0 9px 108px; margin: 0 0 8px -108px;
	border-bottom: 1px dotted #d9d9d9;
} 
#SelectPaymentMethod .CheckWrap .PaymentMethodWrapper .FormHelp { padding: 5px 0 4px 18px; }
.PaymentMethodWithLogo {}
.PaymentMethodWrapper .PaymentMethodLogo {
	position: relative; float: left; width: 90px;
	margin: 0 0 0 -126px; padding: 3px 3px 4px 4px;
	background: #FFF; border: 1px solid #d9d9d9;
	text-align: center;
}
.PaymentMethodWrapper .PaymentMethodLogo img { display: block; margin: 0 auto; }
.PaymentMethodWithLogo .FormHelp { width: 100%; margin: 0; padding: 0; clear: none; }