/*
Custom CSS for website theme
Version: 1.0
Description: Used to establish the look and feel for the custom website
Author: Full Spectrum Marketing
Author URL: http://www.fsm.agency
*/

/* VARIABLES */
:root {
    /* Brand Color Palette */
    --Brand-Color-Primary: #00446A;
    --Brand-Color-Secondary: #1872A7;
    --Brand-Color-3: #FFFFFF;
    --Brand-Color-4: #003051;
    --Brand-Color-5: #1C88C7;
    --Brand-Color-6: #A3C657;
	/* Default Colors */
    --Default-Black: #595454;
    --Default-White: #FFF;
    /* Typography */
    --Heading-1-Size: clamp(2.375rem, round(0.857rem + 4.857cqi, 0.5rem), 4.5rem);
    --Heading-2-Size: clamp(1.875rem, round(0.625rem + 4cqi, 0.5rem), 2.5rem);
    --Heading-3-Size: clamp(1.5rem, round(0.875rem + 2cqi, 0.5rem), 2.175rem);
    --Heading-4-Size: clamp(1.25rem, round(0.893rem + 1.143cqi, 0.5rem), 1.45rem);
    --Heading-5-Size: clamp(1.125rem, round(0.857rem + 0.857cqi, 0.5rem), 1.5rem);
    --Heading-6-Size: clamp(1.125rem, round(0.857rem + 0.857cqi, 0.5rem), 1.5rem);
    --Body-Size: clamp(0.875rem, round(0.786rem + 0.286cqi, 0.5rem), 1rem);
    --Body-Size-lg: clamp(1rem, round(0.911rem + 0.286cqi, 0.5rem), 1.125rem);
	--Font-Heading-Sans: "proxima-nova", Arial, Helvetica, sans-serif;
    --Font-Heading-Serif: "proxima-nova", Arial, Helvetica, sans-serif;
    --Font-Body: "proxima-nova", Arial, Helvetica, sans-serif;
    --Font-Body-Alt: ;
	/* Standards */
    --Line-Height-xs: 1;
    --Line-Height-s: 1.05;
    --Line-Height-m: 1.2;
    --Line-Height-l: 1.5;
    --Line-Height-xl: 2;
    --Font-Weight-Light: 300;
    --Font-Weight-Regular: 400;
    --Font-Weight-Bold: 800;
    --Font-Weight-Extra-Bold: 900;
	/* Border Radius */
	--fsm-radius-100:4px;
	--fsm-radius-200:8px;
}

div#page-container {
    overflow: hidden;
}

/*  
    Button Styles
    ─────────────────────────────────────────────────────────────
    DEFAULT = primary Ferguson button. Any new Divi Button module
    (`.et_pb_button`) inherits these styles without a CSS class.
    Optional variants (`.fsm-btn-secondary`, `.fsm-btn-alt`, etc.)
    override the default when needed.
*/

/* DEFAULT / PRIMARY — all Divi buttons + GF submit + button-like .pseudolink */
#page-container .et_pb_button,
input.gform_button,
.pseudolink {
    color: var(--Default-White) !important;
    text-align: center;
    font-style: normal;
    font-weight: 700 !important;
	font-family: var(--Font-Body);
    font-size: 18px;
    line-height: normal !important;
    letter-spacing: .32px;
	text-transform: uppercase; /* Ferguson button treatment */
    transition: ease all .3s !important;
	background-color: var(--Brand-Color-5);
    border: none;
    border-bottom: solid 4px transparent !important;
	border-color: transparent !important;
    padding: .8rem 1.3rem !important;
    padding-bottom: calc(.8rem - 4px) !important;
	border-radius: 0 !important; /* Ferguson: square buttons */
	text-decoration: none !important;
	text-underline-offset: 0.2em;
    width: fit-content;
}

#page-container .et_pb_button:hover,
#page-container .et_pb_button:focus,
input.gform_button:hover,
input.gform_button:focus,
.pseudolink:hover,
.pseudolink:focus,
.location:hover .pseudolink {
    background-color: var(--Brand-Color-Primary) !important;
	border-color: var(--Brand-Color-Primary) !important;
	color: var(--Default-White) !important;
    border-bottom: solid 4px var(--Brand-Color-Primary) !important;
	text-decoration: underline !important; /* ADA: underline on hover/focus */
    transition: ease all .3s !important;
}

#page-container .et_pb_button:focus,
input.gform_button:focus,
.pseudolink:focus {
    box-shadow: 0px 0px 14px 0px var(--Brand-Color-5);
}

/* OPTIONAL: secondary (outline) — CSS class: fsm-btn-secondary
   Also applied to Divi fullwidth-header button two */
#page-container .et_pb_button.fsm-btn-secondary,
#page-container .et_pb_button.et_pb_button_two {
	background: transparent;
	color: var(--Brand-Color-5) !important;
	border: solid 2px var(--Brand-Color-5) !important;
	padding: calc(1.5vh - 2px) !important;
    border-radius: 0 !important;
	text-decoration: none !important;
}

#page-container .et_pb_button.fsm-btn-secondary:hover,
#page-container .et_pb_button.fsm-btn-secondary:focus,
#page-container .et_pb_button.et_pb_button_two:hover,
#page-container .et_pb_button.et_pb_button_two:focus {
	background: var(--Brand-Color-Primary);
	color: var(--Brand-Color-5) !important;
	border-bottom: solid 2px var(--Brand-Color-5) !important;
	text-decoration: underline !important;
}

/* OPTIONAL: alt text-link (white) — CSS class: fsm-btn-alt */
#page-container .et_pb_button.fsm-btn-alt {
	padding: 0 !important;
	color: var(--Default-White) !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 2px solid #fff !important;
	padding-bottom: 4px !important;
	text-decoration: none !important;
}

#page-container .et_pb_button.fsm-btn-alt:hover i {
	padding-left: 5px !important;
    transition: ease all .3s !important;
}

#page-container .et_pb_button.fsm-btn-alt:hover,
#page-container .et_pb_button.fsm-btn-alt:focus {
	color: var(--Brand-Color-Primary) !important;
    background-color: transparent !important;
	border-bottom: 4px solid var(--Brand-Color-Secondary) !important;
	text-decoration: underline !important;
    box-shadow: none;
}

/* OPTIONAL: alt text-link (accent) — CSS class: fsm-btn-alt-dark */
#page-container .et_pb_button.fsm-btn-alt-dark {
	padding: 0 !important;
	color: var(--Brand-Color-5) !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 2px solid var(--Brand-Color-5) !important;
	padding-bottom: 4px !important;
	width: fit-content;
	text-decoration: none !important;
}

#page-container .et_pb_button.fsm-btn-alt-dark:hover i {
	padding-left: 5px !important;
    transition: ease all .3s !important;
}

#page-container .et_pb_button.fsm-btn-alt-dark:hover,
#page-container .et_pb_button.fsm-btn-alt-dark:focus {
	border-bottom: 4px solid var(--Brand-Color-Secondary) !important;
    background-color: transparent !important;
	text-decoration: underline !important;
    box-shadow: none;
}

/* OPTIONAL: dark CTA fill — CSS class: fsm-btn-cta */
#page-container .et_pb_button.fsm-btn-cta {
	background-color: var(--Brand-Color-4) !important;
    border-bottom: solid 4px transparent !important;
	border-color: transparent !important;
    padding: .8rem 1.3rem !important;
    padding-bottom: calc(.8rem - 4px) !important;
	border-radius: 0 !important;
	text-decoration: none !important;
}

#page-container .et_pb_button.fsm-btn-cta:hover,
#page-container .et_pb_button.fsm-btn-cta:focus {
	border-bottom: solid 4px var(--Brand-Color-Secondary) !important;
	background-color: var(--Brand-Color-Secondary) !important;
	color: var(--Default-White) !important;
	text-decoration: underline !important;
}

/* SIZE VARIANTS */
#page-container .et_pb_button.large {
    padding: 1em 2em !important;
    font-size: var(--Body-Size);
}

#page-container .et_pb_button.small {
    padding: .7em 1.3em !important;
    font-size: 14px;
}

/*
 * Universal text links — color alone is not enough for affordance:
 * no underline by default; underline on hover/focus (ADA).
 * Excludes buttons, icons, cards, and other non-inline-text chrome.
 */
#main-content a:not(
	.et_pb_button,
	.icon,
	img,
	.fsm-post-list a,
	.card,
	.exclude-style,
	.brand-logos a,
	.et_pb_button.fsm-btn-alt-dark,
	.mega-menu-link,
	.pseudolink
) {
	color: var(--Brand-Color-5);
	border-radius: 4px;
	padding: 2px;
	transition: ease all .2s;
	display: inline;
	overflow: hidden;
	text-decoration: none;
	text-underline-offset: 0.2em;
}

#main-content a:not(
	.et_pb_button,
	.icon,
	img,
	.fsm-post-list a,
	.card,
	.exclude-style,
	.brand-logos a,
	.et_pb_button.fsm-btn-alt-dark,
	.mega-menu-link,
	.pseudolink
):hover,
#main-content a:not(
	.et_pb_button,
	.icon,
	img,
	.fsm-post-list a,
	.card,
	.exclude-style,
	.brand-logos a,
	.et_pb_button.fsm-btn-alt-dark,
	.mega-menu-link,
	.pseudolink
):focus {
	border-radius: 3px;
	background-color: rgba(21, 43, 55, .2);
	text-decoration: underline;
	transition: ease all .2s;
}

/* 
    Font Sizing
*/

body.et_divi_theme h1,
body.et_divi_theme h2,
body.et_divi_theme h3,
body.et_divi_theme h4,
body.et_divi_theme h5,
body.et_divi_theme h6,
body.et_divi_theme .h1,
body.et_divi_theme .h2,
body.et_divi_theme .h3,
body.et_divi_theme .h4,
body.et_divi_theme .h5,
body.et_divi_theme .h6 {
	color: var(--Brand-Color-Primary);
	text-transform: uppercase; /* Ferguson heading treatment */
	font-weight: 800; /* Ferguson extrabold */
}

/* Links inside headings use the accent blue, not the heading navy (mirrors Ferguson); underline on hover/focus only */
body.et_divi_theme h1 a,
body.et_divi_theme h2 a,
body.et_divi_theme h3 a,
body.et_divi_theme h4 a,
body.et_divi_theme h5 a,
body.et_divi_theme h6 a,
body.et_divi_theme .h1 a,
body.et_divi_theme .h2 a,
body.et_divi_theme .h3 a,
body.et_divi_theme .h4 a,
body.et_divi_theme .h5 a,
body.et_divi_theme .h6 a {
	color: var(--Brand-Color-5);
	font-weight: var(--Font-Weight-Bold);
	border-bottom: 0;
	text-decoration: none;
	text-underline-offset: 0.2em;
}

body.et_divi_theme h1 a:hover,
body.et_divi_theme h2 a:hover,
body.et_divi_theme h3 a:hover,
body.et_divi_theme h4 a:hover,
body.et_divi_theme h5 a:hover,
body.et_divi_theme h6 a:hover,
body.et_divi_theme .h1 a:hover,
body.et_divi_theme .h2 a:hover,
body.et_divi_theme .h3 a:hover,
body.et_divi_theme .h4 a:hover,
body.et_divi_theme .h5 a:hover,
body.et_divi_theme .h6 a:hover,
body.et_divi_theme h1 a:focus,
body.et_divi_theme h2 a:focus,
body.et_divi_theme h3 a:focus,
body.et_divi_theme h4 a:focus,
body.et_divi_theme h5 a:focus,
body.et_divi_theme h6 a:focus,
body.et_divi_theme .h1 a:focus,
body.et_divi_theme .h2 a:focus,
body.et_divi_theme .h3 a:focus,
body.et_divi_theme .h4 a:focus,
body.et_divi_theme .h5 a:focus,
body.et_divi_theme .h6 a:focus {
	text-decoration: underline;
}

body.et_divi_theme h1 {
    font-size: var(--Heading-1-Size);
	font-weight:var(--Font-Weight-Bold);
	font-family:var(--Font-Heading-Sans);
}

body.et_divi_theme h2 {
    font-size: var(--Heading-2-Size);
	font-weight:var(--Font-Weight-Bold);
	font-family:var(--Font-Heading-Serif);
}

body.et_divi_theme h3 {
    font-size: var(--Heading-3-Size);
	font-family:var(--Font-Heading-Sans);
	font-weight:var(--Font-Weight-Bold);

}

body.et_divi_theme h4 {
    font-size: var(--Heading-4-Size);
	font-family:var(--Font-Heading-Serif);
    font-weight: var(--Font-Weight-Bold);
}

body.et_divi_theme h5 {
    font-size: var(--Heading-5-Size);
	font-family:var(--Font-Heading-Serif);
}

body.et_divi_theme h6 {
    font-size: var(--Heading-6-Size);
}

body,
body p,
body li {
    font-size: var(--Body-Size);
	font-family:var(--Font-Body);
	line-height:var(--Line-Height-l);
	font-weight: var(--Font-Weight-Regular);
	color: var(--Default-Black);
}

body small {
    font-size: clamp(.5rem, 1.25cqi, .8rem);
}

/*Blog Font Sizes*/
.post-template-default {
    h1 {
        &.entry-title {
            font-size: clamp(1.75rem, round(1.125rem + 2cqi, 0.5em), 2.625rem) !important;
        }
    }

    h2 {
        font-size: clamp(1.5rem, round(0.875rem + 2cqi, 0.5em), 2.375rem) !important;
    }

    h3 {
        font-size: clamp(1.25rem, round(0.75rem + 2cqi, 0.5em), 2.125rem) !important;
    }

    h4 {
        font-size: clamp(1.125rem, round(0.625rem + 2cqi, 0.5em), 1.875rem) !important;
    }

    h5 {
        font-size: clamp(1rem, round(0.5rem + 2cqi, 0.5em), 1.625rem) !important;
    }

    h6 {
        font-size: clamp(0.875rem, round(0.375rem + 2cqi, 0.5em), 1.375rem) !important;
    }
}

/*CUSTOM FONT STYLES*/


/*END FONT STYLE*/

/*
MENU STYLES
*/

#logo {
        max-height: 150%!important;
        position: absolute;
        top: -25px;
		z-index:9;
}

/* IF MENU does not have secondary menu
#logo {
        max-height: 150%!important;
        position: absolute;
        top: 0;
		z-index:9;
}
*/

@media only screen and (max-width:980px) {
#logo {
        max-height: 100%!important;
        top: 0;
	}
	
	#page-container #main-header {
        top: 20px !important;
		padding-bottom:20px;
    }
}

/*
 * GLOBAL HEADER — Ferguson-style main nav
 * Utility bar (MMM secondary-menu = phone) + white bar (MMM primary-menu + Vault Login chip)
 */

/* Utility bar — navy full-bleed; inner row matches main header content width */
.prd-global-header__utility {
	background-color: #00446a !important; /* var(--Brand-Color-Primary) */
	padding: 0 !important;
	min-height: 37.5px;
	z-index: 100000;
}

.prd-global-header__utility .prd-global-header__utility-row {
	display: flex !important;
	justify-content: flex-end !important;
	align-items: center !important;
	width: 80% !important;
	max-width: 1080px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 !important;
}

.prd-global-header__utility .prd-global-header__utility-row > .et_pb_column,
.prd-global-header__utility .et_pb_code,
.prd-global-header__utility .et_pb_code_inner {
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

.prd-global-header__utility #mega-menu-wrap-secondary-menu {
	background-color: transparent !important;
	min-height: 37.5px;
	height: auto !important;
	clear: none !important;
	display: flex !important;
	justify-content: flex-end !important;
	align-items: center !important;
}

.prd-global-header__utility #mega-menu-wrap-secondary-menu .mega-menu-toggle {
	display: none !important;
}

.prd-global-header__utility #mega-menu-wrap-secondary-menu #mega-menu-secondary-menu {
	display: flex !important;
	flex-wrap: nowrap;
	justify-content: flex-end !important;
	align-items: center !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
}

/* Secondary utility phone — white text on navy; underline on hover/focus only */
.prd-global-header__utility #mega-menu-wrap-secondary-menu #mega-menu-secondary-menu > li.mega-menu-item.prd-utility-phone {
	margin: 0 !important;
	flex: 0 0 auto;
}

.prd-global-header__utility #mega-menu-wrap-secondary-menu #mega-menu-secondary-menu > li.mega-menu-item.prd-utility-phone > a.mega-menu-link {
	display: inline-flex !important;
	align-items: center !important;
	padding: 8px 0 !important;
	margin: 0 !important;
	color: #fff !important;
	font-family: var(--Font-Body) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-transform: none !important;
	text-decoration: none !important;
	text-underline-offset: 0.2em;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	white-space: nowrap !important;
}

.prd-global-header__utility #mega-menu-wrap-secondary-menu #mega-menu-secondary-menu > li.mega-menu-item.prd-utility-phone > a.mega-menu-link:hover,
.prd-global-header__utility #mega-menu-wrap-secondary-menu #mega-menu-secondary-menu > li.mega-menu-item.prd-utility-phone > a.mega-menu-link:focus {
	color: #fff !important;
	background: transparent !important;
	text-decoration: underline !important;
}

.prd-global-header {
	background-color: #fff !important;
	border-top: 0px solid #e5e5e5 !important;
	border-bottom: 0px solid #e5e5e5 !important;
	z-index: 99999;
}

.prd-global-header .prd-global-header__row {
	display: flex !important;
	align-items: flex-end;
	width: 80% !important;
	max-width: 1080px !important;
	flex-wrap: wrap;
}

.prd-global-header .prd-global-header__logos {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 0.75rem;
	position: relative !important;
	min-height: 0 !important;
	height: auto !important;
}

/* Prevent Divi equal-height / float stacking from overlapping logos */
.prd-global-header .prd-global-header__logos .et_pb_module,
.prd-global-header .prd-global-header__logos .prd-global-header__logo,
.prd-global-header .prd-global-header__logos .et_pb_image_0_tb_header,
.prd-global-header .prd-global-header__logos .et_pb_image_1_tb_header {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	float: none !important;
	display: inline-flex !important;
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: none !important;
	margin: 8px 0 !important;
	padding: 0 !important;
	vertical-align: middle;
}

.prd-global-header .prd-global-header__logo a,
.prd-global-header .prd-global-header__logo .et_pb_image_wrap {
	display: inline-flex !important;
	align-items: center;
	position: relative !important;
	width: auto !important;
	line-height: 0;
}

.prd-global-header .prd-global-header__logo img,
.prd-global-header .prd-global-header__logo--ferguson img,
.prd-global-header .prd-global-header__logo--prd img,
.prd-global-header .et_pb_image_0_tb_header img,
.prd-global-header .et_pb_image_1_tb_header img {
	display: block !important;
	height: 52px !important;
	max-height: 52px !important;
	width: auto !important;
	max-width: none !important;
	object-fit: contain;
}

/* Beat Divi dynamic CSS (.et_pb_image_0_tb_header{width:180px}) if it regenerates */
body #page-container .prd-global-header .et_pb_image_0_tb_header,
body #page-container .prd-global-header .et_pb_image_1_tb_header,
body #page-container .prd-global-header .prd-global-header__logo {
	width: auto !important;
	max-width: none !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.prd-global-header .prd-global-header__nav {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}

.prd-global-header .prd-global-header__nav .et_pb_code,
.prd-global-header .prd-global-header__nav .et_pb_code_inner {
	width: 100%;
}

.prd-global-header #mega-menu-wrap-primary-menu {
	background: transparent !important;
	clear: none !important;
}

.prd-global-header #mega-menu-wrap-primary-menu .mega-menu-toggle {
	background: transparent !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu {
	display: flex !important;
	flex-wrap: nowrap;
	justify-content: flex-end;
	float: none !important;
	text-align: right;
	align-items: flex-end; /* DO NOT change to center — keeps nav + Vault Login on one baseline */
	padding: 0 !important;
	margin: 0 !important;
	width: 100%;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item {
	display: inline-flex !important;
	margin: 0 !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link {
	display: inline-flex !important;
	align-items: center;
	position: relative;
	padding: 15px !important;
	margin: 0 !important;
	color: var(--Brand-Color-Primary) !important;
	font-family: var(--Font-Body) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	opacity: 1 !important;
	transition: color .5s ease, background-color .5s ease !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link:hover,
.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link:focus {
	color: #fff !important;
	background-color: var(--Brand-Color-Primary) !important;
	text-decoration: underline !important;
	text-underline-offset: 0.2em;
	opacity: 1 !important;
}

/*
 * Vault Login chip (class from Ferguson Configurator pattern).
 * End of primary nav — light fill + icon + underline hover (no invert).
 */
.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve {
	margin: 0 !important;
	flex: 0 0 auto;
	align-self: flex-end;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.35rem;
	flex: 0 0 auto;
	width: auto !important;
	max-width: none !important;
	height: auto !important;
	padding: 8px 12px !important;
	margin: 0 !important;
	color: var(--Brand-Color-Primary) !important;
	font-family: var(--Font-Body) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-transform: capitalize !important;
	text-decoration: none !important;
	text-underline-offset: 0.2em;
	white-space: nowrap !important;
	background-color: #f0f3f5 !important;
	background-image: none !important;
	border: none !important;
	outline: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	opacity: 1 !important;
	transition: text-decoration .2s ease !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:hover,
.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:focus {
	color: var(--Brand-Color-Primary) !important;
	background-color: #f0f3f5 !important;
	text-decoration: underline !important;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	opacity: 1 !important;
}

.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link::before {
	content: "" !important;
	display: inline-block !important;
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	margin: 0 !important;
	padding: 0 !important;
	background-image: url("../images/icon-valve-configurator.svg") !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center !important;
}

@media only screen and (max-width: 980px) {
	.prd-global-header .prd-global-header__row,
	.prd-global-header__utility .prd-global-header__utility-row {
		width: 90% !important;
	}

	.prd-global-header .prd-global-header__logos {
		gap: 0.35rem;
	}

	.prd-global-header .prd-global-header__logo img,
	.prd-global-header .prd-global-header__logo--ferguson img,
	.prd-global-header .prd-global-header__logo--prd img {
		height: 40px !important;
		max-height: 40px !important;
	}

	.prd-global-header .prd-global-header__nav {
		justify-content: flex-end !important;
	}

	.prd-global-header #mega-menu-wrap-primary-menu .mega-menu-toggle {
		background: transparent !important;
		display: flex;
		justify-content: flex-end;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu {
		flex-wrap: wrap;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link {
		width: 100%;
		justify-content: flex-start;
		color: var(--Brand-Color-Primary) !important;
		background-color: transparent !important;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link:hover,
	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item > a.mega-menu-link:focus {
		color: #fff !important;
		background-color: var(--Brand-Color-Primary) !important;
		text-decoration: underline !important;
		text-underline-offset: 0.2em;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve {
		width: 100%;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link,
	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:hover,
	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:focus {
		width: 100% !important;
		justify-content: flex-start !important;
		color: var(--Brand-Color-Primary) !important;
		background-color: #f0f3f5 !important;
		text-decoration: none !important;
	}

	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:hover,
	.prd-global-header #mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-item.design-tool-automated-valve > a.mega-menu-link:focus {
		text-decoration: underline !important;
	}
}

/*END MENU*/

/* GLOBAL FORM STYLES */
.gform_wrapper.gravity-theme .gform_validation_errors > h2 {
    font-weight: var(--Font-Weight-Bold) !important;
}

.gform_wrapper.gravity-theme .gform_validation_errors {
    padding: 1em 1em 1em 3em !important;
}

.gform_wrapper.gravity-theme .gfield_validation_message,
.gform_wrapper.gravity-theme .validation_message {
    font-size: 14px !important;
    border-radius: 5px !important;
    padding: .5em .5em .5em 40px !important;
}

.gform_wrapper.gravity-theme .validation_message {
    position: relative;
}

.gform_wrapper.gravity-theme .validation_message::before {
    position: absolute;
    font-family: 'Font Awesome 6 Pro';
    font-weight: var(--Font-Weight-Extra-Bold);
    color: #c02b0a;
    font-size: 20px;
    content: '\f057';
    margin-left: -28px;
}
#page-container .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), #page-container .gform_wrapper textarea.textarea, #page-container div.form_saved_message div.form_saved_message_emailform form input[type=text]{
	    padding: .5vh 1vh!important;
	border-radius: var(--fsm-radius-100)!important;;
border: 1px solid #969696;
background: var(--Default-White);
}

/* CUSTOM FORM STYLES */
/* END FORM STYLES */


/* Slick Defaults */
.slick-slide {
	margin-bottom:0!important;
}

.slick-arrow {
    font-size: 20px !important;
    transition: all .5s ease;
	color:var(--Brand-Color-Primary);
}

.slick-arrow:hover {
    cursor: pointer;
    transition: all .5s ease;
    scale: 1.1 !important;
}

i.slick-arrow:active{
	transition: all .5s ease;
    scale: 1.1 !important;
}

.button-container .slick-arrow:first-child{
  margin-right:5px;
}

.button-container .slick-arrow:last-child{
  margin-left:5px;
}

.left{
    text-align: left;
    align-items: flex-start;	
}

.right{
	text-align: right;
	align-items: flex-end;

}


/*RESUSABLE*/

.flex {
    display: flex;
}

.grid {
    display: grid;
}

#fast-gard-dyna .et_pb_row{
    padding: 5vh;

}

#fast-gard-dyna .et_pb_main_blurb_image img{
    display: flex;
    align-items:start;
    width:150px;
    height: 90px;
    object-fit: contain;
}

div#fast-gard-dyna .et_pb_main_blurb_image {
    margin-bottom: 15px!important;
}

.blue-border-top{
    border-top: 10px solid var(--Brand-Color-5);
}

/*.cta-blurbs-section: set left-aligned icon image width*/
.cta-blurbs-section .et_pb_main_blurb_image{
    width: 50px !important;
}

.cta-blurbs-section{
    margin-bottom: 5vh;
}


/*START PAGE ORGANIZATION*/

/*
HOMEPAGE
*/
/*HERO Styles*/

/*
 * Hero navy bar — mirrors Ferguson's #hero .header-bar
 * (full-bleed rgba(0,68,106,.9)). Applied to .header-content so the
 * bar sits behind the full title + body copy block, not just the h1.
 */
#home-hero,
#home-hero .et_pb_fullwidth_header {
	overflow: visible;
}

/*
 * Match Divi page content width (.et_pb_row = 80% / max 1080px)
 * and keep hero copy left-aligned. Divi's centered fullwidth header
 * defaults to max-width:800px and text-align:center — override both.
 */
#home-hero .et_pb_fullwidth_header,
#home-hero .et_pb_fullwidth_header_container,
#home-hero .header-content-container,
#home-hero .header-content {
	text-align: left !important;
}

#home-hero .et_pb_fullwidth_header_container {
	width: 81% !important;
	max-width: 1155px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

#home-hero .header-content-container,
#home-hero .header-content {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

#home-hero .header-content {
	position: relative;
	z-index: 2;
	padding: 1.25rem 0;
}

#home-hero .header-content::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	margin-left: -50vw;
	background: rgba(0, 68, 106, 0.9);
	z-index: -1;
	pointer-events: none;
}

#home-hero h1.et_pb_module_header,
.hero h1.et_pb_module_header {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	margin: 0 0 1rem;
	padding: 0;
	color: var(--Default-White);
	background: transparent;
	text-align: left;
	font-size: clamp(2.375rem, round(0.857rem + 4.857cqi, 0.5rem), 3.5rem);
	font-weight: 800;
}

#home-hero .et_pb_header_content_wrapper,
#home-hero .et_pb_header_content_wrapper p,
#home-hero .et_pb_header_content_wrapper strong,
.hero .et_pb_header_content_wrapper,
.hero .et_pb_header_content_wrapper p,
.hero .et_pb_header_content_wrapper strong {
	color: var(--Default-White);
	text-align: left;
	/* Ferguson body type — Proxima Nova (licensed kit in WP head); Arial fallback */
	font-size: 16px;
	font-family: var(--Font-Body);
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.5;
}

span.et_pb_fullwidth_header_subhead{
	font-size:clamp(1.125rem, round(0.857rem + 0.857cqi, 0.5em), 1.5rem);	
	font-family:var(--Font-Body);
	line-height:var(--Line-Height-m);
	font-weight: 400;
}

.field-services .grid {
    grid-template-columns: repeat(3, 1fr) !important;
	gap:2vh;
}

.field-services .grid img {
margin:auto auto;
}

.brand-logos {
    display: grid;
	grid-template-columns: repeat(5, 1fr) !important;
	gap:2vh;
}

.brand-logos a{
	padding:0!important;
	transition: .3s ease all;
}

.brand-logos img {
    border: 1px solid rgba(22, 36, 40, 0.20);
    border-radius: var(--fsm-radius-100);
    min-width: 100%;
    max-height: 145px;
    object-fit: contain;
    height: 100%;
    padding: 20px;
}

.et_pb_row.half-width .et_pb_column {
    max-width: 50%;
}

.et_pb_row.forty-width .et_pb_column {
    max-width: 40%;
}

.et_pb_row.forty-five-width .et_pb_column {
    max-width: 45%;
}

div#where-we-serve .et_pb_row{
	position:relative;
}

div#where-we-serve .et_pb_row::before{
	content: '';
    position: absolute;
    width: 40%;
    height: 100%;
    background: url(/wp-content/uploads/2025/05/Service-Map-revMay5.png);
    background-position: 50% 15%;
    background-size: auto;
    background-repeat: no-repeat!important;
    top: 0;
    right: 4vw;
}

.cta-content {
    padding: 38px;
    background-color: var(--Brand-Color-Primary);
    border-radius: var(--fsm-radius-200);
}

.vault-graphic svg{
    background: url(<path-to-image>) #FFFFFF 100% / contain no-repeat;
    mix-blend-mode: multiply;
}

.brand-logos a:hover {
    scale: 1.1;
    transition: .3s ease all;
}

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

	.et_pb_fullwidth_header .et_pb_fullwidth_header_container .et_pb_button_one{
		margin-right:0;
	}
	
	.et_pb_fullwidth_header .et_pb_fullwidth_header_container{
    width: 85%;
    margin-left: auto!important;
    margin-right: auto!important; 
    }

    .et_pb_row.forty-five-width .et_pb_column {
        max-width: 100%;
    }
	
    .et_pb_row.forty-width .et_pb_column {
        max-width: 100%;
    }
	
	  #vault .et_pb_row{
		  display:flex;
          flex-direction: column;
      }
            
            #vault .mob-col-2 {
                order: 2;
            }
            
            #vault .mob-col-1 {
                order: 1;
            }
        
	div#where-we-serve .et_pb_row::before {
        content: '';
        position: absolute;
        width: 50%;
        background: url(/wp-content/uploads/2025/03/Service-Map.png);
        background-position: center;
        background-size: contain;
        top: 0;
        right: -8%;
    }
	
	.cta-content{
	padding: 0;
    background-color: unset;
    border-radius: unset;
	}
	
	.brand-logos {
    display: unset;
	}
	
	.brand-logos img{
		min-width:unset!important;
        max-width: 95%;
		height: auto;
		padding: 10px;
        margin: 10px;
	}

	.brand-logos .slick-track {
    display: flex;
    height: auto;
    }
	
	.services i{
		color:var(--Default-White);
	}
}

/*end homepage*/

/*PRODUCTS PAGE*/

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

/*Blog Section*/


/*END*/


/*
BLOG
*/
/*END*/

/*END*/

/*Please select 1 of the 3 Blog Article Templates & discard unused*/
/*
ALL POSTS OPTION 1
*/

/*END*/

/*
ALL POSTS OPTION 2
*/


/*END*/

/*
ALL POSTS OPTION 3
*/


/*END*/



/*
ABOUT
*/
/*END*/

/*
CONTACT
*/
/*END*/

/*SPLASH PAGE*/

#splash-hero {
    padding: 0;
}

#splash-hero .et_pb_row {
    padding: 1vh 0 ;
}

#splash-hero div.et_pb_button_module_wrapper.et_pb_button_0_wrapper.et_pb_module{
    margin-bottom: 0 !important;
}

#splash-hero-btn-flex{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

#splash-hero-btn-flex .et_pb_button:first-child{
    margin-right: 2vh;
}

@media only screen and (min-width:768px){
    .two-companies .et_pb_text_inner{
        width: 85%;
    }
}

.et_pb_header_content_wrapper p{
    font-size: var(--Heading-4-Size);
}

.location{
    border: 1px solid rgba(0,0,0,.3);
    padding: 3vh;
    border-radius: 5px;
    transition: .2s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.location:hover{
    box-shadow: 4px 5px 5px 0px rgba(0,0,0,0.20);
    transition: .2s ease;
}

/* Kill any leftover Divi Theme Options green accent on Vault Login */
#vault-asset p.pseudolink:hover,
#vault-asset p.pseudolink:focus {
    border-bottom: solid 4px var(--Brand-Color-Primary) !important;
}

@media only screen and (max-width: 980px) {
	#splash-hero-btn-flex {
		display: flex;
		justify-content: flex-end;
		align-items: flex-start;
		flex-direction: column;
		gap: 15px;
	}

	#vault-asset .et_pb_row {
		display: flex;
		flex-direction: column-reverse;
		gap: 1rem;
		padding: 0;
	}
}


/*FOOTER*/

#footer.et_pb_section,
#footer {
	background-color: var(--Brand-Color-Primary) !important; /* #00446A */
}

#footer h2,
#footer h3,
#footer h4,
#footer .et_pb_text_inner,
#footer li,
#footer p {
	color: var(--Default-White);
}

#footer h3,
#footer h4 {
	font-size: var(--Heading-4-Size);
}

#footer a,
#subfooter a {
	text-decoration: none;
	text-underline-offset: 0.2em;
	color: #fff;
}

#footer a:hover,
#footer a:focus,
#subfooter a:hover,
#subfooter a:focus {
	text-decoration: underline;
}

/* Footer top row — 4 equal sections: logos | address | Portersville | Basin Valve */
#footer .prd-footer__row {
	display: flex !important;
	flex-wrap: nowrap;
	align-items: flex-start !important;
	justify-content: space-between !important;
	gap: 1.5rem;
	width: 80% !important;
	max-width: 1080px !important;
}

#footer .prd-footer__row > .et_pb_column {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
	flex: 1 1 0 !important;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
}

/* Logos stacked: company (PRD) above Ferguson */
#footer .prd-footer__logos {
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	gap: 0.75rem;
}

#footer .prd-footer__logos > .et_pb_module {
	width: auto !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

#footer .prd-footer__logo img {
	display: block !important;
	height: 40px !important;
	width: auto !important;
	max-width: 100% !important;
	object-fit: contain;
}

/* CMYK Ferguson mark is navy — invert to white on primary footer bg */
#footer .prd-footer__logo--ferguson img {
	filter: brightness(0) invert(1);
}

#footer .prd-footer__logo--prd img {
	height: 48px !important;
}

#footer .prd-footer__address,
#footer .prd-footer__address .et_pb_text_inner,
#footer .prd-footer__address p {
	margin: 0 !important;
	line-height: 1.35;
}

#footer .prd-footer__location h3 {
	margin-top: 0;
}

@media only screen and (max-width: 980px) {
	#footer .prd-footer__row {
		flex-wrap: wrap;
		width: 90% !important;
	}

	#footer .prd-footer__row > .et_pb_column {
		flex: 1 1 calc(50% - 0.75rem) !important;
	}
}

@media only screen and (max-width: 480px) {
	#footer .prd-footer__row > .et_pb_column {
		flex: 1 1 100% !important;
	}
}

.footer-menu ul{
	list-style-type:none;
	padding-left:0;
}

.footer-grid{
    display: grid;
    grid-template-columns: auto auto !important;
    grid-gap: 2vh!important;
}

@media only screen and (max-width:768px){
    .footer-grid{
        grid-template-columns: auto !important;
}
}


.footer-menu .col {
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
}

.flex-logos-end{
    display: flex;
    justify-content: end;
}

.flex-logos-end img{
    padding-left: 10px;
    transform: scale(.9);
}

.copyright a{
	color:#fff!important;
}

@media only screen and (max-width:768px){
    .flex-logos-end{
        justify-content:center;
    }
}

.footer-menu div{
	width:100%;
}

.footer-menu ul li a{
    color: var(--Default-White)!important;
	text-decoration:none;
	text-underline-offset: 0.2em;
	font-family:var(--Font-Body)!important;
	font-weight:var(--Font-Weight-Regular)!important;
}

.footer-menu ul li a:hover,
.footer-menu ul li a:focus {
	text-decoration: underline;
}

footer a.parent {
    color: var(--Default-White)!important;
	font-family:var(--Font-Body)!important;
	font-weight:var(--Font-Weight-Bold)!important;
	font-size:20px;
	text-decoration:none!important;
}

footer a.icon.et_pb_with_border{
	background-color:var(--Brand-Color-Primary)!important;
}




/** Reusables **/

.grid{
	display:grid;
}

.two-col{
	grid-template-columns: repeat(2, 1fr) !important;
    grid-gap: 2vh!important;
}

.three-col{
	grid-template-columns: repeat(3, 1fr) !important;
    grid-gap: 2vh!important;
}

.align-center{
	align-content:center;
	align-items:center;
}

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

.two-col,
	.three-col{
	grid-template-columns: repeat(1, 1fr) !important;
}
	

}