/* CSS Document */

body { background-color: #333333; }

/* LAYOUT - MAIN PAGE AREAS */
.centreContent {
	width: 100%;
	text-align: center;
/* code for centreuing */
	#position: absolute; #top: 50%;
}

/* large white bg */
#contentArea {
	background-color: #ffffff;
	width: 1119px;
	height: 640px;
	text-align: left;

/* code for centering */
	margin:0px auto 0px auto;
	position: relative; top: -50%;
}


/* left nav column and sections*/
#leftNavArea {
	float: left;
	position: relative;
	top: 10px;
	left: 10px;
	margin-right: 20px;
	background-color: #818183;
	width: 265px;
	height: 620px;
}

#leftNav, #contactArea, #productTextArea {
	width: 241px;
	padding: 12px;
	color: #ffffff;
}

#leftNav {
	position: relative;
	top: 55px;
	height: 400px;
	font: 150% "Georgia, Times New Roman", Times, serif;
}

#contactArea { font: 150% "Georgia, Times New Roman", Times, serif; }
#contactArea .small { font: 50% Verdana, Arial, Helvetica, sans-serif; }


#productDescArea {
	float: left;
	position: relative;
	top: 10px;
	margin-right: 10px;
	background-color: #818183;
	width: 265px;
	height: 620px;
}

/* product description - second column */
#productTextArea { font: 10.8pt Verdana, Arial, Helvetica, sans-serif; }


/* main text area */

/* full size - eg filled with promo image */
#textArea {
	float: left;
	position: relative;
	top: 10px;
	width: 824px;
	height: 620px;
	font: 90% Verdana, Arial, Helvetica, sans-serif;
	color: #7f5267;
}


/* adds padding to textArea - eg for text */
.textAreaPadding {
	width: 744px !important;
	height: 575px !important;
	padding: 35px 40px 10px 40px;
}

.textAreaPagePadding {
	width: 744px !important;
	height: 575px !important;
	padding: 35px 40px 10px 40px;
}

/* smaller textArea - for products */
.textAreaProduct {
	width: 548px !important;
	height: 620px !important;
	display: table;
}

/*  ids below needed for centering product images */
#textAreaProductPosition {
	width: 100%;
	#position: absolute;
	#top: 50%;
	display: table-cell;
	vertical-align: middle;
}
#textAreaProductContent {
	width: 100%;
	#position: relative;
	#top: -50%;
	text-align: center;
}

.productName { margin-top: 34px; }

h1 {
	font: 200em bold Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
}


/* PRODUCT THUMBNAIL AREAS */
.productThumb {
	float: left;
	width: 245px;
	height: 285px;
	margin-right: 24px;
	margin-bottom: 24px;
}

/* LINK COLOURS */
/* links in copy */
a:link { color: #ffffff; text-decoration: none; }
a:visited { color: #ffffff; text-decoration: none; }
a:hover { color: #e0bec6; text-decoration: none; }
a:active { color: #e0bec6; text-decoration: none; }

/* links in nav areas */
#leftNavArea a:link { color: #ffffff; text-decoration: none; }
#leftNavArea a:visited { color: #ffffff; text-decoration: none; }
#leftNavArea a:hover { color: #e0bec6; text-decoration: none; }
#leftNavArea a:active { color: #e0bec6; text-decoration: none; }

#contactArea a:link { color: #e0bec6; text-decoration: none; }
#contactArea a:visited { color: #e0bec6; text-decoration: none; }
#contactArea a:hover { color: #ffffff; text-decoration: none; }
#contactArea a:active { color: #ffffff; text-decoration: none; }


.leftFloat { float: left; }
.rightFloat { float: right; }

/* backgrounds */
body.kenzo #leftNavArea {background:  url(images/backgrounds/bg_kenzo_left.gif) no-repeat top left; }
body.kenzo #productDescArea {background:  url(images/backgrounds/bg_kenzo_right.gif) no-repeat top left; }

body.spoon #leftNavArea {background:  url(images/backgrounds/bg_spoon_left.gif) no-repeat top left; }
body.spoon #productDescArea {background:  url(images/backgrounds/bg_spoon_right.gif) no-repeat top left; }

body.harris #leftNavArea {background:  url(images/backgrounds/bg_harris_left.gif) no-repeat top left; }
body.harris #productDescArea {background:  url(images/backgrounds/bg_harris_right.gif) no-repeat top left; }

body.harlequin #leftNavArea {background:  url(images/backgrounds/bg_harlequin_left.gif) no-repeat top left; }
body.harlequin #productDescArea {background:  url(images/backgrounds/bg_harlequin_right.gif) no-repeat top left; }

body.romo #leftNavArea {background:  url(images/backgrounds/bg_romo_left.gif) no-repeat top left; }
body.romo #productDescArea {background:  url(images/backgrounds/bg_romo_right.gif) no-repeat top left; }

body.mizzoniround #leftNavArea {background:  url(images/backgrounds/bg_mizzoniround_left.gif) no-repeat top left; }
body.mizzionround #productDescArea {background:  url(images/backgrounds/bg_mizzoniround_right.gif) no-repeat top left; }

body.jeremy #leftNavArea {background:  url(images/backgrounds/jeremy_left.gif) no-repeat top left; }
body.jeremy #productDescArea {background:  url(images/backgrounds/jeremy_right.gif) no-repeat top left; }

body.dani #leftNavArea {background:  url(images/backgrounds/dani_left.gif) no-repeat top left; }
body.dani #productDescArea {background:  url(images/backgrounds/dani_right.gif) no-repeat top left; }

/* Pagination */
table.pagination { position: absolute; top: 630px; left: 550px; z-index: 99; font-family: Verdana, Arial, Helvetica, sans-serif; color: #7f5267; font-size: 10.8pt;}
html>body table.pagination { position: absolute; top: 630px; left: 550px; z-index: 99;}