/*!
Theme Name: Diesel
Theme URI: 
Author: Diesel Tax
Author URI: https://campaignedge.com.au
Description: Theme created in April 2026
Version: 1.0.6
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: diesel
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
>>> diesel:
---------------------------------------------------------------- */


/* General
--------------------------------------------- */
body .dashicons {
	width: 1em;
	height: 1em;
	font-size: inherit;
}

.first-no-margin> :first-child,
.fcnm> :first-child {
	margin-top: 0px;
}

.lcnm> :last-child {
	margin-bottom: 0px;
}

.mt0 {
	margin-top: 0;
}

.mb0 {
	margin-bottom: 0;
}

.pt0 {
	padding-top: 0;
}

.pb0 {
	padding-bottom: 0;
}

.wsnw {
	white-space: nowrap !important;
}

.has-heading-font-family span {
	text-decoration-color: var(--wp--preset--color--secondary) !IMPORTANT;
	text-decoration-thickness: 3px !IMPORTANT;
	text-underline-offset: 0.1em;
}


/* Colours
--------------------------------------------- */
.pc-color {
	color: var(--wp--preset--color--primary);
}

.sc-color {
	color: var(--wp--preset--color--secondary);
}

.tc-color {
	color: var(--wp--preset--color--tertiary);
}

.white-color {
	color: var(--wp--preset--color--white);
}

.black-color {
	color: var(--wp--preset--color--black);
}

.pc-bg {
	background-color: var(--wp--preset--color--primary);
}

.sc-bg {
	background-color: var(--wp--preset--color--secondary);
}

.tc-bg {
	background-color: var(--wp--preset--color--tertiary);
}

.white-bg {
	background-color: var(--wp--preset--color--white);
}

.black-bg {
	background-color: var(--wp--preset--color--black);
}

.pc-fill {
	fill: var(--wp--preset--color--primary);
}

.sc-fill {
	fill: var(--wp--preset--color--secondary);
}

.tc-fill {
	fill: var(--wp--preset--color--tertiary);
}

.white-fill {
	fill: var(--wp--preset--color--white);
}

.black-fill {
	fill: var(--wp--preset--color--black);
}

.pc-border {
	border-color: var(--wp--preset--color--primary);
}

.sc-border {
	border-color: var(--wp--preset--color--secondary);
}

.tc-border {
	border-color: var(--wp--preset--color--tertiary);
}

.white-border {
	border-color: var(--wp--preset--color--white);
}

.black-border {
	border-color: var(--wp--preset--color--black);
}

/* Full BG's
- To give an element a full sized background in code give it the class .full-bg along with the 
class wp color class eg .has-primary-background-color
--------------------------------------------- */
.full-bg,
.wp-block-group.has-background {
	position: relative;
	overflow: visible;
}

.full-bg,
.wp-block-group.has-background>* {
	position: relative;
	z-index: 2;
}

.full-bg:before,
.wp-block-group.has-background:before {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(100% / 2);
	transform: translateX(-50%);
	z-index: 0;
	background-position: 50% 50%;
	background-size: cover;
	background: inherit;
}

/* Disable full BG's on nested groups */
.wp-block-group .wp-block-group.has-background:before,
.wp-block-group .wp-block-group.has-background:after,
.wp-block-group .wp-block-group.has-background[style*=".webp')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".webp')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".png')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".png')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".jpg')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".jpg')"]:after {
	width: 100%;
	transform: none;
	left: 0;
	border-radius: inherit;
}


/* If the group has both a colour and image selected then the colour is moved to the :after placed ontop of the image*/
.wp-block-group.has-background[style*=".webp')"]:before,
.wp-block-group.has-background[style*=".jpg')"]:before,
.wp-block-group.has-background[style*=".png')"]:before {
	background-color: unset;
}

.wp-block-group.has-background[style*=".webp')"]:after,
.wp-block-group.has-background[style*=".jpg')"]:after,
.wp-block-group.has-background[style*=".png')"]:after {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc(100% / 2);
	transform: translateX(-50%);
	z-index: 1;
	background-position: 50% 50%;
	background-size: cover;
	background-color: inherit;
}




/* Content Areas
--------------------------------------------- */
.main-content {
	max-width: var(--wp--style--global--wide-size);
	width: 100%;
	margin: 0 auto;
}

.main-content .main-content-inner {
	padding: 0 4%;
}

.site-main-default .main-content .main-content-inner {
	padding: 0em 4% 0em 4%;
}


/* Header
--------------------------------------------- */
.site-header {
	position: relative;
	width: 100%;
	z-index: 3;
	padding-top: 3em;
	padding-bottom: 0.5em;

	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 5;

	display: none;
}

.site-header .main-content .main-content-inner {
	position: relative;
}

/* Header - Logo and Menu container
--------------------------------------------- */

.site-header {

	transition: background-color 0.25s ease, padding-top 0.25s ease;

	.main-content-inner {
		.header-main {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0em 0;
			transition: padding 0.25s ease;
			column-gap: 2em;
		}

		.header-logos {
			position: relative;
			display: flex;
			align-items: center;
			gap: 0.75em;

			.header-logo {
				display: block;
				text-decoration: none;

				img {
					max-width: 2em;
					height: auto;
					width: 100%;
				}

			}
		}

		.header-cta-button {
			display: inline-block;
			font-size: 1.4em;

			a {
				color: var(--wp--preset--color--secondary);
				background-color: var(--wp--preset--color--primary);
				padding: 0.1em 0.75em;
				border-radius: 0.35rem;
				text-decoration: none;
				text-transform: uppercase;
				display: block;

				font-weight: 800;
				font-variation-settings: "slnt" 0, "wdth" 50, "wght" 800;
				text-transform: uppercase;
			}
		}
	}

	&.site-header-scrolled {
		background-color: var(--wp--preset--color--tertiary);
		padding-top: 1em;

		.main-content-inner .header-main {
			padding: 0em 0 0em 0;

			.menu-container {
				& .menu {
					& .menu-item {
						a {
							color: white;
						}
					}
				}
			}
		}
	}
}



/* Header - Menu
--------------------------------------------- */

.header-nav {
	flex: 1 0 auto;
}

.menu-container {
	flex: 1 1 auto;

	.menu {
		margin: 0px;
		list-style: none;
		padding: 0px;
		display: flex;
		justify-content: right;

		.menu-item {
			margin-left: 0.75em;
			padding: 0.2em;
			position: relative;

			a {
				color: var(--wp--preset--color--tertiary);
				font-family: var(--wp--preset--font-family--paragraph);
				line-height: 1em;
				font-weight: 500;
				font-variation-settings: "slnt" 0, "wdth" 50, "wght" 800;
				text-decoration: none;
				transition: color 0.2s ease, background 0.2s ease, border-color ease 0.2s;
				font-size: 17px;
				padding: 0.25em 0em;
				display: block;
				border-bottom: 1px solid transparent;

			}

			&:hover>a {
				border-bottom: 1px solid var(--wp--preset--color--secondary);
			}

			&.current-menu-item>a {
				border-bottom: 2px solid var(--wp--preset--color--secondary);
				font-weight: 700;
			}

			&:last-child a {
				padding-right: 0px;
			}

			&:after {
				content: "";
				width: 1px;
				height: 50%;
				background-color: var(--wp--preset--color--tertiary);
				position: absolute;
				right: -0.4em;
				top: 30%;
				bottom: 0;
			}

			&:last-child:after {
				display: none;
			}

			/* Header - Sub Menu
			--------------------------------------------- */
			&.menu-item-has-children {
				position: relative;

				>a {
					padding-right: 1.25em;
				}

				&::before {
					width: 0.5em;
					height: 0.5em;
					background-color: white;
					clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
					position: absolute;
					top: calc(50% - 0.25em);
					right: 0em;
					content: "";
					transition: 0.2s ease;
					transform: rotate(-90deg);
				}

				&:hover::before {
					color: white;
					transform: rotate(0deg);
				}

				&.current-menu-item::before {
					border-bottom: 1px solid white;
				}

				&:hover>.sub-menu {
					opacity: 1;
					pointer-events: all;
				}

				.sub-menu .menu-item.menu-item-has-children>a {
					padding-right: 0.75em;
				}
			}

			.sub-menu {
				opacity: 0;
				transition: opacity 0.2s ease;
				pointer-events: none;
				padding: 0px 0.5em;
				margin: 0px;
				position: absolute;
				top: 100%;
				left: 0px;
				z-index: 2;
				list-style: none;
				width: max-content;
				max-width: 200px;
				background: var(--wp--preset--color--primary);
				display: block;

				.menu-item {
					margin-left: 0px;
					padding-left: 0px;

					a {
						font-weight: 400;
						line-height: 1.2em;
					}

					.sub-menu {
						left: 100%;
						top: 0%;
						width: max-content;
					}
				}
			}
		}
	}

	.site-header-scrolled &,
	.site-header-bg & {
		.menu .menu-item .sub-menu {
			background-color: var(--wp--preset--color--tertiary);
		}
	}
}


/* Header - Menu Hamburger
--------------------------------------------- */
.menu-center {
	display: none;
}

.show-on-mobile-menu {
	display: none;
}


/* Carousel
--------------------------------------------- */
#carousel {
	position: relative;
	margin-top: 1em;
	margin-bottom: 2rem;

	.carousel-slides {
		display: flex;
		overflow: hidden;
		background: var(--wp--preset--color--primary);

		.carousel-slide {
			position: relative;
			flex: 1 0 100%;
			padding: 18em 0 6em 0;
			transition: background 0.4s ease;
			background: none;


			&.carousel-slide-2 {
				padding: 8em 0 16em 0;
			}

			.main-content-inner {
				opacity: 0;
				transition: opacity 0.5s ease;
			}

			.carousel-img {
				position: absolute;
				top: 0px;
				left: 0px;
				z-index: -1;
				width: 100%;
				height: 100%;
				object-fit: cover;
				transition: opacity 0.4s ease;
				opacity: 0;

				&.carousel-img-yellow {
					filter: grayscale(1);
					mix-blend-mode: multiply;
				}
			}

			h2 {
				color: white;
				font-size: 2.75em;
				line-height: 1.1em;
				margin: 0;
				margin-left: 4%;
				transition: margin-left 0.4s ease;
				max-width: 1000px;
			}

			.carousel-text {
				position: relative;
				z-index: 1;
				font-size: 3em;
				font-weight: 400;
				font-family: var(--wp--preset--font-family--heading);
				color: var(--wp--preset--color--primary);
				opacity: 0;
				margin: 0em 0;
				line-height: 1.1em;


				span {
					color: white;
				}
			}

			.carousel-content {
				position: relative;
				z-index: 1;
				max-width: 580px;
				padding: 2em 0;
				min-height: 12.7em;
				padding-right: 5em;

				&:before {
					content: "";
					position: absolute;
					top: 0;
					left: calc(-1 * ((100vw - 1196px) / 2));
					width: calc(((100vw - 1196px) / 2) + 100%);
					height: 100%;
					background-color: var(--wp--preset--color--secondary);
					background: linear-gradient(90deg, rgba(22, 38, 55, 0.4) 0%, rgba(22, 38, 55, 1) 50%);
					z-index: 0;

					/* Using external SVG file - easier to customize */
					-webkit-mask-image: url('./images/mask-cutoff-br.svg');
					mask-image: url('./images/mask-cutoff-br.svg');

					-webkit-mask-size: 100% 100%;
					mask-size: 100% 100%;
					-webkit-mask-repeat: no-repeat;
					mask-repeat: no-repeat;
					-webkit-mask-position: center;
					mask-position: center;


				}

				&.carousel-content-right {
					margin-left: auto;
					margin-right: 0;
					padding-left: 5em;
					padding-right: 0;

					&:before {
						transform: rotateY(180deg);
						left: unset;
						right: calc(-1 * ((100vw - 1196px) / 2));
					}

					.carousel-text {
						text-align: right;
					}
				}

			}

			.carousel-text .line-carousel {
				overflow: hidden;
				display: block;
			}

			.button-p {
				margin-top: 0;
				font-size: 1.2em;
				opacity: 0;
				transition: opacity 0.6s ease;

				a {
					color: black;
					background-color: var(--wp--preset--color--quinary);
					text-decoration: none;
					text-transform: uppercase;
					font-weight: 600;
					padding: 0.25em 0.7em;

					img {
						width: 0.5em;
						vertical-align: middle;
						margin-left: 0.2em;
					}
				}
			}

			.carousel-darken {
				position: absolute;
				top: 0px;
				left: 0px;
				z-index: -1;
				width: 100%;
				height: 100%;
				background: rgb(0, 0, 0);
				background: -moz-linear-gradient(90deg,
						rgba(0, 0, 0, 0.8) 0%,
						rgba(0, 0, 0, 0) 65%,
						rgba(0, 0, 0, 0.25) 100%);
				background: -webkit-linear-gradient(90deg,
						rgba(0, 0, 0, 0.8) 0%,
						rgba(0, 0, 0, 0) 65%,
						rgba(0, 0, 0, 0.25) 100%);
				background: linear-gradient(180deg,
						rgba(0, 0, 0, 0.8) 0%,
						rgba(0, 0, 0, 0.1) 30%,
						rgba(0, 0, 0, 0.4) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=1);
			}

			&.carousel-slide-active {
				z-index: 1;

				.main-content-inner {
					opacity: 1;
				}

				.carousel-img {
					opacity: 1;
				}

				h2 {
					margin-left: 0;
				}

				.carousel-text {
					opacity: 1;
				}

				.button-p {
					opacity: 1;
				}

				&.carousel-slide-yellow {
					background: var(--wp--preset--color--primary);
				}
			}
		}
	}

	.carousel-navs-arrows {
		.carousel-nav {
			width: 1.5em;
			line-height: 0;
			position: absolute;
			color: white;
			font-size: 1.75em;
			pointer-events: all;
			z-index: 3;
			margin-left: 0.4em;
			cursor: pointer;
			transition: background 0.35s ease;
			top: 50%;
			padding: 0.2em;
			left: calc(((100vw - var(--wp--style--global--wide-size))) / 2 - 1.5em);

			&:hover {
				background: var(--wp--preset--color--quinary);
			}

			&.carousel-nav-left {
				margin-left: 0em;
				margin-right: 0.4em;

				img {
					transform: rotate(180deg);
				}
			}

			&.carousel-nav-right {
				left: unset;
				right: calc(((100vw - var(--wp--style--global--wide-size))) / 2 - 1.5em);
			}
		}
	}

	.carousel-navs {
		position: absolute;
		bottom: 1em;
		right: 0px;
		z-index: 1;
		width: 100%;
		text-align: center;

		.main-content-inner {
			display: flex;
			justify-content: right;
			align-items: center;
		}

		.carousel-nav-dot {
			width: 1em;
			height: 1em;
			background: black;
			margin: 0 0.3em;
			transition: background 0.3s ease;
			border-radius: 100%;
			cursor: pointer;

			&.carousel-nav-dot-active {
				background: white;
			}
		}
	}
}



/* Banner
--------------------------------------------- */

.header-banner {
	position: relative;
	width: 100%;
	z-index: 3;
	background: var(--wp--preset--color--secondary);


	.header-banner-title {
		position: absolute;
        top: 50%;
        left: 55%;
        transform: translate(0%, -50%);
        color: white;
        font-size: 1.5em;
        font-weight: 600;
        text-align: left;
        max-width: 470px;
	}


	.header-banner-desktop {
		width: 100%;
	}

}



/* Footer
--------------------------------------------- */

.site-footer {
	padding: 1em;
	color: white;
	overflow: hidden;
	position: relative;
	background: var(--wp--preset--color--secondary);
	background-image: url('/app/uploads/2026/04/FooterBG.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	.main-content-inner {
		position: relative;

		.footer-inner {
			text-align: center;

			.footer-logo {
				width: 100%;
				max-width: 250px;
				margin: 2em auto;
			}

			.footer-texts {
				
				.footer-text {

					display: inline-block;
					margin: 0.5em 2em;
				}
			}
		}
	}
}




/* Custom
--------------------------------------------- */

.addtoany_shortcode {
	text-align: center;
}


ul.wp-block-list {
	list-style: none;

	li {
		position: relative;
		margin-bottom: 0.5em;

		&:before {
			content: "";
			position: absolute;
			left: 0;
			top: 0em;
			width: 1.2em;
			height: 1.2em;
			transform: translateX(-150%);
			background-image: url('/app/themes/diesel/images/ListTick.svg');
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			display: inline-block;
		}
	}
}


.customgridlines {
	position: relative;

	&:before,
	&:after {
		content: "";
		position: absolute;
	}

	&:before {
		width: 100%;
		height: 1px;
		background: var(--wp--preset--color--tertiary);
		left: 0;
		top: 50%;
	}

	&:after {
		width: 1px;
		height: 100%;
		background: var(--wp--preset--color--tertiary);
		left: 50%;
		top: 0;
	}

}




/* WP Blocks
--------------------------------------------- */

.column-align-bottom {
	display: flex;
	align-items: flex-end;
}

.wp-block-cover a {
	text-decoration: none;
	transition: all 0.3s ease;
}

.wp-block-column {
	position: relative;
}

.is-layout-flow>*,
.is-layout-constrained>* {
	margin-block-start: 1em;
}

/* Youtube */
.is-provider-youtube .wp-block-embed__wrapper {
	position: relative;
	padding-bottom: 56.25%;
	width: 100%;
}

.is-provider-youtube .wp-block-embed__wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* image fixing */

.wp-block-group.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex img {
	max-width: unset;
	vertical-align: unset;
}

.wp-block-image.size-full.is-resized img {
	max-width: unset;
}


/* buttons */

.button-p,
.wp-block-button {
	margin-top: 0;
	font-size: 1em;

	a,
	.wp-block-button__link {
		color: black;
		background-color: var(--wp--preset--color--primary);
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 700;
		padding: 0em 0.3em;
		border-radius: 0.1em;
		font-size: 1.15em;

		&:hover {
			color: inherit;
		}
	}
}


/* Columns with cover block */

.wp-block-columns.are-vertically-aligned-center.is-layout-flex.wp-block-columns-is-layout-flex {

	>.wp-block-column:nth-child(1),
	>.wp-block-column:nth-child(2) {
		position: relative;
		align-self: stretch;

		.wp-block-cover {
			object-fit: cover;
			width: 50vw;
			position: absolute;
			top: 0;
			right: 0;
			height: 100%;
			max-height: unset;
			margin: 0;
			margin-block-start: 0;
			padding: 0;
			line-height: 0;
			display: block;
			min-height: unset;
		}

		&.has-background:before {
			content: "";
			width: 50vw;
			height: 100%;
			position: absolute;
			top: 0;
			right: 0;
			z-index: -1;
			background: inherit;
		}
	}

	>.wp-block-column:nth-child(2) {

		.wp-block-cover {
			left: 0;
			right: unset;
		}

		&.has-background:before {
			left: 0;
			right: unset;
		}
	}
}




/* Forms
--------------------------------------------- */

#page .gform_wrapper {

	form {

		.gform-body {

			.gform_fields {
				row-gap: 1em;

				.gfield {
					label {}

					.ginput_container {

						input {
							border-color: var(--wp--preset--color--primary);
							background-color: transparent;
							border-radius: 0.5em;
							border-width: 1px;
							border-style: solid;
							padding: 0.5em 1em;
							font-weight: 400;
							font-style: italic;

							&.gfield-choice-input {
								padding: 0.5em;
							}
						}
					}

				}

				.gfield--type-submit {
					align-items: flex-start;

					input {
						background-color: var(--wp--preset--color--primary);
						color: black;
						border-radius: 0.35em;
						border-width: 1px;
						border-style: solid;
						padding: 0.5em 1em;
						font-weight: 700;
						font-size: 1.15em;
						text-transform: uppercase;
					}
				}
			}

		}

		.gform-footer {
			margin-top: 0;

		}
	}
}



.gform_required_legend {
	display: none;
}





/* Custom
--------------------------------------------- */

.contact-item {
	min-width: 220px;
	text-align: center;
}




/* Pagination
--------------------------------------------- */

.news-pagination {
	text-align: center;
	font-weight: 700;
	margin: 1em 0;
}

.page-numbers {
	padding: 0;
	text-align: right;
	list-style: none;
	margin: 0px;
	display: inline-block;
}

.page-numbers li {
	display: inline-block;
	width: 1.2em;
	height: 1.25em;
	line-height: 1.25em;
	font-weight: 600;
	margin: 0;
	text-align: center;
}

.page-numbers.current {
	text-decoration: underline;
	color: var(--wp--preset--color--primary);
}

.page-numbers a {
	color: var(--wp--preset--color--text);
}

.page-numbers li span,
.page-numbers li a {
	text-decoration: none;
}

.page-numbers li .next,
.page-numbers li .prev {
	display: block;
	position: relative;
	color: transparent;
	margin: 0px;
}

.page-numbers li .next:after,
.page-numbers li .prev:after {
	content: "";
	border-right: 0.2em solid black;
	border-bottom: 0.2em solid black;
	display: block;
	line-height: 1;
	font-weight: 400;
	font-style: normal;
	speak: never;
	text-decoration: inherit;
	text-transform: none;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	width: 0.6em;
	height: 0.6em;
	font-size: 0.9em;
	vertical-align: top;
	text-align: center;
	transition: color .1s ease-in;
	position: absolute;
	top: 50%;
	left: 40%;
	transform: translate(-50%, -50%) rotate(-45deg);
	z-index: 2;
	pointer-events: none;
	cursor: pointer;
}

.page-numbers li .prev:after {
	transform: translate(-50%, -50%) rotate(135deg);
	left: 60%;
}



/* MOBILE
--------------------------------------------- */

@media only screen and (max-width: 1300px) {

	.site-header .main-content-inner .header-logo {}


}

/* MENU MOBILE TRIGGER - Move last submenus to the left */

@media only screen and (max-width: 1675px) {
	.menu-container .menu .menu-item:last-child>.sub-menu {
		left: unset;
		right: 0;
	}
}

@media only screen and (max-width: 1300px) {

	#carousel {
		.carousel-slides {
			.carousel-slide {
				.carousel-content {
					&::before {
						left: -8%;
						width: 108%;
						background: linear-gradient(90deg, rgba(22, 38, 55, 0.4) 0%, rgb(22, 38, 55) 50%);
					}

					&.carousel-content-right {
						&:before {
							transform: rotateY(180deg);
							left: unset;
							right: -8%;
						}
					}
				}
			}
		}
	}
}


/* MENU MOBILE TRIGGER */
@media only screen and (max-width: 1100px) {


	/* Menu - pullout */

	.menu-pullout-mask {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background: var(--wp--preset--color--quaternary);
		z-index: 10;
		display: block;
	}

	.menu-pullout {
		display: block;
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		transform: translateX(-101%);
		transition: transform .5s ease;
		z-index: 11;
		padding: 3em;
		box-shadow: 1px 1px 7px 0 #00000045;
		background: var(--wp--preset--color--primary);
		height: 100vh;
	}

	.menu-pullout-active {
		transform: translateX(0%);
		overflow-y: scroll;
	}

	.menu-pullout .menu-container .menu .menu-item a {
		padding: 0.25em 0em;
	}

	.header-nav {
		flex: 0 0 auto;
	}

	.site-header,
	.site-footer {
		.main-content-inner {
			.header-logo {
				flex: 0 1 auto;
			}
		}
	}


	/* Hamburger */
	.menu-center {
		position: relative;
		width: 2.3em;
		text-align: center;
		margin: 0 auto;
		display: inline-block;
		vertical-align: middle;
		border: 2px solid var(--wp--preset--color--tertiary);
		border-radius: 100%;
		height: 2.3em;
		padding: 0.5em;
	}

	.menu-center:before,
	.menu-center:after,
	.menu-center div {
		background: var(--wp--preset--color--tertiary);
		content: "";
		display: block;
		height: 2px;
		border-radius: 0px;
		margin: 3px 0;
		margin-top: 2px;
		transition: 0.5s;
	}

	.menu-center.menu-center-active:before {
		transform: translateY(5px) rotate(135deg);
	}

	.menu-center.menu-center-active:after {
		transform: translateY(-5px) rotate(-135deg);
	}

	.menu-center.menu-center-active div {
		transform: scale(0);
	}

	.menu-center:hover {
		background: var(--wp--preset--color--tertiary);
	}

	.menu-center:hover::before,
	.menu-center:hover::after,
	.menu-center:hover div {
		background: var(--wp--preset--color--secondary);
	}

	.menu-pullout-inner .menu-center:before,
	.menu-pullout-inner .menu-center:after,
	.menu-pullout-inner .menu-center div {
		background: var(--wp--preset--color--secondary);
	}

	.menu-pullout-inner .menu-center {
		border-color: var(--wp--preset--color--secondary);
	}

	.site-header-scrolled .menu-center:before,
	.site-header-scrolled .menu-center:after,
	.site-header-scrolled .menu-center div,
	.site-header-bg .menu-center:before,
	.site-header-bg .menu-center:after,
	.site-header-bg .menu-center div {
		background: var(--wp--preset--color--white);
	}

	.site-header-scrolled .menu-center,
	.site-header-bg .menu-center {
		border-color: var(--wp--preset--color--white);
	}


	.menu-pullout .menu-center {
		margin: 0 auto;
		display: block;
		margin-top: 3em;
	}


	.single-campaign .menu-center {
		z-index: 5;
		margin: 0 auto;
		display: block;
	}


	/* menu */

	.site-header .main-content .main-content-inner .header-main .header-logo {}

	.menu-container .menu {
		flex-wrap: wrap;
		font-size: 16px;
	}

	.menu-container .menu .menu-item {
		flex: 1 1 100%;
		padding-right: 0px;
		padding-left: 0px;
		margin-bottom: 0.75em;
		margin-left: 0;

		&:after {
			content: none;
		}
	}

	.menu-container .menu .menu-item a {
		display: inline-block;
	}

	.menu-container .menu .menu-item .sub-menu {
		position: relative;
		top: unset;
		left: unset;
		display: none;
		width: 100%;
		max-width: unset;
	}


	.menu-container .menu .menu-item .sub-menu li {
		margin-bottom: 0px;
	}

	.menu-container .menu .menu-item.menu-item-has-children:hover>.sub-menu {
		display: block;
		border: 0px;
		padding-left: 1em;
		border-left: 1px solid white;
	}

	.menu-container .menu .menu-item .sub-menu .menu-item .sub-menu {
		left: unset;
		top: unset;
		width: 100%;
	}

	.menu-container .menu .menu-item.menu-item-has-children::before,
	.menu-container .menu .menu-item.menu-item-has-children:hover::before {
		top: 0.831em;
	}

	.site-header .main-content .main-content-inner .header-main .menu-container .menu .menu-item a {
		border-right: none;
		color: var(--wp--preset--color--tertiary);
	}




}

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


/* MENU MOBILE TRIGGER */
@media only screen and (max-width: 781px) {

	.wp-block-columns.are-vertically-aligned-center.is-layout-flex.wp-block-columns-is-layout-flex {

		&>.wp-block-column:nth-child(1),
		&>.wp-block-column:nth-child(2) {

			&.has-background:before,
			.wp-block-cover {
				width: 104vw;
				right: -4vw;
			}
		}

		&>.wp-block-column:nth-child(2) {

			&.has-background:before,
			.wp-block-cover {
				left: -4vw;
				right: unset;
			}
		}


	}


	.reverse-columns-on-mobile {

		>.wp-block-column:nth-child(1) {
			order: 2;
		}

		>.wp-block-column:nth-child(2) {
			order: 1;
		}

	}


}


@media only screen and (max-width: 768px) {

	/* Flex Styling
	--------------------------------------------- */
	body .is-layout-grid.wp-block-group-is-layout-grid {
		display: flex;
		flex-direction: column;
	}



	/* Carousel
	--------------------------------------------- */

	#carousel {
		.carousel-slides {
			.carousel-slide {
				.carousel-content {
					min-height: 10.95em;
					max-width: 450px;

					.carousel-text {
						font-size: 2em;
					}
				}
			}
		}
	}



	/* Header
	--------------------------------------------- */
	.site-header,
	.site-footer {
		.main-content-inner {
			.header-logo {
				a {
					p {
						font-size: 1.5em;
					}
				}
			}
		}
	}



	.header-banner {
		.home-banner-image-container {
			padding-bottom: 75%;

			.home-banner-image {
				top: 21%;
			}
		}
	}




	/* Footer
	--------------------------------------------- */

	.site-footer {
		& .main-content-inner {
			& .footer-inner {
				flex-wrap: wrap;

				.footer-info,
				.footer-logos {
					text-align: center;
					flex: 1 1 100%;
				}

				.footer-info {
order: 2;
margin-top: 2em;
				}
			}
		}
	}

}


@media only screen and (max-width: 500px) {

	/* Flex Styling
	--------------------------------------------- */


	.site-header,
	.site-footer {
		.main-content-inner {

			.header-logo {
				a {
					p {
						font-size: 1.35em;
						line-height: 1em;
						padding-top: 0.5em;
						margin-bottom: 0.35em;
						padding-bottom: 0.3em;
					}
				}
			}


			.header-cta-button {
				font-size: 1.2em;
				text-align: center;

				a {
					white-space: nowrap;
				}

			}
		}
	}


	.site-main-default .main-content .main-content-inner {
		padding-top: 0em;
	}


	/* Menu
	--------------------------------------------- */
	.menu-pullout {
		padding-left: 5%;
		padding-right: 5%;
	}

	.menu-container .menu .menu-item:hover>a {
		border-bottom: unset;
	}

	.menu-container .menu .menu-item .sub-menu {
		padding-top: 0.5em;
		margin-bottom: 1em;
	}



	.header-banner {
		.home-banner-image-container {
			padding-bottom: 82%;

			.home-banner-image {
				top: 29%;
			}
		}
	}





	/* Carousel
	--------------------------------------------- */

	#carousel {
		.carousel-slides {
			.carousel-slide {


				.carousel-content {
					min-height: 8.75em;
					max-width: 450px;
					padding: 1em 9% 1em 0%;
				}

				&.carousel-slide-1 {

					padding: 21em 0 3em 0;

					.carousel-img {
						object-position: 65% 50%;
					}
				}

				&.carousel-slide-2 {

					padding: 3em 0 21em 0;

					.carousel-img {
						object-position: 31% 0%;
					}

					.carousel-content {

						padding: 1em 0% 1em 9%;
					}
				}

				&.carousel-slide-3 {

					padding: 21em 0 3em 0;

					.carousel-img {
						object-position: 68% 0%;
					}
				}



			}
		}
	}




	.ecampaign-postcode-search {
		#gform_2 {
			.gform-body {
				#field_2_1 {

					.gfield_label {
						white-space: nowrap;
					}
				}
			}
		}
	}




	.footer-info {
		left: unset;
		right: 0;
		max-width: 75%;
	}

	.footer-image {
		.footer-image-inner {
			padding-bottom: calc(40% + 2em);
		}
	}

	.footer-links {
		text-align: right;
	}





}