@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700);

body {
	font-size: 100%;
	margin: 0px;
	font-family: 'Open Sans', sans-serif;
	color: #010000;
}

p,li,dt,dd,a,td	{font-size: 1rem;}
p,li					{line-height:160%;}


/**************** header *****************************/

.banner {width:1200px;margin:auto;position:relative;}
.logo img {display:block;}
.topRight .linkButton {padding: 6px 17px;}

@media(min-width:961px){
	.banner {height:106px;}
	.logo {position:absolute;top:0;left:0;width:30%;padding:10px 18px 0 0;z-index:100;}
	.topRight {width:151px;text-align:right;padding-top:30px;position:absolute;top:0;right:0;z-index:100;}
}
	
/**************** nav - wide menu *************************/

.topmenuContainer:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
.topmenuContainer {
	background-color: transparent;
   height:85px;
	position:relative;
	}
.topnav {
	background-color:#fff;
	padding-left:30%;
	padding-right:170px;
	padding-top:20px;
	position:relative;
	z-index:-1;

}


.topmenu > ul {display: flex !important;justify-content:space-between;}
.topmenu > ul li.top-level {padding: 0;height:86px;}
.topmenu a {text-decoration:none;font-size:1rem;}
.topmenu > ul li.top-level>a {color: #000;padding: 20px 9px 0;}
.topmenu > ul li.top-level>a:hover,
.topmenu > ul li.top-level:hover {color: #ffffff;background:#262626;}
.topmenu > ul li.top-level:hover>a{color: #ffffff;}
.topmenu > ul .mega-menu{
	z-index:100;
	width:100%;
	background-color: #262626;
	color:#fefefe;
	position: absolute;
	top: 106px;
	left: 0; 
	padding: 30px;
   column-count: 4;
   -webkit-column-count: 4;
   -moz-column-count: 4;
   column-gap: 2em;
   -webkit-column-gap: 2em;
   -moz-column-gap: 2em;
    border-bottom:2px solid #333;
   
}
.topmenu > ul li:not(:first-child) {display: block !important;}
.topmenu .mega-menu > li > a {border-bottom:1px solid #ec2802;}
.topmenu .mega-menu li {padding:6px 0;	display:block;}
.topmenu .mega-menu > li {
-webkit-column-break-inside: avoid;
       /* page-break-inside: avoid;   not working properly in FF */
               break-inside: avoid;

}
.topmenu .mega-menu > li > a{color:#fefefe;font-weight:700;}
.topmenu .mega-menu li a:hover {color:#f16d71;}

.topmenu .mega-menu li > ul {padding:0;}
.topmenu .mega-menu > li > ul li a{font-size:1rem;color:#e7e7e7;padding-left:10px;}    

.topmenu .mega-menu li > ul > li ul{padding:0;}
.topmenu .mega-menu > li > ul li > ul li a{font-size:1rem;color:#e7e7e7;padding-left:20px;} 



/**************** nav - mobile header *************************/

.slicknav_menu {background-color:transparent;padding:0;}
.slicknav_nav {z-index:10000000;}
.slicknav_nav {font-size:1.750em;}
.slicknav_nav .slicknav_arrow	{background-color:transparent;font-size:1.5em;}
.slicknav_nav .slicknav_row	{padding: 12px 20px;} /* row is for subs that are parents */
.slicknav_nav a					{padding: 12px 20px;font-size:1.125rem;}

/* first level */
li.slicknav_collapsed.slicknav_parent > a .slicknav_arrow	{color:#000000;}
li.slicknav_parent.slicknav_open > a .slicknav_arrow			{color:#ffffff;}

.slicknav_nav > li:nth-of-type(1)	{border-top:1px solid #000000;}
.slicknav_nav > li 						{background-color:#ffffff;color:#000000;border-bottom:1px solid #000000;}
.slicknav_nav a 							{color:#000000;}
.slicknav_nav a:hover					{background-color:#ec2802;color:#ffffff;}
.slicknav_row:hover, 
li.slicknav_collapsed .slicknav_row:hover a	{background-color:#ec2802;color:#ffffff;}
.slicknav_nav li.slicknav_open,
.slicknav_nav li.slicknav_open > a,
.slicknav_nav li.slicknav_open > a a,
.slicknav_nav li.slicknav_open > a:hover 		{background-color:#ec2802;color:#ffffff;border:none;}

/* second level */
ul li ul li.slicknav_collapsed.slicknav_parent > a .slicknav_arrow	{color:#333333;}

.slicknav_nav ul li 						{background-color:#f0f0f0;border-bottom:1px solid #333333;}
.slicknav_nav ul li a 					{color:#333333;}	
.slicknav_nav ul li a 					{padding: 12px 20px 12px 30px;}
.slicknav_nav ul li .slicknav_row	{padding: 12px 20px 12px 30px;}

.slicknav_nav ul li.slicknav_parent.slicknav_open,
.slicknav_nav ul li.slicknav_parent.slicknav_open > a,
.slicknav_nav ul li.slicknav_parent.slicknav_open > a a,
.slicknav_nav ul li.slicknav_parent.slicknav_open > a:hover 	{background-color:#ec2802;color:#ffffff;}

/* third levels */
.slicknav_nav ul li ul li 					{background-color:#f0f0f0;}
.slicknav_nav ul li ul li a 				{color:#333333;}
.slicknav_nav ul li ul li a 				{padding-left: 60px;}
	
.slicknav_nav ul li .slicknav_arrow	{}
.slicknav_nav ul li.slicknav_parent.slicknav_open  .slicknav_arrow:before {content:"-";}


/* overrides */

.slicknav_nav li:nth-child(even) 	{background-color:#ffffff;}
.slicknav_nav ul li:nth-child(even) {background-color:#f0f0f0;}
.slicknav_nav ul li ul li:nth-child(even) {background-color:#f0f0f0;}
.slicknav_nav .slicknav_item a, .slicknav_nav .slicknav_parent-link a {font-size: 1.125rem;}
.slicknav_nav .slicknav_row {padding: 12px 20px;}
.slicknav_nav .slicknav_arrow {background-color: transparent;width: 44px;}
.slicknav_row:hover, li.slicknav_collapsed .slicknav_row:hover a {background-color: transparent;color: #000000;}	
	
	
	
/**************** footer *****************************/

.footer			{background-image:url('footerbackground.jpg');color:#ffffff;}
.footerInfo		{width:1200px;margin:auto;padding:20px 0 30px 0;}
.footerSitemap div > ul li{
-webkit-column-break-inside: avoid;
       /* page-break-inside: avoid;   not working properly in FF */
               break-inside: avoid;
}

@media(min-width:1023px){
	.footer-Col1 {width:19%;float:left;}
	.footer-Col2 {width:60%;float:left;}
	.footer-Col3 {width:19%;float:right;}
	.footerSitemap {column-count:4;}
}
@media(min-width:660px) and (max-width:1023px){
	.footer-Col1 {width:22%;float:left;padding-right:12px;}
	.footer-Col2 {width:55%;float:left;padding-top:21px;}
	.footer-Col3 {width:22%;float:right;}
	.footerSitemap {column-count:3;}
}
.footerInfo ul {list-style-type:none;padding:0;}
.footerInfo ul li a {color:#ffffff;font-weight:700;}
.footerInfo ul li ul li a {color:#e6e6e6;font-weight:400;}
.footerInfo p 	{margin-bottom:18px;line-height:160%;font-size:0.875em;}
.footerInfo	a 	{text-decoration:none;font-size:0.875em;}
.footerPhone {padding-bottom:5px;}
.footerPhone a {font-size: 1.000em;color:#ffffff;font-weight:700;text-decoration:none;cursor:default;}	
.footerPhone a:hover {color:#ffffff;}
.footerBase				{width:75em;margin:auto;padding: 10px 0;color: #ffffff;line-height:140%;}
.footerLeft				{width:66%;float: left;font-size:0.563em;}
.footerRight			{width:33%;float: right;text-align:right;font-size:0.563em;}
.footerBase a 			{font-size: 0.563rem;color:#ffffff;}
.footerBase a:hover	{color:#f0f0f0;}

/**************** slideshow *****************************/

.feature{position:relative;}

.slideshowOverlay {
    position: absolute;
    left: 0;
    z-index: 1;
    color: #ffffff;
    text-align: center;
    width: 100%;
}

.slideshowOverlay h1 {
	font-size:3.750em;
	color:#ffffff;
	text-shadow:
    -1px -1px 0 #666,
    1px -1px 0 #666,
    -1px 1px 0 #666,
    1px 1px 0 #666; 
}

@media (min-width:769px){.slideshow {height:471px;}.slideshowOverlay{top: calc(50% - 85px);}}
@media (min-width:698px) and (max-width:768px){.slideshow {height:400px;} .slideshowOverlay {top: calc(50% - 122px);}}
@media (min-width:495px) and (max-width:696px){.slideshow {height:360px;}.slideshowOverlay {top: calc(50% - 122px);}}
@media (max-width:494px){.slideshow {height:230px;}.slideshowOverlay {top: calc(50% - 80px);} .slideshowOverlay h1 {font-size: 2.250em;margin-bottom:20px;}}

/**************** content *****************************/

/* layout */

.bg {
	background-repeat: no-repeat;
	background-attachment: fixed;
	padding-top:30px;
	padding-bottom:30px;
}
@media (min-width:768px){
	.bg {background-image: url('bg-image-1920.jpg');}
}
@media (max-width:767px){
	.bg {background-image: url('bg-image-768.jpg');background-size:cover;}
	
}

.middleHome	{padding:28px 0;width:75em;margin:auto;}
.middle		{padding: 28px 20px 32px 20px; width:75em;margin:auto; min-height:400px;	background:rgba(255,255,255,0.9);}

.crumbContainer {box-shadow: inset 0 5px 5px -5px #666666; background-color:#f7f7f7;}

.crumb		{width:75rem;margin:auto;font-size:0.750rem;color:#959595;}
.crumb a    {color:#999999;font-size:1em;text-decoration:none;padding-left:3px;padding-right:3px;}
.crumb a:hover {color:#325678;}


.crumbPageTitle		{width:75rem;margin:auto;color:#959595;font-size:0.750rem;padding-top:16px;padding-bottom:30px;}
.crumbPageTitle h1 {font-size: 2.250rem;margin-top:20px;}
.crumbPageTitle a    {color:#999999;font-size:0.750rem;text-decoration:none;padding-left:3px;padding-right:3px;}
.crumbPageTitle a:hover {color:#325678;}






.greyRow {background-color:#f7f7f7;}
.greyRowMiddle {width:75em;margin:auto;}
.greyRowMiddle h1 {margin-bottom:0;}

@media (min-width:1025px) {.crumb {padding: 16px 0 46px 3px;}.greyRowMiddle {padding-bottom:50px;}}
@media (min-width:768px) and (max-width:1025px) {.crumb {padding: 16px 0 26px 3px;}.greyRowMiddle {padding-bottom:40px;}}
@media (max-width:767px) {.crumb {padding: 16px 0 16px 3px;}.greyRowMiddle {padding-bottom:35px;}}

.colourRow	{background: #f0f0f0;}
.homerow1 {margin-bottom:60px;}

/* general */
a 			{color: #b51d02;text-decoration: underline;}
a:hover	{color: #999999;}
a img		{border:0;}

h1, h2, h3, h4, h5 {}
h1 {font-size: 2.250em;color:#ec2802;font-weight:700;margin-top:0;}
h2 {font-size: 1.500em;color:#010000;font-weight:600;}
h3 {font-size: 1.313em;color:#ec2802;font-weight:700;}
h4 {font-size: 1.750em;color:#ec2802;font-weight:700;text-align:center;}
h5 {font-size: 1.000em;color:#ffffff;font-weight:700;margin-top:0;display:inline-block;border-bottom:1px solid #ec2802;padding-bottom:10px;margin-bottom:10px;}

.footerInfo .sideBySide-Col1 h5 {padding-right:20px;}
.footerInfo .sideBySide-Col2 h5 {padding-left:50px;}

.introText {font-size:1.125rem;}


.middleHome h2 {font-size: 1.750em;font-weight:700;margin-top:0;}
.middleHome h3 {font-size: 1.313em;color:#ffffff;}

.background h2 {color:#ffffff;background-image:url('h2background.jpg');text-align:center;padding: 11px 0;}
.background h3 {color:#ffffff;background-image:url('h2background.jpg');text-align:center;padding: 11px 0;}
h2.background2 {color:#ffffff;background-image:url('h2background2.jpg');text-align:center;padding: 11px 0;}

.middle h2 {
    display: inline-block;
    border-bottom: 2px solid #ec2802;
    padding-bottom: 10px;
    padding-right: 3px;
    margin-top:0;
}

p, ul, li		{margin-top:0;}
.formRequired	{color:#cc0000;font-size:0.625rem;}

.contactUs td {padding-bottom:5px;}
.contactUs td:first-child {padding-right:20px;}
.contactUs a[href^="tel:"] {text-decoration:none;color:#010000;cursor:default;}
.contactUs a[href^="tel:"]:hover {color:#010000;}

.linkButton, .overlayButton{
	display:inline-block;
	padding:5px 27px;
	line-height:30px;
	background-color: #ec2802;
	font-size:0.813rem;
	border-radius:5px;
	font-weight:700;
	color:#ffffff;
	text-decoration: none;
}
.linkButton a, .overlayButton a {color:#ffffff;text-decoration: none;}
.linkButton:hover, .overlayButton:hover, .dataForm50 .button:hover, .dataForm .button:hover {background-color: #000000;color:#ffffff;}

 .dataForm50 .button, .dataForm .button {
 	display:inline-block;
	padding:5px 27px;
	line-height:30px;
	background-color: #ec2802;
	font-size:1rem;
	border-radius:5px;
	font-weight:700;
	color:#ffffff;
	text-decoration: none;
	border:none;
	-webkit-appearance:none;
	font-family: 'Open Sans', sans-serif;
 }


.redButton, .greyButton {
	display:inline-block;
	text-decoration:none;
	border-radius:5px;
	color:#ffffff;
	font-size:0.875rem;
	font-weight:600;
	padding:6px 20px;
	text-align:center;
}
.redButton {background-color:#ec2802;}
.greyButton {background-color:#959595;}
.redButton:hover, .greyButton:hover {background-color:#010000;color:#ffffff;}

.featuredProduct {margin-bottom:30px;text-align:center;}
.featuredProduct h3 {font-size:1.125em;font-weight:600;}
.featuredProduct h3 a {font-size:1em;color:#000;text-decoration:none;}

@media (min-width:640px) {
	.homeFeatured {display:flex;justify-content:space-between;}
	.homeFeatured > .featuredProduct {width:32%;}
}

/****************  catalogue home & home page ***************************/

.categoryBox {background-color:#fff;border:1px solid #e1e1e1;text-align:center;margin-bottom:60px !important;}
.categoryBox h2 {background-color:#ec2802;margin:0;padding:12px 0;font-weight:700;font-size:1.313em;display:block;}
.categoryBox h2 a {color:#ffffff;font-size:1em}

@media (max-width:910px){.categoryBox h2 {padding:10px 0;font-size:1.250em;}}

/****************  browse ***************************/

.categoryDynamicLeftmenu {border:none;}

.leftMenuHeading {background-color:#ec2802;color:#fff;padding:5px;margin-bottom:16px;font-weight:600;}
.categoryDynamicLeftmenu a {color:#000;font-weight:700;}
.categoryDynamicLeftmenu .open > a,
.categoryDynamicLeftmenu .open > a:hover,
.categoryDynamicLeftmenu #selectedItem{background-color:transparent;color:#ec2802;}
.categoryDynamicLeftmenu ul li ul li a {font-size:0.875rem;color:#000;font-weight:400;}
.categoryDynamicLeftmenu a:hover {}

.browseProduct {padding-bottom:30px;text-align:center;}
.browseProduct h2 a {text-decoration:none;font-size:1em;color:#010000;}
.browseProduct img {border:1px solid #e1e1e1;}
.browseCategory .redButton{margin-top:12px;padding:6px 20px;}

@media (min-width:560px){
	.browseProduct {width:48%;float:left;}
	.browseProduct:nth-child(odd) {margin-right:4%;}
	}


/****************  product ***************************/


.productPage h2 {display:inline-block;border-bottom:2px solid #ec2802;padding-bottom:10px;padding-right:3px;}
.productPage h2 a {text-decoration:none;font-size:1em;color:#010000;}

.slider.slider-nav .item {width: 49% !important;margin-top:10px;}
.slider.slider-nav .item:nth-of-type(odd) {margin-right: 2%;}

.price {font-size:1.875em;font-weight:700;margin-bottom:20px;}
.rrp {text-decoration:line-through;}


@media (min-width:640px){
	.productPage-Col1 {width:26%;float:left;}
	.productPage-Col2 {width:71%;float:right;}
}

.productPdfs {padding-bottom:40px;}
.productPdfs a {margin-top:20px}
.productPdfs a:not(:last-child){margin-right:12px;}

.productPage .redButton, .productPage .greyButton {font-size:0.875rem;padding:12px 20px;}
.productPage .greyButton img {margin-right:10px;vertical-align:middle;}

.relatedProducts div div {background-color:#fff;border:1px solid #e1e1e1;}
.relatedProducts h3 a {text-decoration:none;color:#010000;margin-top:0;}

@media (min-width:431px) and (max-width:1200px) {.productPdfs > span {display:inline-block;}}
@media (min-width:431px) and (max-width:970px) {.productPdfs a span {display:none;}}
@media (min-width:431px) and (max-width:680px) {.productPage .greyButton img {margin-right:5px;}.productPage .greyButton {padding:12px 14px;}}

@media (max-width:430px){
	.productPdfs a {width:100%;text-align:center;padding-left:0;padding-right:0;}
	.productPdfs a:last-child{margin-right:12px;}
	.productPdfs a span {display:inline;}
}

/**************** faq *****************************/

.faq {border-bottom:1px solid #E0DEDE;padding:8px 0;}
.faq_question {
	display:inline-block;
    padding-bottom:5px;
    cursor: pointer;
	color:#333333;
}
.faq_question:hover {color:#ec2802;}
.faq_question:hover .twisty {background-color: #ec2802;}
.twisty {
	display:inline-block;
	width:22px;
	line-height:22px;
	background-color:#333333;
	font-weight:bold;
	color:#ffffff;
	margin-right:10px;
	text-align:center;
}
.twisty:hover {background-color: #ec2802;}
.plus {background-color: #333333;}
.minus {background-color: #ec2802;}
.faq_answer_container {
    height: 0px;
    overflow: hidden;
    padding-left:32px;
	font-size:1.154em;
}
.faq_answer {padding: 8px 0;}