@import url('https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700|Source+Sans+Pro:300,300i,400,400i,600,600i,700,700i');
	@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css');

	/* Default Styles */
	html, body																{ margin: 0; padding: 0; width: 100%; height: 100%; font-size: 100%; }
	input, select, textarea													{ margin: 0; padding: 0; resize: none; }
	table, tr, th, td														{ margin: 0; padding: 0; border-spacing: 0; border-collapse: collapse; vertical-align: top; }
	a, img																	{ border: none; outline: 0; color: inherit; text-decoration: none; }
	span.icon																{ width: 1em; height: 1em; text-align: center; vertical-align: middle; display: inline-block; font-family: 'FontAwesome'; }
	hr																		{ margin: 0.25em 0 0.5em; height: 1px; background-color: #A1A1A1; border: 0 none; clear: both; }
	iframe																	{ border: 0 none; }

	.social a																{ margin-right: 1em; vertical-align: middle; display: inline-block; }
	.social .icon															{ padding: 0.25em; width: 1.5em; height: 1.5em; font-size: 1.875em; line-height: 1em; color: #FFFFFF; background-color: #7C9687; border-radius: 25px; }

	/* Page Styles */
	html																	{ background-color: #FFFFFF; }
	body																	{ font-family: 'Source Sans Pro', sans-serif; }

	div.page																{ margin: auto auto auto auto; padding: 0; width: 100%; }
	div.offset																{ margin: 0 auto; padding: 0; width: 100%; max-width: 1020px; position: relative; clear: both; }

	header.main																{ margin: auto auto auto auto; padding: 0; width: 100%; background-color: #FFFFFF; clear: both; position: relative; z-index: 10; font-family: 'Quicksand', Arial, sans-serif; }
	.parallax header.main													{ position: absolute; }
	header.main div.offset													{ max-width:98%; }

	header.main div.header-logo												{ padding: 3.1em 0 0.25em; width: 55%; vertical-align: top; display: inline-block; position: relative; font-family: 'Quicksand', Arial, sans-serif; font-size:1.5em; color:#4a4a4a;}
	header.main div.header-logo a											{ display: inline-block; }
	header.main div.header-logo img											{ max-width: 100%; display: block; }

	header.main div.header-details											{ width: 45%; vertical-align: top; color: #FFFFFF; display: inline-block; }
	header.main div.header-details .social									{ text-align: right; }
	header.main .social span.icon											{ vertical-align: top; }

	header.main div.header-contact											{ padding: 1.1875em 1.75em 0.5em 0; }

	#header-store-basket													{ margin: 0; font-size: 1em; line-height: 1em; color: #FFFFFF; float: right; position: relative; font-family: 'Source Sans Pro', sans-serif; }
	#header-store-basket #basket-count										{ padding: 0.25em 0.5em 0.3em; top: -13px; right: -0.875em; font-size: 1.125em; color: #FFFFFF; background-color: #4A4A4A; text-align: center; position: absolute; border-radius: 20px; }
	#header-store-basket #basket-total										{ padding: 0.6em 40px 0.6em 54px; font-size: 1.125em; color: #FFFFFF; background-color: #737373; background-image: url("../images/basket-icon.png"); background-position: 12px center; background-repeat: no-repeat; text-align: left; }

	.header-account															{ margin: 0.8em 0.8em; color: #4A4A4A; float: right; }

	nav.main																{ margin: 0; padding: 0; position: relative; }
	nav.main ul																{ margin: 0; padding: 0; list-style-type: none; text-align: right; position: relative; }
	nav.main ul li															{ margin: 0; padding: 0; text-align: center; vertical-align: top; display: inline-block; }
	nav.main ul li a														{ margin: 0 0 0.25em; padding: 0.35em 0.4em 0.7em 0.4em; font-size: 1.25em; line-height: 1.09em; text-transform: lowercase; color: #737373; text-align: left; display: block; }
	nav.main ul li:hover a,
	nav.main ul li.current a												{ color: #4A4A4A; }
	nav.main ul li ul														{ margin: 0; padding: 1em; width: auto; background-color: #4A4A4A; list-style-type: none; display: none; position: absolute; z-index: 1000; }
	nav.main ul li:hover ul													{ display: block; }
	nav.main ul li ul li													{ margin: 0; padding: 0; display: list-item; text-align: left; }
	nav.main ul li ul li a													{ margin: 0; padding: 0 1em; font-size: 1em; line-height: 1.25em; font-weight: normal; }
	nav.main ul li ul li:hover a											{ text-decoration: underline; }

	div#mobile-nav															{ display: none; }

	.map-container															{ padding: 20px; width: 100%; background-color: #EEEFEE; }
	#google-map																{ width: 100%; height: 500px; position: relative; }

	section.main															{ margin: 0; padding: 0; width: 100%; position: relative; }
	section.no-bgd															{ padding-top: 100px; }
	section.home div.offset 												{ max-width: 1020px; }
	section.shop div.offset													{ max-width: 100%; }

	.parallax .parallax-back												{ padding: 0; width: 100%; background-color: #EEEFEE; overflow: hidden; position: relative; }
	.parallax-back img														{ width: 100%; display: block; -ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; position: absolute; }
	.content-container														{ padding: 3em 1em 7em; background-color: #FFFFFF; position: relative; z-index: 2; }
	.content-container.grey													{ padding-top: 4em; background-color: #EEEFEE; }

	.home-header															{ padding: 42% 0 0; top: 0; left: 0; right: 0; position: absolute; }
	.home-header img														{ margin: 0 auto; width: 89px; max-width: 15%; display: block; cursor: pointer; }

	section.main div.content												{ margin: 0; padding: 0; position: relative; }
	section.main div.content-col											{ padding: 0.375em 0.625em; vertical-align: top; display: inline-block; }
	section.main div.content-left											{ padding-left: 0; }
	section.main div.content-right											{ padding-right: 0; }
	section.main div.content-small											{ margin: 0 auto; max-width: 330px; }

	section.main .content-col2 div.content-col								{ width: 50%; }

	section.main .content-col3												{ padding-top: 2em; padding-bottom: 2em; }
	section.main .content-col3 div.content-col								{ width: 33.33%; }
	section.main .content-col3 div.content-left								{ padding-right: 2.5em; }
	section.main .content-col3 div.content-right							{ padding-left: 2.5em; }
	section.main .content-col3 div.content-mid								{ padding-left: 1.25em; padding-right: 1.25em; }

	section.main div.content h1												{ margin: 0 0 1em; padding: 0; font-size: 2.25em; line-height: 1.25em; font-weight: 400; color: #1B1E1C; font-family: 'Quicksand', Arial, sans-serif; }
	section.main div.content h2												{ margin: 1.25em 0 1em; padding: 0; font-size: 1.5em; line-height: 1.5em; font-weight: 400; color: #1B1E1C; font-family: 'Quicksand', Arial, sans-serif; }
	section.main div.content h3												{ margin: 0 0 1em; padding: 0; font-size: 1.375em; line-height: 1.375em; font-weight: 400; text-transform: uppercase; color: #1B1E1C; }
	section.main div.content p												{ margin: 0 0 1.5em; padding: 0; font-size: 1.125em; line-height: 1.667em; color: #1B1E1C; }
	section.main div.content a												{ margin: 0; padding: 0; line-height: 1em; text-decoration: underline; text-align: center; color: inherit; }

	div.popup-panel.alert p a.button,	
	section.main div.content .button,
	section.main div.content button											{ margin: 0; padding: 0.25em 1.5em; min-width: 180px; font-size: 1em; line-height: 1.667em; text-decoration: none; color: #FFFFFF; background-color: #4A4A4A; border: 0 none; display: inline-block; }

	div.popup-panel.wg_popup_1 												{ background-size: cover; }

	section.main div.content h1												{ margin-bottom: 0; }
	section.home div.content h2												{ margin-top: 0; font-size: 1.875em; line-height: 2em; }

	.visit section.main div.content img										{ margin-left: 6.5%; min-width: 29%; max-width: 29%; }
	.visit section.main div.content img:first-of-type						{ margin-left: 0; }

	section.main .content :first-child										{ margin-top: 0; }
	section.main .content-col2 .content-col h3								{ margin: 0 9% 0.5em; }
	section.main .content-col2 .content-col p								{ margin-left: 9%; margin-right: 9%; }
	section.main .content-col2 .content-col p:first-of-type					{ margin-left: 0; margin-right: 0; }
	section.main .content-col2 .content-col p.photo							{ margin-left: 0; margin-right: 0; }

	section.main div.content ol,
	section.main div.content ul												{ margin: 1em 0; padding: 0 0 0 2em; font-size: 1em; line-height: 1.25em; color: #1B1E1C; }
	section.main div.content li												{ margin: 0 0 0.125em; padding: 0; font-size: 1em; line-height: 1.25em; color: #1B1E1C; }
	section.main div.content img											{ max-width: 100%; height: auto; }


	/* section.main .content .enquiry											{ margin: 0 auto; max-width: 700px; }
	section.main .content .field-block										{ margin: 0 auto; padding: 0 0 1em; width: 100%; text-align: center; display: block; }
	section.main .content .field-block.half									{ max-width: 350px; }
	section.main .content .field-label										{ margin: 0 0 0.625em; width: 100%; font-weight: 600; color: #1B1E1C; display: block; }
	section.main .content .field-block input,
	section.main .content .field-block select,
	section.main .content .field-block textarea								{ padding: 0.25em; width: 100%; font-size: 1em; line-height: 1.875em; border: 0 none; display: block; }
	section.main .content .field-block textarea								{ height: 15.25em; }
	section.main .content .field-block img									{ margin: 0 auto 0.75em; display: block; } */

	section.main div.content table											{ width: 100%; table-layout: fixed; border: 0 none; }
	section.main div.content table tr th,
	section.main div.content table tr td									{ padding: 0.375em 0.5em 0.375em 0.5em; border: 0 none; }

	footer.main																{ margin: auto; padding: 2.375em 0 11.375em 0; width: 100%; background-color: #FFFFFF; text-align: center; position: relative; }
	footer.main p															{ margin: 0; font-size: 1.125em; line-height: 1.667em; font-weight: normal; text-transform: none; color: #4A4A4A; }
	footer.main .footer-links												{ margin-top: 3em; color: #737373; }
	footer.main .social														{ margin-bottom: 2em; }
	footer.main .social a:last-child										{ margin-right: 0; }

	.clear																	{ clear: both; }
	.error																	{ color: #FFFFFF !important; background-color: #B01858 !important; }

	@media only screen and (min-width: 0px) and (max-width: 1024px) {

	header.main div.header-logo												{ padding: 2.85em 0 0.25em; }


	nav.main ul li a														{ margin: 0 0 0.25em; padding: 0.35em 0.75em 0.7em 0.75em; font-size: 1.0em; line-height: 1.09em; text-transform: lowercase; color: #737373; text-align: left; display: block; }
	nav.main ul li:hover a,
	nav.main ul li.current a												{ color: #4A4A4A; }
	nav.main ul li ul														{ margin: 0; padding: 1em; width: auto; background-color: #4A4A4A; list-style-type: none; display: none; position: absolute; z-index: 1000; }
	nav.main ul li:hover ul													{ display: block; }
	nav.main ul li ul li													{ margin: 0; padding: 0; display: list-item; text-align: left; }
	nav.main ul li ul li a													{ margin: 0; padding: 0 1em; font-size: 1em; line-height: 1.25em; font-weight: normal; }
	nav.main ul li ul li:hover a											{ text-decoration: underline; }

	}

	@media only screen and (min-width: 0px) and (max-width: 900px) {

		.content-container													{ padding: 2em 5% 4em; }
		.content-container.grey												{ padding-top: 3em; }

		.parallax header.main												{ position: relative; }
		header.main div.offset												{ padding: 0 0%; max-width:100%;}
		header.main div.header-logo											{ padding: 0.5em 0; width: 100%; vertical-align: middle; text-align:center; font-size:2.3em; clear:both;}
		header.main div.header-logo a										{ margin: 0; position: relative; }

		header.main div.header-details										{ width: 100%; margin: 0.5em auto 1em auto; vertical-align: middle;  clear:both;}
		header.main div.header-contact										{ display: none; }

		header.main div.mobile-commerce 									{ text-align:center; margin: 0 auto; width:100%; max-width:600px;}

		header.main div.mobile-commerce .commerce-button					{ width: 30%; margin: 0 1%; background-position: center center; background-repeat: no-repeat; background-size: contain; -webkit-background-size: contain; float: right; position: relative; }
		header.main div.mobile-commerce .commerce-button img				{ margin: 0 auto; display: block; max-width:40px; }
		header.main div.mobile-commerce .commerce-button a					{ margin: 0% 0% 0% 0%; text-shadow: 1px 1px 2px #FFFFFF; }
		header.main div.mobile-commerce .mobile-menu						{ cursor: pointer; }
		header.main div.mobile-commerce .basket								{ }
		header.main div.mobile-commerce .basket a							{ top: 0px; bottom: 0px; left: 0px; right: 0px; text-align: center; white-space: nowrap; position: absolute; }
		header.main div.mobile-commerce .basket a:before					{ width: 0; height: 100%; content: ""; vertical-align: middle; display: inline-block; }
		header.main div.mobile-commerce .basket .basket-count				{ margin: 7% auto 0em auto; padding: 0em 0em 0em 0em; width: 100%; max-height: 100%; overflow-y: auto; color: #FFFFFF; text-align: center; vertical-align: middle; white-space: normal; position: relative; display: inline-block; }

		nav.main															{ display: none; }

		header.main .strapline img											{ margin: 0 auto; max-width: 100%; display: block; }

		div#mobile-nav														{ display: block; }
		#menu-container														{ width: 100%; z-index: 100000; position: absolute; }

		@supports (height: 100vh) and (object-fit: cover)
		{
			.parallax .parallax-back										{ padding-top: 0 !important; height: 100vh; }
			.parallax-back img												{ height: 100%; object-fit: cover; }

			.home-header													{ padding-top: 100%; }
		}

		section.no-bgd														{ padding-top: 0; }

		section.main div.content											{ padding: 0; width: 100%; float: none; }

		section.main .content-col2 div.content-col,
		section.main .content-col3 div.content-col							{ padding-left: 0; padding-right: 0; width: 100%; }

		section.main .content-col2 div.content-col							{ text-align: center; }
		section.main .content-col3											{ padding-top: 4.5em; padding-bottom: 5em; }

		section.main div.content h1											{ font-size: 2em; line-height: 1.25em; text-align: center; }
		section.main div.content h2											{ font-size: 1.75em; line-height: 1.25em; }
		section.main div.content h3											{ font-size: 1.375em; line-height: 1.25em; }
		section.main div.content p											{ font-size: 1.25em; line-height: 1.5em; }
		section.main div.content ol,
		section.main div.content ul											{ padding-left: 2.375em; }
		section.main div.content li											{ font-size: 1.25em; }
		section.main div.content img										{ margin: 0 auto 0.5em !important; /* display: block; */ }

		.visit section.main div.content img									{ margin: 1em auto 1em; width: auto !important; height: auto !important; max-width: 100%; }
		.visit section.main div.content img:first-of-type					{ margin-left: auto; }

		#google-map															{ height: 250px; }

		footer.main															{ padding: 4.375em 5% 5em 5%; }
		footer.main p														{ font-size: 1em; }
		footer.main a														{ display: block; }
		footer.main .divider												{ display: none; }

	}
	@media only screen and (min-width: 0px) and (max-width: 600px) {

	div.popup-panel 														{ padding: 0.75em 40px 0.75em 40px; max-width:90%;}

	@media only screen and (min-width: 0px) and (max-width: 400px) {
		header.main div.header-logo											{ padding: 1em 0 0 0; width: 100%; vertical-align: middle; text-align:center; font-size:1.1em; }
		
		/*
			header.main div.mobile-commerce 									{ text-align:center; margin: 0 auto; width:100%; }
			header.main div.mobile-commerce .commerce-button					{ float:none; display:inline-block; width: 32%; max-width: 40px; margin: 0 10px; background-position: center center; background-repeat: no-repeat; background-size: contain; -webkit-background-size: contain; float: right; position: relative; }
		*/
		
		
		section.main div.content h1											{ font-size: 1.75em; }
		section.main div.content h2											{ font-size: 1.5em; }
		section.main div.content h3											{ font-size: 1.125em; }
		section.main div.content p											{ font-size: 1em; }

	}