@import url("wallpaper-calculator.css");

/* Product page */
div.product {
	position: relative;
	width: 94em;
	height: 60em;
	z-index: 1;
}

div.message {
	margin: 0.5em 0 0.5em 0;
	padding: 0.5em;
	background-color: rgb(40,40,40);
	color: rgb(225,225,225);
	font-size: 120%;
	font-weight: bold;
	text-align: center;
}

div.product div.header {
	background: url("../../images/70percent.png");
	color: rgb(255,255,255);
	height: 3em;
}

div.product div.header h1,
div.product div.header h2,
div.product div.header h4,
div.product div.header a {
	float: left;
}

div.product div.header a {
	position: absolute;
	top: 0;
	padding: 0.5em 1em 0.5em 2.5em;
	font-size: 1.2em;
	color: rgb(255,255,255);	
	text-decoration: none;
}

div.product div.header a#add-this {
	top: 5px;
	right: 24.5em;
	padding:0px;
}

div.product div.header a.send-to-friend {
	right: 31em;
	width: 7em;
	text-indent: -1000em;
	overflow: hidden;
	background: url("../../images/buttons/send-email_rollover.gif") no-repeat center right;
}

div.product div.header a.send-to-friend:hover {
	background: url("../../images/buttons/send-email.gif") no-repeat center right;
}

div.standard div.header a#add-this {
	right: 0.4em;
}

div.standard div.header a.send-to-friend {
	right: 7em;
}

div.product div.header a.add {
	top: 0.5em;
	right: 0.5em;
	width: 12.2em;
	height: 2em;
	padding: 0;
	text-indent: -1000px;
	background: url("../../images/buttons/add-to-basket.gif") no-repeat top left;
	font-size: 100%;
	overflow: hidden;
}

div.product div.header a.add:hover {
	background-image: url("../../images/buttons/add-to-basket_rollover.gif");
}

ul.carousel h4.price a.back {
	background: url("../../images/buttons/icon-left.png") no-repeat 0.8em 0;
	padding-left: 2.5em;
	font-size: 0.7em;
	font-weight: normal;
	text-decoration: none; 
	color: #FFFFFF;
}

div.product div.header a.back {
	left: 0;
	background: url("../../images/buttons/icon-left.png") no-repeat 0.6em 0.6em;
}

div.product div.header a.show {
	right: 11em;
	background: url("../../images/buttons/icon-down.png") no-repeat 0.6em 0.6em;
}

div.product div.header h1,
div.product div.header h4,
div.product div.header h2 {
	margin: 0.1em;
	padding: 0;
	line-height: 1.7em;
	font-size: 1.5em;
	font-weight: bold;
	color: rgb(255,255,255);	
}

div.product div.header h1,
div.product div.header h2 {
	margin-left: 9em;
	width: 285px;
}

div.product div.header h1 {
	overflow: hidden;
	height: 28px;
}

div.product div.header h4 {
	margin-left: 1em;
	margin-right: 8em;
}

div.product div.header h2 span {
	font-weight: normal;
}

div.product dl {
	display: table;
	width: 20em;
	margin-bottom: 0.5em;
}

div.product dl dt,
div.product dl dd {
	display: inline;
	float: left;
	width: 9em;
}

div.product dl dt {
	text-transform: lowercase;
	clear: both;
}

div.product dl dd {
	margin-left: 0.5em;
	width: 10.5em;
}

div.product dl dd abbr {
	border: none;
	margin-left: 3px;
}

div.product h5 {
	margin: 0.5em 0;
	font-size: 1.2em;
	color:black;
}

div.product ul.images {
	display: block;
	width: 32.9em;
	margin-top: 0.5em;
	text-align: center;
}

div.product ul.images li {
	display: inline;
	padding: 0 0.12em;
}

div.product ul.images li img {
	border: solid 0.1em #959698;
}

div.product div.image {
	position: relative;
	width: 32.9em;
	height: 40.5em;
	border: solid 0.1em #959698;
}
div.product div.image img {
	cursor:pointer;
}

#lightbox-container-image div.loader-overlay,
div.product div.image div.loader-overlay {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 32.9em;
	height: 40.5em;
	background: url("../../images/ajax-loader.gif") no-repeat 15em 18em;
	background-color: rgb(0,0,0);
	opacity: 0.6;
}

#lightbox-container-image div.loader-overlay {
	width: 920px;
	height: 700px;
	background: url("../../images/ajax-loader.gif") no-repeat 453px 343px;
	background-color: rgb(0,0,0);
	z-index: 1000;
}

#lightbox-container-image.loading div.loader-overlay,
div.product div.loading div.loader-overlay {
	display:block;
}

div.product a.action {
	display: block;
	margin: 0.5em 0 1em;
	padding: 0.5em 1em;
	background-color: #404040;
	color: rgb(255,255,255);
	text-decoration: none;
}

div.product a.action:hover {
	background-color: #909090;
}

div.product a.sample {
	margin-bottom: 0;
}

div.product div.summary {
	font-size: 1.2em;
}

/* Standard product page */
div.standard {
	background: url("../../images/background_dark.gif");
}

div.standard div.wallpaper {
	display: table;
}

div.standard div.image {
	margin: 1em;
	margin-top: 0;
}

div.standard ul {
	list-style-type:none;
}

div.standard ul li {
	position: absolute;
	background-color: rgb(255,255,255);
	overflow: hidden;
}

div.standard ul li a.product-link {
	display: block;
	height: 37em;
}

div.standard ul li img {
	display: block;
}

div.standard ul li.back-two,
div.standard ul li.forward-two {
	top: 20em;
	width: 9em;
	height: 22em;
	opacity:0.5;
	filter: alpha(opacity=50);
}

div.standard ul li.back-one,
div.standard ul li.forward-one {
	top: 12em;
	width: 12em;
	height: 37em;
	opacity:0.7;
	filter: alpha(opacity=70);
}

div.standard ul li.back-two {
	left: 1em;
}

div.standard ul li.back-one {
	left: 10em;
}

div.standard ul li.forward-one {
	right: 10em;
}

div.standard ul li.forward-two {
	right: 1em;
}

div.standard ul li.forward-two a,
div.standard ul li.forward-one a {
	float: right;
}

div.standard ul li.forward-two a img,
div.standard ul li.forward-one a img {
 position: absolute;
	top: 0px;
	right: 0px;
}

div.standard ul li.current {
	top: 5em;
	left: 22em;
	width: 50em;
	height: 53em;
}

div.standard ul li.current h1,
div.standard ul li.current h2 {
	margin: 0 0 0.6em 0;
	padding: 0.2em 0.5em;
	background-color: rgb(40,40,40);
	color: rgb(255,255,255);
}

div.standard ul li.current h1 {
	font-size: 1.7em;
	margin-bottom: 11px;
	line-height: 1.5;
}

div.standard ul li.current h4 {
	position: absolute;
	top: 0.2em;
	right: 0.5em;
	margin: 0;
	font-size: 1.7em;
	line-height: 1.5em;
	color: rgb(255,255,255);
}

div.standard dl {
	width: 14em;
}

div.standard dl dt {
	background-color: rgb(240,240,240);
	width: 13.4em;
	padding: 0.1em 0.3em;
}

div.standard dl dd {
	width: 13em;
	margin: 0.1em 0 0.1em 1em;
}

div.standard div.sidebar {
	position: absolute;
	top: 3.7em;
	right: 1em;
	width: 14em;
}

div.standard a.view-in-room,
div.standard div.summary {
	margin: 0 1em 1em;
	font-size: 1.2em;
}

div.standard ul.images {
	width: auto;
	text-align: left;
}

div.standard ul.images li {
	position: relative;
	float: left;
	margin: 0;
	padding: 0 0.4em 0.5em 0;
}

div.standard ul.images li a {
	display: block;
}

/* Wallpaper product page */
div.product div.section {
	position: absolute;
	top: 5em;
	border: 0.1em solid #959698;
	z-index: 50;
}

div.product div.section div.inner {
	padding: 1em;
	background-color: #FFFFFF;	
}
div#content div.product div.details div.inner {
	padding-bottom: 1.2em;	
}
div.product div.images {
	left: 5em;
	width: 35.2em;
}

div.product div.details {
	right: 5em;
	width: 22em;
}

div.product div.section h4 {
	position: relative;
	margin: 0;
	padding: 0.3em 0.6em;
	font-size: 1.2em;
	background: url("../../images/70percent.png");
	color: rgb(255,255,255);	
	cursor: pointer;
}

div.product div.section h4 a {
	position: absolute;
	top: 0.3em;
	right: 0.3em;
	width: 1.5em;
	height: 1.5em;
	background: url("../../images/buttons/icon-minus.png") no-repeat top right;
}

div.product div.section h4 a.closed {
	background: url("../../images/buttons/icon-plus-black.png") no-repeat top right;
}

div.search-pager {
	display: table;
	width: 94em;
}

div.search-pager ul,
div.search-pager div.button {
	float: left;
}

div.search-pager div.button a {
	display: block;
	padding-top: 2em;	
	text-decoration: none;
	font-size: 1.3em;
	font-weight: bold;
	color: #959698;
}

div.search-pager div.button {
	display: block;
	width: 11em;
	height: 4.2em;
	margin: 0.5em;
	padding: 1em;	
	background: url("../../images/curve.gif") no-repeat bottom left;
	border: solid 0.1em #959698;
	border-bottom: none;
}

div.search-pager div.prev-button {
	border-left: none;
	margin-left: 0;
}

div.search-pager div.next-button {
	width: 4.1em;
	background: url("../../images/curve_right.gif") no-repeat bottom right;
	border-right: none;
	margin-right: 0em;
}

div.search-pager ul {
	position: relative;
	float: left;
	width: 73.7em;
	height: 7.1em;
	list-style-type: none;
}

div.search-pager ul li {
	float: left;
	width: 5em;
	height: 6.1em;
	border: solid 1px #cccccc;
	margin: 0.5em 0 0.5em 0.5em;
}

div.search-pager ul li.selected {
	border: solid 1px #959698;
}

div.search-pager ul li.first {
	margin-left: 0;
}

div.search-pager ul li a img {
	display: block;
	opacity:0.5;
	filter: alpha(opacity=50);
}

div.search-pager ul li a img {
	display: block;
}

div.search-pager ul li a:hover img,
div.search-pager ul li.selected a img {
	opacity:1;
	filter: alpha(opacity=100);
}

div.full-text {
	display: none;
}

div#purchase {
	position:relative;
	margin-top:1em;
	height: 10.5em;
}

a.basket {
	display: block;
	position:absolute;
	width:122px;
	height:20px;
	right:0;
	top:0;
	background: url("../../images/buttons/add-to-basket-light.gif") no-repeat top right;
	text-indent: -1000em;
}

h3.addToProject {
	position:absolute;
	right:-0.2em;
	top:4.3em;
	width: 10.3em;
	text-align: left;
	font-weight: normal;
}

select#roomId {
	position: absolute;
	right: -0.2em;
	top: 6.3em;
	width: 11.3em;
}

div#standard-purchase h3.addToProject {
	position:relative;
	top: 0;
	left: 1em;
	margin: 0.6em 0 0;
}

div#standard-purchase select#roomId {
	position: relative;
	left: 0.2em;
	top: 0.3em;
}

a.stock-notification-button,
a.stock-notification-text {
	display: block;
	position: absolute;
	width: 12.4em;
	height: 2em;
	right: -0.1em;
}

a.stock-notification-text {
	top:1.9em;
	right: 0.5em;
}

a.stock-notification-button {
	top: 0.5em;
	background: url("../../images/buttons/out-of-stock.gif") no-repeat top right;
	text-indent: -1000em;
}

a.stock-notification-button:hover {
	background: url("../../images/buttons/out-of-stock_rollover.gif") no-repeat top right;
}

div.standard a.stock-notification-text {
	display:block;
	position: static;
	margin-left:1em;
	margin-top:0.4em;
}

div.standard a.stock-notification-button {
	display:block;
	position: static;
	margin-left:1em;
	margin-top:0.4em;
}

li.current a.basket {
	position: relative;
}

a.basket:hover {
	background: url("../../images/buttons/add-to-basket-light_rollover.gif") no-repeat top right;
}

a.sample {
	display: block;
	position: absolute;
	width: 122px;
	height: 20px;
	right: 0;
	top: 2.4em;
	background: url("../../images/buttons/order-sample.gif") no-repeat top right;
	text-indent: -1000em;
}

a.colour-card,
a.sample {
	display: block;
	position:absolute;
	width: 122px;
	height: 20px;
	right: 0;
	top: 2.4em;
	text-indent: -1000em;
}

a.colour-card {
	display: block;
	position: static;
	float:right;
	margin-top:1.2em;
}

a.wallpaper-sample {
	background: url("../../images/buttons/order-sample.gif") no-repeat top right;
}

a.paint-sample {
	background: url("../../images/buttons/order-tester.gif") no-repeat top right;
}

a.colour-card {
	width: 158px;
	top: 55px;
	background: url("../../images/buttons/request-colour-card.gif") no-repeat top right;
}

a.stock-sample {
	display: block;
	position: absolute;
	width: 12.2em;
	height: 2em;
	right: 0;
	top: 3em;
	background: url("../../images/buttons/order-sample.gif") no-repeat top right;
	text-indent: -1000em;
}

li.current a.sample {
	position: relative;
	right:0;
	top:0;
}

a.wallpaper-sample:hover {
	background: url("../../images/buttons/order-sample_rollover.gif") no-repeat top right;
}

a.paint-sample:hover {
	background: url("../../images/buttons/order-tester_rollover.gif") no-repeat top right;
}

a.colour-card:hover {
	background: url("../../images/buttons/request-colour-card_rollover.gif") no-repeat top right;
}

div#purchase span.price {
	font-weight: bold;
	font-size: 200%;
	color:black;
	display:block;
	text-align: center;
	width: 70px;
} 

div#purchase span.units {
	display:block;
	width: 70px;
	margin-top:-0.8em;
	font-size: 120%;
	color:black;
	text-align: center;
}

div#standard-purchase {
	text-align: center;
}

div#standard-purchase a.basket, div#standard-purchase a.sample {
	display:block;
	margin-left:1em;
	margin-top:0.4em;
}

div#standard-purchase span {
	font-weight: bold;
	font-size: 160%;
	color:black;
	padding-bottom:0.4em;
}

ul.popupImages {
	display:none;
}

div#purchase span.price span.original-price,
div#standard-purchase span.price span.original-price {
	display: block;
	font-weight: normal;
	color: #808080;
	text-decoration: line-through;
	line-height: 1.25em;
	padding-top: 2px;
}

div#standard-purchase span.price span.original-price {
	font-size:100%;
	padding-bottom: 0;
}

/* Calculator */
div.inner a#calc-room {
	clear: both;
	display: block;
	margin-top: 0.7em;
	padding: 0.4em 3em 0.4em 0;
	text-align: right;
	color: #959698;
	background: url("../../images/buttons/howmanyrolls.gif") no-repeat top right;
}

div.inner a#calc-room:hover {
	background: url("../../images/buttons/howmanyrolls_rollover.gif") no-repeat top right;
}

/* Product Room list */
div.product-rooms li, div.inner ul.product-rooms li{
	position: relative;
	min-height: 2.5em;
	
}

div#dialog ul.product-rooms {
	padding: 0 120px 0 120px;	
}	

div.product-rooms li span, div.inner ul.product-rooms span {
	display: block;
	width: 13em;
	font-size: 1.1em;
}

div.inner ul.product-rooms span {
	width: 250px;
}	

div.product-rooms li span.cost, div.inner ul.product-rooms li span.cost {
	display: inline;
	width: auto;
}

div.product-rooms li span.amount, div.inner ul.product-rooms li span.amount {
	color: #000;	
}

div.product-rooms li a.basket, div.inner ul.product-rooms li a.basket {
	position: absolute;
	display: block;
	top: 0;
	right: 0;
	width: 5.6em;
	height: 2em;
	text-indent: -1000em;
	background: url("../../images/buttons/add-to-basket-small.gif") no-repeat;
}

div.product-rooms li a.basket:hover, div.inner ul.product-rooms li a.basket:hover {
	background: url("../../images/buttons/add-to-basket-small_rollover.gif") no-repeat;
}

div.product-rooms {
	position: relative;
	top: 1em;
	left: -1em;
	width: 22em;
	margin: 0;
}

div.product div.product-rooms div.inner {
	padding-bottom: 0.5em;
}

div.standard ul li.forward-one a img.forward {
	position: absolute;
	display: block;
	top: 17em;
	left: 2em;
	z-index: 10000;
}

li.back-one a img.back {
	position: absolute;
	display: block;
	top: 17em;
	right: 2em;
	z-index: 10000;
}

div.image img.zoom {
	position: absolute;
	display: none;
	top: 17em;
	right: 13em;
	z-index: 10000;
}

/* Related Products/Coordinating Products/Colourways */
h5.flyout {
	clear: both;
	margin: 0.5em 0;
	padding: 0.3em 0 0.3em 2em;
}

/* for non-wallpaper items */
h5.flyout.flyout-right {
	background: url("../../images/buttons/arrow-right-off.gif") no-repeat 9em;
	padding-left: 0;
}
h5.flyout.flyout-right:hover {
	background: url("../../images/buttons/arrow-right-on.gif") no-repeat 9em;
	padding-left: 0;
}

div.product h5.flyout-right.open {
	background: url("../../images/buttons/arrow-right-selected.gif") no-repeat 9em;
	padding-left: 0;
}

/* for wallpaper/paint -- flyout will have arrows on the buttons facing in opposite directions */
h5.flyout.flyout-left {
	background: url("../../images/buttons/arrow-left-off.gif") no-repeat left center;
	padding-left: 2em;
}
h5.flyout.flyout-left:hover {
	background-image: url("../../images/buttons/arrow-left-on.gif");
	padding-left: 2em;
}

div.product h5.flyout-left.open {
	background-image: url("../../images/buttons/arrow-left-selected.gif");
	padding-left: 2em;
}

div.flyout-container {
	background-color: rgb(255,255,255);
	border: solid 1px #959698;
	border-right: none;
	z-index: 99;
	overflow: hidden;
}

div.flyout-container.flyout-right {
	border: solid 1px #FFF;
	border-left: none;
}

.flyout-active {
	cursor: pointer;
}

div.flyout-container ul.relatedProducts {
	margin: 5px;
	margin-left: 0;
	overflow: hidden;
}

div.flyout-container ul.relatedProducts li {
	margin: 0 0 5px 5px;
}

ul.relatedProducts li {
	display: inline;
	float: left;
	margin-right: 0.5em;
	margin-bottom: 0.5em;
}

ul.relatedProducts li a {
	display: block;
}

ul.relatedProducts li img {
	display: block;
	border: solid 1px #cccccc;
}

/*expanded attributes*/
div.expanded-attributes {
	display:none;
}

#product-view div.show-attributes, 
#product-view div.show-attributes div.title {
	width: 300px;
}

body#product-view div#dialog div.summary-dialog {
	font-size: 1.2em;
	margin-top:2.5em;
}

div.summary-dialog dt {
	float: left;
	width: 100px;
}

div.summary-dialog dt,
div.summary-dialog dd {
	margin-bottom: 6px;
}

div.summary-dialog dl {
	padding: 8px 10px 3px 10px;
	margin-bottom: 0px;
}

div.summary-dialog dl dd abbr {
	border: none;
	margin-left: 3px;
}

/* Request a Colour Card popup*/
div.inner form#contact div.comment {
	margin: 0.5em 0.5em 0;	
}

div.inner form#contact textarea {
	width: 99%;
}

#dialog form#contact div.comment label.error {
	margin-left: 0;
}

/* Product image lightbox */
#lightbox-container-image p.no-flash {
	position: relative;
	top:  200px;
	z-index:1000000; 
	background-color:#FFF;
	color:#000;
}

div.images div.inner a.view-in-hd {
    text-indent:-9999px;
	position:relative;
	display:block;	
	left:65px;
	top:3px;
	width:200px;
	height:28px;
	background: url('../../images/buttons/view_in_hd.gif') no-repeat center center;
}
div.images div.inner a.view-in-hd:hover {
    background: url('../../images/buttons/view_in_hd_rollover.gif') no-repeat center center;
}

div.product div.paint-images {
		width:59.2em;
}

div.product div.paint-images div.image {
	width: 56.9em;	
}

div.coordinating {
	position:relative;	
	height: 100px;
	width: 100%;
}	

ul.coordinatingProducts {
	width: 240px;
	float:left;
	margin-right: 15px;
}

ul.coordinatingProducts li {
	display: inline;
	margin-left: 8px;	
}

ul.coordinatingProducts li.first {
	margin-left: 0px;	
}

ul.coordinatingProducts li a {
	text-decoration: none;
}

ul.coordinating-paint {
	top: 10px;
	left: 700px;
}

ul.coordinating-canvas {
	top: 10px;
	left: 400px;	
}


ul.coordinatingProducts h3 {
	background-color: #302b2f;
	font-size: 130%;
	height: 14px;
	padding:10px;
	text-align:center;
	color: #FFFFFF; 
}

div.paint-carousel-button {
	height:16px;
	width: 16px;
	background-color: #000000;
	border: 1px solid #4d4d4d;
	opacity: 1;
}

div.paint-carousel .selected {
	background-color: #36578a;
}
.product-like {
	float:right;
	margin-top:1.4em;
}