/* Colours: */

.house			{color: #36454F;} /* dark grey */
.secondary		{color: #A6A6A6;}
.mid			{color: #D8D8D8;}
.light			{color: #EAEAEA;}
.lightest		{color: #E6E6E6;}
.black			{color: #000000;}
.white			{color: #FFFFFF;}
.red			{color: #ee0000 !important;}
.orange			{color: #C54A00;}
.amber			{color: #FFBF00;}
.green			{color: #8dc53e !important;}

/* Background Colours: */

.house-bg		{background: #878787;}
.primary-bg		{background: #9A9A9A;}
.secondary-bg	{background: #A6A6A6;}
.mid-bg			{background: #D8D8D8;}
.light-bg		{background: #EAEAEA;}
.lightest-bg	{background: #E6E6E6;}
.white-bg		{background: #FFFFFF;}

/* Background Gradients: */

.gradient-house		{background: #555555; background: linear-gradient(to bottom, #161616 0%, #555555 75%, #555555 100%);}
.gradient-secondary	{background: #A6A6A6; background: linear-gradient(to bottom, #A6A6A6 0%, #1B72A1 50%, #A6A6A6 100%);}
.gradient-gold		{background: #EAEAEA; background: linear-gradient(to bottom, #EAEAEA 0%, #ffffff 50%, #EAEAEA 100%);}
.gradient-lightest	{background: #E6E6E6; background: linear-gradient(to bottom, #E6E6E6 0%, #ffffff 50%, #E6E6E6 100%);}
.gradient-cool		{background: #DBE5E5; background: linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%);}
.gradient-warm		{background: #C7DCEF; background: linear-gradient(to bottom, #C7DCEF 0%, #ECF2F8 50%, #C7DCEF 100%);}

.gradient-warning {color: #ffffff; background: #ff003c; background: radial-gradient(ellipse at center, rgba(255,0,60,1) 0%, rgba(179,25,61,1) 59%, rgba(140,23,50,1) 100%)}
.gradient-warning h2,.gradient-warning h3,.gradient-warning h4,.gradient-warning h5,.gradient-warning h6 {color: #ffffff !important;}
.gradient-warning a	{color: #ffffff !important; text-decoration: underline;}

h1 {font-size: 1.5em; font-weight: 200; padding: 9px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}
h2 {font-size: 1.3em; font-weight: 200; padding: 9px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}
h3 {font-size: 1.25em; font-weight: 200; padding: 7px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}
h4 {font-size: 1.2em; font-weight: 200; padding: 7px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}
h5 {font-size: 1.15em; font-weight: 200; padding: 5px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}
h6 {font-size: 1.1em; font-weight: 200; padding: 5px 0; margin: 0; letter-spacing: 0.05em; color: #36454F;}

body {
	background: #ffffff;
	color: #606060;
	font-family:  'Times New Roman', Times, serif;
	margin: 0;
	font-size: 1.2em;
}

.button:disabled, .button_large:disabled, .button_submit:disabled { background: #999999; }

.g-recaptcha { display: inline-block; }

@media all and ( max-width: 330px ) {
	.g-recaptcha
	{
	    max-width: 250px;
	}
	.button_submit, .button_large, .button_listing, .button_red_large { font-size: 1.2em; padding: 10px; }
}

#ssl-img {
    display: inline-block;
    vertical-align: middle;
    margin: 10px 0;
	width: 114px;
	height: 56px;
    overflow: hidden;
    border-radius: 5px;
}
#ssl-img img {
	margin: 0 !important;	
}

li {margin-top: 9px;}

.to-top { background: rgba(135,135,135,0.7); border-radius: 6px; }
.to-top:hover { background: rgba(135,135,135,1); }

.header-top-wrapper {
	clear: both; width: 100%; padding: 5px 0 0 0; 
/*	background: #45484D; */
/*	background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(69,72,77,1) 100%); */
}

.header-branding-wrapper { clear: both; width: 100%; background: #ffffff; }

#branding {
	margin: 9px auto;
	text-align: center;
}

.branding {
	clear: both;
	margin: 0 auto;
	padding: 0;
	display: inline;
	font-size: 1.8em;
	line-height: 0.9em;
	white-space: nowrap;
}
.branding span { font-size: 0.5em; font-style: italic; }

.branding a:link { text-decoration: none; }
.branding a:visited { text-decoration: none; }
.branding a:active { text-decoration: none; }
.branding a:hover { text-decoration: none; }

.header-menu-wrapper { clear: both; width: 100%; background: #ffffff; border-bottom: 1px solid #E6E6E6;}

.header-wrapper { clear: both; width: 100%; margin: 0; padding: 0; background: #ffffff url('images/preload.gif') no-repeat 50% 50%; border-bottom: 1px solid #E6E6E6; }
#header-image { height: 200px; position: relative; }

/* cycle slider common styles */

.cycle-pager {position: absolute; z-index: 100; bottom: 7px; left: 50%; margin-left: -58px; display: block;} /* 5dots = -58px; 8dots = -92px; */
.cycle-pager span { font-size: 2%; margin: 6px; text-decoration: none !important; text-align: center; color: transparent; display: inline-block; width: 7px; height: 7px; background-color: transparent; border: 2px solid #ffffff; border-radius: 50%; }
.cycle-pager span:hover { cursor: pointer; }
.cycle-pager span.cycle-pager-active { background-color: #878787; cursor: auto; }

.firstslide { display: block; }

/* /cycle-slider common styles */

/* page sliders */

.headerslides { width: 100%; height: 100%; margin: 0; padding: 0; }
.headerslide { width: 100%; height: 100%; margin: 0; padding: 0; display: none; position: relative; }

#header-strap { position: absolute; top: 9px; left: 15px; z-index: 500; padding: 6px; font-size: 1.2em; font-style: italic; font-weight: normal; color: #ffffff; background: rgba(135,135,135,0.5); text-shadow: 2px 2px 8px #666666; border-radius: 3px; }

/* /page sliders */

/* home page slider */

.home-slider-wrapper { clear: both; width: 100%; margin: 0; padding: 0; background: #E6E6E6 url('images/preload.gif') no-repeat 50% 50%; }

.cyclecontainer { width: 100%; max-width: 1280px; height: 200px; margin: 0 auto; padding: 0; background: transparent; display: block; overflow: hidden; }

.cycleslidescontainer { position: relative; width: 100%; height: 100%; margin: 0 auto; padding: 0; }

.cycleslides { width: 100%; height: 100%; margin: 0; padding: 0; }
.cycleslides p { margin: 0; padding: 0; }

.cycleslide { width: 100%; height: 100%; margin: 0; padding: 0; display: none; position: relative; }

#headerslide0, #slide0 {background: transparent url('/images/slides/slide-1.jpg') center center no-repeat; background-size: cover !important;}
#headerslide1, #slide1 {background: transparent url('/images/slides/slide-2.jpg') center center no-repeat; background-size: cover !important;}
#headerslide2, #slide2 {background: transparent url('/images/slides/slide-3.jpg') center center no-repeat; background-size: cover !important;}
#headerslide3, #slide3 {background: transparent url('/images/slides/slide-4.jpg') center center no-repeat; background-size: cover !important;}
#headerslide4, #slide4 {background: transparent url('/images/slides/slide-5.jpg') center center no-repeat; background-size: cover !important;}

.slidecontent-wrapper { position: absolute; top: 0; left: 0; width: 100%; z-index: 50; background: rgba(135,135,135,0.3); text-align: center; }
.slidecontent { display: inline-block; margin: 0; padding: 9px; }
.slidecontent p { line-height: 1.5em; text-shadow: 2px 2px 8px #666666; }
.slidecontent ul { text-shadow: 2px 2px 8px #666666; }
.slidecontent li { text-shadow: 2px 2px 8px #666666; }
.slidecontent img { margin-top: 15px; }
.slidecontent a { color: #ffffff !important; text-decoration: none !important; }

.slidetitle { color: #ffffff; font-size: 1.1em; font-weight: 200; }

.slidebutton { margin: 5px 0; font-size: 1.1em; text-decoration: none; }

#cycleleftarrow {display: none; position: absolute; z-index: 400; top: 45%; left: 16px; height: 40px; width: 40px; margin: 0 0 20px 0; padding: 0; background: rgba(255,255,255,0.5) url('images/leftarrow.png') -3px -40px no-repeat; cursor: pointer; border-radius: 20px; }
#cycleleftarrow:hover {background: rgba(0,0,0,0.5) url('images/leftarrow.png') -3px 0 no-repeat;}
#cyclerightarrow {display: none; position: absolute; z-index: 400; top: 45%; right: 16px; height: 40px; width: 40px; margin: 0 0 20px 0; padding: 0; background: rgba(255,255,255,0.5) url('images/rightarrow.png') 3px -40px no-repeat; cursor: pointer; border-radius: 20px; }
#cyclerightarrow:hover {background: rgba(0,0,0,0.5) url('images/rightarrow.png') 3px 0 no-repeat;}

.cyclebuttons { display: none; position: absolute; bottom: 0; left: 0; width: 100%; z-index: 500; background: rgba(135,135,135,0.3); }
.cyclebuttons a { color: #ffffff !important; text-decoration: none !important; }
.cyclebuttons a:hover { color: #ffffff !important; background: rgba(135,135,135,0.3); text-decoration: none !important; }

.cyclebutton { width: 20%; display: inline-block; float: left; padding: 9px; text-align: center; color: #ffffff; font-size: 1em; box-sizing: border-box; }

#homeslidernav { display: none; }

#headerslidernav { display: block; }

/* / home page slider */

/* feature sliders */

#featured, #feature-ads { margin: 9px 0 !important; padding: 0 !important;  }
.featured-li { max-width: 100%; margin-top: 0 !important; display: none; }
.featurebox { width: 90%; margin: 0 auto; }

.savings-pane { width: 100%; min-height: 24px; color: #ffffff; background: #ee0000; padding: 3px 0; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.savings-panel { position: absolute; top: 0; left: 0; width: 100%; min-height: 24px; color: #ffffff; background: #ee0000; padding: 3px; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.promotion-pane { width: 100%; min-height: 24px; color: #ffffff; background: #A6A6A6; padding: 3px 0; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.promotion-panel { position: absolute; top: 0; left: 0; width: 100%; min-height: 24px; color: #ffffff; background: #A6A6A6; padding: 3px; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.delivery-pane { width: 100%; min-height: 24px; color: #ffffff; background: #878787; padding: 3px 0; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.delivery-panel { position: absolute; top: 0; left: 0; width: 100%; min-height: 24px; color: #ffffff; background: #878787; padding: 3px; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }
.savings-pane a, .delivery-pane a, .savings-pane a:hover, .delivery-pane a:hover, .promotion-pane a:hover, .promotion-pane a:hover { display: block; color: #ffffff !important; text-decoration: none !important; }

.normally { font-size: 0.8em; font-weight: bold; }
.pricetext { font-size: 1em; font-weight: bold; }
.reducedpricetext { font-size: 1em; font-weight: bold; color: #ee0000; } 
.tradepricetext { font-size: 1em; font-weight: bold; background: #C6D29A; padding: 5px; border-radius: 4px; } 

.feature-left-arrow {position: absolute; z-index: 900; top: 45%; left: 20px; height: 30px; width: 30px; margin: 0 0 15px 0; padding: 0; text-align: center; cursor: pointer; }
.feature-right-arrow {position: absolute; z-index: 900; top: 45%; right: 20px; height: 30px; width: 30px; margin: 0 0 15px 0; padding: 0; text-align: center; cursor: pointer; }
.feature-left-arrow:hover, .feature-right-arrow:hover { color: #36454F; }

/* /feature sliders */

/* small slider */

.slidespanel { position: relative; height: 200px; width: 590px; max-width: 100%; margin: 0 auto; padding: 0; background: #DBE5E5; background: linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%); overflow: hidden; }

/* /small slider */

.crumbtrail { padding: 12px 1.25%; }

/* product lists, search, product details, basket and checkout */

.button_reset
{
color: #ffffff !important;
background: #dd0000 !important;
text-decoration: none !important;
text-align: center;
border: 0 none;
cursor: pointer;
font-size: 0.9em;
padding: 5px 10px;
margin: 0 3px;
float: right;
}

.button_reset:hover
{
color: #ffffff !important;
background: #686868 !important;
text-decoration: none !important;
}

.button_catalog, .button_filter{
color: #ffffff !important;
background: #535353 !important;
text-decoration: none !important;
text-align: center;
border: 0 none;
cursor: pointer;
font-size: 0.9em;
padding: 5px 10px;
}

.button_catalog:hover,
.button_filter:hover
{
color: #ffffff !important;
background: #686868 !important;
text-decoration: none !important;
}

.select_catalog { background: #ededed; font-size: 0.9em; padding: 5px; }

.setparams { margin: 10px 0; padding: 5px; border-top: 0 solid #8A8A8A; }

.prodcount { font-size: 0.9em; padding: 0; }

.heading-pane-filter { width: 100%; color: #ffffff; background: #878787; padding: 3px 6px; text-align: center; border-radius: 3px 3px 0 0; box-sizing: border-box; }

#filters { border-bottom: 1px solid #999999;}

.filterlabel { display: block; width: 100%; box-sizing: border-box;}

.filtercontrol { display: block; }
.button_filter { float: right; }
.filtercontent input[type="text"] { max-width: 100%; box-sizing: border-box; }
.input-slider-container { padding: 10px 16px; overflow: hidden; }
.filter-sortorder-select { font-size: 1em; }

.rdrhtfilterdisabled {}

.sortorderform { text-align: right; margin: 0 0 0 15px; }

.currencyform { text-align: right; margin: 0 15px 0 0; display: block; }
.currencyselect { margin: 0 3px 4px 3px; background: #dcdcdc; border: 1px solid #808080; font-size: 0.9em; }

.prevnext { float: right; margin: 0 5px; line-height: 250%; clear: right;}

.thispage { color: #ffffff; background: #535353; padding: 5px 8px; border-radius: 2px; font-weight: bold; }

a.pagenumber {padding: 5px 8px; font-weight: normal; white-space: nowrap; border-radius: 2px; font-weight: bold;}
a.pagenumber:link {color: #000000; background: #bababa; text-decoration:none; font-weight: bold;} 
a.pagenumber:visited {color: #000000; background: #bababa; text-decoration:none; font-weight: bold;} 
a.pagenumber:hover {color: #ffffff; background: #535353; text-decoration:none; font-weight: bold;}
a.pagenumber:active {color: #000000; background: #bababa; text-decoration:none; font-weight: bold;}

a.pagelink {padding: 5px 8px; font-weight: normal; white-space: nowrap; border-radius: 2px; font-weight: bold;}
a.pagelink:link {color: #000000; background: #bababa; text-decoration:none; font-weight: normal;} 
a.pagelink:visited {color: #000000; background: #bababa; text-decoration:none; font-weight: normal;} 
a.pagelink:hover {color: #ffffff; background: #535353; text-decoration:none; font-weight: normal;}
a.pagelink:active {color: #000000; background: #bababa; text-decoration:none; font-weight: normal;}

.itemsperpage {float: left; }
.switchview, .switchadminview, .switchhidden {float: right; padding: 5px; display: none;}

.button_grid {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/view_sprite.png') 0 top no-repeat; cursor:pointer; overflow:hidden; text-decoration:none; display:inline; vertical-align:middle}
.button_grid:hover {background-position: 0 -25px;}

.button_list {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/view_sprite.png') -25px top no-repeat; cursor: pointer; overflow: hidden; text-decoration: none; display: inline; vertical-align: middle;}
.button_list:hover {background-position: right -25px;}

.button_adminon {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/admin_sprite.png') 0 top no-repeat; cursor: pointer; overflow: hidden; text-decoration: none; display: inline; vertical-align: middle;}
.button_adminon:hover {background-position: 0 -25px;}

.button_adminoff {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/admin_sprite.png') -25px top no-repeat; cursor: pointer; overflow: hidden; text-decoration: none; display: inline; vertical-align: middle;}
.button_adminoff:hover {background-position: right -25px;}

.button_showhidden {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/show_sprite.png') 0 top no-repeat; cursor: pointer; overflow: hidden; text-decoration: none; display: inline; vertical-align: middle;}
.button_showhidden:hover {background-position: 0 -25px;}

.button_hidehidden {width: 25px; height: 25px; margin: 0; padding: 0; border: 0 none; font-size: 0.5em; color: transparent; background: transparent url('../catalog/icons/show_sprite.png') -25px top no-repeat; cursor: pointer; overflow: hidden; text-decoration: none; display: inline; vertical-align: middle;}
.button_hidehidden:hover {background-position: right -25px;}

th {text-align: left;}

.catalogbox {margin: 10px 0; color: #222222; text-align: left; font-size: 0.9em; border-bottom: 1px solid #999999;}
.subsectiontitle {font-weight: bold;}
a.subsectiontitle:link {color: #222222; text-decoration:none; font-weight: bold;} 
a.subsectiontitle:visited {color: #222222; text-decoration:none; font-weight: bold;} 
a.subsectiontitle:hover {color: #222222; text-decoration:underline; font-weight: bold;}
a.subsectiontitle:active {color: #222222; text-decoration:none; font-weight: bold;}

.setcategoryform {margin: 5px 15px 0 10px;}
.catheading {border-top: 1px solid #007BC6; margin: 5px 15px 0 10px;}

.resultmessage {margin: 0 10px;}

#search-form { margin: 9px auto; }

.product-images { }
.product-image { position: relative; margin: 10px auto; }
.productimage { max-width: 100%; border: 1px solid #dddddd; border-radius: 3px; }
.prodimagestrap { font-size: 0.9em; color: #999999; padding: 5px; }

.productfullimage { position: absolute; display: none; z-index: 25; top: 0; left: 0; max-width: 100%; border: 1px solid #dddddd; border-radius: 3px; }

#ringoptions table { font-size: 0.9em; }
#ringoptions select { font-size: 0.9em !important; padding: 3px !important;}


#product-button-panel { background: #ffffff; }
#product-button-panel img { margin: 0 1px; }

.pseudo-itemheader { margin-top: 1px; border-top: 1px solid #999999; }

.side-sash-tag-left, 
.side-sash-tag-right, 
.side-corner-tag-left,
.side-corner-tag-right
{        
position: relative;        
overflow: hidden;        
}

.side-sash-tag-right span 
{        
position: absolute;        
display: inline-block;        
top: 15px;        
right: -25px;        
box-shadow: 0px 0px 10px rgba(0,0,0,0.2), inset 0px 5px 30px rgba(255,255,255,0.2);        
text-align: center;        
text-transform: uppercase;        
background: rgba(255,0,0,0.9);        
width: 120px;        
padding: 3px 16px;        
transform: rotate(45deg);
}

.side-sash-tag-left span 
{        
position: absolute;        
display: inline-block;        
top: 15px;        
left: -25px;        
box-shadow: 0px 0px 10px rgba(0,0,0,0.2), inset 0px 5px 30px rgba(255,255,255,0.2);        
text-align: center;        
text-transform: uppercase;        
background: rgba(255,0,0,0.9);        
width: 120px;        
padding: 3px 16px;        
transform: rotate(-45deg);
}

.side-corner-tag-right span 
{        
position: absolute;        
display: inline-block;        
top: -5px;        
right: -42px;        
box-shadow: 0px 0px 10px rgba(0,0,0,0.2), inset 0px 5px 30px rgba(255,255,255,0.2);        
text-align: center;        
text-transform: uppercase;        
color: #ffffff;        
background: rgba(255,0,0,0.9);        
width: 100px;        
padding: 12px 7px 1px 7px;        
font-size: 0.9em;
font-family: arial, sans-serif;        
font-weight: 200;
transform: rotate(45deg);
}

.side-corner-tag-left span 
{        
position: absolute;        
display: inline-block;        
top: -5px;        
left: -42px;        
box-shadow: 0px 0px 10px rgba(0,0,0,0.2), inset 0px 5px 30px rgba(255,255,255,0.2);        
text-align: center;        
color: #ffffff;        
background: rgba(255,0,0,0.9);        
width: 100px;        
padding: 12px 7px 1px 7px;        
text-transform: uppercase;        
font-size: 0.9em;
font-family: arial, sans-serif;        
font-weight: 200;
transform: rotate(-45deg);
}

.catinfo { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px dotted #dddddd; }

.listfulldesc { padding-bottom: 5px; margin-bottom: 5px; } 

.setparams { float: left; }

.paging { float: right; font-size: 0.9em; }

.button-toggle-view-grid
{ 
	font-size: 0.9em;
	padding: 5px 10px;
	border-radius: 3px;
	color: transparent !important;
	background: #173056;
	background: url('../images/view-grid.png') no-repeat center center, linear-gradient(to bottom, #1B72A1 0%, #1B72A1 50%, #173056 100%);
	text-decoration: none !important;
	text-align: center;
	white-space: nowrap;
	display: inline-block;
	border: 0 none;
	box-shadow: 0px 3px 5px 0px rgba(66,66,66,0.5);
	margin: 5px 0;
	cursor: pointer;
}
.button-toggle-view-grid:hover
{
	color: transparent !important;
	background: url('../images/view-grid.png') no-repeat center center, linear-gradient(to bottom, #173056 0%, #1B72A1 50%, #1B72A1 100%);
}

.button-toggle-view-list
{ 
	font-size: 0.9em;
	padding: 5px 10px;
	border-radius: 3px;
	color: transparent !important;
	background: #173056;
	background: url('../images/view-list.png') no-repeat center center, linear-gradient(to bottom, #1B72A1 0%, #1B72A1 50%, #173056 100%);
	text-decoration: none !important;
	text-align: center;
	white-space: nowrap;
	display: inline-block;
	border: 0 none;
	box-shadow: 0px 3px 5px 0px rgba(66,66,66,0.5);
	margin: 5px 0;
	cursor: pointer;
}
.button-toggle-view-list:hover
{
	color: transparent !important;
	background: url('../images/view-list.png') no-repeat center center, linear-gradient(to bottom, #173056 0%, #1B72A1 50%, #1B72A1 100%);
}

.cycle-slideshow img { width: 100%; height: auto; display: block; }

#slideshow-1, #slideshow-2 { max-width: 400px; margin: 9px auto; }
#slideshow-1 img { border-radius: 3px; }

#cycle-1 div { width: 100%; height: 100%; border-radius: 3px; background-position: center top; background-repeat: no-repeat; background-size: contain; }
/*	padding-bottom: 100%; insert this above to force square slider */

#cycle-2 .cycle-slide { margin-right: 2px; height: 78px; }
#cycle-2 .cycle-slide img { height: 74px; border-radius: 3px; }
#cycle-2 .cycle-slide img:hover { cursor: pointer; }
#cycle-2 .cycle-slide-active img { border-bottom: 4px solid #0067B4; }

#cartmessage { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9999; }
#cartmessagecontents { position: relative; max-width: 1200px; margin: 5px auto 25px auto; padding: 10px; border: 2.5px #db8300 solid; color: #36454F; background: #f1e566; background: url('images/basket_bg.png') right center no-repeat, radial-gradient(ellipse at center, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); cursor: pointer; }
.cart-button { position: absolute; top: 0; right: 0; z-index: 20; height: 38px; width: 48px; }

.qtybox { text-align: center; max-width: 60px !important; }
.pricebox { text-align: center; max-width: 80px !important; font-size: 1em !important; padding: 3px 1px !important;}
.couponbox { text-align: center; max-width: 180px !important; font-size: 1.15em !important; padding: 3px !important; }

.basket_table { width: 100%; background: #eeeeee; box-sizing: border-box; }
.basket_table>div:nth-child(odd) { background: #dddddd; }

.basket_headings { width: 100%; font-weight: bold; background: #d8d8d8 !important; padding: 3px; box-sizing: border-box; }

.basket_item { width: 100%; padding: 3px; box-sizing: border-box; }
.basket_product { width: 100%; }
.basket_details { width: 100%; text-align: right; }
.basket_quantity { width: 40%; display: inline-block; float: left; }
.basket_excvat { width: 30%; display: inline-block; float: left; }
.basket_incvat { width: 30%; display: inline-block; float: left; font-weight: bold; }

.basket_delete {float: left; width: 32px; height: 32px; margin: 0 3px 0 0; }

.add_to_basket { }
.add_to_basket_plus { width: 30px; height: 25px; display: block; background: transparent url('images/add_item_to_basket.png') center top no-repeat; cursor: pointer; }
.add_to_basket_text { width: 124px; height: 25px; display: block; background: transparent url('images/add_item_to_basket_text.png') center top no-repeat; cursor: pointer; }
.add_to_basket:hover, .add_to_basket_text:hover { background-position: center -25px; }

.shopping_basket {margin: 5px 0; padding: 5px 0 5px 5px; display: block;}
.delivery_costs {margin: 3px 0; padding: 0; display: block;}
.promocode {margin: 0 5px; padding: 5px;}

.label40 {width: 40%; float: left; margin: 0 5px 0 0;}  /* this label container is not responsive */
.label50 {width: 50%; float: left; margin: 0 5px 0 0;}  /* this label container is not responsive */
.label60 {width: 60%; float: left; margin: 0 5px 0 0;}  /* this label container is not responsive */

/* /product lists, search, product details, basket and checkout */

#site-map .infolinks { font-size: 0.9em; }

#content { position: relative; }

#message-box { position: relative; display: none; }
#message-box-close { position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; z-index: 300; cursor: pointer; padding: 0; color: #333333; background: transparent; }
#message-box-close:hover { color: #ee0000; }
#message-box-open { position: absolute; display: none; top: 0; right: 0; z-index: 300; cursor: pointer; width: 50px; height: 60px; background: transparent url('images/message-box-show.png') right -60px no-repeat; }
#message-box-open:hover { background-position: right top; }

.noscreen {display: none;}

.floatright {float: none;}
.floatleft {float: none;}

.floatrightimg {float: right; margin: 3px 3px 10px 10px;}
.floatleftimg {float: left; margin: 3px 10px 10px 3px;}

.printlogoright {float: right; margin: 3px;}
.printlogoleft {float: left; margin: 3px;}

.no-overflow {overflow: hidden;}
.alignright {text-align: right;}
.alignleft {text-align: left;}
.aligncenter {text-align: center;}
.centered {text-align: center;}
img.centered {display: block; margin-left: auto !important; margin-right: auto !important;}

.valignmiddle {}

.valignmiddle:before {    		/* create a full-height inline block pseudo=element */
    content: '';
    display: inline-block;
    vertical-align: middle;  	/* vertical alignment of the inline element */
    height: 100%;
    width: 0.1%;
    overflow: hidden;
}

.valignmiddle > div:first-of-type {
	display: inline-block;
    vertical-align: middle;  	/* vertical alignment of the inline element */
    width: 90%;
}

.relative { position: relative; }
.inline {display: inline;}
.inlineblock {display: inline-block !important;}

img {border: 0 none; }
image {border: 0 none; }

img.responsive,
image.responsive,
input.responsive
{
	max-width: 100% !important;
	width: auto !important;
	height: auto !important;
}

a:focus {outline: none;}

.shadowed {box-shadow: 0px 0px 1px 1px rgba(99,99,99,0.5);}
.padded {padding: 5px;}
.rounded {border-radius: 3px;}
.bordered {border: 1px solid #cccccc;}
.bordered-dark {border: 1px solid #999999;}
.shaded {background: #E6E6E6;}
.shaded-dark {background: #cccccc;}
.spaced {margin: 9px;}
.vspaced {margin: 6px 0;}
.plain {border: 0 none; box-shadow: none; }

.underlined {text-decoration: underline;}
.indented {margin-left: 25px;}
.warning {color: #FE101C; font-weight: bold;}

.smaller {font-size: 0.9em;}
.smallest, small {font-size: 0.8em;}
.large {font-size: 1.1em;}
.larger {font-size: 1.2em;}
.largest {font-size: 1.5em;}
.warning {color: #FE101C; font-weight: bold;}
.bold {font-weight: bold;}

.table { width: 100%; display: table; }
.table-cell { display: table-cell; }

.nowrap {white-space: nowrap;}
.underlined {text-decoration: underline;}
.line-through {text-decoration: line-through; }
.clickable {cursor: pointer;}
div.clickable:hover {background-color: #ECECEC;}
.uppercase {text-transform: uppercase;}
.scroll { overflow-y: scroll !important; }

.highlighted { border: 3px solid #D8D8D8; padding: 10px; margin: 10px; font-weight: bold; color: #36454F; border-radius: 3px; }

.tight {margin: 0; padding: 0;}
.spacer {clear: both; height: 10px; margin: 0px;}
.spacerbig {clear: both; height: 25px; margin: 0px;}
.separator {clear: both; height: 1px; margin: 0px; font-size: 0.1em;}
.clear {clear: both;}

.article {}
.article-boxed {}
.articletitle { padding: 5px; }
.articlebody { margin: 5px; line-height: 1.5em; border-bottom: 1px solid #cccccc; }
.articlebody img { margin: 5px;}
.article-boxed .articlebody img { display: none;}
.articledate { font-size: 0.9em; margin: 0; padding: 5px; float: right; }
.articleattributor { font-size: 0.8em; text-transform: uppercase; margin: 0; padding: 5px; float: left; }

.testimonials div.article:nth-child(odd) { background: #DBE5E5; background: linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%);}
.testimonials div.article:nth-child(even) { background: #C7DCEF; background: linear-gradient(to bottom, #C7DCEF 0%, #ECF2F8 50%, #C7DCEF 100%);}

.bloglist div.article:nth-child(odd) { background: #DBE5E5; background: linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%);}
.bloglist div.article:nth-child(even) { background: #C7DCEF; background: linear-gradient(to bottom, #C7DCEF 0%, #ECF2F8 50%, #C7DCEF 100%);}

li.tick {margin: 0; padding: 0 0 5px 5px; list-style-image: url('../images/tick.gif')}

li.dec { background: url('images/dec_30.png') 0 0 no-repeat; padding: 9px 0 9px 40px; margin: 3px 0;}
li.inc { background: url('images/inc_30.png') 0 0 no-repeat; padding: 9px 0 9px 40px; margin: 3px 0;}
li.del { background: url('images/del_30.png') 0 0 no-repeat; padding: 9px 0 9px 40px; margin: 3px 0;}

li.facebook {list-style-type: none; background: url('../images/facebook_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}
li.twitter {list-style-type: none; background: url('../images/twitter_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}
li.tumblr {list-style-type: none; background: url('../images/tumblr_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}
li.blogger {list-style-type: none; background: url('../images/blogger_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}
li.linkedin {list-style-type: none; background: url('../images/linked_in_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}
li.instagram {list-style-type: none; background: url('../images/instagram_38.png') left center no-repeat; padding: 12px 0 12px 45px !important; margin: 3px 0;}

li.facebook_large {font-size: 1.9em; list-style-type: none; background: url('../images/facebook_48.png') left center no-repeat; padding: 16px 0 16px 60px; margin: 3px 0;}
li.twitter_large {font-size: 1.9em; list-style-type: none; background: url('../images/twitter_48.png') left center no-repeat; padding: 16px 0 16px 60px; margin: 3px 0;}
li.blog_large {font-size: 1.9em; list-style-type: none; background: url('../images/blog_48.png') left center no-repeat; padding: 16px 0 16px 60px; margin: 3px 0;}
li.linkedin_large {font-size: 1.9em; list-style-type: none; background: url('../images/linkedin_48.png') left center no-repeat; padding: 16px 0 16px 60px; margin: 3px 0;}
li.email_large {font-size: 1.9em; list-style-type: none; background: url('../images/email_48.png') left center no-repeat; padding: 16px 0 16px 60px; margin: 6px 0;}

li.jpg {list-style-type: none; background: url('../images/jpg_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.pdf {list-style-type: none; background: url('../images/pdf_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.pdf {list-style-type: none; background: url('../images/pdf_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.ppt {list-style-type: none; background: url('../images/ppt_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.doc {list-style-type: none; background: url('../images/doc_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.xls {list-style-type: none; background: url('../images/xls_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.web {list-style-type: none; background: url('../images/web_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.email {list-style-type: none; background: url('../images/email_38.png') left top no-repeat; padding: 12px 0 12px 43px; margin: 3px 0;}
li.install {list-style-type: none; background: url('../images/install.gif') left top no-repeat; padding: 5px 0 5px 25px; margin: 3px 0;}
li.nobull {list-style: none; padding: 5px 0 5px 25px; margin: 3px 0;}

ul.nobull {list-style: none;}

.button_large,
.button,
.button_small,
.button_smaller,
.button_house,
.button_house_right_pointer,
.button_red_large,
.button_red,
.button_red_small,
.button_red_smaller,
.button_grey_small,
.button_grey_smaller,
.button_gold,
.button_submit,
.button_listing,
.edit_button 
{
color: #ffffff !important;
background: #878787;
text-decoration: none !important;
text-align: center;
white-space: nowrap;
display: inline-block;
border: 0 none;
box-shadow: 0px 3px 5px 0px rgba(66,66,66,0.5);
cursor: pointer;
}

.button_large:hover, 
.button:hover, 
.button_small:hover, 
.button_smaller:hover, 
.button_house:hover,
.button_house_right_pointer:hover,
.button_red_large:hover,
.button_red:hover, 
.button_red_small:hover,
.button_red_smaller:hover,
.button_grey_small:hover,
.button_grey_smaller:hover,
.button_gold:hover,
.button_submit:hover,
.button_listing:hover,
.edit_button:hover 
{
color: #ffffff !important;
background: #999999;
text-decoration: none;
}

.button_gold { background: #F0AF00; font-size: 1em; padding: 7px 14px; border-radius: 3px; }
.button_large {font-size: 1.5em; padding: 10px 20px; border-radius: 3px;}
.button_small {font-size: 0.9em; padding: 5px 10px; border-radius: 3px;}
.button_smaller {font-size: 0.8em; padding: 3px 10px; border-radius: 3px;}

.button, .button_house {font-size: 1em; padding: 7px 14px; border-radius: 3px;}
.button_house_right_pointer {font-size: 1em; padding: 2px 14px 0 14px; border-radius: 3px;}

.button_submit {font-size: 1.75em; padding: 12px 24px; border-radius: 3px;}
.button_listing {font-size: 1.3em; padding: 10px 15px; border-radius: 3px;}

.button_red_large {font-size: 1.3em; padding: 10px; background: #ee0000; border-radius: 3px;}
.button_red {font-size: 1em; padding: 7px; background: #ee0000; border-radius: 3px;}
.button_red_small {font-size: 0.9em; padding: 5px 10px; background: #ee0000; border-radius: 3px;}
.button_red_smaller {font-size: 0.8em; padding: 3px 10px; background: #ee0000; border-radius: 3px;}

.button_red:hover, .button_red_small:hover, .button_red_smaller:hover, .button_red_large:hover { background: #dd0000; }

.button_grey_small {font-size: 0.8em; padding: 3px 10px; color: #333333 !important; background: #cccccc; border-radius: 3px;}
.button_grey_smaller {font-size: 0.8em; padding: 3px 10px; color: #333333 !important; background: #cccccc; border-radius: 3px;}
.button_grey_small:hover, .button_grey_smaller:hover {background: #878787;}

.edit_button {font-size: 0.9em; margin: 2px; padding: 3px; border-radius: 2px;}

a.button_small:link, a.button:link, a.button_large:link, a.button_red:link, a.button_home_slider:link, a.button_submit:link, a.button_listing:link, a.edit_button:link {color: #ffffff; text-decoration: none;}
a.button_small:visited, a.button:visited, a.button_large:visited, a.button_red:visited, a.button_home_slider:visited, a.button_submit:visited, a.button_listing:visited, a.edit_button:visited {color: #ffffff; text-decoration: none;}
a.button_small:hover, a.button:hover, a.button_large:hover, a.button_red:hover, a.button_home_slider:hover, a.button_submit:hover, a.button_listing:visited, a.edit_button:hover {color: #ffffff; text-decoration: none;}
a.button_small:active, a.button:active, a.button_large:active, a.button_red:active, a.button_home_slider:active, a.button_submit:active, a.button_listing:visited, a.edit_button:active {color: #ffffff; text-decoration: none;}

input[type="text"], input[type="email"], input[type="url"], input[type="number"], input[type="tel"], input[type="password"] {font-family: 'Cormorant Infant', serif; font-size: 1.2em; padding: 6px 3px; border: 1px solid #a5a5a5; border-radius: 3px; width: 98%;}
input[type="checkbox"] {width: 26px; height: 26px; padding: 6px 3px; border: 1px solid #a5a5a5; border-radius: 6px; vertical-align: middle;}
input[type="radio"] {height: 26px; width: 26px; padding: 6px 3px; border: 1px solid #a5a5a5; vertical-align: middle;}
textarea {font-family: 'Cormorant Infant', serif; font-size: 1.2em; padding: 3px 0; border: 1px solid #a5a5a5; border-radius: 3px; width: 98%;}
select {font-family: 'Cormorant Infant', serif; font-size: 1.2em; margin: 2px 0; padding: 6px 3px; border: 1px solid #a5a5a5; border-radius: 3px; max-width: 98%;}

.plaintextbox {font-family: 'Cormorant Infant', serif; background: transparent; border: 0 none !important; color: #606060; font-size: 1em; }

.smalltextbox { font-size: 0.8em !important; max-width: 150px !important; }
.smallselect { font-size: 0.8em !important; }

.dateinput { width: 75% !important; }

a:link {color: #36454F; text-decoration:underline;} 
a:visited {color: #36454F; text-decoration:underline;} 
a:hover {color: #000000; text-decoration:none;}
a:active {color: #36454F; text-decoration:underline;}

a.antilink:link {color: #36454F; text-decoration:none;} 
a.antilink:visited {color: #36454F; text-decoration:none;} 
a.antilink:hover {color: #606060; text-decoration:underline;}
a.antilink:active {color: #36454F; text-decoration:none;}

a.plainlink:link {color: #36454F; text-decoration: none;} 
a.plainlink:visited {color: #36454F; text-decoration: none;} 
a.plainlink:hover {color: #000000; text-decoration: none;}
a.plainlink:active {color: #36454F; text-decoration: none;}

.gradient-house a, .gradient-gold a, .lightest-bg a, .house-bg a {color: #ffffff; text-decoration: none !important;}

.toggledown { width: 38px !important; height: 38px !important; margin: 0 !important; padding: 0 !important; border: 0 none !important; text-align: center; text-decoration: none; background: transparent url('images/pointer-down.png') center top no-repeat; cursor: pointer;}
.toggleup { width: 38px !important; height: 38px !important; margin: 0 !important; padding: 0 !important; border: 0 none !important; text-align: center; text-decoration: none; background: transparent url('images/pointer-up.png') center top no-repeat; cursor: pointer;}

.showmore { height: 26px !important; margin: 0 !important; font-size: 0.9em; padding: 8px 0 0 32px; border: 0 none !important; text-align: left; text-decoration: none !important; overflow: hidden; background: transparent url('images/pointer-down-header.png') left top no-repeat; cursor: pointer;}
.showless { height: 26px !important; margin: 0 !important; font-size: 0.9em; padding: 8px 0 0 32px; border: 0 none !important; text-align: left; text-decoration: none !important; overflow: hidden; background: transparent url('images/pointer-up-header.png') left top no-repeat; cursor: pointer;}
.showmore:hover, .showless:hover { background-position: left -32px;}

.tooltip {position:relative; cursor: help;} 
.tip
	{ 
		display: none;
		position: absolute;
		bottom: 12%;
		left: 12%; 
		z-index:99;
		width: 85%;
		min-height: 50%;
		padding: 2%;
		background: #DBE5E5;
		background: linear-gradient(to bottom, #DEDEE6 0%, #ffffff 50%, #DEDEE6 100%);
		border: 1px solid #36454F;
		border-radius: 4px;
		font-size: 0.9em;
	}
.tip h4 { text-align: center; }

.closetip { width: 40px; height: 40px; float: right; background: url('images/close_bg.png') center center no-repeat; }
.closetip:hover { background-position: 1px 1px; }

.cal_button {width: 40px; height: 22px; background: transparent url('images/cal.png') center center no-repeat; border: 0 none; margin: 1px;}
.cal_button:hover {background: transparent url('images/cal_on.png') center center no-repeat; cursor: pointer;}

.delivery_costs {}

.shippingzone { margin: 15px 0; border: 1px #808080 dashed; background: #f5f5f5; border-radius: 5px; }
.selectedshippingzone { margin: 15px 0; border: 1px #36454F solid; background: #E2F3F8; border-radius: 5px; }
.selectedshippingzone h5 { color: #36454F; }
.selectedshippingzone strong { color: #36454F; }

.headerorderprint {width: 100%; color: #000000; background: #ffffff; border-bottom: 1px dashed #000000; padding: 0; margin: 0 0 15px 0;}
.headerorderprint table {color: #000000; background: #ffffff; margin: 0;}

.floatedbox-brands {float: left; width: 100%; height: 125px; margin: 2px 0; color: #76899a; text-align: center; overflow: hidden;}
.floatedbox-brands img ,#brands_slider img, .brandimg { border: 2px solid #DEDFE1; border-radius: 5px;}

.brands-slider-wrapper { clear: both; width: 100%; margin: 0; padding: 0; background: #ffffff; }
#brands-slider { width: 100%; margin: 0 auto; padding: 0; background: #eeeeee; }

#brands_slider { width: 98%; height: 66px; margin: 0; padding: 5px 2% 5px 0; overflow: hidden; }
#brands_slider .floatedbox-brands { height: 64px; margin: 0; padding: 0; }
#brands-slider #brands_slider img { height: 60px; width: 106px; }

.owl-item{ float: left; }

/* Cookies Warning Styles */

#cookiesWarning {
	z-index: 999999;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 0;
	margin: 0;
	background: #9A9A9A;
	box-shadow: 0px -5px 6px -0 rgba(66,66,66,0.5);
	font-size: 1em;
}

#cookiesWarningActive {
	color: #ffffff;
	background: transparent;
	margin: 0 auto;
	padding: 5px;
	border: none;
	max-width: 1250px;
	font-weight: 200;
	text-align: left;
}

#cookiesWarningActiveNotTicked {
	color: #ffffff;
	background: #ee0000;
	margin: 5px 0;
	padding: 5px;
	border: none;
	font-weight: 200;
	text-align: left;
}

#readMoreURL {
	width: 30%;
	float: right;
	font-weight: 200;
	text-align: right;
}

#cookiesText {
	font-size: 0.8em;
	width: 65%;
	float: left;
	text-align: left;
}

#cookiesText h5 {
	color: #ffffff;
	margin: 0;
	padding: 3px 0;
	font-weight: 600;
	font-size: 1.1em;
}


#acceptWarning {
}

#cookiesDisabled {
}

.cookiesAcceptance {
	padding: 5px;
}

#cookieForm {
	clear: both;
	padding: 5px 0;
	text-align: right;
}

#agreed {
	font-size: 1.1em;
	padding: 5px;
}

#cookieForm label {
	margin: 0 9px;
}
 

/* / Cookies Warning Styles */


/* Responsive Web Design Styles */

/* mobile styles */

.notsmallscreen {display: none;}
.mediumscreen {display: none;}
.largescreen {display: none;}

.displayinline {display: inline;}

iframe {border: 0 none; margin: 0; padding: 0; overflow: auto;}

.panel-box-rwd  {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 0;
	height: 0;
}

.rwd-first-div {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#twitter-feed {padding-bottom: 100%;}

.videowrapper {
	position: relative;
	padding-bottom: 56.25%; 	/* 16:9 */
	padding-top: 0;
	height: 0;
}
.modal-tiny-iframe-wrapper {
	position: relative;
	padding-bottom: 133%; 		/* 4:3 */
	padding-top: 0;
	height: 0;
}
.gallerywrapper {
	position: relative;
	padding-bottom: 125%; 		/* 5:4 */
	padding-top: 0;
	height: 0;
}
.productbox {
	position: relative;
	padding-bottom: 112.5%;		/* 5:4 */
	padding-top: 0;
	height: 0;
}
.categorybox, .square-wrapper-rwd {
	position: relative;
	padding-bottom: 100%; 		/* 1:1 */
	padding-top: 0;
	height: 0;
}
.twothirds-wrapper-rwd, .image-rwd {
	position: relative;
	padding-bottom: 66.66%;		/* 3:2 */
	padding-top: 0;
	height: 0;
}
.half-wrapper-rwd {
	position: relative;
	padding-bottom: 50%; 		/* 2:1 */
	padding-top: 0;
	height: 0;
}
.onethird-wrapper-rwd {
	position: relative;
	padding-bottom: 33.33%; 	/* 1:3 */
	padding-top: 0;
	height: 0;
}

.videowrapper iframe,
.image-rwd div,
.gallerywrapper iframe,
.modal-tiny-iframe-wrapper iframe,
.square-wrapper-rwd iframe,
.square-wrapper-rwd  > div:first-of-type,
.square-wrapper-rwd  iframe,
.twothirds-wrapper-rwd  > div:first-of-type,
.half-wrapper-rwd  > div:first-of-type,
.onethird-wrapper-rwd > div:first-of-type
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.max-rwd-outer {
	margin: 0 auto;
	max-width: 630px;
}

.portrait-rwd {
	position: relative;
	padding-bottom: 133%;		/* 3:4 */
	padding-top: 0;
	height: 0;
	overflow: auto !important;
	-webkit-overflow-scrolling: touch !important;
}

.portrait-rwd iframe
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: scroll;
}

.heading-pane {
	text-align: left;
	margin: 0 !important;
	padding: 6px;
	font-size: 1em;
	font-weight: normal;
}

.heading-pane a {
	color: #606060 !important;
	text-decoration: none !important;
	display: block;
}

/* tinybox modal */

.pane-modal { background: #ffffff; min-height: 550px; }

.tcontent { width: 100%; min-width: 340px; }  /* modal content wrapper */
.tbox { position: absolute; display: none; padding: 14px 17px; z-index:900; border-radius: 9px; }
.tinner { padding: 0; border-radius: 5px; background: rgba(255,255,255,0.85) url('images/preload.gif') no-repeat 50% 50%; }

.tmask { position: absolute; display: none; top: 0px; left: 0px; height: 100%; width: 100%; background: #000000; z-index:800; }

.tclose { position: absolute; top: 0; left: 0; width: 30px; height: 30px; cursor:pointer; background: url(images/close.png) no-repeat; }
.tclose:hover { background-position: 0 -30px}

#error { background:#ff6969; color:#fff; text-shadow:1px 1px #cf5454; border-right: 1px solid #000; border-bottom: 1px solid #000; padding:0; }
#error .tcontent { padding: 10px 14px 11px; border: 1px solid #ffb8b8; border-radius: 5px; }
#success { background: #2ea125; color: #ffffff; text-shadow: 1px 1px #1b6116; border-right: 1px solid #000; border-bottom: 1px solid #000; padding: 10px; border-radius: 0; }
#tmask { background: #333333; }
#frameless { padding: 0; }
#frameless .tclose { left: 6px; }

/* /tinybox modal */

.imagecontainh { position: relative; }
.imagecontainh img { max-width: 100%; }

.imagecontainv { position: relative; }
.imagecontainv img { max-height: 100%; }

.pdf-over { position: absolute; z-index: 10; top: 3px; right: 3px; width: 38px; height: 38px; background: url('images/pdf_38.png') center center no-repeat; }

.box { width: 90%; margin: 9px auto; }

.categorybox, .productbox { position: relative; border-radius: 3px; text-align: center; overflow: hidden; border: 1px solid #E6E6E6; }

.categorybox .heading-pane,
.productbox .heading-pane {
	height: 48px;
	padding-bottom: 0;
	border-radius: 3px 3px 0px 0px;
	overflow: hidden;
}

.clickable:hover .heading-pane a {
	color: #36454F !important;
}

.categorybox .videowrapper, 
.productbox .videowrapper {
	background: #000000;
	box-shadow: 0px 0px 1px 1px rgba(99,99,99,0.5);
}

.categorybox p,
.productbox p {
	text-shadow: 0px 0px 15px #ffffff;
}

.categorybox ul,
.productbox ul {
	margin: 5px !important; list-style-type: square; text-align: left !important;
}

.categorybox ul>li,
.productbox ul>li {
	padding: 5px !important; font-size: 0.95em;
}

.categorybox img { border-radius: 9px; }
.productbox img { border-radius: 9px; }

.button_productbox {
	font-size: 0.8em;
	font-weight: normal;
	color: #ffffff !important;
	text-decoration: none !important;
	background: #878787;
	padding: 3px 6px;
	margin: 0 auto;
	border-radius: 3px;
}

.button_productbox:hover {
	background: #36454F;
}

.button_productbox_feature {
	font-size: 0.9em;
	font-weight: normal;
	color: #ffffff !important;
	text-decoration: none !important;
	background: #878787;
	padding: 3px 0;
	margin: 0;
	display: inline-block;
	width: 100%;
	border-radius: 0 0 3px 3px;
}

.button_productbox_feature:hover {
	background: #36454F;
}

.button-pane { position: absolute; bottom: 6px; left: 0; width: 100%; padding: 0; margin: 0; text-align: center; }

.featurebox .button-pane { bottom: 0;}

.button-pane p { color: #333333; background: rgba(255,255,255,0.5); margin: 5px 5%; padding: 2px; border-radius: 3px; }

.accordion-control-filter {
	font-size: 0.9em;
	color: #ffffff !important;
	text-decoration: none !important;
	background: #999999;
	padding: 3px 0;
	margin: 0;
	display: inline-block;
	width: 100%;
	border-radius: 0 0 3px 3px;
}

.accordion-control-filter a {
	color: #ffffff;
	text-decoration: none;
	display: inline-block;
	text-align: center;
	padding: 6px auto;
	float: left;
	width: 50%;
	box-sizing: border-box;
}
	
#sidebar2 {clear: left;}

.side-bar-share { min-height: 36px; display: block; text-align: center; }

.column-content, .column-side-bar { width: 100%; margin: 0; padding: 5px 0; }

.column-20, .column-25, .column-30, .column-33, .column-40, .column-45, .column-50, .column-60, .column-66, .column-75, .column-80, .column-checkout { width: 100%; margin: 0; padding: 0; }

.column-checkout { margin-bottom: 5px !important; }
.column-checkout h2 { margin: 0 !important; padding: 0 !important; }
.column-checkout input[type="text"], .column-checkout select { width: 96% !important; padding: 5px 1%; font-size: 1.2em; }

.checkout-wide { width: 100%; margin: 0; padding: 0; }

.deliverylocationselect { padding: 5px 1%; font-size: 1.2em; }

.formfield { clear: both; margin: 10px 0; }

.formlabel-product { width: 40%; float: left; margin: 0 5px 0 0; font-weight: bold; }
.formlabel-order { width: 100px; float: left; padding: 5px 0; margin: 0 5px 0 0; font-weight: bold; }

.formlabel, 
.formlabel30, 
.formlabel50, 
.formlabel60, 
.formlabel75, 
.formlabelwide, 
.rightformlabel 
{ width: 100%; float: left; margin: 0; }

.verificationcode { max-width: 20%; margin-left: 3px; }

.container { clear: both; width: 100%; position: relative;}

/* button panel */

.button-panel-wrapper { clear: both; width: 100%; background: #ffffff; }

#button-panel, #button-panel-home {
    color: #ffffff; background: transparent;
}

#button-panel>ul, #button-panel-home>ul {
	display: table; width: 100% !important; padding: 0; margin: 5px 0; border: 0 none; list-style-type: none; font-size: 0.9em;
}
#button-panel>ul>li, #button-panel-home>ul>li {
    display: table-cell; float: left; padding: 0; margin: 0; border: 0 none; list-style-type: none; text-align: center; box-sizing: border-box;
}

#button-panel>ul>li a, #button-panel-home>ul>li a { color: #ffffff; text-decoration: none; display: block; padding: 6px 0 6px 50px; }
#button-panel>ul>li a:hover, #button-panel-home>ul>li a:hover { color: #36454F; text-decoration: none; }

li.click-and-collect { height: 48px; background: url('../images/click-and-collect_48.png') left top no-repeat; width: 31%; }
li.cycle-to-work { height: 48px; background: url('../images/cycle-to-work_48.png') left top no-repeat; width: 23%; }
li.finance { height: 48px; background: url('../images/zero-percent_48.png') left top no-repeat; width: 23%; }
li.stores { height: 48px; background: url('../images/stores_48.png') left top no-repeat; width: 23%; }

#button-panel .mhide {display: none;}

#button-panel-home li.click-and-collect, #button-panel-home li.cycle-to-work, #button-panel-home li.finance, #button-panel-home li.stores { width: 100%; }

/* /button panel */

/* member menu panel */

.member-menu-wrapper { clear: both; width: 100%; background: #ffffff; }

#member-menu-panel { color: #333333; background: #E6E6E6; }

#member-menu { background: transparent; }

#membermenu { font-size: 0.9em;}
#membermenu ul {margin: 0 5px; padding: 0; list-style: none;}
#membermenu li {float: left; margin: 3px 0; padding: 0;}

#membermenu ul li ul {float: none; display: block;}
#membermenu ul li:hover ul {display: block;}

#membermenu li span {display: block; padding: 5px; font-weight: bold;}

#membermenu li a {color: #000000; background: #c5c5c5; text-decoration: none; padding: 6px; margin: 0 4px; border-radius: 3px; display: block;}
#membermenu li a:hover {color: #ffffff; background: #878787;}

/* /member menu panel */

/* admin menu panel */

.admin-menu-wrapper { clear: both; width: 100%; background: #ffffff; }

#admin-menu-panel { color: #333333; background: #f1e566; background: radial-gradient(ellipse at center, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); }

#admin-menu { background: transparent; }

#adminmenu { font-size: 0.9em;}
#adminmenu ul {margin: 0 5px; padding: 0; list-style: none;}
#adminmenu li {float: left; margin: 3px 0; padding: 0;}

#adminmenu ul li ul {float: none; display: block;}
#adminmenu ul li:hover ul {display: block;}

#adminmenu li span {display: block; padding: 5px; font-weight: bold;}

#adminmenu li a {color: #000000; background: #c5c5c5; text-decoration: none; padding: 6px; margin: 0 4px; border-radius: 3px; display: block;}
#adminmenu li a:hover {color: #ffffff; background: #878787;}

/* /admin menu panel */

#adminhome li a {color: #000000; background: #c5c5c5; text-decoration: none; padding: 6px; margin: 0 4px; border-radius: 3px; display: block;}
#adminhome li a:hover {color: #ffffff; background: #878787;}

.shaded-admin {border: 2.5px #db8300 solid; color: #36454F; background: #f1e566; background: radial-gradient(ellipse at center, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); border-radius: 3px;}
.shaded-admin ul {display: table; width: 100%;}
.shaded-admin li {display: table-cell; float: left; padding: 5px;}

.ordercontainer { width: 90%; margin: 9px auto; padding: 5px; background: #E6E6E6; border: 1px solid #cccccc; border-radius: 3px; }

.product-allocate ul>li {
    display: block;
    height: 32px;
    line-height: 32px;
    margin: 0 !important;
}
.product-allocate ul>li a {display: inline-block; vertical-align: middle; }
.product-allocate ul>li img {display: inline-block; vertical-align: middle; }

.remove-item { margin: 6px 0 0 0; padding: 0 5px; height: 28px; width: 28px; background: url('images/sprite-cross-plus-minus.png') 0 0 no-repeat; display: inline-block; cursor: pointer; }
.remove-item:hover { background-position: 0 -52px; }

.productstatus {position: absolute; z-index: 10; right: -40px; top: 13px; width: 40px; height: 20px; background: url('../catalog/icons/traffic_light_sprite.png') left top no-repeat; cursor: pointer;}
.status_hidden {background-position: left -20px;}

.admin-flag-saving {position: absolute; z-index: 1; left: 1px; top: 5%; width: 3px; height: 85%; background: #ee0000;}
.admin-flag-promo {position: absolute; z-index: 1; left: 1px; top: 5%; width: 3px; height: 85%; background: #878787;}
.admin-flag-default {position: absolute; z-index: 1; left: 1px; top: 5%; width: 3px; height: 85%; background: #808080;}

#productstatusmessage { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9999; }
#productstatusmessagecontents { position: relative; max-width: 1200px; margin: 5px auto 25px auto; padding: 10px; border: 2.5px #db8300 solid; color: #36454F; background: #f1e566; background: radial-gradient(ellipse at center, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); cursor: pointer; }

#productremovemessage { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9999; }
#productremovemessagecontents { position: relative; max-width: 1200px; margin: 5px auto 25px auto; padding: 10px; border: 2.5px #db8300 solid; color: #36454F; background: #f1e566; background: radial-gradient(ellipse at center, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); cursor: pointer; }

#option_choices_selector { min-height: 16px; }

.ajax_loading_inner { height: 16px; width: 16px; background: transparent url('../images/small-ajax-spinner.gif') top left no-repeat; }

/* trade menu panel */

.trade-menu-wrapper { clear: both; width: 100%; background: #ffffff; }

#trade-menu-panel { color: #333333; background: #abbd73; background: radial-gradient(ellipse at center,  #e4efc0 0%,#abbd73 100%); }

#trade-menu { background: transparent; }

#trademenu { font-size: 0.9em;}
#trademenu ul {margin: 0 5px; padding: 0; list-style: none;}
#trademenu li {float: left; margin: 3px 0; padding: 0;}

#trademenu ul li ul {float: none; display: block;}
#trademenu ul li:hover ul {display: block;}

#trademenu li span {display: block; padding: 5px; font-weight: bold;}

#trademenu li a {color: #000000; background: #abbd73; text-decoration: none; padding: 6px; margin: 0 4px; border-radius: 3px; display: block;}
#trademenu li a:hover {color: #ffffff; background: #878787;}

/* /trade menu panel */

#tradehome li a {color: #000000; background: #abbd73; text-decoration: none; padding: 6px; margin: 0 4px; border-radius: 3px; display: block;}
#tradehome li a:hover {color: #ffffff; background: #878787;}

.shaded-trade {border: 2.5px #db8300 solid; color: #36454F; background: #abbd73; background: radial-gradient(ellipse at center,  #e4efc0 0%,#abbd73 100%); border-radius: 3px;}
.shaded-trade ul {display: table; width: 100%;}
.shaded-trade li {display: table-cell; float: left; padding: 5px;}

.phone {font-weight: bold; color: #ffffff; text-decoration: none !important;}

.main-wrapper { clear: both; padding: 0; }

.main-wrapper .container { min-height: 300px; background: #ffffff; }

.quicklinks-wrapper { clear: both; width: 100%; }

.quicklinks-wrapper .container { padding: 0; font-size: 0.85em; background: #E4ECEC; border-top: 5px solid #D8D8D8; }

.quicklinks-wrapper a { text-decoration: none; color: #000000; }
.quicklinks-wrapper a:hover { text-decoration: underline; }

.quicklinks-wrapper h5 { margin: 9px; text-align: left; color: #A6A6A6; }

#quicklinks-payments { }
.paymentlogos { text-align: center; margin: 15px auto; }

#quicklinks-suppliers { }
#quicklinks-suppliers ul { margin: 0 9px; padding: 0; list-style-type: none; }
#quicklinks-suppliers ul li { margin: 0; padding: 6px 1% 6px 0; width: 48%; box-sizing: border-box; float: left; }

#quicklinks-information { }
#quicklinks-information ul { margin: 0 9px; padding: 0; list-style-type: none; }
#quicklinks-information ul li { margin: 0; padding: 6px 1% 6px 0; width: 100%; box-sizing: border-box; float: left; }

#quicklinks-services { }
#quicklinks-services ul { margin: 0 9px; padding: 0; list-style-type: none; }
#quicklinks-services ul li { margin: 0; padding: 6px 1% 6px 0; width: 100%; box-sizing: border-box; float: left; }

#quicklinks-contact { }
#quicklinks-contact ul { margin: 0 9px; padding: 0; list-style-type: none; }
#quicklinks-contact ul li { margin: 0; padding: 6px 1% 6px 0; width: 100%; box-sizing: border-box; float: left; }

#quicklinks-social { }
#quicklinks-social ul { margin: 0 9px; padding: 0; list-style-type: none; }
#quicklinks-social ul li { margin: 0; padding: 6px 1% 6px 0; width: 100%; box-sizing: border-box; float: left; }

.footer-wrapper { clear: both; width: 100%; background: #E6E6E6; border-top: 5px solid #D8D8D8; }

.footer-wrapper .container { padding: 9px 0; font-size: 0.85em; color: #000000; }

.footer-wrapper a { text-decoration: none; color: #000000; }
.footer-wrapper a:hover { text-decoration: underline; }

.footer-wrapper h5 { margin: 9px; text-align: left; color: #36454F; }

#footer-contact p { text-indent: -15px; margin: 9px 9px 9px 38px; padding: 0; }

#footer-information ul { margin: 0 9px; padding: 0; list-style-type: none; }
#footer-information ul li { margin: 0; padding: 6px 1% 6px 0; width: 48%; float: left; }

.webmaster-wrapper { clear: both;  width: 100%; color: #ffffff; background: #9b9b9b; margin: 0; padding: 9px 0; border-top: 5px solid #A6A6A6; }
.webmaster-wrapper a { color: #ffffff !important;}

.webmaster-wrapper ul { padding: 0; margin: 0; list-style-type: none; font-size: 0.85em; }
.webmaster-wrapper ul li { width: 100%; padding: 5px 0; text-align: center; }

.viewcounter {color: #333333; font-size: 0.6em;}

hr {
    height: 1px;
    background: #D8D8D8;
    width: 100%;
    overflow: hidden;
    border: 0 none;
    margin: 5px 0;
    font-size: 1px; /* IE 6 */
}

.mobile-hr {clear: both; border-bottom: 1px solid #36454F; width: 90%; margin: 5px 5%;}
.mobile-hr-black {clear: both; border-bottom: 5px solid #000000; width: 100%; margin: 5px 0;}

.framecontainer { position: relative; clear: both; width: 100%; height: 600px; margin: 0; padding: 0; background: #DBE5E5; background: url('images/loading.gif') no-repeat center center, linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%); box-shadow: 0px 3px 5px 0px rgba(66,66,66,0.5); }
.framecontainer iframe { width: 100%;  height: 100%; }

.mapcontainer { position: relative; clear: both; width: 100%; height: 300px; margin: 0; padding: 0; background: #DBE5E5; background: url('images/loading.gif') no-repeat center center, linear-gradient(to bottom, #DBE5E5 0%, #ffffff 50%, #DBE5E5 100%); box-shadow: 0px 3px 5px 0px rgba(66,66,66,0.5); }
.mapcontainer iframe { width: 100%;  height: 100%; }

.page-scroll-reserve {position: absolute; z-index: 10; top: 15%; right: 1%; height: 55%; width: 7%; background: rgba(0,0,0,0.1); border-radius: 9px;}

.directionscontainer { position: absolute; z-index: 20; bottom: 0; left: 0; width: 80%; margin: 0 10% 50px 10%; padding: 0; text-align: center; }
.directionspanel { display: inline-block; margin: 0 auto; padding: 9px; background: rgba(255,255,255,0.5); border-radius: 9px; }
.directionspanel .button { margin-left: 3px; margin-right: 3px; }

.newmapwindow { position: absolute; bottom: 0; left: 0; z-index: 20; width: 80%; margin: 0 10% 5px 10%; padding: 0; text-align: center;}

.ui-resizable-helper { position: absolute; bottom: 0; left: 0; z-index: 20; margin-bottom: -25px; height: 50px; width: 100%; background: url('images/resize-v.png') center center no-repeat; display:none; }

@media all and (min-width: 375px ){

	.floatedbox-brands { width: 164px; margin: 2px; }

}

@media all and (min-width: 559px ){

	.branding {	font-size: 1.9em; }

	#adminhome li {width: 50%; float: left;}
	#tradehome li {width: 50%; float: left;}

	.smallscreen {display: none;}
	.notsmallscreen {display: inline;}
	.notmediumscreen {display: none;}
	.mediumscreen {display: inline;}

	.branding {	font-size: 2em; }

	#header-image { height: 250px; }

	.cyclecontainer {height: 250px;}

	.slidecontent-wrapper { text-align: left; }

	#button-panel>ul>li, #button-panel-home>ul>li { width: 50%; }
	#button-panel-home li.click-and-collect, #button-panel-home li.cycle-to-work, #button-panel-home li.finance, #button-panel-home li.stores { width: 50%; }
	#button-panel .mhide {display: inline;}

	.prevnext { clear: none; } 

	#twitter-feed  {padding-bottom: 120%;}

	.column-20 {width: 50%;}
	.column-25 {width: 50%;}
	.column-30 {width: 50%;}
	.column-33 {width: 50%;}
	.column-45 {width: 45%;}
	.column-66 {width: 50%;}

	.column-side-bar .column-50 { width: 50%; }

	.floatright {float: right;}
	.floatleft {float: left;}

	.basket_product {width: 60%; float: left;}
	.basket_details {width: 40%; float: left;}

	#catmap>ul { column-count: 2; }

	#site-map>ul { column-count: 2; }

	.enquiryform {width: 98%; padding: 1%;}

	.speclines div.specline { float: left; width: 48%;}
	.speclines div.specline:nth-child(odd) { background: rgba(233,241,241,0.8); }

	input[type="text"], input[type="email"], input[type="url"], input[type="number"], input[type="tel"], input[type="password"], .dateinput { width: auto; max-width: 98%; }

	.formlabel {width: 30%; float: left; margin: 0 10px 0 0;}
	.formlabel30 {width: 30%; float: left; margin: 0 10px 0 0;}
	.formlabel50 {width: 50%; float: left; margin: 0 10px 0 0;}
	.formlabel60 {width: 60%; float: left; margin: 0 10px 0 0;}
	.formlabel75 {width: 75%; float: left; margin: 0 10px 0 0;}
	.formlabelwide {width: 90%; float: left; margin: 0 10px 0 0;}
	.rightformlabel {width: 35%; float: left; font-weight: bold; margin: 0 5px 0 5px; text-align: right;}

	.tcontent { width: auto; height: auto; }
/*	.tinner { padding: 15px; border-radius: 5px; background: #fff url(images/preload.gif) no-repeat 50% 50%; border-right: 1px solid #333; border-bottom: 1px solid #333; } */
	.tclose { top: 0; right: 0; }
	.modal-tiny-iframe-wrapper {
		padding-bottom: 80%;
		width: 500px;
	}

/* add more styles for mid-sized viewports here... */
}

@media all and (min-width: 800px){

	span.notmediumscreen {display: inline;}
	p.notmediumscreen  {display: block;}
	.largescreen {display: inline;}

	.branding {	font-size: 2.1em; }

	#header-image { height: 250px; }

	.slidetitle { color: #ffffff; font-size: 1.3em; font-weight: 200; }
	.slidebutton { margin: 5px 0; font-size: 1.2em; text-decoration: none; }

	.cyclecontainer { height: 300px; }
	.cyclebuttons { display: block; }

	.mapcontainer { width: 100%; height: 350px; }
	.directionscontainer { margin-bottom: 35px; }
	.newmapwindow { display: none; }
	.ui-resizable-helper { display: block; }

	.mobile-hr-black {display: none;}
	.mobile-hr {display: none;}

	.column-content { width: 75% !important; }
	.column-side-bar { width: 25% !important; }

	.column-20 {width: 20%;}
	.column-25 {width: 25%;}
	.column-30 {width: 30%;}
	.column-33 {width: 33.33%;}
	.column-40 {width: 40%;}
	.column-45 {width: 45%;}
	.column-50 {width: 50%;}
	.column-60 {width: 60%;}
	.column-66 {width: 66.66%;}
	.column-75 {width: 75%;}
	.column-80 {width: 80%;}

	.column-checkout { width: 49%; margin-right: 1%; }

	.checkout-wide { width: 99%;  margin-right: 1%; }

	.column-side-bar .column-50 { width: 100%; }

	#quicklinks-suppliers ul li { padding: 6px 1% 6px 0; width: 31%; float: left; }

	.webmaster-wrapper ul { margin: 0 10px 10px 10px; font-size: 0.85em; }
	.webmaster-wrapper ul li { display: inline; width: auto; text-align: left; margin-right: 15px; padding-right: 15px; border-right: 1px solid #ffffff; }
	.webmaster-wrapper ul li:last-child { border-right: 0 none; }

	.modal-tiny-iframe-wrapper {
		padding-bottom: 70%;
		width: 700px;
	}

	.filtercontrol {display: inline;}
	.sortcontrol {display: inline;}

/* add more styles for larger viewports here... */

}

@media all and (min-width: 1000px){

	.branding {	font-size: 2.2em; }

	.container {max-width: 1280px; margin: 0 auto;}

	#button-panel>ul>li, #button-panel-home>ul>li { width: 25%; }
	#button-panel-home li.click-and-collect, #button-panel-home li.cycle-to-work, #button-panel-home li.finance, #button-panel-home li.stores { width: 25%; }

	#header-image { height: 300px; }


	.slidetitle { color: #ffffff; font-size: 1.5em; font-weight: 200; }
	.slidebutton { margin: 5px 0; font-size: 1.3em; text-decoration: none; }

	.cyclecontainer { height: 400px; }
	#homeslidernav { display: block; bottom: 60px; }

	.mapcontainer { width: 100%; height: 400px; }

	#quicklinks-suppliers ul li { padding: 6px 1% 6px 0; width: 23%; float: left; }

	.modal-tiny-iframe-wrapper {
		padding-bottom: 75%;
		width: 750px;
	}
	.productbox {
		padding-bottom: 125%;		/* 5:4 */
	}

	.categorybox {
		padding-bottom: 100%;		/* 1:1 */
	}

/* add more styles for largest viewports here... */

}

@media all and (min-width: 1282px){

	#header-image { height: 300px; }

	.branding {	font-size: 2.3em; }

	.cyclecontainer { height: 500px; }

	.main-wrapper .container { }

	.productbox {
		padding-bottom: 112.5%;		/* 9:8 */
	}

	.categorybox {
		padding-bottom: 100%;		/* 1:1 */
	}

/* add more styles for very, very large viewports here... */

}