@font-face {
    font-family: 'BorisBlackBloxxRegular';
    src: url('../fonts/borisblackbloxx-webfont.eot');
    src: url('../fonts/borisblackbloxx-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/borisblackbloxx-webfont.woff') format('woff'),
         url('../fonts/borisblackbloxx-webfont.ttf') format('truetype'),
         url('../fonts/borisblackbloxx-webfont.svg#BorisBlackBloxxRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* 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; }
/* remember to define focus styles! */
:focus { outline: 0; }
body { line-height: 1.2; color: #000; background: #fff; }
a { text-decoration: none; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
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: "" ""; }
a img { border: 0; }

/* Sense2 */
html, body { width: 100%; height: 100%; }
body { font-size: 62.5%; background: #e8e5ed; font-family: helvetica, arial, sans-serif; min-width: 768px; }
#page { position: relative; background: #fff; margin: 0 auto; min-height: 60em; padding: 8em 0; width: 100em; }
#pageinner { padding: 0 2.1em; }
#header { width: 100%; margin: 0 0 1em 0; }
#badge { position: absolute; left: -6em; top: 2.8em; background: url('../images/badge.png') top left no-repeat; width: 124px; height: 124px; z-index: 9999; }
#menu { font-size: 1.4em; border-bottom: 1px solid #615a57; float: right; padding: 0 0 0.2em 0; margin: 0 0 0.2em 0; z-index: 51; }
#menu li { float: right; margin: 0 1em 0 0; position: relative; }
#menu li:first-child { margin: 0; }
#menu li a { color: #4f4745; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1.4em; }
#menu li a:hover { color: #ed1589; }

#menu li  a+div { display: none; position: absolute; left: 0; top: 100%; z-index: 50; padding: 2px 0 0 0; }
#menu ul { background: #fff; border: 1px solid #696361; width: auto; display: block; }
#menu li:hover > div { display: block; }
#menu li li { width: auto; float: none; margin: 0; font-style: italic; }
#menu li li a { white-space: nowrap; display: block; padding: 0.2em 0.6em; font-size: 0.85em; color: #898483; }
#menu li li a:hover { color: #fff; background: #ed1589; }

#menu li li:hover > a { color: #fff; background: #ed1589; }
#menu li li div { left: 100%; top: -4px; }

#bannerimg { position: relative; height: 215px; }
#bannerimg img { position: absolute; left: 0; top: 0; height: 215px; }
#banner { height: 215px; background: url('../images/headerbg.png') left top repeat-x; clear: both; overflow: hidden; position: relative; width: 100%; white-space: nowrap; }
#bubble { height: 215px; background: #fff; width: auto; line-height: 0.9; white-space: normal; z-index: 2; position: relative; float: left; padding: 0 0.5em 0 0; }
#bubble div { margin: 0.2em 0 0.2em 2.94em; font-size: 0.34em; color: #676364; font-weight: normal; font-family: Arial, tahoma, sans-serif; letter-spacing: -0.03em; max-width: 35em; }
#bubblecap { height: 215px; background: url('../images/bubble.png') left top no-repeat; width: 32px; z-index: 2; position: relative; float: left; }
#bubbleimg { height: 215px; width: 1200px; z-index: 1; left: -32px; position: relative; float: left; }
#bubble td { height: 215px; vertical-align: middle; color: #ed1589; font-size: 4em; letter-spacing: -0.05em; font-family: 'Arial Black', Arial, sans-serif; }
#bubble h1 { margin: 0 0.2em 0 1em; line-height: 0.80; }
#bubble h1 .cufon { margin-top: -24em; } /* WTF does this work? */
#content { width: 100%; float: left; }
#left { width: 20%; float: left; }
#right { width: 80%; float: right; }
#rightpad { padding: 0 0 0 1em; }

#bubble a.readmore { color: #ed1589; }

@media screen and (max-width: 1024px)
{
	#left { width: 23%; }
	#right { width: 77%; }
	#page { width: 77em; }
}

@media screen and (min-width: 1025px)
{
	#page { width: 100em; }
}

@media screen and (min-width: 1281px)
{
	#page { width: 125em; }
}

@media screen and (min-width: 1600px)
{
	#page { width: 157em; }
}


.hidden { display: none; }
.ca { text-align: center; }
.ra { text-align: right; }
.la { text-align: left; }

#categorylist { height: auto; max-height: 80em; overflow: auto; }
#categorylist a { color: #fff; padding: 0.4em 0.3em; display: -moz-inline-box; display: inline-block; text-decoration: none; font-style: italic; text-transform: uppercase; letter-spacing: -0.01em; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; }
#categorylist a:hover { color: #ed1589; }
#categorylist li.cate a { background: #1cdad2; }
#categorylist li.cato a { background: #00ed79; }
#categorylist span { color: #1cdad2; margin: 0 0.2em 0 0; }
#categorylist li.cate span { color: #1cdad2; }
#categorylist li.cato span { color: #00ed79; }
#categorylist span.empty { visibility: hidden; }
#categorylist li { overflow: hidden; white-space: nowrap; }
#categorylist li ul { margin: 0 0 0 1em; }
#categorylist .heart { font-size: 1.2em; }

#categorylist li.disabled a { background: #d6cfdf; }
#categorylist li.disabled li.cate a { background: #1cdad2; }
#categorylist li.disabled li.cato a { background: #00ed79; }
#categorylist li.disabled li.disabled a { background: #d6cfdf; }


div.clear { clear: both; height: 0; overflow: hidden; }

div.tabset { position: relative; clear: both; }
div.tabset ul.tabs { position: relative; vertical-align: bottom; padding: 0; z-index: 2; margin: 0 0 1em; height: 2em; width: 100%; background: #d5d1e0; }
div.tabset ul.tabs li { display: block; background: #d5d1e0; float: left; padding: 0 0.2em; height: 2em; line-height: 2em; margin: 0 0 1em 0; position: relative; }
div.tabset ul.tabs li a { padding: 0 0.8em; color: #fff; font-weight: bold; font-size: 1.2em; text-transform: uppercase; line-height: 1.66667em; }
div.tabset ul.tabs li a:hover { color: #fc00bf; text-decoration: none; }
div.tabset ul.tabs li div.tick { position: absolute; width: 4px; height: 4px; background: #fc00bf url('../images/tabactive.png') 0 0 no-repeat; left: 0; top: 100%; visibility: hidden; }
div.tabset ul.tabs li.active { background: #fc00bf }
div.tabset ul.tabs li.active div.tick { visibility: visible; }
div.tabset ul.tabs li.active a { color: #fff; cursor: default; }
div.tabset div.tabbody { display: none; position: relative; top: 0; clear: both; }
div.tabset div.active { display: block; }
div.subheader { border: 1px solid #d5d1e0; border-width: 0 1px 1px 1px; position: relative; background: #f0f1f1; padding: 0.5em 1em; }
.tabbody .subheader { top: -1em; }
div.subheader a { color: #666; text-decoration: none; }

div.section { position: relative; }
div.sectionHeader { position: relative; vertical-align: bottom; padding: 0; z-index: 2; margin: 0; height: 2em; width: 100%; background: #d5d1e0; overflow: hidden; }
div.sectionHeader h2 { margin: 0; padding: 0 0.8em; color: #fff; font-weight: bold; font-size: 1.2em; text-transform: uppercase; }
div.sectionHeader div { display: block; background: #fc00bf; float: left; padding: 0 0.2em; margin: 0 0 1em 0; position: relative; line-height: 2em; }
div.sectionHeader div a { color: #fff; }
div.sectionHeader div.tick { position: absolute; width: 4px; height: 4px; background: transparent url('../images/tabactive.png') 0 0 no-repeat; left: 0; top: 100%; }
div.sectionHeader a.parent { color: #fea6e9; }

button, a.button { background: #FB3AC9; padding: 0.3em 1em; -moz-border-radius: 1.2em; -webkit-border-radius: 1.2em; border-radius: 15px 15px 15px 15px; border: 0; color: #fff; min-width: 8em; font-weight: bold; font-size: 1.3em; font-family: inherit; line-height: 1.5em; cursor: pointer; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; text-transform: uppercase; }
a.button { display: -moz-inline-box; display: inline-block; }
button, a.button {
	background: -moz-linear-gradient(top, #fb56eb 0%, #fb0a8e 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fb56eb), color-stop(100%,#fb0a8e)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fb56eb', endColorstr='#fb0a8e',GradientType=0 ); /* ie */
	background: -o-linear-gradient(top, #fb56eb 0%,#fb0a8e 100%); /* opera */
}

button.clear, a.button.clear { background: #D5D1E0; }


button.small, a.button.small { font-size: 0.9em; }

h2 { font-weight: bold; color: #ed1589; font-size: 2.2em; margin: 0 0 0.5em 0; }
h3 { font-weight: bold; color: #ed1589; font-size: 1.2em; margin: 1em 0 0.5em 0; }

.product h3 { margin: 0.25em 0; }

div.columns { width: 100%; overflow: hidden; color: #7c7b7d; }
div.column { float: left; }
div.columnpadding { padding: 0 0 0 1em; }
div.column:first-child .columnpadding { padding: 0; }
div.threequarter { width: 75%; }
div.quarter { width: 25%; }
div.half { width: 50%; }

ul.tabs h2 { font-size: 1em; margin: 0; }

#searchform label { text-transform: uppercase; color: #fff; padding: 0.1em 0.3em; font-style: italic; }
#searchform input[type=text] { border: 1px solid #ccc; margin: 0.3em 0 1em 0; width: 90%; }
#keywordslabel { background: #c3bab1; }
#quantitylabel { background: #44eb33; }
#budgetlabel { background: #898dfe; }
#deliverytimelabel { background: #7fe7c9; }
#targetmarketlabel { background: #f1cc4d; }
#purposelabel { background: #f389b4; }
#colourlabel { background: #66d7ff; }
#finishlabel { background: #f8a886; }

#searchform .filtersection { padding-bottom: 1em; }
#searchform .multi { margin: 0.3em 0 1em 0; width: 100%; overflow: hidden; }
#searchform select { margin: 0.3em 0 1em 0; font-size: 0.95em; }
#searchform .multi label { font-style: normal; color: #333; text-transform: none; float: left; width: 50%; display: block; padding: 0; }

#overlay { position: fixed; z-index:1000; top: 0px; left: 0px; height:100%; width:100%; background: #fff; display: none; text-align: center; padding-top: 25%; color: #fc00bf; font-weight: bold; }
#overlay span { background: #000; -moz-border-radius: 0.6em; -webit-border-radius: 0.6em; border-radius: 0.6em; font-size: 3em; padding: 1em; }

#footer { margin: 3em 0 1em 20%; border-top: 3px solid #c4bac0; padding: 1em 0 0 0; color: #585956; }
body.login #footer, body.admin #footer { margin-left: 0; }
#footer select { font-size: inherit; font-family: inherit; }
#footerleft { float: left; }
#flags { margin-top: 2em; clear: both; }
#flags img { margin: 0 0.5em 0 0; vertical-align: middle; }
#footerleft ul { list-style-type: none; }
#footerleft li { display: inline; margin: 0 1em 0 0; padding: 0 1em 0 0; border-right: 1px solid #c4bac0; color: #585956; }
#footerleft li a { color: #585956; text-decoration: none; }
#footerleft li a:hover { text-decoration: underline; }
#footerleft li:last-child { border: 0; }
#footerright { float: right; }

img.swatch { border: 2px solid #fff; cursor: pointer; margin: 0 2px 2px 0; }
img.swatch.selected { border: 2px solid #fc00bf; }

#menu #quicksearch div { position: relative; border: 1px solid #63f054; overflow: hidden; display: block; padding: 0; margin: 0; }
#quicksearch button { position: absolute; right: 0; top: 0; bottom: 0; background: #63f054; color: #fff; padding: 0 0.5em; margin: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; line-height: 1; float: right; min-width: 0; width: auto; font-weight: normal; font-size: 0.95em; letter-spacing: -0.05em; filter: none; }
#quicksearch input { width: 10em; border: none; color: #696361; margin: 0 5em 0 0; }

@media screen and (max-width: 1024px)
{
	#quicksearch input { width: 3em; }
}

span.colourname { margin: 0 0 0 2em; text-transform: none; font-weight: normal; }
div.colourname {text-transform: none; font-weight: normal; color: #797A7C; }

@media print
{
  #header, #footer { display: none; }
	#left { display: none; }
	.sectionHeader, .subheader, .calculator, ul.tabs, #alsolike, #bestsellers, #categoryinfo { display: none; }
	#right { width: 100%; margin: 0; }
}

#bubble canvas { z-index: -1; background: transparent; }

.pagenav span.currentpage { color: #ed1589; font-weight: bold; }

.qwarning { color: #ed1589; }

.product .icons {
	position: absolute;
	top: 1px;
	right: 1px;
	text-align: right;
}

.product a.addtofavourites {
	background: url('../images/heart.png') center center no-repeat;
	width: 35px;
	height: 35px;
	display: none;
}

#zoomed .product a.addtofavourites, .product.zoomed a.addtofavourites {
	display: inline-block;
}

#menu li.hasFavourites a {
	color: #ed1589;
}

#mobilecategories {
	margin-bottom: 1em;
}

#mobilecategories select {
	width: 100%;
}

@media screen and (min-width: 769px) {
	#mobilecategories {
		display: none;
	}
}

@media screen and (max-width: 768px) {
	#bannerimg, #bubblecap {
		display: none;
	}

	#bubble {
		background: #fff;
		color: #fff;
		width: 100%;
		max-width: 100% !important;
	}

	#bubble br {
		display: none;
	}

	#bubble canvas {
		display: none
	}

	#bubble cufontext {
		height: auto !important;
		width: auto !important;
		text-indent: 0 !important;
		font-size: 40px !important;
		line-height: 40px !important;
	}

	#bubble br + cufon {
		margin-left: 18em;
	}

	#bubble table {
		width: 100%;
	}

	#badge {
		left: -2em;
	}

	.subheader {
		display: none;
	}

	#left {
		display: none;
	}

	#right {
		width: 100%;
	}

	#maincats .tabs {
		display: none;
	}
}


option.childcat {
	margin-left: 1em;
}