/**

Add your custom styles here

EHM Green is #008C00
Colours:

Orange: E96402
R – 233, G- 100, B-2

Orange tint: E96402
R-253, G-243, B-235

Green: 008C00
R-0, G-140, B-0

Green tint: E3F2E3
R-227, G-242, B-227

**/


/** New Global CSS for new layouts **/

/*Global CSS*/
body, p, ul, ol, li, a, button, form, h1, h2, h3, h4, h5, h6{
	font-family: 'Roboto', sans-serif !important;
}
a:hover, a:active, {
	color: #E96402 !important;
	text-decoration: none !important;
}

/* set head to have 0 px margin on bottom */
.head {
	margin: 15px 0px 0px 0px;
}

body > div.wrapper.remodal-bg > div.main > div > main > header > div > div {
	margin-bottom:0px;
}

/* contact info - header */
div .col-9 .col .contact-title {
	padding-top: 8px;
	text-indent: -25px;
	color: #909090;
	font-weight: 500;
}

/*Amended CSS*/
.row {
	margin-bottom: 20px;
	max-width: 1200px;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Add space between mega menu and main page content */
div.row.top {
	margin-top:10px;
}

.container {
	width: 100% !important;
}

/** search results text bigger **/
small { font-size: 100%; }


/** Filter arrow fixes **/
.display .filter:after {
	left: 50px;
	right: auto;
}

/* Updated CSS for tel and email in header */
/* Overall */
.contact {
	font-size: 1.8em;
	text-align: left;
	color:grey;
	margin-top:2px;
	text-indent: -15px;
}
@media only screen and (max-width:1024px) {
	.contact {
		text-indent: -6px;
	}
}

.contact-text {
	font-size:0.9em;
}

/* Filter orrange arrow fixes */
.display .filter:after { left: 50px; right: auto;
}

/** Make black search arrow ranged right in header **/
.search select.select,
.search input[type="text"].select {
	background-color: #f2f2f2;
	padding: 0 0px;
padding-left: 20px;
}
/** end search header **/

/** style for arrow on PER PAGE **/
.display form .form-group .numeric {
	width: 60px;
	padding-right: 0px;
}
/** END style for arrow on PER PAGE **/

/** make Search Magnifying Glass bigger **/
.search .search-button {
	font: normal normal normal 20px/1 FontAwesome; right: 15px;
	top: 0;
	position: absolute;
	color: #008C00;
	border: none;
	background: none;
	margin: 0;
	padding: 0;
}
/** end Mag Glass **/

/** make search box grey outer line tad darker **/
form input[type="text"],
form input[type="password"],
form input[type="email"],
form select,
form textarea,
form button {
	border-radius: 0px;
	border: 1px solid #dadada;
	-webkit-border-radius: 0px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 35px;
	padding-left: 15px;
	padding-right: 15px;
}
/** end of search outer line **/


/** making responsive icon colours, text colour change and close button. default was #009f8e **/
.btn.btn-head {
	color: #008C00;
	display: inline-block;
	}
.md-device-menu.active ul li a {
	width: 100%;
	display: block;
	color: #008C00;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #f4f4f4;
	font-size: 1.2em;
	}

@media only screen and (max-width: 959px) {
.logo img {
	width: 50%;
	height: 50%
	}
.md-close {
	width: 30px;
	height: 30px;
	background: #008C00;
	color: white;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	float: right;
	border-color: transparent;
	font-size: 1.5em;
	padding: 0;
	line-height: 1;
	text-shadow: 1px 1px #007c6f;
	}

	.md-close:hover, .md-close:active, .md-close:focus {
	background: #ff0000;
	border-color: transparent; color: #ffffff;
	}

	.account-menu-nav, .filter-menu {
	display: none;
	}

	.account-menu-btn, .filter-menu-btn {
	width: 100%;
	}
}

/** end of responsive and close icon colours **/

.zbasket .icon {
	height: 40px;
	width: 40px;
	color: white;
	padding: 10px; padding-left: 8px;
	background-color: #ff6c00;
	float: center; font-size: 30px;
}


/* Account Invoice & Basket */

.prod-row {
	border-bottom: 1px solid #e5e5e5;
	padding: 8px 0;
}

.text-right {
	text-align: right;
}
.summary-order-details {
	display: inline;
}

.order-details {
	display: inline;
}

.display-mobile {
	display: none;
}

.totals {
	text-align: right;
}
.totalspdf {
	text-align: right;
}
.total-value-right-pad {
	text-align: right;
	padding-right: 50px;
}
.total-value-right {
	text-align: right;
}

@media only screen and (max-width: 767px) {
	.total-value-right-pad {text-align: left;}
	.total-value-right {text-align: left;}
}

@media (max-width: 767px) {
	.hide-mobile {
		display: none;
	}
}

@media only screen and (max-width: 767px) {
	.totals {
		width: 50% !important;
		}
	.totalspdf {
		width: 30% !important;
	}
	.totals.total-price {
		width: 30% !important;
	}
	.order-details {
		display: inline-block;
		width: 90px;
		margin-right: -4px;
	}
	.order-details input[type="text"] {
		display: inline-block;
		width: 80px;
	}
	.summary-order-details {
		display: inline-block;
		width: 125px;
		margin-right: -4px;
	}

	.summary-order-details input[type="text"] {
		display: inline-block;
		width: 80px;
	}
	.display-mobile {
		display: inline-block;
		width: 30px;
		margin-right: -4px;
		text-align: left;
	}
}

/** end of invoice styles **/

.promo-text-1 {
	padding-top:7px;
	font: 13px Verdana;
	letter-spacing: 0.5px;
	color: #ffffff;
	text-align: center;
	font-weight: bold;
}

.promo-text-2 {
	padding-top:15px;
	font: 13px Verdana;
	color: #313140;
	text-align: center;
}

.promo-text-3 {
	color: #ffffff;
	font-weight: normal;
	text-transform: uppercase;
	padding-top:7px;
	letter-spacing:2px;
	font-size: 14px;
	text-align:center;
}

.promo-img {
	padding-top:15px;
	padding-bottom:5px;
}

.slider-button-promo {
	background: #008C00;
	color: #ffffff;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #008C00;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 18px;
	cursor:help;
}

.slider-button-promo:visited{
	color: white;
}

.slider-button-promo:hover {
	background: #E96402;
	color: #ffffff;
}
.slider-button-promo:active {
	color: white;
}

/** Mega Menu Start **/

/** Main Nav **/

@media (max-width: 1199px) {
	nav .row ul {
		text-align: center;
	}

	nav .row ul li a, nav .row ul li:visited {
		padding-left: 10px;
		padding-right: 10px;
		font-size: 0.85em;
	}
}

/**
 * EasyZoom and thumbnails styles
 */


.easyzoom {
	position: relative;

	/* 'Shrink-wrap' the element */
	display: inline-block;
	*display: inline;
	*zoom: 1;
	 width: 300px;
	 height: 300px;
}
.easyzoom img {
	vertical-align: bottom;
}
.easyzoom.is-loading img {
	cursor: progress;
}
.easyzoom.is-ready img {
	cursor: zoom-in;
}
.easyzoom.is-error	img {
	cursor: not-allowed;
}
	.easyzoom-flyout {
	position:absolute;
	z-index: 100;
	overflow: hidden;
	background: #FFF;
	border: 1px solid #008C00;
}

@media (min-width: 959px) {
	.easyzoom--adjacent .easyzoom-flyout {
		top: 0;
		left: 100%;
		width: 500px!important;
		height: 500px!important;
		margin-left: 20px;
	}
}

@media (max-width: 959px) {
	.easyzoom--overlay .easyzoom-flyout {
		top: 0;
		left: 0;
		width: 120%;
		height: 120%;
	}
}

.thumbnails{
	margin-top: 20px;
	text-align: center;
}

.thumbnails-image {
	margin: 5px 5px;
	max-width: 40px;
	height: 40px;
}

 .thumbnails li {
	 display:inline-block;
	width: 55px;
	height: 55px;
	margin: 0 5px;
	border: 3px solid white;
}

 .thumbnails li:hover{
	border: 3px solid #ff6c00;
}

.wholesale-title-checkout {
	margin-top: 21px;
	font-size: 1.8em;
	text-align: left;
	font-weight:bold;
	color: #008C00;
}

.wholesale-title small {
	display: block;
	margin-top: 6px;
	font-size: 0.7em;
	font-weight: normal;
	color: #6e6e6e;
}

@media (max-width: 1199px) {
	.zwholesale-title {
	font-size: 1.2em;
	}
}

@media (max-width: 960px) {
	.wholesale-title {
	display: none;
	}
}
/** end of strapline in header **/


/* Filter orrange arrow fixes */
.display .filter:after { left: 50px; right: auto;
}

/** Make black search arrow ranged right in header **/
.search select.select,
.search input[type="text"].select {
	background-color: #f2f2f2;
	padding: 0 0px;
padding-left: 20px;
}
/** end search header **/

/** style for arrow on PER PAGE **/
.display form .form-group .numeric {
	width: 60px;
	padding-right: 0px;
}
/** END style for arrow on PER PAGE **/

/** make Search Magnifying Glass bigger **/
.search .search-button {
	font: normal normal normal 20px/1 FontAwesome; right: 15px;
	top: 0;
	position: absolute;
	color: #008C00;
	border: none;
	background: none;
	margin: 0;
	padding: 0;
}
/** end Mag Glass **/

/** make search box grey outer line tad darker **/
form input[type="text"],
form input[type="password"],
form input[type="email"],
form select,
form textarea,
form button {
	border-radius: 0px;
	border: 1px solid #dadada;
	-webkit-border-radius: 0px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 35px;
	padding-left: 15px;
	padding-right: 15px;
}
/** end of search outer line **/

/** nav bar **/



/** end Nav Bar **/

/** making responsive icon colours, text colour change and close button. default was #009f8e **/
.btn.btn-head {
	color: #008C00;
	display: inline-block;
	}
.md-device-menu.active ul li a {
	width: 100%;
	display: block;
	color: #008C00;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #f4f4f4;
	font-size: 1.2em;
	}

@media only screen and (max-width: 959px) {
.logo img {
	width: 50%;
	height: 50%
	}
.md-close {
	width: 30px;
	height: 30px;
	background: #008C00;
	color: white;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	float: right;
	border-color: transparent;
	font-size: 1.5em;
	padding: 0;
	line-height: 1;
	text-shadow: 1px 1px #007c6f;
	}

	.md-close:hover, .md-close:active, .md-close:focus {
	background: #ff0000;
	border-color: transparent; color: #ffffff;
	}

	.account-menu-nav, .filter-menu {
	display: none;
	}

	.account-menu-btn, .filter-menu-btn {
	width: 100%;
	}
}

/** end of responsive and close icon colours **/

.zbasket .icon {
	height: 40px;
	width: 40px;
	color: white;
	padding: 10px; padding-left: 8px;
	background-color: #ff6c00;
	float: center; font-size: 30px;
}


/* Account Invoice & Basket */

.prod-row {
	border-bottom: 1px solid #e5e5e5;
	padding: 8px 0;
}

.text-right {
	text-align: right;
}
.summary-order-details {
	display: inline;
}

.order-details {
	display: inline;
}

.display-mobile {
	display: none;
}

.totals {
	text-align: right;
}
.totalspdf {
	text-align: right;
}
.total-value-right-pad {
	text-align: right;
	padding-right: 50px
}
.total-value-right {
	text-align: right;
}

@media only screen and (max-width: 767px) {
	.total-value-right-pad {
		text-align: left;
	}
	.total-value-right {
		text-align: left;
	}
}

@media (max-width: 767px) {
	.hide-mobile {
		display: none;
	}
}

@media only screen and (max-width: 767px) {

	.totals {
		width: 50% !important;
	}
	.totalspdf {
		width: 30% !important;
	}
	.totals.total-price {
		width: 30% !important;
	}
	.order-details {
		display: inline-block;
		width: 90px;
		margin-right: -4px;
	}
	.order-details input[type="text"] {
		display: inline-block;
		width: 80px;
	}
	.summary-order-details {
		display: inline-block;
		width: 125px;
		margin-right: -4px;
	}
	.summary-order-details input[type="text"] {
		display: inline-block;
		width: 80px;
	}
	.display-mobile {
		display: inline-block;
		width: 30px;
		margin-right: -4px;
		text-align: left;
	}
}

/** end of invoice styles **/
.slider-button {
	background: #008C00;
	color: #ffffff;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #008C00;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

.slider-button:visited{
	color: #ffffff;
}

.slider-button:hover {
	color: #ffffff;
	text-decoration: underline;
}
.slider-button:active {
	color: #ffffff;
}

.primary {
	background: #008C00;
	color: white;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #008C00;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

.primary:visited {
	color: white;
}

.primary.disabled{
	background:gray ! important;
	border:gray ! important;
}

.primary:hover,
.primary:active {
	background: #E96402;
	border: 1px solid #E96402;
	color: white;
	text-decoration: none;
	-webkit-transition: background-color 0.2s linear 0.2s;
	-moz-transition: background-color 0.2s linear 0.2s;
	-ms-transition: background-color 0.2s linear 0.2s;
	-o-transition: background-color 0.2s linear 0.2s;
	transition: background-color 0.2s linear 0.2s;
}

.secondary {
	background: #E96402;
	color: white;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #E96402;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

.secondary:visited {
	color: white;
}

.secondary:hover,
.secondary:active {
	background: #008C00;
	border: 1px solid #008C00;
	color: white;
	text-decoration: none;
	-webkit-transition: background-color 0.2s linear 0.2s;
	-moz-transition: background-color 0.2s linear 0.2s;
	-ms-transition: background-color 0.2s linear 0.2s;
	-o-transition: background-color 0.2s linear 0.2s;
	transition: background-color 0.2s linear 0.2s;
}


a.primary-green {
	color: white;
}
.primary-green {
	background: #008C00;
	color: white;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #008C00;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

a.primary-green:visited {
	color: white;
}.primary-green:visited{
	color: white;
}

a.primary-green:hover {
	color: white;
}.primary-green:hover {
	color: white;
	background: #E96402;
	text-decoration: underline;
}
a.primary-green:active {
	color: white;
}.primary-green:active {
	color: white;
}

.primary-orange {
	background: #E96402;
	color: #ffffff;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #E96402;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

.primary-orange:visited{
	color: #ffffff;
}

.primary-orange:hover {
	background: #008C00;
	color: #ffffff;
	text-decoration: underline;
}
.primary-orange:active {
	color: #ffffff;
}


/* end of banner styles */

/** prev banner styles media mobile **/

@media (max-width: 767px) {

.banner .cycle-slideshow {
	background: url(/assets/file/slider-bg.jpg) no-repeat;
width: 100%; height: 420px;

}
.banner .cycle-slideshow .slide .txt .title {
	display: block;
	margin-bottom: 10px;
	font-size: 2.3em;
	line-height: 1.1em;
	margin-top: -30px;
}

.banner {
	overflow: hidden !important;
	}

	.banner .cycle-slideshow {
	background-repeat: repeat !important;
	height: 330px !important;
	}

	.banner .cycle-slideshow .slide .img {
	float: none !important;
	width: 100% !important;
	margin-top: 0 !important;
	text-align: center !important;
	}

	.banner .cycle-slideshow .slide .img img {
	width: 80% !important;
	}

}
@media (max-width: 959px) and (min-width: 768px) {
	.banner .cycle-slideshow .slide .img img {
	width: 100% !important;
	}
	.banner .cycle-slideshow .slide .img img {
	width: 100% !important;
	}
.banner .cycle-slideshow .slide .txt .title {

	text-transform: uppercase;
	display: block;
	margin-bottom: 10px;
	font-size: 2.4em;
	line-height: 1.1em;
	margin-top: 50px;
}
}

/** end of banner for mobile **/

/** Mega Menu Start **/

nav{
	background-color: #008C00;
}

.menu-item {
	width: 165px;
	word-wrap: break-word;
	padding: 0px;
	font-size: 15px;
	vertical-align: middle;
}

nav .row ul li:hover a,
nav .row ul li:active a {
	background-color: #008C00;
	color: white;
}

nav .row ul li .main-sub.active {
	height: auto; bg-color: #008C00;
	padding: 10px;
	border-left: 3px solid #008C00;
	border-right: 3px solid #008C00;
	border-bottom: 3px solid #008C00;
	border-top: 3px solid #008C00;
}
nav .row ul li a,
nav .row ul li:visited {
	padding: 15px 20px 15px 20px;
	color: white;
	display: block;
}

nav .row ul li .main-sub ul {
	width: 100%;
	margin: 0;
}


nav .row .col-16 .wrap {
	background: #008C00;
	/* Old browsers */
	background: -moz-linear-gradient(top, #008C00 0%, #008C00 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #009f8e), color-stop(100%, #006c60));
	/* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #008C00 0%, #008C00 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #008C00 0%, #008C00 100%);
	/* Opera 11.10+ 008C00
	background: -ms-linear-gradient(top, #008C00 0%, #008C00 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #008C00 0%, #008C00 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@colour1', endColorstr='darken(@colour2, 10%)', GradientType=0);
	/* IE6-9 */
	height: 50px;
}
/** Mega Menu **/

nav .row ul li .main-sub.active {
	padding-top: 0px !important;	 
}	

nav .row ul li .main-sub ul {
	width: 100%;			   
	margin: 0;	  
}

nav .row ul li .main-sub ul li {
	border-bottom: 1px dashed #E96402;
}

nav .row ul li .main-sub ul li.title {
	width: 100%;
	font-size: 1.1em;
	color: #005eb8;
}

nav .row ul li .main-sub ul li.title a {
	color: #E96402; 
}

nav .row ul li .main-sub ul li.title a:hover {
	color: #ff6c00;
}

nav .row ul li .main-sub ul li.sub {
	float: left;
 	width: 23%;
	margin-left: 0;
	margin-right: 2%;
	padding: 5px 0;
  border: none;
}

nav .row ul li .main-sub ul ul {
	padding: 5px 0;
}

@media (max-width: 1199px) {
	nav .row ul li .main-sub ul
		text-align: left;
		padding-top: 10px;
	}

	nav .row ul li .main-sub ul ul {
		text-align: left;
	}

	nav .row ul li .main-sub ul li.sub {
	float: none;
		display: inline-block;
		vertical-align: top;
	margin-left: 0;
	margin-right: -4px;
		padding: 1px 0;
  }
}



/** END Mega Menu **//** Mega Menu End **/


/* Feature Categories */
.title-box {
	height: 63px;


}

.title-box {
	height: 63px;

}


.feature-categories {
	border: 3px solid #008C00;
	height: 285px;
	background: #008C00;
}
.feature-categories ul li {
	margin: 0;
	padding: 0;
	height: 12.5%;
	font-weight: bold;
	text-transform: uppercase;
	border-bottom: 1px solid #008C00;
	line-height: 2.1em;
	background-color: #ffffff;
}

.feature-categories ul li.title {
	display: block;
	padding-top: 1px;
	background-color: #008C00;
	color: white;
	font-size: 1.1em;
	line-height: 1.8em;
}

.feature-categories ul li a {
	height: 100%;
	display: block;
	padding: 5px 15px;
	line-height: 1.8em;
	color: #666666;
}

.feature-categories ul li .sub.active {
	padding: 20px;
	border-top: 3px solid #008C00;
	border-right: 3px solid #008C00;
	border-bottom: 3px solid #008C00;
}

.feature-categories ul li:hover a,
.feature-categories ul liactive a {
	color: #008C00; !important;
}

.feature-categories ul li:hover .sub ul li a,
.feature-categories ul liactive .sub ul li a {
	color: #008C00 !important;
}


.basket {
	z-index: 999;
	float: right;
	height: 30px;
	background: #3d3c3f ;
	padding: 10px;
	margin-top: -10px;
	position: relative;
}

.basket .containing {
	display: inline-block;
	height: 20px;
	font-size: 0.9em;
	padding: 0px 5px 5px;
	float: right;
	margin: 0 0 0 10px;
}

.basket .basket-content {
	visibility: hidden;
	opacity: 0.0;
	position: absolute;
	top: 41px;
	right: -10px;
	width: auto;
	margin-right: 10px;
	padding: 20px 5px 15px;
	background: white;
	z-index: 999;
	height: auto;
	overflow: auto;
	border-bottom: 3px solid #ff6c00;
	-webkit-transition: visibility 0.0s linear 0.4s, opacity 0.2s linear 0.2s;
	-moz-transition: visibility 0.0s linear 0.4s, opacity 0.2s linear 0.2s;
	-ms-transition: visibility 0.0s linear 0.4s, opacity 0.2s linear 0.2s;
	-o-transition: visibility 0.0s linear 0.4s, opacity 0.2s linear 0.2s;
	transition: visibility 0.0s linear 0.4s, opacity 0.2s linear 0.2s;
}

.delete-item {
	background: #E96402;
	font-family: 'Ek Mukta', sans-serif;
	color: white;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #E96402;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
	margin-left:15px;
}

.delete-item:visited {
	color: white;
}

.delete-item:hover,
.delete-item:active {
	background: #008C00;
	border: 1px solid #008C00;
	color: white;
	-webkit-transition: background-color 0.2s linear 0.2s;
	-moz-transition: background-color 0.2s linear 0.2s;
	-ms-transition: background-color 0.2s linear 0.2s;
	-o-transition: background-color 0.2s linear 0.2s;
	transition: background-color 0.2s linear 0.2s;
}

.grid-title {
	display:inline-block;
	height: 60px;
}

.product .search-info .title {
	font-weight: bold;
	font-size: 1em;
	min-height: 25px;
	height: 25px;
}

.product .search-category {
	min-height: 110px;
	height: 110px;
}

category {
	min-height: 110px;
	height: 110px;
}

.search-category {
	text-align: center;
	padding: 0 !important;
	min-height: 155px;
	position: relative;
}


.search-category:hover,
.search-category:active {
	border-color: #008C00;
}
.search-category:hover .search-info,
.search-category:active .search-info {
	background: #008C00;
	color: white;
	min-height:49px;
	min-width:119px;
}

/** For accounts Menu **/
.side-categories ul li.title,
.side-filters ul li.title {
	display: block;
	padding: 5px 15px;
	border-bottom: 1px solid #E96402;
	border-left: 1px solid #E96402;
	border-right: 1px solid #E96402;
	background-color: #E96402;
	color: white;
	font-size: 1.2em;
	font-weight: bold;
}

.side-categories ul li:hover a,
.side-filters ul li:hover a,
.side-categories ul li:active a,
.side-filters ul li:active a {
	font-weight: bold;
	color: #008C00 !important;
}

.side-categories ul li {
	border-bottom: 1px solid #E96402;
}

.side-categories,
.side-filters {
	border-bottom: 1px solid #E96402;
	border-left: 1px solid #E96402;
	border-right: 1px solid #E96402;
	font-size: 0.9em;
	font-weight: bold;
	background-color: #f2f2f2;
}

.grid-view .product-wrap.alpha .col .block .price {
	font-size: 1.3em;
}

/*
	Style class used for a scrolling ticker
	Note background colour and text colour not defined
		as they will be defined in the tickertape snippet
*/

/* liScroll styles */
.tickeroverlay-left {
	background-image:url('left.png');
	display:block;
	pointer-events:none;
	position:absolute;
	z-index:30;
	width:150px;
	top:0;
	left:-2px;
}

.tickeroverlay-right {
	background-image:url('right.png');
	display:block;
	pointer-events:none;
	position:absolute;
	z-index:30;
	width:150px;
	top:0;
	right:-2px;
}

.tickercontainer { /* the outer div */
		 colour:#E96402;
	width: 100%;
	font: 24px Verdana;
	letter-spacing:2px;
	overflow: hidden;
	margin-bottom:0px;
}

.row .tickercontainer .mask {
	margin-bottom:0px;
	padding-bottom;0px;
}

.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
	position: relative;
	height: 34px;
	overflow: hidden;
	margin-bottom:0px;
	padding-bottom;0px;
}

ul.newsticker { /* that's your list */
	/*Transitions have been added in order set css3 transitions; and have linear easing. Changing these lines you might have unexpected results */
	-webkit-transition: all 0s linear;
	-moz-transition: all 0s linear;
	-o-transition: all 0s linear;
	transition: all 0s linear;
	position: relative;
	font: 24px Verdana;
	letter-spacing:2px;
	list-style-type: none;
}

ul.newsticker li {
	float: left; /* important: display inline gives incorrect results when you check for elem's width */
	font: 24px Verdana;
	letter-spacing:2px;
}


ul.newsticker a {
	white-space: nowrap;
	padding: 0px;
	font: 24px Verdana;
	letter-spacing:2px;
}

/*
04/10/2021 - removed CSS for 'old' kssor slider;
*/

.text-link {
/*	color:#E96402; */
	color:#ffffff;
	text-decoration: underline;
	font-weight: normal;
}

.text-link:visited {
	color:#ffffff;
	text-decoration: underline;
	font-weight: normal;
}

.text-link.disabled{
	background:gray ! important;
	border:gray ! important;
}

.text-link:hover,
.text-link:active {
	color:#313140;
	font-weight: normal;
	text-decoration: underline;
}

.category:hover, .category:active {
	border-color: #008C00 ;
}

.category:hover,
.category:active {
	border-color: #008C00;
}

.category:hover .info,
.category:active .info {
	background: #008C00;
	color: white;
}

/* Address Pagination Style */

.controls {
	display: flex;
	justify-content: center;
	margin: 20px 0 10px 0;
}

.paginator {
	display: flex;
	padding-left: 40px;
}

.address-values {
	margin: 0 0 0 0;
}

.postcode {
	margin-bottom: 10px;
}

.address {
	min-height: 220px;
}

.search-box {
	display: inline-flex;
	margin-left: 20px;
}

.paginator-btn {
	color: #fff;
	background-color: #E96402;
	border-color: #E96402;
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	border: 1px solid transparent;
	padding: .2rem .6rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .20rem;
	margin: 0 3px;
}
	
	.paginator-btn:hover {
	color: #fff;
	background-color: #008C00;
	border-color: #008C00;
	transition: background-color 0.2s linear 0.2s;
	}

.jplist-selected {
	background-color: #008C00;
	border-color: #008C00;
}

[data-jplist-control="pagination"] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	margin-bottom: 20px;
}

[data-type="info"] {
	font-family: 'Open Sans', sans-serif;
	font-size: 0.9em;
	color: #444;
	;
}

.postcode-clear-btn {
		line-height: 1.2;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;	 
	padding: .2rem .6rem;
	margin: 0 3px;
	max-height: 30px;
}
	
	.postcode-clear-btn:hover {
	color: #fff;
	background-color: #008C00;
	border-color: #008C00;
}
	
.address-type {	
	font-size: 20px;
		color: #1047aa;
}

.stock.alert {
 	position: static !important;
	padding: unset;
	font-size: 0.8em; !important;
}


/* Styles for product variants in a list */
/* Product List */

.shop-list .product-wrap {
	margin-bottom: 1px;
	border: 1px solid #cdcdcd;
}
.prod-break .break {
	font-size: 0.9em;
	text-transform: uppercase;
}


/* Comment out as not needed
.product-wrap:nth-of-type(even) {
	background-color: rgba(220,220,220, 0.4);
} 
*/

.product.full .product-info {
	padding: 5px 20px;
	font-size:0.8em;
}

.product.full .title {
	display: block;
	margin-top: 5px;
	padding-top: 0px;
}

.product.full .price-area {
	width: 230px;
	min-height: 53px;
	padding: 5px 5px;
}

.product-wrap:nth-of-type(even) .price-area {
	background-color: rgba(220, 220, 220, 0.1);
} 


.product.full .price-area .break-zone {
	display: inline-block;
	margin-top: 7px;
	margin-right: 0px;
	text-transform: none;
}

.product.full .price-area .block .price-wrap {
	float: right;
	margin-top: 4px;
	margin-right: 2px;
}

.product.full .price-area .block .price {
	float: none;
	font-size: 0.9em;
}

.product.full .price-area .block .quantity {
	width: 50px;
	padding-left: 5px;
	padding-right: 5px;
	font-size:0.9em;
}

.product.full .price-area .block .price.cross {
	margin-top: 14px;
	line-height: 1;
}

@media only screen and (max-width: 1199px) and (min-width: 960px) {
	.product.full .price-area {
	width: 278px;
	}

	.product.full .title {
	font-size: 0.8em;
	}

	.product.full .price-area .break-zone {
	margin-right: 10px;
	}

	.product.full .price-area .block .price-wrap {
	margin-top: 7px;
	margin-right: 10px;
	}
	
	.product.full .price-area .block .price {
	font-size: 1.4em;
	}

	.product.full .price-area .block .quantity {
	width: 50px;
	}
}

@media only screen and (max-width: 959px) and (min-width: 768px) {
	.product.full .title {
	font-size: 0.8em;
	}

	.product.full .price-area {
	width: 218px;
	}

	.product.full .price-area .block .price-wrap {
	float: none;
	}

	.product.full .price-area .block .quantity {
	width: 60px;
	margin-top: 25px;
	}
}

@media only screen and (max-width: 767px) {
	.shop-list .product-wrap {
	margin-bottom: 10px;
	}
	
	.product.full .price-area {
	width: 100%;
	}
	
	.product.full .product-info { 
	padding-left: 10px;
	padding-right: 10px;
	
	}

	.product.full .title {
	margin-top: 0;
	padding-top: 0;
	padding-left: 0;
	padding-bottom: 5px;
	}

	.product.full .price-area .block .price-wrap {
	float: none;
	}

	.product.full .price-area .block .quantity {
	margin-top: 25px;
	}
}

/* END Product List */

/* Grey Button Used for Link to Variants Modal */
.grey {
	background: #ccc;
	color: #313140;
	font-weight: normal;
	text-transform: uppercase;
	border: 1px solid #bbb;
	-webkit-transition: background-color 0.2s linear 0;
	-moz-transition: background-color 0.2s linear 0;
	-ms-transition: background-color 0.2s linear 0;
	-o-transition: background-color 0.2s linear 0;
	transition: background-color 0.2s linear 0;
	text-shadow: none;
	border-radius: 3px;
	padding: 7px 14px;
	display: inline-block;
	font-size: 12px;
}

.grey:visited {
	color: #313140;
}

.grey:hover,
.grey:active {
	background: #999;
	border: 1px solid #888;
	color: #313140;
	text-decoration: none;
	-webkit-transition: background-color 0.2s linear 0.2s;
	-moz-transition: background-color 0.2s linear 0.2s;
	-ms-transition: background-color 0.2s linear 0.2s;
	-o-transition: background-color 0.2s linear 0.2s;
	transition: background-color 0.2s linear 0.2s;
}

.grey.small {
	padding: 2px 7px;
	font-size: 10px;
}

/* Close button on Variant Modal */
.remodal-close {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 28px;
	height: 28px;

	-webkit-transition: background 0.2s ease-out;
	-moz-transition: background 0.2s ease-out;
	-o-transition: background 0.2s ease-out;
	transition: background 0.2s ease-out;
	text-decoration: none;

	-webkit-border-radius: 50%;
	border-radius: 50%;
		text-align:center;
}

.remodal-close:after {
	font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;
	font-size: 28px;
	line-height: 28px;

	display: block;

	content: "×";
	cursor: pointer;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	text-decoration: none;
	color: #3e5368;
}

.remodal-close:hover,
.remodal-close:active {
	background: #3e5368;
	text-decoration: none;
}

.remodal-close:hover.remodal-close:after,
.remodal-close:active.remodal-close:after {
	color: #f4f4f4;
}

/* for forms relating to user permissions */
input[type=checkbox] { 
	vertical-align: middle; 
	position: relative; 
	bottom: 1px; 
}

label { 
	display: block; 
} 

/*
04/10/2021 New CSS for EHM website refresh
*/


/** JSSOR slider styles **/
/*jssor slider loading skin double-tail-spin css*/
.jssorl-004-double-tail-spin img {
	animation-name: jssorl-004-double-tail-spin;
	animation-duration: 1.6s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

@keyframes jssorl-004-double-tail-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

/*jssor slider bullet skin 031 css*/
.jssorb031 {position:absolute;}
.jssorb031 .i {position:absolute;cursor:pointer;}
.jssorb031 .i .b {fill:#000;fill-opacity:0.5;stroke:#fff;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.3;}
.jssorb031 .i:hover .b {fill:#fff;fill-opacity:.7;stroke:#000;stroke-opacity:.5;}
.jssorb031 .iav .b {fill:#fff;stroke:#000;fill-opacity:1;}
.jssorb031 .i.idn {opacity:.3;}

/*jssor slider arrow skin 051 css*/
.jssora051 {display:block;position:absolute;cursor:pointer;}
.jssora051 .a {fill:none;stroke:#fff;stroke-width:360;stroke-miterlimit:10;}
.jssora051:hover {opacity:.8;}
.jssora051.jssora051dn {opacity:.5;}
.jssora051.jssora051ds {opacity:.3;pointer-events:none;}

.BSlide {
	height: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
.Slider-Wrapper{
	max-width: 960px;
		padding-top:20px;
	margin-left: auto !important;
	margin-right: auto !important;
}

.Slider-Wrapper p{
	margin: 0;
}
.Slide-Button {
	position: absolute;
	bottom: 30px;
	font-size: 12px;
	color: #fff; !important
	text-transform: uppercase;
	font-weight: 700;
	padding: 7px 15px;
	background-color: #FF662B;
	border-radius: 3px;
	transition: all .5s ease-in-out;
}
.Slide-Button:visited {
	color: #fff; !important
}
.Slide-Button:hover {
	background-color: #000;
	color: #FF662B;
}
.Slide-Text-One{
	color: #fff;
	font-size: 24px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 400;
	line-height: 28px;
}
.Slide-Text-Two{
	color: #ddca00;
	font-size: 80px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 700;
	line-height: 98px;
}
.Slide-Text-Three{
		padding-bottom:10px;
	color: #fff;
	font-size: 42px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 400;
	line-height: 48px;
}
.Slide-Text-Four{
	color: #fff;
	font-size: 16px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 400;
	line-height: 22px;
}
.row.slider {
	max-width: 100%;
	margin: 0 0 30px 0;
}
.slider .col-16.col{
	width: 100%;
	margin: 0;
}
nav .row{
	margin-bottom: 0;
}
.slider #jssor_1{
	margin: 0 !important;
}

/* CSS for block of 3 'Feature' images with text overlay */
.FeatureBox {
	min-height: 260px;
	background-position: right;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px;
	position: relative;
}
.FeatureBox p {
	color: #fff;
	font-size: 36px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 700;
	line-height: 36px;
}
.Feature-Button {

	background-color: #FF662B;
	padding: 10px 20px;
	border-radius: 3px;
	color: #ffffff !important;
	transition: all .5s ease-in-out;
	position: absolute;
	bottom: 20px;
	text-transform: uppercase;
	font-weight: 700;
}
.Feature-Button:visited{
	color: #ffffff !important;
}
.Feature-Button:hover{
	background-color: #000;
	color: #FF662B;
}

/* CSS for block of 3 offers images with text overlay */
.OfferBox {
	min-height: 240px;
	background-position: right;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px;
	position: relative;
}
.OfferBox .Offer-Title {
	color: #fff;
	font-size: 36px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 700;
	line-height: 36px;
}
.OfferBox .Offer-Text {
	color: #2b2a2b;
	font-size: 15px;
	text-transform: uppercase;
	font-family: 'News Cycle', sans-serif !important;
	font-weight: 500;
	line-height: 17px;
}
.OfferBox-Button {

	background-color: #2b2a2b;
	padding: 10px 20px;
	border-radius: 3px;
	color: #ffffff !important;
	transition: all .5s ease-in-out;
	position: absolute;
	bottom: 20px;
	text-transform: uppercase;
	font-weight: 700;

}
.OfferBox-Button:visited{
	color: #fff; !important;
}
.OfferBox-Button:hover{
	background-color: #000;
	color: #FF662B;
}

/* CSS for block of 4 info icons */
.info-wrapper{
	border-top: 1px solid #d1d1d1;
	border-bottom: 1px solid #d1d1d1;
	padding-top: 15px;
	padding-bottom: 15px;
}

.info-wrapper .col{
	margin: 0;
}
.info-wrapper .col-4{
	width: 25%;
}

.Info-Icon {
	width: 25%;
	float: left;
}
.Info-Text {
	width: 73%;
	float: left;
}
.Info-Text h5{
	font-size: 15px;
	color: #3d3c3f;
	text-transform: uppercase;
	margin-top: 10px;
}
.Info-Text p{
	margin: 0;
	font-size: 11px;
	color: #3d3c3f;
}

/** End of JSSOR slider styles **/

/*Header*/
.main{
	margin-top: 0 !important;
	padding-bottom:30px;
}
.topper{
	background-color: #3d3c3f !important;
	position: relative !important;
}
.topper .welcome {
	color:white;
	font-weight:bold;
}

.welcome:hover {
	color:ed7921;
}

.welcome:visited {
	color:ed7921;
}

a.login {
	color:#E96402;
}

.topper .account-menu {
	margin-top: 4px !important;
	color:white;
}
.topper .account-menu li a, .topper .account-menu li:visited{
	color: #ed7921 !important;
	font-size: 12px !important;
	text-decoration: underline;
	font-weight: 600 !important;
}

/*Footer*/
footer{
	background-color: #3d3c3f;
	padding: 30px 0 !important;
}
footer h4{
	font-family: 'News Cycle', sans-serif;
	text-transform: uppercase;
	letter-spacing: -1px;
	font-size: 19px;
	color: #FF662B;
}
footer li{
	margin-bottom: 0;
}
footer li a{
	color: #fff !important;
	font-size: 14px;
	line-height: 32px;
}
footer p, footer li{
	color: #fff;
	line-height: 24px;
	font-size: 14px;
}
.bottom {
	background-color: #3d3c3f;
	border-top: 1px solid #3d3c3f;
}
.bottom p{
	background-color: #3d3c3f;
	padding-bottom:10px;
	margin-bottom: 0;
	color:white;
}
footer .row{
	margin-bottom: 0;
}

/* Responsive CSS for mini promo on home page */
/* Iphone  Landscape */
@media only screen and (max-width:1024px) {

}

/* CSS for display of pricing */
#retail {
	float:left;
	width:100%;
}
#trade {
	float:left;
	clear:left;
	width:100%;
}
.prod-break .block .price.cross {
	font-size: 0.9em;
	line-height: 2em;
}
#retail > span {
	text-decoration:line-through;
}

/* CSS for stock availability */
.action ul li {
	width: 60px !important;
}
.action {
	float: left;
}

.product-details-stock {
	font-size: 2.1em;
	float: left;
	line-height: 1.2em;
	color: #1047aa;
	font-weight: bold;
	padding-top:20px;
	padding-left:20px;
}

/* Ipad Landscape */
@media only screen and (max-width:667px) {
	.Info-Text h5 {
		font-size: 15px !important;
		margin-left: 0px !important;
	}
	.Info-Text p{
		display: inline  !important;
		margin-left: 0px !important;
	}

}
/* Ipad Portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	.Info-Text h5 {
		font-size: 12px;
		color: #3d3c3f;
		text-transform: uppercase;
		margin-top: 0px !important;
		margin-left: 22px !important;
	}
	.Info-Text p{
		display: none  !important;
	}
}

/* Iphone 6 Landscape */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
}
/*Iphone Portrait*/
@media only screen and (max-width: 767px) {
	.container .col-1, .container .col-1, .container .col-2, .container .col-3, .container .col-3-2, .container .col-4, .container .col-5, .container .col-6, .container .col-7, .container .col-8, .container .col-9, .container .col-10, .container .col-11, .container .col-12, .container .col-13, .container .col-14, .container .col-15, .container .col-16, .container .col-3rd, .container .col-2-3rd {
		width: 100%;
		margin-bottom: 15px;
	}
	.row{
		width: 90%
	}
}

/* Iphone X Landscape */
@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
	.container .col-2 {
		width: 146px;
	}
	.container .col-9 {
		width: 600px;
	}
}
@media only screen and (min-device-width : 960px) and (max-device-width : 1199px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
	.container .col-2 {
		width: 130px;
	}
	.container .col-5 {
		width: 300px;
	}
	.container .col-9 {
		width: 540px;
	}
}
@media (max-width: 1199px) {
	.shop-list .product-wrap .col-5 {
			width: 300px;
	}
	
	.product.list .price-area {
		width: 200px;
	}
}

/* CSS for catalogue categories */
/*Listing Page*/
.code {
	font-size: 0.9em !important;
}

.post{
	border: 0 !important;
	border-bottom: 1px solid #d1d1d1 !important;
	padding: 0 !important;
}
.post h1{
	font-size: 28px;
	color: #3d3c3f;
	font-weight: 600;
	text-transform: uppercase;
}
.product{
	border: 0 !important;
}
.category:hover .info a, .category:active .info a{
	color: #009f8e !important;
}
.product .info{
	background-color: #fff !important;
}
.product .info .title{
	font-size: 16px !important;
	text-transform: uppercase !important;
	font-weight: 500 !important;
	line-height: 16px !important;
}
.category .info{
	position: relative !important;
	min-height: auto !important;
}