@import url("firefox.css");

/*
@font-face {  
  font-family: "dearjoe 5 CASUAL";  
  src: url(/fonts/dearjoecasual.eot);
  src: local("dearjoe 5 CASUAL"), url(/fonts/dearjoecasual.ttf) format("truetype");
}
*/

body {
	margin: 0; padding: 0;
	background: #000; color: #FFF;
	text-align: center;
	font-family: Arial, Sans-Serif; font-size: 12px;
}

h2, h3, h4, h5, p { margin: 0; }
h2, h3, h4 { color: #000; font-family: Georgia, Times, Arial; padding: 0; }
h1 { font-size: 30px; font-weight: normal; margin: 0; padding: 0; }
h2 { font-size: 40px; font-weight: normal; letter-spacing: -1px; padding: 0 0 10px 0; }
h3 { font-size: 22px; font-weight: NORMAL; font-family: Arial; }
h4, .image_thumb h3 { font-size: 14px; font-weight: bold; font-family: Arial; }
hr { color: #000; background: #000; border:0; height: 1px; margin: 20px 0; clear: both; }
hr.white { color: #FFF; background: #FFF; }
p { padding: 10px 0; text-align: left; line-height: 16px; }
a { color: #000; text-decoration: none; }
a:hover { color: #666; }
a.nodec, a.nodec:hover { text-decoration: none; border: 0; }
img { border: 0; }
img.right { display: block; float: right; }
input.flright { float: right !important; }
ul li, ol li { margin: 0; padding: 5px 0; }

.uc { text-transform: uppercase; }
.hide { display: none; }
.red { color: #AA0505; }
.clear { clear: both; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.small { font-size: 11px; }
.normal { font-size: 12px; line-height: 16px; }
.medium { font-size: 14px; line-height: 20px; }
.flat { margin: 0 !important; padding: 0 !important; }
.terms h1, .terms h2, .terms h3, .terms p { margin: 0; padding: 10px 0; }
.terms h1 { color: #000 !important; font-size: 22px; font-weight: normal; }
.terms h3 { color: #000 !important; font-size: 14px; font-weight: bold; }
.wide { padding: 0 20px; }
.black {color: #000;}
.white{background: #FFF;}

.two-col {
	width: 521px;
	margin: 0;
	float: left;
}
.two-col.a { padding: 0 10px 0 0; }
.two-col.b { padding: 0 0 0 10px; }

/************************************************************************* layout ***/

#container {
	width: 1102px;
	margin: 0 auto; padding: 0;
	text-align: left;
}

/************************************************************************* header ***/

header {
	width: 1102px; height: 83px;
	margin: 0; padding: 18px 0 0 0;
	display: block; clear: both;
	background: url(../images/lifes-little-luxury.gif) no-repeat bottom right; border-bottom: #242424 1px solid;
}
header a.logo {
	width: 313px; height: 68px;
	margin: 0; padding: 0;
	display: block; float: left;
	background: url(../images/duck-island.png) no-repeat;
}
header a.logo span { display: none; }

nav {
	width: 1102px; height: 31px;
	margin: 0; padding: 16px 0 0 0;
	display: block; clear: both;
}

nav ul { margin: 0; padding: 0; list-style: none; }
nav ul li { margin: 0; padding: 0 40px 0 0; display: block; float: left; font-size: 14px; font-weight: bold; }
nav ul li.end { padding: 0; background: none; }
nav ul li a { color: #bdbdbd; }
nav ul li a:hover { color: #FFF; }

/************************************************************************* content ***/

article { height: 597px; margin: 0; padding: 0; display: block; color: #000; }
article.noheight, article.noheight section { height: auto; }

section {
	width: 1102px; height: 557px;
	margin: 0; padding: 20px 0;
	display: block; clear: both;
	background: #FFF;
}

section a { border-bottom: #666 1px dotted; }
section a:hover { border-bottom: #666 1px dotted; }

section .text-box {
	padding: 10px 20px;
	background: url(../images/bg-text-box.png) repeat; color: #FFF;
	font-family: Georgia, Times, Arial;
}
section .text-box h3 { color: #FFF; padding: 10px 0; }
section .text-box a { color: #FFF; }
section .text-box a:hover { color: #E5B223; }

section.home { padding: 0; }

section.duck-island { height: 597px; padding: 0; background: url(../images/banners/duck-island.jpg) no-repeat; }
section.duck-island .text-box { width: 368px; margin: 126px 110px 0 0; float: right; font-size: 26px; font-weight: normal; }
section.duck-island .text-box p { line-height: 32px !important; }
section.duck-island .text-box .highlight { color: #f3e18f; }

section.opulence { height: 487px; padding: 110px 0 0 0; background: url(../images/banners/opulence.jpg) no-repeat; }
section.opulence .text-box { width: 700px; margin: 56px 110px 0 0; float: right; font-size: 26px; font-weight: normal; }
section.opulence .text-box p { line-height: 32px !important; }
section.opulence .text-box .highlight { color: #f3e18f; }

section.regal { height: 597px; padding: 0; background: url(../images/banners/regal.jpg) no-repeat; }
section.regal .text-box { width: 368px; margin: 126px 110px 0 0; float: right; font-size: 26px; font-weight: normal; }
section.regal .text-box p { line-height: 32px !important; }
section.regal .text-box .highlight { color: #f3e18f; }

section.mandarin { height: 597px; padding: 0; background: url(../images/banners/mandarin.jpg) no-repeat; }
section.mandarin .text-box { width: 368px; margin: 126px 110px 0 0; float: right; font-size: 26px; font-weight: normal; }
section.mandarin .text-box p { line-height: 32px !important; }
section.mandarin .text-box .highlight { color: #f3e18f; }

section.retail { width: 582px; height: 497px; padding: 100px 500px 0 20px; background: #FFF url(../images/banners/retail-to-guests.jpg) no-repeat;  color: #000; }
section.retail .text-box { width: 368px; margin: 0; font-size: 12px; font-weight: normal; }
section.retail .text-box p { line-height: 22px !important; }
section.retail .text-box .highlight { color: #f3e18f; }

section.environment { height: 487px; padding: 110px 0 0 0; background: url(../images/banners/environment.jpg) no-repeat; }
section.environment .text-box { width: 368px; margin: 20px 110px 0 0; float: right; background: url(../images/bg-text-box-white.png) repeat; color: #000; font-size: 26px; font-weight: normal; }
section.environment .text-box p { font-size: 14px; line-height: 20px !important; font-weight: bold; }
section.environment .text-box p strong { font-size: 26px; line-height: 32px !important; font-weight: normal; }
section.environment .text-box .highlight { color: #f3e18f; }

section.contact { height: 567px; padding: 30px 0 0 0; background: url(../images/banners/contact.jpg) no-repeat; }
section.contact .text-box { width: 700px; margin: 0 60px 0 0; float: right; font-size: 14px; font-weight: normal; }
section.contact .text-box p { line-height: 18px; font-family: Arial, Sans-Serif; }
section.contact .text-box p.small { color: #545454; line-height: 12px; }
section.contact .text-box p.small a { color: #545454 !important; }
section.contact .text-box p.small a:hover { color: #FFF !important; }
section.contact .text-box p a { color: #FFF !important; }
section.contact .text-box p a:hover { border-bottom: #FFF 1px dotted !important; }
section.contact .text-box .highlight { color: #f3e18f; }

section.email-friend, section.register { height: 487px; padding: 110px 0 0 0; }
section.email-friend { background: url(../images/banners/email-friend.jpg) no-repeat; }
section.register { background: url(../images/banners/register.jpg) no-repeat; }
section.email-friend .text-box, section.register .text-box { width: 700px; margin: 30px 60px 0 0; float: right; font-size: 14px; font-weight: normal; }
section.email-friend .text-box p, section.register .text-box p { line-height: 18px; font-family: Arial, Sans-Serif; }
section.email-friend .text-box .highlight, section.register .text-box .highlight { color: #f3e18f; }

section.brochure { height: 397px; padding: 200px 0 0 0; background: url(../images/banners/brochure.jpg) no-repeat; }
section.brochure .text-box { width: 342px; margin: 150px 40px 0 0; float: right; font-size: 12px; font-weight: normal; font-family: Arial, Sans-Serif; }
section.brochure .text-box p { line-height: 16px !important; }
section.brochure .text-box .highlight { color: #f3e18f; }

aside { margin: 0; padding: 0; display: block; }

ul.product-types {
	width: 367px; height: 149px;
	margin: 446px 0 0 0; padding: 20px 0 0 20px;
	display: block; position: absolute; z-index: 2;
	list-style: none; font-weight: bold;
}
ul.product-types li { width: 180px; margin: 0; padding: 0 0 16px 0; float: left; }
ul.product-types li a { color: #d4d4d4; border: 0; }
ul.product-types li a:hover { color: #FFF; border: 0; }

ul.product-nav {
	width: 169px; height: 517px;
	margin: 0; padding: 0 20px 20px 20px;
	display: block; float: left; clear: both;
	/*border-right: #a6a6a6 1px dotted;*/
	list-style: none;
}
ul.product-nav li { margin: 0; padding: 0 0 1px 0; clear: both; font-size: 12px; font-weight: bold; }
ul.product-nav li a { padding: 10px; display: block; background: #242424; color: #FFF; border: 0; }
ul.product-nav li a:hover { background: #000; color: #FFF; border: 0; }
ul.product-nav li a.on { background: #000 url(../images/left-arrow.gif) no-repeat right center; }

.product-info {
	width: 872px;
	margin: 0; padding: 0 0 0 20px;
	float: left;
}

.button, a.button, input.button {
	width: 130px; height: 25px;
	margin: 0; padding: 5px 0 0 0;
	display: block;
	background: url(../images/button.png) no-repeat; color: #FFF; border: 0;
	text-align: center; font-size: 12px; font-weight: bold; font-family: Arial, Sans-Serif;
}
.button:hover, a.button:hover, input.button:hover { background-position: 0 -30px; color: #E5B223; border: 0; }

a.view-brochure {
	width: 185px; height: 32px;
	margin: 10px 0 0 840px; padding: 14px 0 0 15px;
	display: block; position: absolute; z-index: 2;
	background: url(../images/view-brochure.png) no-repeat; color: #FFF; border: 0;
	text-align: left; font-size: 14px; font-weight: bold; font-family: Arial, Sans-Serif;
}
a.view-brochure:hover { background-position: 0 -46px; color: #E5B223; border: 0; }

ul.tag-info { margin: 0; padding: 0; display: block; list-style: none; position: absolute; z-index: 2; }
ul.tag-info li { margin: 0; padding: 3px 0; clear: both; font-size: 11px; }
ul.tag-info li.title { font-weight: bold; font-size: 12px; }
ul.tag-info.display { width: 130px; margin: 34px 0 0 545px; }
ul.tag-info.giftbox { width: 600px; margin: 350px 0 0 10px; }
ul.tag-info.giftbox li { padding: 0 20px 0 0; clear: none; display: inline; }
ul.tag-info.card { width: 400px; margin: 350px 0 0 620px; }
ul.tag-info.card li { padding: 0 20px 0 0; clear: none; display: inline; }

ul.all-products, ul.all-products li ul { margin: 0; padding: 0; list-style: none; }
ul.all-products { padding: 20px 0 0 0; }
ul.all-products li { width: 100%; /*width: 521px;*/ margin: 0; padding: 0 10px 0 0; display: block; float: left; }
ul.all-products li a { background: #000; color: #FFF; border: 0; font-size: 22px; font-weight: normal; padding: 5px; display: block; }
ul.all-products li a:hover { background: #242424; }
ul.all-products li ul { padding: 10px 0 0 0; }
ul.all-products li ul li { width: 167px; margin: 0; padding: 0 5px 20px 0; display: block; float: left; text-align: center; }
ul.all-products li ul li.wide { width: 400px; text-align: center; }
ul.all-products li ul li a { background: none; color: #000; font-size: 12px; font-weight: bold; }
ul.all-products li ul li a:hover { background: none; }

ul.product-range { margin: 0; padding: 0; list-style: none; }
ul.product-range li { margin: 0; padding: 0; display: block; float: left; border-right: #FFF 1px solid; }
ul.product-range li.top { border-bottom: #FFF 1px solid; }
ul.product-range li a {
	width: 283px; height: 35px;
	margin: 0; padding: 241px 0 0 0;
	display: block; float: left;
	border: 0; background: #CCC;
}
ul.product-range li a:hover { color: #FFF; }
ul.product-range li a span {
	/*width: 263px; height: 36px;*/
	margin: 0; padding: 10px;
	display: none;
	background: #000; color: #FFF;
	font-size: 14px; font-weight: bold;
}
ul.product-range li a.hair-care { background: url(../images/product-range/hair-care.jpg) no-repeat; }
ul.product-range li a.bath-shower { background: url(../images/product-range/bath-shower.jpg) no-repeat; }
ul.product-range li a.soaps { background: url(../images/product-range/soaps.jpg) no-repeat; }
ul.product-range li a.body-creams { background: url(../images/product-range/body-creams.jpg) no-repeat; }
ul.product-range li a.bracket-tray { background: url(../images/product-range/bracket-tray.jpg) no-repeat; }
ul.product-range li a.accessories { background: url(../images/product-range/accessories.jpg) no-repeat; }

.privacy{
	width: 1062px;
	display: block!important; clear: both!important;
	margin: 0; padding: 30px 20px 0 20px;
	float: left!important;
	height: 650px!important;
	background: #FFF;
}

.terms{
	width: 1062px;
	display: block!important; clear: both!important;
	margin: 0; padding: 30px 20px 0 20px;
	float: left!important;
	height: 3600px!important;
	background: #FFF;
}

/************************************************************************* footer ***/

footer {
	width: 1102px;
	margin: 0; padding: 0;
	display: block; clear: both;
	font-size: 11px;
}

footer ul { width: 1102px; margin: 0; padding: 18px 0; list-style: none; text-align: center; }
footer ul li { margin: 0; padding: 0 40px 0 0; display: inline; font-size: 12px; font-weight: normal; }
footer ul li.end { padding: 0; background: none; }
footer ul li a { color: #bdbdbd; }
footer ul li a:hover { color: #FFF; }

footer .copyright { width: 1102px; margin: 0; padding: 0 0 20px 0; clear: both; text-align: center; color: #3e3e3e; line-height: 16px; }
footer .copyright a { color: #3e3e3e; border-bottom: #3e3e3e 1px dotted; }
footer .copyright a:hover { color: #FFF; border-bottom: #FFF 1px dotted; }

/************************************************************************* forms ***/

.contact-form {
	width: 350px; height: 300px;
	margin: 0; padding: 10px 0 0 20px;
	float: right;
	border-left: #000 1px dotted;
}

.contact-form.main { height: 420px; }
.contact-form.friend { height: 270px; }
.contact-form.reg { height: 230px; }

.contact-form fieldset {
	margin: 0; padding: 0;
	clear: both;
}
.contact-form fieldset dl dt { width: 120px; margin: 3px 0; padding: 5px 5px 0 0; float: left; clear: both; font-size: 12px; font-family: Arial, Sans-Serif; text-align: right; }
.contact-form fieldset dl dd { width: 210px; margin: 3px 0;  float: left; }
.contact-form fieldset dl dd input#submit { height: 25px; cursor: pointer; }
.contact-form form, fieldset, dl, dt, dd { margin: 0; padding: 0; border: 0; }
input.text, textarea.text {
	width: 200px; padding: 5px 3px;
	border: #262729 1px solid; background: #000; color: #FFF;
	font-size: 13px; font-family: Arial, Sans-Serif;
}
input.text.code { width: 50px; }
textarea.text { height: 100px; }
input.postcode { width: 90px; }
form.add-basket { margin: 0; padding: 0 0 70px 0; }

.error-box {
	width: 200px; height: 34px;
	margin: 259px 0 0 -110px; padding: 6px 30px 0 10px;
	position: absolute; z-index: 2;
	background: url(../images/bg-error-box.png) no-repeat; color: #AA0505;
}
.error-box p { padding: 0 0 5px 0; font-size: 11px; line-height: 14px !important; }

.contact-form.reg .error-box { margin: 71px 0 0 -110px !important; }

/************************************************************************* content scroller ***/

.main_image {
	width: 550px; height: 500px;
	float: left;
	position: relative;
	overflow: hidden;
	color: #000;
	border-top: 1px dotted #ccc;
}
.main_image h2 {
	font-size: 2em;
	font-weight: normal;
	margin: 0 0 5px; padding: 10px;
}
.main_image p {
	font-size: 12px;
	padding: 10px 0; margin: 0;
	line-height: 1.6em;
}
.block small { 
	padding: 0 0 0 20px; 
	background: url(icon_calendar.gif) no-repeat 0 center; 
	font-size: 1em; 
}
.main_image .block small {margin-left: 10px;}
.main_image .block .code { font-size: 12px; }
.main_image .desc{
	position: absolute;
	top: 0;	left: 0;
	width: 100%;
	display: none;
}
.main_image .block{
	width: 250px;
	padding: 20px 20px 0 20px;
	float: right;
	border-top: 1px solid #FFF;
}
.main_image a.collapse {
	background: url(btn_collapse.gif) no-repeat left top;
	height: 27px; width: 93px;
	text-indent: -99999px;
	position: absolute; 
	top: -27px; right: 20px; 
}
.main_image a.show {background-position: left bottom;} 
.main_image .code { display: none; }

.image_thumb {
	float: left;
	width: 299px;
	border-left: 1px dotted #ccc;
	border-top: 1px dotted #ccc;
}
.image_thumb img {
	border: 1px solid #ccc; 
	background: #fff; 
	float: left;
}
.image_thumb ul {
	margin: 0; padding: 0;
	list-style: none;
}
.image_thumb ul li{
	margin: 0; padding: 12px 10px;
	background: #FFF;
	width: 279px;
	float: left;
	border-bottom: 1px dotted #ccc;
	border-right: 1px dotted #ccc;
}
.image_thumb ul li.hover {
	background: #FCF9EA;
	cursor: pointer;
}
.image_thumb ul li.active {
	background: #FFF url(../images/bg-highlight.gif) repeat-y;
	cursor: default;
}
html .image_thumb ul li h2 {
	font-size: 1.5em; 
	margin: 5px 0; padding: 0;
}
.image_thumb ul li .block {
	float: left; 
	margin-left: 10px;
	padding: 0;
	width: 190px;
}	
.image_thumb ul li p, .image_thumb ul li ul.spec {display: none;}
.image_thumb ul li p.code { display: inline; color: #303030; font-size: 11px; }

/************************************************************************* MultiBox v1.3 ***/

.MultiBoxContainer {
	position: absolute;
	border: 20px solid #FFF;
	background-color: #FFF !important;
	display: none;
	z-index: 2;
	text-align: left;
}

.MultiBoxLoading {
	background: url(../images/multibox/loader.gif) no-repeat center;
}

.MultiBoxContent {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.MultiBoxClose {
	position: absolute;
	top: -26px;
	right: -26px;
	background: url(../images/multibox/close.png) no-repeat;
	width: 24px;
	height: 24px;
	cursor: pointer;
}


.MultiBoxControlsContainer {
	overflow: hidden;
	height: 0px;
	width: 100%;
	position: relative;
}

.MultiBoxControls {
	width: 100%;
	height: auto;
	background-color: #FFF;
	padding: 0 0 2px 0;
	position: absolute;
	bottom: 0px;
}


.MultiBoxPrevious {
	position: absolute;
	background: url(../images/multibox/left.png) no-repeat;
	width: 24px;
	height: 24px;
	left: 0px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNext {
	position: absolute;
	background: url(../images/multibox/right.png) no-repeat;
	width: 24px;
	height: 24px;
	right: 0px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNextDisabled {
	cursor: default;
	background: url(../images/multibox/rightDisabled.png) no-repeat;
}

.MultiBoxPreviousDisabled {
	cursor: default;
	background: url(../images/multibox/leftDisabled.png) no-repeat;
}

.MultiBoxTitle {
	position: relative;
	margin: 10px 0 0 35px;
	padding: 0 0 0 10px;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #2E2E2E;
	font-weight: bold;
	text-align: left;
}

.MultiBoxNumber {
	position: relative;
	width: 50px;
	margin: 10px 35px 0 0;
	float: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	text-align: right;
}

.MultiBoxDescription {
	clear: left;
	position: relative;
	margin: 0 35px 0 35px;
	padding-top: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
	text-align: left;
}

#box-prod{ width: 400px; padding: 0 0 0 0; }