#logo span{height:67%;width:115%;}
.hasBanners #logo span{color:#ffffff;}
.noBanners #logo span{color:#ffffff;}
.hasBanners #logo #strapLine{color:#e0e0e0;} 
.noBanners #logo #strapLine,.headerFixed #logo #strapLine{color:#f3f3f3;}
 #logo span{border:none;text-align:left;align-items:center } body{
text-align:left;
position:relative;
background:var(--pageColour);
} 
*{font-family:var(--mainFont),Arial,Helvetica,sans-serif; font-size:var(--mainFontSize);} 
::-webkit-input-placeholder{color:#999;font-weight:300;font-size:13.1px;text-transform:none;opacity:0.9}
:-moz-placeholder{color:#999;font-weight:300;font-size:13.1px;text-transform:none;opacity:0.9}
::-moz-placeholder{color:#999;font-weight:300;font-size:13.1px;text-transform:none;opacity:0.9}
:-ms-input-placeholder{color:#999;font-weight:300;font-size:13.1px;text-transform:none;opacity:0.9 } 
#wrapper{
width:100%; 
min-width:1120px;
margin:0px auto; min-height:78vh;
}
.noFooter #wrapper{min-height:calc(100vh - 65px);}
#header{
width:100%;
min-width:1120px;
z-index:5;position:absolute;
left:0;
right:0;
top:0px;
}
 
#top{ 
height:0px;
position:relative;
z-index:10;
margin:0 auto;
}
#headerFillColour{z-index:-1;background-color:var(--headerFillColour);position:absolute;top:0px;left:0px;width:100%;} 
.transparentHeader.hasBanners #headerFillColour, .hasBanners.transparentHeader #navMain{background:none} 
.fixedWidth #top{width:1120px;max-width:100%;}
.fixedWidth1200 #top{width:1200px;max-width:100%;}
.fullWidth #top{width:100%; }
#navMain{z-index:5;display:block;position:absolute; left:0%;width:100%;}
 
#navMain ul,#navMain ul li{list-style:none }
 
.headerFixed #navMain,
.headerFixed.noBanners #navMain,
.headerFixed.transparentHeader.hasBanners #navMain,
.headerFixed.transparentHeader.hasBanners #navMain{top:0px;margin:0 auto;background:var(--headerFixedbackground);}
.headerFixed #navMain a,
.headerFixed.noBanners #navMain a,
.headerFixed.transparentHeader.hasBanners #navMain a,
.headerFixed.transparentHeader.hasBanners #navMain a{ color:var(--headerFixedNavColour);}
.headerFixed #header{margin:0 auto;padding:0;position:fixed; width:100%;left:0px;right:0px;height:44px;}
.headerFixed #header{z-index:1001}
.headerFixed #navMain ul{margin:0px auto 0 auto;padding:0;} 
.headerFixed #navMain a:hover{color:#fff;}
.headerFixed #socialTop,.headerFixed #telephoneNumber,.headerFixed #strapLine{position:absolute;top:-200px;} 
#hamburger{display:none;}
#logo{
position:absolute;
display:block;
z-index:200; 
-webkit-transition:height 200ms;
transition:height 200ms; 
} 
.fullWidth #logo{left:30px;width:250px;margin:0px;}
#navMain a{font-weight:var(--navMainWeight);}
#navMain a{color:var(--navFontColour) }
.noBanners #navMain a{color:var(--navFontColourNoBanners) } 
#socialTop{position:absolute;width:auto;z-index:1;height:20px;}
.fullWidth #socialTop{right:30px;}
 
#strapLine{
clear:both;
display:block;
font-style:normal;
font-size:var(--strapLineFontSize);
overflow:visible;
font-weight:var(--strapLineFontWeight);
letter-spacing:0.6px;
height:20px;
white-space:nowrap;
padding:0 0 0 1px; width:100%;
margin-top:var(--strapLineTop); 
} 
 
	
.hiddenSocialTop,.hiddenSocialTop li,.hiddenSocialTop *{display:none;}
.graySocialTop .twitterIcon span{background-image:url(https://resources.hertsmedia.com/images/social/twitterGray.png) }
.graySocialTop .facebookIcon span {	background-image:url(https://resources.hertsmedia.com/images/social/facebookGray.png)} 
.graySocialTop .linkedInIcon span{background-image:url(https://resources.hertsmedia.com/images/social/linkedinGray.png) } 
.graySocialTop .pinterestIcon span{background-image:url(https://resources.hertsmedia.com/images/social/pinterestGray.png) }
.graySocialTop .instagramIcon span{background-image:url(https://resources.hertsmedia.com/images/social/instagramGray.png);}
.graySocialTop .youTubeIcon span {background-image:url(https://resources.hertsmedia.com/images/social/youtubeGray.png) }
.graySocialTop .whatsappIcon span {background-image:url(https://resources.hertsmedia.com/images/social/whatsappGray.png) }
.blackSocialTop .twitterIcon span{background-image:url(https://resources.hertsmedia.com/images/social/twitterBlk.png) }
.blackSocialTop .facebookIcon span{	background-image:url(https://resources.hertsmedia.com/images/social/facebookBlk.png)} 
.blackSocialTop .linkedInIcon span{background-image:url(https://resources.hertsmedia.com/images/social/linkedinBlk.png) } 
.blackSocialTop .pinterestIcon span{background-image:url(https://resources.hertsmedia.com/images/social/pinterestBlk.png) }
.blackSocialTop .instagramIcon span{background-image:url(https://resources.hertsmedia.com/images/social/instagramBlk.png);}
.blackSocialTop .youTubeIcon span{background-image:url(https://resources.hertsmedia.com/images/social/youtubeBlk.png) }
.blackSocialTop .whatsappIcon span{background-image:url(https://resources.hertsmedia.com/images/social/whatsappBlk.png) }
.whiteSocialTop .twitterIcon span,.headerFixed .twitterIcon span{background-image:url(https://resources.hertsmedia.com/images/social/twitter.png) }
.whiteSocialTop .facebookIcon span,.headerFixed .facebookIcon span {	background-image:url(https://resources.hertsmedia.com/images/social/facebook.png)} 
.whiteSocialTop .linkedInIcon span,.headerFixed .linkedInIcon span{background-image:url(https://resources.hertsmedia.com/images/social/linkedin.png) } 
.whiteSocialTop .pinterestIcon span,.headerFixed .pinterestIcon span{background-image:url(https://resources.hertsmedia.com/images/social/pinterest.png) }
.whiteSocialTop .instagramIcon span,.headerFixed .instagramIcon span{background-image:url(https://resources.hertsmedia.com/images/social/instagram.png);}
.whiteSocialTop .youTubeIcon span,.headerFixed .youTubeIcon span{background-image:url(https://resources.hertsmedia.com/images/social/youtube.png) }
.whiteSocialTop .whatsappIcon span{background-image:url(https://resources.hertsmedia.com/images/social/whatsapp.png) }
#telephoneNumber{
position:absolute;
width:auto;
top:var(--telTopPosition);
height:var(--telFontSize);
} 
#telephoneNumber.hidden,#telephoneNumber.hidden *{left:-1000000px;}
#telephoneNumber.left{left:0px;text-align:left}
#telephoneNumber.center{left:0px;right:0px; text-align:center}
#telephoneNumber.right{right:0px;text-align:right}
.fullWidth #telephoneNumber.right{right:20px;text-align:right}
#telephoneNumber a, 
#telephoneNumber em{
font-family:var(--telFont);
font-weight:var(--telFontWeight);
font-size:var(--telFontSize);
letter-spacing:normal;
text-align:var(--telTextAlign);
display:inline-block;height:20px;line-height:20px;
font-style:normal;
} 
#telephoneNumber span#phoneIconMobile{display:none} 
#telephoneNumber span#phoneIconScreen{width:auto;padding:0 2px;font:inherit;}
.noBanners #telephoneNumber span,.noBanners #telephoneNumber a,.noBanners #telephoneNumber em {color:var(--telColourNoBanners);}
.hasBanners #telephoneNumber span,.hasBanners #telephoneNumber a,.hasBanners #telephoneNumber em{color:var(--telColourBanners);} 
 
#socialTop{z-index:6}
#socialTop li{display:block;float:left;text-align:center;margin-left:10px;}
#socialTop li:last-child{margin-right:0}
#socialTop li a span{
display:block;
width:20px;
height:20px;
margin:0 auto;
background-position:50% 50%;
background-repeat:no-repeat;
background-size:16px auto;text-indent:-100000px;
}
#socialTop li a span{
-webkit-transition:all 100ms ease-in-out 0s;
transition:all 100ms ease-in-out 0s;
}
#socialTop li a:hover span{background-size:20px;}
#socialTop li a strong{display:none;}
#socialTop li a:hover strong{display:none;}
#navMain *{ z-index:10;}
#navMain ul{
height:44px;
position:relative;
list-style:none;
}
#navMain li{position:relative; margin:0px;height:44px;line-height:44px;} 
#navMain li:last-child{background-image:none}
 
#navMain ul li a {
text-align:center; 
display:block;
padding:0px;
padding-left:var(--navPadding);
padding-right:var(--navPadding);
text-transform:var(--navTextTransform);
text-decoration:none;
height:44px;line-height:44px;
color:var(--navFontColour);font-family:var(--navFont);font-size:var(--navFontSize);letter-spacing:var(--navLetterSpacing);
} 
.hasBanners #navMain ul li a{text-shadow:var(--navTextShadow);} 
 
#navMain ul li.mainCategory a span{
	margin:0 0 0 0px;
	display:block;
	float:right;
	position:relative;
	transition:transform 300ms;
	transform:rotate(90deg);
} 
#navMain ul li.mainCategory a span:before{
width:20px;
display:block;
text-align:center;
content:"\003E";
opacity:0.8;
transition:opacity 150ms;
font:inherit;
font-size:16px;
font-weight:100;
font-family:"Comic Sans MS",cursive
}
#navMain ul li.mainCategory a:hover span:before{opacity:1}
#navMain ul li.mainCategoryOpen a span{transform:rotate(-90deg); 	} 
#navMain li:not(.mainCategory) ::before{
content:'';
position:absolute;
left:50%;
bottom:0;
width:0;
height:3px;
background-color:currentcolor;
-webkit-transition:.2s;
transition:.2s;
display:var(--navAnimatedBorder)
}
.navBelowHeader #navMain li:not(.mainCategory) ::before{bottom:5px;}
#navMain li:not(.mainCategory):hover ::before{width:100%;left:0px;} 
#navMain ul.subNav li:hover ::before,#navMain ul.subNav li::before{display:none}
#navMain ul li a.navMainSelected{ }
#navMain ul li a:hover,
#navMain ul li.mainCategoryOpen a,
#navMain ul li.mainCategoryOpen:hover a{
text-decoration:none;
} 
#navMain ul li.mainCategoryOpen a,
#navMain ul li.mainCategoryOpen:hover a{
background-color:var(--headerFixedbackground);color:#fff;background-image:none;
} 
li ul.subNav, #navMain ul li ul.subNav{
width:320px; 
position:absolute; left:0px;top:44px;margin:0;
height:auto;
background-color:var(--headerFixedbackground);
padding:10px 10px 20px 10px;
opacity:0;
visibility:hidden;
transition:opacity 200ms ease-in-out 0s;
}
li.mainCategoryOpen ul.subNav, 
#navMain ul li.mainCategoryOpen ul.subNav{ display:block;opacity:1;visibility:visible;}
#navMain ul li ul.subNav li,ul.subNav li{
display:block;clear:both;width:100%;margin:4px auto;line-height:normal;height:auto;}
ul.subNav li:last-child{background-image:none;border-bottom:none} 
ul.subNav li a,#navMain ul li ul.subNav a{
	background:none;
	background-color:transparent;
	text-align:left;
	display:block;
	padding:6px 0px 6px 12px;
	text-decoration:none;
	border:0;
	line-height:1.4em;
	height:auto;
	color:#fff;
	margin:0px auto;
	-webkit-transition:none;
	white-space:normal;
	-moz-transition:none;
	-o-transition:none;
	transition:none;
	text-shadow:none; 
} 
#navMain ul li ul li:last-child a{border-bottom:0;}
#navMain ul li ul.subNav a:hover{
color:#fff;text-decoration:underline;
}
 
 
#contentWrapper{
}
#contentWrapper{width:100%;margin:0px auto 0px auto;padding-top: 0px;} 
#pageBanner{width:var(--pageBannerWidth);margin:var(--pageBannerMargin);}
#content{display:block;width:1120px;margin:0 auto;padding: 20px 0 20px 0;max-width:100%;} 
#siteContent{display:block;width:1120px;margin:0 auto;padding: 20px 0 20px 0;max-width:100%;} 
#contentTop{padding-bottom:10px;}
#contentTop p{ margin:8px auto} 
#contentTop ul li{list-style:disc;list-style-position:inside}
#products,#productDetails{display:block;width:1120px;margin:0 auto;padding: 20px 0 20px 0;max-width:100%;} 
#galleryContent{display:block;width:1120px;margin:0 auto;padding: 20px 0 20px 0;max-width:100%;} 
#galleryContent hr.textPad{height:15px;}#headerFillColour{height:90px;}
.headerFixed #headerFillColour{height:0px;} 
#logo{top:0px; width:180px;height:90px;left:0px;}
 
#logo span{ background-size:contain; background-position:0% 50%;margin-top:var(--logoTopPosition);}
.headerFixed #logo{position:absolute;height:34px;top:4px;margin:0;padding:0;} 
.headerFixed #logo span{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0; font-size:65%;color:var(--logoFontColourHeaderFixed)} 
#strapLine{text-align:left;} 
#navMain{top:24px;}
#navMain ul{margin:0 auto 0 auto;display:flex;width:var(--navWidth);} 
.navleft #navMain ul{justify-content:flex-start;}
.navright #navMain ul{justify-content:flex-end;} 
.navcentered #navMain ul{text-align:center;display:block;font-size:0px;}
.navcentered #navMain ul li{display:inline-block}
.hasBanners.bannersBelowHeader #bannerWrap{top:90px;opacity:0.6} 
.hasBanners.bannersBelowHeader #contentWrapper{margin-top:90px;}
.noBanners #contentWrapper{padding-top:90px;} 
.hasBanners.transparentHeader #contentWrapper{}#socialTop{right:0px;top:65px;text-align:right;}