/* Eric Meyers CSS reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0;
	font-weight: inherit; font-style: inherit; font-size: 100%;
	font-family: inherit; vertical-align: baseline; }
body { line-height: 1; color: black; background: white; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" "";}
select, input textarea { font: inherit; }

.ie67 .button input { overflow: visible; width: auto; }


/**
 *	BASE
 */
body { margin: 0; padding: 0; }
a { color: #006cc8; text-decoration: none; }
	a:hover { text-decoration: underline; }

/*
 * Typography
 */
h1 {
	font-size: 1.7em;
	margin-top: 0.25em;
	font-weight: normal; }
h2 {
	font-size: 1.3em;
	margin-top: 0.25em;
	font-weight: normal; }
h3 {
	font-size: 1.1em;
	font-weight: normal; }
body {
	font: 13px Arial, Helvetica, sans-serif;
	color: #4d4d4d; line-height: 1.25; } 
h4 { font-weight: bold; margin: 1em 0 0.5em; }
strong { font-weight: bold; }

/**
 *	GRID
 */
.row { overflow: hidden; width: 984px; margin-right: -16px; }
	.col1, .col2,	.col3, .col4,
	.col5, .col6,	.col7, .col8,
	.col9, .col10, .col11, .col2 { float: left; zoom: 1; }

	/* --- Plain */
	.col1  { width: 66px; margin-right: 16px }
	.col2  { width: 148px; margin-right: 16px }
	.col3  { width: 230px; margin-right: 16px }
	.col4  { width: 312px; margin-right: 16px }
	.col5  { width: 394px; margin-right: 16px }
	.col6  { width: 476px; margin-right: 16px }
	.col7  { width: 558px; margin-right: 16px }
	.col8  { width: 640px; margin-right: 16px }
	.col9  { width: 722px; margin-right: 16px }
	.col10 { width: 804px; margin-right: 16px }
	.col11 { width: 886px; margin-right: 16px }
	.col12 { width: 968px; margin-right: 16px }

.row .col3.raised { background: url(images/shadow-3col.png) bottom left; padding-bottom: 16px; }
.row .col4.raised { background: url(images/shadow-4col.png) bottom left; padding-bottom: 16px; }
.row .col6.raised { background: url(images/shadow-6col.png) bottom left; padding-bottom: 16px; }
.row .col8.raised { background: url(images/shadow-8col.png) bottom left; padding-bottom: 16px; }
.row .col12.raised,
.row.raised { overflow: hidden; background: url(images/shadow-12col.png) bottom left no-repeat; padding-bottom: 16px; }


#body .container,
#footer .container,
#legal .container {
	position: relative;
	width: 984px;
	margin: 0 auto;
	}
	#footer .container { left: 16px; }

/**
 *	CONTENT STYLING
 */	
#body {
	background: #f4f9fe url(images/body-bg.gif) top left repeat-x; }
	#body .theme {
		background: url(images/body-theme-bg.gif) 50% 111px no-repeat; padding-bottom: 50px; }
	#content { padding: 111px 0 0 16px; position: relative; }

/**
 *	HEADER
 */
#header {
	position: absolute;
	top: 0; left: 16px;
	width: 968px;
	}
	/* --- Banner */
	#banner h2 a { 
		position: absolute; top: 56px; left: 0;color: #6d6d6d;
		display: block; width: 160px; height: 31px; 
		background: url(images/interface-logo.gif) top left no-repeat; 
		text-indent: -1000px; overflow: hidden; }
		.c-ru #banner h2 a { background-image: url(images/interface-logo-ru.gif); }
	#banner p {
		position: absolute; top: 14px; left: 0;
		font-size: 12px; color: #6d6d6d; margin: 0;
		}
		#banner p a, #banner p span { 
			padding: 0 0 0 20px; text-decoration: none; color: #808080;
			background: url(images/interface-icons.gif) 0 -60px no-repeat; }
			#banner p span { padding: 0 0 0 35px; background-image: url(images/interface-flags.gif); }
				.c-fi #banner p span { background-position: 15px 1px; }
				.c-se #banner p span { background-position: 15px -14px; }
				.c-ee #banner p span { background-position: 15px -29px; }
				.c-eu #banner p span { background-position: 15px -44px; }
				.c-ru #banner p span { background-position: 15px -59px; }
			.c-ru #banner p span { display: none; }

	/* --- Quick links */
	#links ul { list-style-type: none; margin: 0; padding: 0; position: absolute; right: 0; top: 14px; }
		#links li { 
			display: inline; padding: 0 0 0 20px; margin-left: 20px; 
			background: url(images/interface-icons.gif) no-repeat; }
			#links .basket { background-position: 0 0 }
			#links .login  { background-position: 0 -20px }
			#links .account { background-position: 0 -40px }
			#links a { text-decoration: none; color: #6d6d6d; }
				#links a.logout { font-size: 11px; text-decoration: underline; }

	/* --- Navigation */
	#navigation {
		position: absolute;
		top: 67px; left: 312px; width: 656px; }
		#navigation h3 { display: none; }
		#navigation .catalog { float: left; list-style-type: none; margin: 0; padding: 0; }
			#navigation .catalog li { display: inline; font-size: 16px; }
				#navigation .catalog a {
					background: url(images/interface-tabs.png) 0 -99px no-repeat; color: white; 
					padding: 7px 0 14px 15px; text-decoration: none; position: absolute; top: -8px; right: 656px; }
					#navigation .catalog a span { 
						background: url(images/interface-tabs.png) 100% -100px no-repeat; padding: 7px 15px 14px 0; }
			#navigation .catalog ul { display: inline; margin: 0 0 0 10px; padding: 0; }
				#navigation .catalog ul li { font-size: 14px; }
				#navigation .catalog ul a { background: none; padding: 9px 0 27px 10px; text-decoration: none; position: static; color: #666; }
					#navigation .catalog ul a span { background: none; padding: 9px 10px 27px 0; }
					#navigation .catalog ul .selected a span { color: #4594d7; }
		#navigation .normal { float: right; list-style-type: none; margin: 0; padding: 0; }
			#navigation .normal ul { display: none; }
				#navigation .normal li { padding-left: 1px; display: inline; font-size: 16px; margin-left: 1px; }
					#navigation .normal a { background: url(images/interface-tabs.png) 0 0 no-repeat; color: white; padding: 7px 0 14px 15px; text-decoration: none; }
						#navigation .normal a span { background: url(images/interface-tabs.png) 100% 0 no-repeat; padding: 7px 15px 14px 0; }
					#navigation .normal .services a { background-position: 0 -50px }
						#navigation .normal .services a span { background-position: 100% -50px }
						
		.ie67 #navigation .normal { top: -7px; position: relative; }
		.ie67 #navigation .normal a { display: inline-block; padding: 0 14px 0 0; }
		.ie67 #navigation .normal a span { display: inline-block; padding: 6px 0 15px 15px; }
/**
 *	FOOTER
 */
#footer {
	background: url(images/footer-bg.gif) top left repeat-x; 
	font-size: 12px; width: 100%;
	}
	#footer .container { padding: 25px 0 20px 0; }
	#footer a { text-decoration: none; color: #4d98d9; }
		#footer a:hover { text-decoration: underline; }
	#footer h3 { font-weight: normal; font-size: 14px; margin: 0 0 0.5em 0; }
	#footer ul { list-style-type: none; margin: 0; padding: 0; }
	#footer .contact { padding-top: 25px; background: url(images/footer-logo.gif) 0 0 no-repeat; }
		.c-ru #footer .contact { padding-top: 25px; background: url(images/footer-logo-ru.gif) 0 0 no-repeat; }
		#footer .contact h3 { display: none; }
		#footer .contact p { margin: 0 0 1em 0 }
		#footer .contact ul { list-style-type: none; margin: 0; padding: 0; }
			#footer .contact span { padding: 0 10px 0 22px; background: url(images/interface-flags.gif) no-repeat; }
				#footer .contact span.fi { background-position: 0 1px; }
				#footer .contact span.se { background-position: 0 -14px; }
				#footer .contact span.ee { background-position: 0 -29px; }
				#footer .contact span.eu { background-position: 0 -44px; }
				#footer .contact span.ru { background-position: 0 -59px; }
			#footer .contact span strong { display: none; }
			#footer .contact span span { background: none; padding: 0 4px; }
		
/**
 *	FOOTER
 */
#legal {
	font-size: 12px;
	border: 1px solid #d4e9fb;
	border-width: 1px 0 0 0;
	margin-bottom: 50px;
	}
	#legal a { text-decoration: none; color: #4d98d9; }
	#legal span { padding: 0 5px; }
	#legal .container { padding: 10px 0; }

/**
 *	ELEMENTS
 */
 
.hintedLabel.hinted { color: #666; }
 
.priceBox {
	position: relative; font-size: 28px; padding: 0 22px 0 0;
	color: #bc1aa6; text-align: right; line-height: 1em;
	}
	.priceBox span, .priceBox em {
		display: block; position: absolute; overflow: hidden; 
		top: 0.4em; right: 0; width: 20px; padding: 0;
		font-size: 12px; text-align: left; line-height: 1em; text-indent: -3px; }
	.priceBox em { top: 1.5em; color: #4d4d4d; font-style: normal; text-indent: 0px; font-size: 11px; overflow: visible; }	
	.priceBox del { position: absolute; right: 0; bottom: 0; white-space: pre; line-height: 1.2em; font-size: 13px; }

.priceBox.discount, .priceBox-discount { color: #ef5300; padding: 0 22px 12px 0; position: relative; top: -15px; }
	.priceBox.discount del, .priceBox-discount del { color: #bc1aa6; }
	
/* Boxes */
.boxed h2, .boxed h3.title { 
	border-bottom: 2px solid #ff9610; margin: 0; padding: 4px 0 3px 0;
	font-size: 15px; font-weight: normal; position: relative; }
	.boxed h2 small, .boxed h3.title small { position: absolute; top: 5px; right: 10px; margin-top: 2px; font-size: 12px; } 
		.boxed h3.title small {	top: 4px; right: 10px; } 

/* Bordered boxes */
.border { border: 1px solid #b2b2b2; padding: 4px; background: #f2f2f2; zoom: 1; }
	.border.dimmed { border-color:#d9d9d9; }
	.border .inner { background: white; overflow: hidden; zoom: 1; padding: 6px; }

		
/* User icons */
.byline img { float: left; }
.byline { overflow: hidden; }
	.byline em, 
	.commentSummary em {
		color: #7b9c34; font-style: normal;
		padding-left: 14px; background: url(images/community-icons.gif) 0 -1px no-repeat; }
		.byline em.official,
		.commentSummary em.official {
			background-position: 0 -20px;
			color: #006cc8; font-style: normal;	}
	.byline .tag { 
		display: block; float: left; margin: 0 6px 0 0;
		background: url(images/community-icons.gif) 0 -66px no-repeat;
		padding-left: 1px; }
		.byline .tag span {
			background: url(images/community-icons.gif) 100% -66px no-repeat;
			display: block; height: 19px; padding: 1px 5px;
			text-align: center; color: white;
			font-weight: normal; font-size: 10px; }

/* Comment lists */
ul.commentList {
	margin: 0; padding-top: 1px;
	border-top: 1px solid #b7dbf9; background: #e5f2fd; }
	ul.commentList li { overflow: hidden; padding: 10px 0; background: white; border-top: 2px solid #e5f2fd; }
		ul.commentList li img { float: left; }
		ul.commentList li p, ul.commentList li blockquote { margin-left: 58px; }
		ul.commentList li p em { color: #7b9c34; }
			ul.commentList li.official p em { color: #006cc8; }
				ul.commentList li.official img { border-color: #70b6f3; background: white; }

/* Avatar icons */
img.avatar { border: 1px solid #cbf573; width: 40px; height: 40px; background: #f5fde3; padding: 3px; }
	.official img.avatar, img.avatar.official { border-color: #70b6f3; background: white; }

/* Pagers */
.pagination { overflow: hidden; width: 100%; }
	.pagination p { float: left; }
	
	.pagination .showAll, .pagination .showPaged { 
		float: none; width: 200px; margin: 0 auto; 
		text-align: center; padding: 5px 0; }
		.pagination .showAll a { background: url(images/catalog-icons.gif) 0 -291px no-repeat; padding: 0 0 0 25px; }
		.pagination .showPaged a { background: url(images/catalog-icons.gif) 0 -261px no-repeat; padding: 0 0 0 25px; }

	.pagination .top {	float: left; padding: 0 0 0 10px; line-height: 24px;  }
		.pagination .top a {	background: url(images/catalog-icons.gif) 0 -319px no-repeat; padding: 2px 0 2px 25px; }

	.pagination .sorting { float: left; background: url(images/catalog-icons.gif) 10px -3px no-repeat; padding: 0 0 0 35px; }
		.pagination .sorting form, .pagination .sorting p { display: inline; line-height: 24px; }
		.pagination .sorting p { font-weight: bold; float: none; }
		.pagination .sorting label { padding-left: 10px; }
		.pagination .sorting select { border: 1px solid #b7dbf9; }
		
	.pagination .pages { float: right; margin: 0 10px 0 0; line-height: 24px; }
		.pagination .pages span, .pagination .pages a, .pagination .pages strong {
			text-decoration: none; padding: 0 5px; border: 1px solid #b7dbf9; 
			background: url(images/catalog-bg.gif) 0 -628px repeat-x; }	
			.pagination .pages strong { border-color: #4d98d9; background-position: 0 -610px; color: white; font-weight: normal; }
			.pagination .pages span { background: white; color: #4d98d9; }
			.pagination .pages span { background: white; color: #b7dbf9; }

/* Tabular product listings */
.productList { background: white; width: 100%; }
	.productList thead th { font-size: 11px; padding: 4px 3px 2px 3px; border-bottom: 2px solid #e6e6e6; }
	.productList td, .productList th { padding: 3px; border: 1px solid #e6e6e6; border-width: 0 0 1px 0; vertical-align: middle; }
	.productList thead .title th { border-bottom: 3px solid #b2b2b2; font-size: 14px; padding: 0 3px 3px 3px; }
	.productList .thumbnail { width: 30px; padding: 0; }
		.productList .thumbnail img { display: block; border: 0; height: 30px; width: 30px; }
	.productList .name a { color: #4d4d4d; }
	.productList .size { width: 80px; }
	.productList .symbol em { width: 30px; }
	.productList	.parfume em {
		width: 17px; height: 17px; display: block; overflow: hidden; text-indent: -1000px;
		background: url(images/catalog-parfume-icons.png) 0 0 no-repeat; }
		.productList .parfume .o { background-position: 0 0 }
		.productList .parfume .h { background-position: 0 -53px }
		.productList .parfume .n { background-position: 0 -34px }
		.productList .parfume .p { background-position: 0 -17px }
	.productList .availability em { 
		display: block; text-indent: -1000px; overflow: hidden;
		background: url(images/catalog-stock-icons.png) 0 0 no-repeat; }
		.productList .availability .limited { width: 32px; height: 11px; background-position: 0 -12px; }
		.productList .availability .exiting { width: 28px; height: 10px; background-position: 0 0px; }
	.productList .stockLevel em { 
		display: block; text-indent: -1000px; overflow: hidden; width: 13px; height: 12px;
		background: url(images/catalog-stock-icons.png) 0 0; }
		.productList .stockLevel .empty { background-position: 0 -67px; }
		.productList .stockLevel .critical { background-position: 0 -53px; }
		.productList .stockLevel .low { background-position: 0 -39px; }
		.productList .stockLevel .high { background-position: 0 -25px; }
	.productList .price { width: 60px; text-align: right; padding-right: 10px; }
	.productList .total { width: 80px; text-align: right; padding-right: 3px; }
	.productList .count { width: 50px; text-align: center; padding-right: 3px; }
		.productList .count input { width: 20px; text-align: center; }
	.productList .actions { width: 20px; }
		.productList .actions .button {
			display: block; overflow: hidden; width: 12px; height: 12px; margin: 0 auto; padding: 0;
			background: url(images/order-icons.png) 0 0 no-repeat; }
			.productList .actions .button input { width: 12px; padding: 1000px 0 0 0; border: none; background: transparent; }
	.productList tfoot th, .productList tfoot td { 
		padding: 10px; background: #f2f2f2; border: none; 
		font-size: 15px; font-weight: bold; }
		.productList tfoot td.total { padding-right: 3px; }
		.productList tfoot .actions .button { background-position: 0 -14px; width: 16px; height: 16px; }


.catalog .availability em { 
	display: block; text-indent: -1000px; overflow: hidden; margin-top: 5px;
	background: url(images/catalog-stock-icons.png) 0 0 no-repeat; }
	.catalog .availability .limited { width: 32px; height: 11px; background-position: 0 -12px; }
	.catalog .availability .discontinued { width: 28px; height: 10px; background-position: 0 0px; }
.catalog .stockLevel em { 
	display: block; text-indent: -1000px; overflow: hidden; width: 13px; height: 12px; margin-top: 5px;
	background: url(images/catalog-stock-icons.png) 0 0; }
	.catalog .stockLevel .empty { background-position: 0 -67px; }
	.catalog .stockLevel .critical { background-position: 0 -53px; }
	.catalog .stockLevel .low { background-position: 0 -39px; }
	.catalog .stockLevel .high { background-position: 0 -25px; }


.fixate { position: relative; z-index: 100; }
	.fixate .fixed { position: fixed; top: 0;  }

/* Rudimentary styles for displaying html */
.htmlField {}
	.htmlField ul, .htmlField ol { padding-left: 20px;  }
	.htmlField ul { list-style: disc; }
	.htmlField ol { list-style: decimal; }
	.htmlField table, .htmlField h1, 
	.htmlField h2, .htmlField h3, 
	.htmlField p { margin: 1em 0 }
	.htmlField h1 { margin-top: 0; }
	.htmlField td { padding: 0.5em; }
	
form.standard {}
	form.standard label { display: block; padding: 0 6px; margin: 0 0 6px 0; }
	form.standard label.inline { display: inline; }
	form.standard fieldset { margin: 4px 0 16px 0; overflow: hidden; }
		form.standard fieldset div { overflow: hidden; padding: 8px 0 0 0; }
			form.standard fieldset div p { float: left; margin-right: 16px; padding: 0 5px 5px 5px; }
	form.standard .field { 
		padding: 8px 4px; background: #e6e6e6; 
		-webkit-border-radius: 2px; -moz-border-radius: 3px; }
		form.standard .radio .field { 
			padding: 1px; background: transparent;
			-webkit-border-radius: 2px; -moz-border-radius: 3px; }
		form.standard .error .field { background-color: #ff9740; }
		form.standard .field.block { display: block; padding: 4px; position: relative; left: -4px; }
		form.standard .field input, 
		form.standard .field select { 
			padding: 2px; }			
			
form.standard .complete, form.standard .errors { background: white; margin-bottom: 16px; }
	form.standard .complete .inner, form.standard .errors .inner { 
		background: #f2f2f2 url(images/order-icon-error.png) 61px 14px no-repeat;
		padding: 16px 16px 16px 109px; }
	form.standard .complete .inner { background-image: url(images/order-icon-complete.png); }
	form.standard .complete h3, form.standard .errors h3 { font-size: 14px; border: none; font-weight: bold; margin: 0 0 4px 0; }
