/*	 Jonny Norridge	2024 */


html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

body {
	text-align: center;
	padding: 0px;
	margin: 0px;
	line-height: 1;
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes*/
	background-color: white;
	font-family: 'Lato', Helvetica, Arial, sans-serif;
}
body.loggedin{
	margin-top: -36px;
}

#page {
	width: 100%;
}
#page #content{
	background: white;
	min-height: 60vh;
}
section{
	display: block;
	width: 100%;
}

/*
Cookie notcie edits 
*/
.cookie-notice-container{
	border-top: 2px white solid;
}
#cn-accept-cookie{
	border: 1px white solid !important;	
}
#cn-refuse-cookie, #cn-more-info{
	color: #aaa;	
}
.cn-text-container{
	margin: 12px 0 6px 0 !important;
}

/*
-----------------------------------
*/





/*
WOOCOMMERCE OTHER
*/
.woocommerce-notices-wrapper{
	/*position: fixed;
	top: 0;
	left: 0;
	width: 100%;*/
	z-index: 999999;
}

.woocommerce-products-header{
	margin: 0 auto 1em;
	padding: 0 10px;
	width: 90%;
	max-width:100%; /* ie10 11 fix */
	max-width: 1800px;
}
@media (max-width: 960px){
 .woocommerce-products-header{
	  width: 100%;
   }	
}

.woocommerce div.product{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;	
}
.woocommerce div.product .container{
	padding: 0 10px;
}
.woocommerce-product-gallery,
.summary.entry-summary{
	width: auto;
	display: flex;
	flex-grow: 1;
	flex-shrink: 1;
	flex-basis:auto;
	flex-direction: column;
	width: 50%;
}
/* edit to gallery plugin */
#wpgs-gallery .wcgs-carousel .wcgs-swiper-arrow{
	border-radius: 50px;
	margin: 0 10px;
}

.woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery ol{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	border: thin red solid;
}
.woocommerce-product-gallery__wrapper > div,
.woocommerce-product-gallery ol li{
	border: thin blue solid;
	width: 30%;
}
.woocommerce-product-gallery__wrapper > div:first-of-type{
	border: thin blue solid;
	width: 100%;
}

.woocommerce-tabs{
	width: 100%;
}



p.price{
	color: black;
}
/*
p.price span.woocommerce-Price-amount {
	margin-top: 0.6em;
	display: block;
	color: #ffb100;
	font-weight: 700;
	text-align: center;
	line-height: 1.0em;
}
p.price span.woocommerce-Price-amount:before{
	content: "from";
	font-size: 0.7em;
}
p.price span.woocommerce-Price-amount:after{
	content: "(ex-VAT)";
	font-size: 0.7em;
}
p.price span bdi{
	display: block;
	margin: 2px 2px;
	color: #ffb100;
}
p.price span.note{
	font-size: 0.8em;
}

p.price #addtocartedit{
	position: relative;
	left: -112px;
	top: -60px;	
	float: left;	
}

p.price #addtocartedit a{
	font-size: 0.8em	
}
*/


	
	
	/* fixes for deafault woo shop page */
	.woocommerce.woocommerce-page .type-product.grid_6 img {
		max-width: 100%;
		height: auto;
	}
	.woocommerce.woocommerce-page .type-product.grid_6 h3 span{
		background-color: white;
	}
	
	.woocommerce-cart-form .quantity .screen-reader-text{
		display: none;
	}
	.woocommerce .type-product form.cart{
		border: 1px solid #ffb100;
		padding: 9px 14px 10px 14px;
	}
	.woocommerce-checkout #payment ul.payment_methods li img{
		width: 36px;
		margin-right: 4px;
	}
	.woocommerce-checkout #payment div.payment_box .form-row{
		margin:  0 0 0 0;
	}
	
	.product_cat-spare-parts .woocommerce-message .button {
		margin-right: 6.0em;
	}
	
	/* hide amex crdit card icon */
	#add_payment_method #payment ul.payment_methods li img+img:nth-child(3), .woocommerce-checkout #payment ul.payment_methods li img+img:nth-child(3){
		display: none;
	}
	

	
	
	/* free gift alert notice */
	body .wfg-fixed-notice {
		background-color: #ffb100 !important;
		box-shadow: none;
		position: relative;
	}
	
	body .wfg-fixed-notice > p {
		background-color: #ffb100 !important;
		padding: 6px 5px 4px 5px;
		font-family: 'Lato', helvetica, sans-serif;
		font-weight: bold;
		font-size: 14px;
	}
	body a.wfg-fixed-notice-remove {
		position: inherit;
		float: none;
		right: auto;
	}
	
	body .wfg-fixed-notice > p  > a.wfg-fixed-notice-remove {
		color: #fff;
		position: relative;
		float: right;
		right: 20px;
	}
	



/*
contact pop up
*/
#contact_popup {
	position: fixed;
	z-index: 200;
	right: 18px;
	bottom: 10px;
	width: 90px;
	height: 90px;
	border-radius: 90px;
	background: black;
	border: 8px #ffb100 solid
}
#contact_popup .icon a,
#contact_popup .icon a:visited{
	display: block;
	background: white;
	font-family: 'Lato', Helvetica, Arial, sans-serif;
	color: black;
	text-align: center;
	font-size: 60px;
	line-height: 50px;
	font-weight: 900;
	cursor: pointer;
	width: 60px;
	height: 60px;
	border-radius: 50px;
	margin: 7px;
	z-index: 9;
}
#contact_popup .icon a::after{
	content: '';
	position: absolute;
	left: 64%;
	top: 60%;
	width: 0;
	height: 0;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid white;
	clear: both;
	z-index: -1;
}
#contact_popup .close_btn{
	display: block;
	float: right;
	background: #ffb100;
	border: 4px white solid;
	border-radius: 3em;
	margin: 0.2em;
	position: relative;
	top: -18px;
	right: -18px;
}
#contact_popup .close_btn a{
	display: block;
	padding: 8px 3px 12px;
	cursor: pointer;
}
#contact_popup .close_btn span{
	text-indent: -999px;
	overflow: hidden;
	background-color: white;
	display: block;
	width: 23px;
	height: 4px;
 }
#contact_popup .close_btn span  {
	-webkit-transform: rotate(-225deg) translate(1px, -3px);
	transform: rotate(-225deg) translate(3px, -3px);
}
#contact_popup .close_btn span:last-of-type {
	-webkit-transform: rotate(45deg) translate(-9px, -12px);
	transform: rotate(45deg) translate(0px, 0px);
}

#contact_popup .contact_popup_window{
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
	display: block;
	z-index: 201;	
	background: white;
	border-radius: 10px;
	filter: drop-shadow(-3px 3px 14px #666666);
	transition: all 0.3s ease-out 0.1s;
	position: absolute;
	width: 310px;
	left: -240px;
	height: auto;
	top: -222px;
}
#contact_popup .contact_popup_window.popup_close{
	opacity: 0;
	left: 0px;
}
#contact_popup .contact_popup_window.popup_open{
	opacity: 1;
	left: -240px;
}
#contact_popup .contact_popup_window::after{
	content: '';
	position: absolute;
	left: 84%;
	top: 100%;
	width: 0;
	height: 0;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-top: 25px solid white;
	clear: both;
	z-index: -1;
}
#contact_popup .contact_popup_window .inner_wrap{
	background: #ffb100;
	background-image: url(../images/bkg-chevron-small-white.png);
	background-position: center -5px;
	background-repeat: repeat-x;
	border-radius: 6px;
	margin: 6px;
	padding: 1.3em 0.5em 0.5em 0.9em;
}
#contact_popup .contact_popup_window p{
	font-size: 0.9em;
	line-height: 1.2em;
	font-weight: 400;
	letter-spacing: 0.03em;
	padding: 0px;
	margin: 0.5em 0;
}
#contact_popup .contact_popup_window a,
#contact_popup .contact_popup_window a:visited{
	color: black;
	text-decoration: none;

}
#contact_popup .contact_popup_window .status a,
#contact_popup .contact_popup_window .status a:visited{
	color: white;
	text-decoration: underline;
}
#contact_popup .contact_popup_window p.telephone,
#contact_popup .contact_popup_window p.email{
	font-size: 1.5em;
	font-weight: 700;
	padding: 0 0;
}
#contact_popup .contact_popup_window p.telephone{
	color: white;
	margin: 0 0 0.2em;
}
#contact_popup .contact_popup_window p.email{
	margin: -0.1em 0 0.1em 0;
}
	@media (max-width: 960px){
		#contact_popup {
			right: 10px;
			bottom: 10px;
			width: 80px;
			height: 80px;
			border-radius: 80px;
			border: 8px #ffb100 solid
		}
		#contact_popup .icon a{
			font-size: 50px;
			line-height: 45px;
			width: 52px;
			height: 52px;
			border-radius: 50px;
			margin: 6px;
		}
		#contact_popup .icon a::after{
			left: 64%;
			top: 55%;
			width: 0;
			height: 0;
			border-left: 0px solid transparent;
			border-right: 20px solid transparent;
			border-bottom: 20px solid white;
		}
		#contact_popup .contact_popup_window.popup_open{
			left: -250px;
		}
		#contact_popup .contact_popup_window::after{
			left: 86%;
		}
	}
	@media (max-width: 480px){	
		#contact_popup .contact_popup_window{
			width: 310px;
			height: auto;
			top: -220px;
		}
		#contact_popup .contact_popup_window.popup_open{
			left: -250px;
		}
	}




/*
-----------------------------------
Home and genral content display
-----------------------------------
*/

#content {
	clear: both;
	margin: 40px auto;
	width: 100%;
	padding: 0px;
}


.video_holder {
	float: none;
	display: inline-block;
	margin: 20px auto;
}

.contentblock{
	margin: 10px auto 25px auto;
	padding: 10px 0px;
	display: block;
	background-color: white;
	color: black;
}

.post_content{
	margin: 20px auto 30px auto;
}
.page_content{
	margin: 20px auto 30px auto;
	max-width: 960px;
}

.product_notice{
	__margin: 0px 10px -1.2em;
	margin: 0px 10px 0px;
}

.page_title,
.section_title{
	width: 100%;
	padding: 0 10px;
	margin: 1em 0 0 0;
}

.video_embed{
	margin-top: 40px;
}




/*
-----------------------------------
SINLE PRODUCTS  
-----------------------------------
*/

.single .featureimage {
	width: auto;
	margin: 0px 5px;
}
.single .featureimage img{
	max-width: 100%;
	width: 100%;
	height: auto;
}








/*
-----------------------------------
Products   display
-----------------------------------
*/
.product-item{
	display: block;
	margin: 5px 0px 15px;
	padding: 0px;
	text-align: left;
	position: relative;
	overflow: hidden;
	vertical-align: top;
	height: 330px;
	/* for when products have a background img */
	background-position: center center;
	background-size: cover; 
}
.product-item a{
	width: 100%;
	height: 100%;
	margin: 0px;
	text-align: left;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	overflow: hidden;
	display: block;
}
.product-item a:hover {
	background-color: rgba(0,0,4,0.2);
}
.product-item img{
	position: absolute;
	top: 0px;
	z-index: 0;
}
.spare_part{
	margin-bottom: 20px;
}
.spare_part .img_wrap{
	float: left;
	width: 30%;
	margin: 0px 1%;
}
.spare_part .details{
	float: left;
	width: 66%;
	margin: 0px 1%;
	padding: 5px 0px 5px 0px;
	background-color: rgba(255,255,255,0.6);
}


	
/*
-----------------------------------
Page and post   display
-----------------------------------
*/

.search .post .img_wrap{
	float: left;
	margin: 0px 14px 10px 12px;
}
.search .post{
	margin-bottom: 15px;
	padding: 1em 10px;
	width: 50%;
	display: flex;
}
.search .post .inner_wrap{
	border: 2px #ededed solid;
	border-radius: 6px;
	padding: 0 0.5em 0.2em;
	display: block; 
}
.dd_element_container{
	margin-bottom: 10px;
	overflow: hidden;
	max-width: 960px;
}
.dd_element_container .innerbox{
	padding-bottom: 10px;
}
.dd_element_container .fullpostcontent{
	display: none;
	padding-bottom: 20px;
}
.dd_element_container a:hover h3{
	color: black;
	cursor: pointer;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
/*
-----------------------------------
*/

img.left{
	float: left;
}
img.right{
	float: right;
}
@media (max-width: 960px){
	figure, #content .posts-wrap figure, #content .posts-wrap img{
		max-width: 100%;
		height: auto;
	}
	.entry-header img, .entry-content img, .comment-content img, .widget img {
		max-width: 100%; /* Fluid images for posts, comments, and widgets */
		height: auto;
	}
	li div img {
		max-width: 100%; /* Fluid images for posts, comments, and widgets */
		height: auto;
	}
	img[class*="align"], img[class*="wp-image-"] {
		height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
	}
	img.size-full {
		max-width: 100%;
		width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8 */
	}
}

/* SHOP PAGES 
----------------------------------------------------------------------------------------------------*/

@media (max-width: 960px){	
	.contentblock .content_aligned{
		width: 75%;
		margin: 0px auto;
		left: 0px;
		display: inline-block;
	}	
}
@media (max-width: 760px){
	.contentblock .content_aligned{
		width: 85%;
		margin: 0px auto;
	}	
}
@media (max-width: 720px){
	.contentblock .content_aligned{
		width: 90%;
		margin: 0px auto;
	}
}	
@media (max-width: 480px){		
	.contentblock .content_aligned{
		width: 100%;
		margin: 0px auto;
	}
}
#content .content_aligned.inner_block {
	margin: 0px auto;
	padding: 0 10px;
	width: 100%;
}

/* woo 	commerce columns */
#content .col2-set{
	margin: 0 auto;
	padding: 0 0;
   width: 100%;
   list-style: none;
   clear: both;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-between;
}
#content  .col2-set .col-1,
#content  .col2-set .col-2 {
	margin: 0 0;
	padding: 0 10px;
	width: 50%;
	display: block;
	vertical-align: top;
}
#content .content_aligned .col2-set .col-1 {
}
#content .content_aligned .col2-set .col-2 {
}
@media (max-width: 580px){
  #content  .col2-set .col-1,
  #content  .col2-set .col-2 {
	width: 100%;
  }
}



/* search form
----------------------------------------------------------------------------------------------------*/
.search #page form.searchform{
	margin: 40px 0px 10px 0px;
}

@media (max-width: 480px){	
	form.searchform input[type="text"]{
		width: auto;
	}	
}


form.searchform{
	margin: 10px 0px 20px 0px;
	display: inline-block;
	vertical-align: middle;
	border: 1px solid #5a5a5a;
	color: white;
}

form.searchform input[type="text"]{
	background-color: white;
	border: none;
	margin: 6px 4px 6px 6px;
	height: 30px;
	width: 300px;
	border: 1px solid #e0e0e0;
}

form.searchform input[type="submit"]{
	background-color: #5a5a5a !important;
	background: #5a5a5a !important;
	color: white;
	overflow: hidden;
	border: none;
	margin: 6px 6px 6px 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}




/* ' FOOTER  
------------------------------------------------------------------------------------------*/
#footer {
	clear: both;
	margin: 0px;
	padding: 0 0 1em 0;
	width: 100%;
	background-color: black;
	text-align: center;
}
#footer .innerwrap{
	padding: 0px;
	margin: 0px;
	text-align: center
}
#footer .container_12{
	background-color: black;
}


#footer .contact_details{
	background: #FBB017;
	margin: 0 0;
	padding: 1px 0px 2px 0px;
}
#footer .contact_details div{
	display: inline-block;
	margin: 0 auto;
}


#footer .navigation ul{
	list-style: none;
	text-align: left;
	padding: 0 0;
	margin: 0 12px 1em 12px;
	font-size: 1.1em;
	line-height: 1.4em;
}
#footer .navigation ul li{
	line-height: 1.2em;
	padding: 0.1em 0;
	margin: 0.1em 0;
}
#footer .address{
	margin-bottom: 1em;
}
#footer .address p{
	font-size: 1.1em;
	font-weight: 400;
}
#footer p{
	color: white;
	font-size: 0.9em;
	line-height: 1.4em;
	margin: 5px 12px;
	text-align: left;
}
#footer a,
#footer a:hover
#footer h4 div span{
	color: white !important;
	text-decoration: none;
}


@media (max-width: 960px){
	#footer .container_12 .grid_12{
		width: 100%;
		margin: 0px 0;
	}	
}
@media (max-width: 640px){
	#footer .container_12 .grid_6{
		width: 100%;
		margin: 10px 0;
		left: 0px;
	}
	#footer .container_12 p,
	#footer .navigation ul	{
		text-align: center;
	}
}

@media (max-width: 480px){		
	#footer h4{
		font-size: 1.2em;
		line-height: 1.3em;
	}
}



#footer .social{
}
#footer .social ul{
	list-style: none;
	margin: 10px 0px 0px 0px;
	padding: 0px;
}
#footer .social ul li {
	margin: 0px 0px 0px 0px;
	padding: 0px;
	text-align: left;
	display: inline-block;
}
#footer .social ul li a{
	margin: 0px 30px 0px 30px;
	padding: 24px 10px 6px 42px;
	height: 36px;
	width: auto;
	background-image: url(../images/icon-twitter.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	overflow: hidden;
}
#footer .social ul li a.mail{
	padding-left: 46px;
	background-image: url(../images/icon-mail.png);
}
#footer .social ul li a:hover{
	color: white;
}









/* MAILCHIMP 
*/


#mc_embed_signup{
	margin: 10px 30px 15px 30px;
	padding: 5px 10px;
	background: #101c2c;
	clear:left;
	font:14px Helvetica,Arial,sans-serif;
	
	border: 1px white solid;
	
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	-moz-border-radius-bottomleft:5px; 
	-moz-border-radius-bottomright:5px;     
	 
	
	-webkit-border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	-webkit-border-bottom-left-radius:5px; 
	-webkit-border-bottom-right-radius:5px; 
	 
	border-top-left-radius : 10px;
	border-top-right-radius : 10px; 
	border-bottom-left-radius : 10px;       
	border-bottom-right-radius : 10px;  
}
#mc_embed_signup label,#mc_embed_signup div {
	color: white;
}
div#mce-success-response.response{
	background: rgba(255,255,255,0.8);
	padding: 0px 10px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	-moz-border-radius-bottomleft:5px; 
	-moz-border-radius-bottomright:5px;     
	 
	
	-webkit-border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	-webkit-border-bottom-left-radius:5px; 
	-webkit-border-bottom-right-radius:5px; 
	 
	border-top-left-radius : 10px;
	border-top-right-radius : 10px; 
	border-bottom-left-radius : 10px;       
	border-bottom-right-radius : 10px; 
}

input#mc-embedded-subscribe.button{
	background-color: #284b5f;
	width: 96%;
			-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
input#mc-embedded-subscribe.button:hover{
	background-color: #8bb6c5;
	color: #151e29
}