html,body,table,tr,div,p,a,img{
    /* margins etc. off for layout */
	margin: 0;
	padding: 0;
	border: 0;
	/* Why, oh why the defaults are always to be overridden? ;) */
}
html{
	/* force scrollbar, reduces "jumpyness" between pages holding variable sized content*/
	/*height:101%;*/
	text-align:left;
/*	height: 100%;*/
}
body, input, textarea{
    font-family: Verdana, Sans-serif, Arial;
    font-size: 11px;
    color: #3e3d40;
}
div 
{
    font-family: Verdana, Sans-serif, Arial;
    font-size: 10px;
    color: #3e3d40;
}

html>body{
    /* IE6 does NOT see this */
}
body {background: url(/img/body.gif) repeat-x left top #ECF5FA; text-align: center;}

form a, form a:link, form a:visited, form a:active {text-decoration: none; color: #0076a0!important;}
form a:hover {color: #000!important; text-decoration:none;}

img{
	-ms-interpolation-mode:bicubic;
}

h1 {font-size: 18px; line-height: 18px; margin: 2px 0 4px 0; padding: 0; color: #58585A;}
h2 {font-size: 14px; line-height: 14px; margin: 2px 0 4px 0; padding: 0; color: #58585A;}
h3 {font-size: 12px; line-height: 12px; margin: 2px 0 4px 0; padding: 0; color: #58585A;}
h4 {font-size: 11px; line-height: 11px; margin: 2px 0 4px 0; padding: 0; color: #58585A;}
h5 {font-size: 10px; line-height: 10px; margin: 2px 0 4px 0; padding: 0; color: #58585A;}


/* Set cross-browser minimum content height */

#MinHeight 
{
	position: relative;
	display: block;
	float: right;
	height: 500px;
	width: 1px;
}

#Container 
{
	position: relative;
	display: block;
	margin-top: 0; 
	margin-right: auto; 
	margin-bottom: 0; 
	margin-left: auto;
	padding: 0;
	height: auto;
	width: 954px;
	text-align: center;
	background: url(/img/container.gif) repeat-y center top #fff;
}

/* This is needed for clearing floats  inside container */
/*
#Container:after {
	content: "."; 
	display: block;
	height: 0.01em;
	overflow: hidden;
	visibility: hidden; 
	clear: both;
}*/

#Header 
{
	position: relative;
	display: block;
	height: 158px;
	width: 930px;
	margin: 0 12px 0 12px;
	background-color: #fff;
	background: url(/Bannerit/verkkokauppa_banneri.jpg) no-repeat left top;
}

#Columns {
	position: relative;
	display: block;
	margin: 0;
	padding: 0 0 10px 0;
	height: auto;
	width: 930px;
	margin: 0 12px 0 12px;
	background: url(/img/columns.gif) repeat-x left top #fff;
	text-align: left;
}

/* This is needed for clearing floats  inside container */

#Columns:after {
	content: "."; 
	display: block;
	height: 0.01em;
	overflow: hidden;
	visibility: hidden; 
	clear: both;
}

#C1 {
	position: relative;
	display: inline;
	float: left;	
	width: 199px;
	background-color: Transparent;
}

#C2 {
	position: relative;
	display: inline;
	float: left;
	width: 700px;
	margin: 0 15px 0 15px;
	background-color: Transparent;
}

#C2.FrontPage {width: 500px;}
#C2.Wide {width: 905px; margin: 0 0 0 10px;}

#C3 {
	position: relative;
	display: inline;
	float: left;
	width: 150px;
	background-color: Transparent;
}

#C3.FrontPage {width: 200px;}

#C4 {
	position: relative;
	display: inline;
	float: left;
	width: 1px;
	overflow:hidden;
}

#BreadCrumb, .BreadCrumbPathRoot
{
    position: relative;
    display: inline;
    float: left;
    clear: both;
    height: 28px;
    width: 910px;
    margin: 0 10px 0 10px;
    text-align: left!important;
    line-height: 28px;
    border: none;
}

#Footer {
	position: relative
	display: block;
	clear: both;
	height: 28px;
	width: 950px;
	margin: 0 2px 0 2px;
	background: url(/img/footer.gif) no-repeat left bottom;
	overflow: hidden;
	padding-top: 20px;
}
#FooterContent {display:block; position:relative; height:28px; overflow:hidden; padding:0; margin:0;}

#C1 .ContainerHeaderDiv
{
    display: block;
    position: relative;
    width: 200px;
    height: 20px;
    padding: 5px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    background: url(/img/C1_header_bg.gif) no-repeat left top #fafafa;
    overflow: hidden;
}
html>body #C1 .ContainerHeaderDiv {width: 190px; height: 10px;}

#C1 .ContainerHeaderDivPale
{
    display: block;
    position: relative;
    width: 200px;
    height: 20px;
    padding: 5px;
    color: #000;
    font-size: 10px;
    font-weight: bold;
    background: url(/img/C1_header_bg_pale.gif) no-repeat left top #fafafa;
    overflow: hidden;
}
html>body #C1 .ContainerHeaderDivPale {width: 190px; height: 10px;}

#C1 .ContainerDiv
{
    display: block;
    position: relative;
    width: 200px;
    height: auto;
    padding: 5px;
    background: url(/img/C1_box_bg.gif) repeat-y left top #fafafa;
    border-bottom: 1px solid #C6C7C8;
}
html>body #C1 .ContainerDiv {width: 190px;}

#C2 .ProductsTop
{
    display: block;
    position: relative;
    background: url(/img/C2_top.gif) no-repeat left top;
    width: 700px;
    height: 41px;
    padding: 5px;
}
html>body #C2 .ProductsTop {width: 690px; height: 31px;}
.ProductsTop div
{
    font-size: 10px;
    color: #fff;
}
.ProductsTop a {color: #00597B!important;}
.ProductsTop a.PageSelected {color: #000!important;}


#C2 .ProductsBottom
{
    display: block;
    position: relative;
    background: url(/img/C2_bottom.gif) no-repeat left bottom;
    width: 700px;
    height: 41px;
    padding: 5px;
    margin-bottom: 20px;
}
html>body #C2 .ProductsBottom {width: 690px; height: 31px;}
.ProductsBottom div
{
    font-size: 10px;
    color: #fff;
}
.ProductsBottom a {color: #00597B!important;}
.ProductsBottom a.PageSelected {color: #000!important;}


.BlockElement {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
}


.BlockElement:after {
	content: "."; 
	display: block;
	height: 0.01em;
	overflow: hidden;
	visibility: hidden; 
	clear: both;
}


.Column {
	position: relative;
	display: inline;
	float: left;
}

.Column_floatRight {
	position: relative;
	display: inline;
	float: right;
}

#LoginAndSearch
{
    position: absolute;
    display: block;
    text-align: left;
    right: 0;
    top: 5px;
    width: 220px;
    height: 97px;
    background: url(/img/login_and_search_box_new.gif) no-repeat left top;
    z-index: 50;
}

#LoginAndSearch div {font-size: 9px!important; line-height: 12px;}

.ProductListContainer
{
    display: block;
    position: relative;
    width: 700px;
    background: url(/img/product_card_bg.gif) repeat-y left top;
    padding: 0;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
}
html>body .ProductListContainer {padding-left: 1px; padding-right: 1px;}

/*.ProductListContainer div {margin: -1px 0 0 -2px;}*/

.ProductListItem
{
	position: relative;
	display: inline;
	float: left;
    width: 233px;
    height: 313px;
    margin: -1px 0 0 -1px;
    padding: 11px 15px 10px 15px;
    text-align: center;
    border-left: 1px dotted #c6c7c8;
    border-bottom: 1px dotted #c6c7c8;
}
html>body .ProductListItem {width: 202px; height: 295px;}

.ProductListItem div { text-align: left; font-size: 10px!important; letter-spacing: -1px; }

.ProductCard
{
    display: block;
    position: relative;
    width: 700px;
    height: auto;
    background: url(/img/product_card_bg.gif) repeat-y left top;
    padding: 0;
    margin: 0;
    border-top: 1px solid #c6c7c8;
    border-bottom: 1px solid #c6c7c8;
}
.ProductCard div {font-size: 10px;}

.ProductImageContainer, .ProductExtraImageContainer
{
    display: block;
    position: relative;
    width: 232px;
    height: auto;
    padding: 10px 15px 5px 15px;
    margin: 0;
    border-bottom: 1px dotted #c6c7c8;
}
html>body .ProductImageContainer {width: 202px;}

.ProductImage {display: block; position: relative; height: 201px; width: 201px; padding: 1px; border: 1px solid #c6c7c8; background-color: #fff; text-align: center!important;}

.ProductExtraImageContainer {padding: 5px; border-bottom: none;}
html>body .ProductExtraImageContainer {width: 222px;}

.ProductExtraImageContainer span {text-transform: uppercase; text-decoration: underline;}

.ProductInfoContainer
{
    display: block;
    position: relative;
    width: 456px;
    height: auto;
    padding: 10px 0 10px 0;
    margin: 0 0 0 5px;
}

/** html .ProductInfoContainer {width: 467px; background-color: Fuchsia;}*/

.ProductExtraThumbs
{
	display: inline;
	position: relative;
	float: left;
	margin: 5px 0 0 5px;
	border: 1px solid #c6c7c8;
	width: 48px;
	height: 48px;
}

.Button
{
    display: block;
    position: relative;
    border: 1px solid;
    border-color: #c7c7c7;
    background: url(/img/button_bg.gif) repeat-x left top #e1e1e1;
    height: 17px;
    margin: 0;
    padding-bottom: 3px;
    font-size: 9px!important;
    text-align: center;
    letter-spacing: -1px;
}
.Button:hover {cursor: pointer;}

.GreenButton
{
    display: block;
    position: relative;
    background: url(/img/continue.gif) repeat-x left top;
    height: 31px;
    line-height: 31px;
    width: 151px;
    border: none;
    margin: 0;
    padding: 0;
    font-size: 9px!important;
    text-align: center;
    letter-spacing: -1px;
    color: #fff;
}
.GreenButton:hover {cursor: pointer;}

.TextBox
{
    display: block;
    position: relative;
    border: 1px solid;
    border-color: #c7c7c7;
    height: 17px;
    line-height: 15px;
    margin: 0;
    padding: 0;
    font-size: 9px!important;
}
html>body .TextBox {height: 15px;}

.TextBoxCentered
{
    display: block;
    position: relative;
    border: 1px solid;
    border-color: #c7c7c7;
    height: 17px;
    line-height: 15px;
    margin: 0;
    padding: 0;
    font-size: 9px!important;
    text-align: center;
}
html>body .TextBoxCentered {height: 15px;}

.DropDown
{
    display: block;
    position: relative;
    border: 1px solid;
    border-color: #c7c7c7;
    /*height: 15px;*/
    line-height: 15px;
    margin: 0;
    padding: 0;
    font-size: 9px!important;
}
/*html>body .DropDown {height: 15px;}*/

.DottedHorizontalRule
{
    position: relative;
    display: block;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 0;
    height: 1px;
    clear: both;
    border-top: 1px dotted #C6C7C8;
}
.BorderDottedRight {border-right: 1px dotted #c6c7c8;}

.Centered {text-align: center!important;}

.GrayBorder1px {border: 1px solid #C6C7C8;}

.Spyglass 
{
	position: absolute;
	display: none; /*block*/
	right: 0;
	top: 0;
	height: 20px;
	width: 20px;
	z-index: 50;
	background: url(/img/spyglass.gif) no-repeat right top Transparent;
}

.ErrorInfo
{
	display: block;
	position: relative;
	width: 100%;
	background-color: Red;
	color: #fff!important;
	margin: 10px 0 10px 0;
	padding: 0;
	line-height: 30px;
}

.SuccessInfo
{
	display: block;
	position: relative;
	width: 100%;
	background-color: Green;
	color: #fff;
	margin: 10px 0 10px 0;
	padding: 0;
	line-height: 30px;
}

.Width4 {width: 4px;}
.Width10 {width: 10px;}
.Width30 {width: 30px;}
.Width48 {width: 48px;}
.Width50 {width: 50px;}
.Width60 {width: 60px;}
.Width70 {width: 70px;}
.Width72 {width: 72px;}
.Width74 {width: 74px;}
.Width80 {width: 80px;}
.Width88 {width: 88px;}
.Width90 {width: 90px;}
.Width95 {width: 95px;}
.Width100 {width: 100px;}
.Width110 {width: 110px;}
.Width120 {width: 120px;}
.Width130 {width: 130px;}
.Width158 {width: 158px;}
.Width160 {width: 160px;}
.Width177 {width: 177px;}
.Width190 {width: 190px;}
.Width194 {width: 194px;}
.Width200 {width: 200px;}
.Width202 {width: 202px;}
.Width204 {width: 204px;}
.Width206 {width: 206px;}
.Width232 {width: 232px;}
.Width234 {width: 234px;}
.Width290 {width: 290px;}
.Width315 {width: 315px;}
.Width360 {width: 360px;}
.Width362 {width: 362px;}
.Width376 {width: 376px;}
.Width405 {width: 405px;}
.Width406 {width: 406px;}
.Width450 {width: 450px;}
.Width456 {width: 456px;}
.Width467 {width: 467px;}
.Width498 {width: 498px;}
.Width520 {width: 520px;}
.Width525 {width: 525px;}
.Width620 {width: 620px;}
.Width688 {width: 688px;}
.Width694 {width: 694px;}
.Width695 {width: 695px;}
.Width698 {width: 698px;}
.Width699 {width: 699px;}
.Width700 {width: 700px;}
.Width727 {width: 727px;}
.Width895 {width: 895px;}
.Width900 {width: 900px;}
.Width905 {width: 905px;}
.Width910 {width: 910px;}
.Width915 {width: 915px;}
.Width930 {width: 930px;}

.Width2p {width: 2%;}
.Width5p {width: 5%;}
.Width10p {width: 10%;}
.Width15p {width: 15%;}
.Width20p {width: 20%;}
.Width25p {width: 25%;}
.Width30p {width: 30%;}
.Width35p {width: 35%;}
.Width40p {width: 40%;}
.Width45p {width: 45%;}
.Width50p {width: 50%;}
.Width60p {width: 60%;}
.Width65p {width: 65%;}
.Width70p {width: 70%;}
.Width75p {width: 75%;}
.Width100p {width: 100%;}

.Height48 {height: 48px;}
.Height200 {height: 200px!important;}
.Height202 {height: 202px!important;}
.Height322 {height: 322px;}
.Height315 {height: 315px;}

.MarginTop1 {margin-top: 1px;}
.MarginTop2 {margin-top: 2px;}
.MarginTop3 {margin-top: 3px;}

.PaddingBottom20 {padding-bottom: 20px!important;}

.NegativePositionTop4 {top: -4px;}

.TextAlignRight {text-align: right;}

/* OSTOSKORI */
.ShoppingCart td,th {
	padding:3px;
}




/* OSTOSKORI - PIKKUNÄKYMÄ */
.SmallShoppingCart {background-color: #EDEDEE; font-size: 9px;}
/*.SmallShoppingCart a {text-transform: uppercase!important;}*/

.ShoppingBasketCaption{
	background-color:#AAAAAA;
	font-size:14pt;
	text-align:center;
}

.VerticalMiddle
{
	vertical-align: middle;
}

.FrontpageTabSelected
{
	display:block;
	position:absolute;
	height: 30px;
	width: 150px;
	top: 11px;
	left: 15px;
	margin: 0;
	padding: 0;
	line-height: 30px;
	text-transform: uppercase;
	text-align: center;
	background: url(/img/frontpage_tab_selected.gif) no-repeat left top;
}

.NewProducts
{
	display: block;
	position: relative;
	width: 928px;
	height: 240px;
	background-color: #fff;
	border: 1px solid #C6C7C8;
	margin: 40px 0 13px 0;
}

.NewProductContainer
{
    display: inline;
    position: relative;
	float:left;
    width: 202px;
    height: 202px;
    padding: 0;
    margin: 24px 8px 12px 18px;
}

.NewProducts .PageLinkContainer
{
	display:block;
	position: absolute;
	right: 18px;
	top: 5px;
	width: 190px;
	height: 15px;
	line-height: 15px;
	text-align: right;
}

.NewsContainer
{
	display: block;
	position: relative;
	width: 500px;
	height: auto;
	padding: 0;
	margin: 0;
	background: url(/img/frontpage_titleblock.gif) no-repeat left top;
}

.News
{
	display: block;
	position: relative;
	width: 498px;
	height: auto;
	margin: 0;
	padding: 13px 15px 13px 15px;
	color: #000;
	font-weight: normal;
	border-left: 1px solid #c6c7c8;
	border-right: 1px solid #c6c7c8;
	border-bottom: 1px solid #c6c7c8;
	background-color: #fafafa;
}
html>body .News {width: 468px;}


.OfferContainer
{
	display: block;
	position: relative;
	width: 200px;
	height: auto;
	padding: 0;
	margin: 0;
}

.OfferTopBlock
{
	display:block;
	position:relative;
	height:20px;
	width:200px;
	/*border-top: 1px solid #c6c7c8;
	border-left: 1px solid #c6c7c8;
	border-right: 1px solid #c6c7c8;
	background: url(/img/offer_titleblock_top.gif) no-repeat left top;*/
}

.Offers
{
	display:block;
	position:relative;
	width:200px;
	height:auto;
	margin: 0;
	padding: 0 15px 0 15px;
	/*border-left: 1px solid #c6c7c8;
	border-right: 1px solid #c6c7c8;
	background-color: #FFF8B2;
	text-align:center!important;*/
}
html>body .Offers {width: 170px;}

.OfferBottomBlock
{
	display:block;
	position:relative;
	height:20px;
	width:200px;
	/*border-bottom: 1px solid #c6c7c8;
	border-left: 1px solid #c6c7c8;
	border-right: 1px solid #c6c7c8;
	background: url(/img/offer_titleblock_bottom.gif) no-repeat left top;*/
}

.PageSelected
{
	color: #000!important;
	text-decoration: underline!important;
}

.CartTab
{
	position: relative;
	display: inline;
	float: left;
	width:219px;
	height:26px;
	line-height:26px;
	border:1px solid #C5C6CB;
}

.SiteStatus
{
    position: absolute;
    display: block;
    text-align: left;
    left: 0;
    bottom: 0;
	height: 32px;
	width: 930px;
	line-height: 14px;
    z-index: 50;
	font-size: 10px!important;
	letter-spacing: -1px;
}