:root {
	
	--dci-white: #fff;
	--dci-white-rgb: 255, 255, 255;
	--dci-green: #8cc63f;
	--dci-green-rgb: 140, 198, 63;
	--dci-bluegrey: #323e48;
	--dci-bluegrey-rgb: 54, 55, 55;
	--dci-bluegrey-dark: #3e4854;
	--dci-bluegrey-darker: #141c24;
	--dci-bluegrey-light: #404c5a;
	--dci-lightblue: #9ab2c7;
	--dci-blue: #3f8cc6;
	--dci-blue-rgb: 63, 140, 198;
	--dci-lightgrey: #dfdfdf;
	--dci-mediumgrey: #e5e5e5;
	--dci-darkgrey: #363737;
	--dci-grey: #9a9a9a;
	--dci-purple: #c63f8c;
	--dci-purple-rgb: 198, 63, 140;		
	--dci-lighterblue: #4280b0;
	--dci-lighterblue-rgb: 66, 128, 176;

	--font-family: 'Nunito Sans', sans-serif;
}


/* ***************************************************** */
/* OVERWRITES */
/* ***************************************************** */

.bg-dci-green,
.bg-primary { background-color: var(--dci-green) !important; }
.bg-dci-bluegrey,
.bg-secondary { background-color: var(--dci-bluegrey) !important; }
.bg-dci-bluegrey-light { background-color: var(--dci-bluegrey-light) !important; }
.bg-dci-blue { background-color: var(--dci-blue) !important; }
.bg-dci-purple { background-color: var(--dci-purple) !important; }

.text-dci-green  { color: var(--dci-green); }
.text-dci-bluegrey  { color: var(--dci-bluegrey); }
.text-dci-white  { color: #fff; }
.text-dci-grey  { color: var(--dci-grey); }
.text-dci-blue  { color: var(--dci-blue); }
.text-dci-lightblue  { color: var(--dci-lightblue); }

.border-bottom-bluegrey { border-bottom: 2px solid var(--dci-bluegrey); }
.rounded { border-radius: 0.6em !important; }
.rounded-top { border-top-left-radius: 0.6em !important; border-top-right-radius: 0.6em !important; }
.rounded-right { border-top-right-radius: 0.6em !important; border-bottom-right-radius: 0.6em !important; }
.rounded-bottom { border-bottom-right-radius: 0.6em !important; border-bottom-left-radius: 0.6em !important; }
.rounded-left { border-top-left-radius: 0.6em !important; border-bottom-left-radius: 0.6em !important; }
.rounded-top-left { border-top-left-radius: 0.6em !important; }
.rounded-top-right { border-top-right-radius: 0.6em !important; }
.rounded-bottom-left { border-bottom-left-radius: 0.6em !important; }
.rounded-bottom-right { border-bottom-right-radius: 0.6em !important; }
@media (min-width: 992px) {
	.rounded-lg-top { border-top-left-radius: 0.6em !important; border-top-right-radius: 0.6em !important; }
	.border-lg-bottom  { border-bottom: 1px solid #dee2e6 !important; }
	.rounded-lg-top-left { border-top-left-radius: 0.6em !important; }
	.rounded-lg-bottom-left { border-bottom-left-radius: 0.6em !important; }
	.rounded-lg-bottom-right { border-bottom-right-radius: 0.6em !important; }
	.rounded-lg-none { border-radius: 0 !important; }
	.border-lg-right-0 { border-right: none !important; }
}

.lead { font-size: 1.25em; font-weight: 300; }
.font-weight-semi { font-weight: 600 !important; }

.btn, .wpcf7 input[type="submit"] { font-size: 1em; border-radius: 0.6em; text-transform: lowercase; font-weight: 600; }
.btn-group-lg > .btn, .btn-lg { padding: .5rem 1rem; font-size: 1.25em; line-height: 1.5; }

button:focus { outline: none; }

.btn-primary { color: #fff; background-color: var(--dci-green); border-color: var(--dci-green); }
	.btn-primary:hover {color: #fff; background-color: var(--dci-green); border-color: var(--dci-green); webkit-filter: brightness(90%); filter: brightness(90%); }
	.btn-primary:focus, .btn-primary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-green-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-green-rgb), 0.5); }
	.btn-primary.disabled, .btn-primary:disabled { color: #fff; background-color: var(--dci-green); border-color: var(--dci-green); }
	.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
	.show > .btn-primary.dropdown-toggle { color: #fff; background-color: var(--dci-green); border-color: var(--dci-green); }
	.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
	.show > .btn-primary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-green-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-green-rgb), 0.5); }
	
.btn-secondary { color: #fff; background-color: var(--dci-bluegrey); border-color: var(--dci-bluegrey); }
	.btn-secondary:hover { color: #fff; background-color: var(--dci-bluegrey); border-color: var(--dci-bluegrey); webkit-filter: brightness(90%); filter: brightness(90%); }
	.btn-secondary:focus, .btn-secondary.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-bluegrey-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-bluegrey-rgb), 0.5); }
	.btn-secondary.disabled, .btn-secondary:disabled { color: #fff; background-color: var(--dci-bluegrey); border-color: var(--dci-bluegrey); }
	.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
	.show > .btn-secondary.dropdown-toggle { color: #fff; background-color: var(--dci-bluegrey); border-color: var(--dci-bluegrey); }
	.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
	.show > .btn-secondary.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-bluegrey-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-bluegrey-rgb), 0.5); }

.btn-opaque { color: #fff; background-color: rgba(255,255,255, 0.05); border-color: rgba(255,255,255, 0.3); }
	.btn-opaque:hover { color: #fff; background-color: rgba(255,255,255, 0.15); border-color: rgba(255,255,255, 0.3); }
	.btn-opaque:focus, .btn-opaque.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255,255,255, 0.2); box-shadow: 0 0 0 0.2rem rgba(255,255,255, 0.2); }
	.btn-opaque.disabled, .btn-opaque:disabled { color: #fff; background-color: rgba(255,255,255, 0.05); border-color: rgba(255,255,255, 0.3); }
	.btn-opaque:not(:disabled):not(.disabled):active, .btn-opaque:not(:disabled):not(.disabled).active,
	.show > .btn-opaque.dropdown-toggle { color: #fff; background-color: rgba(255,255,255, 0.05); border-color: rgba(255,255,255, 0.3); }
	.btn-opaque:not(:disabled):not(.disabled):active:focus, .btn-opaque:not(:disabled):not(.disabled).active:focus,
	.show > .btn-opaque.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(255,255,255, 0.2); box-shadow: 0 0 0 0.2rem rgba(255,255,255, 0.2); }

.btn-blue { color: #fff; background-color: var(--dci-blue); border-color: var(--dci-blue); }
	.btn-blue:hover { color: #fff; background-color: var(--dci-blue); border-color: var(--dci-blue); webkit-filter: brightness(90%); filter: brightness(90%); }
	.btn-blue:focus, .btn-blue.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-blue-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-blue-rgb), 0.5); }
	.btn-blue.disabled, .btn-blue:disabled { color: #fff; background-color: var(--dci-blue); border-color: var(--dci-blue); }
	.btn-blue:not(:disabled):not(.disabled):active, .btn-blue:not(:disabled):not(.disabled).active,
	.show > .btn-blue.dropdown-toggle { color: #fff; background-color: var(--dci-blue); border-color: var(--dci-blue); }
	.btn-blue:not(:disabled):not(.disabled):active:focus, .btn-blue:not(:disabled):not(.disabled).active:focus,
	.show > .btn-blue.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-blue-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-blue-rgb), 0.5); }
	
.btn-purple { color: #fff; background-color: var(--dci-purple); border-color: var(--dci-purple); }
	.btn-purple:hover { color: #fff; background-color: var(--dci-purple); border-color: var(--dci-purple); webkit-filter: brightness(90%); filter: brightness(90%); }
	.btn-purple:focus, .btn-purple.focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-purple-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-blue-rgb), 0.5); }
	.btn-purple.disabled, .btn-purple:disabled { color: #fff; background-color: var(--dci-purple); border-color: var(--dci-purple); }
	.btn-purple:not(:disabled):not(.disabled):active, .btn-purple:not(:disabled):not(.disabled).active,
	.show > .btn-purple.dropdown-toggle { color: #fff; background-color: var(--dci-purple); border-color: var(--dci-purple); }
	.btn-purple:not(:disabled):not(.disabled):active:focus, .btn-purple:not(:disabled):not(.disabled).active:focus,
	.show > .btn-purple.dropdown-toggle:focus { -webkit-box-shadow: 0 0 0 0.2rem rgba(var(--dci-purple-rgb), 0.5); box-shadow: 0 0 0 0.2rem rgba(var(--dci-purple-rgb), 0.5); }
	
.embed-responsive .embed-responsive-item { z-index: 2; }
.embed-responsive .spinner-border { z-index: 1; position: absolute; left: 50%; top: 50%; margin: -1rem 0 0 -1rem; }


/* ***************************************************** */
/* FORMS */
/* ***************************************************** */

.form-control:focus, .wpcf7 .wpcf7-validation-errors:focus, .wpcf7 input:focus[type="color"], .wpcf7 input:focus[type="date"], .wpcf7 input:focus[type="datetime-local"], .wpcf7 input:focus[type="datetime"], .wpcf7 input:focus[type="email"], .wpcf7 input:focus[type="file"], .wpcf7 input:focus[type="month"], .wpcf7 input:focus[type="number"], .wpcf7 input:focus[type="range"], .wpcf7 input:focus[type="search"], .wpcf7 input:focus[type="submit"], .wpcf7 input:focus[type="tel"], .wpcf7 input:focus[type="text"], .wpcf7 input:focus[type="time"], .wpcf7 input:focus[type="url"], .wpcf7 input:focus[type="week"], .wpcf7 select:focus, .wpcf7 textarea:focus
	{ border-color: var(--dci-green); -webkit-box-shadow: 0 0 0 .2rem rgba( var(--dci-green-rgb) ,.25); box-shadow: 0 0 0 .2rem rgba( var(--dci-green-rgb) ,.25); }

.custom-control-label { display: inline; }
.custom-control-label span { vertical-align: sub; display: inline-block; }
.custom-control-label:before { border: 1px solid #adb5bd; }
.custom-control-input:checked ~ .custom-control-label:before { border-color: var(--dci-green); background-color: var(--dci-green); }
.custom-control-input:not(:disabled):active ~ .custom-control-label:before { background-color: var(--dci-green); border-color: var(--dci-green); }
.custom-control-input:focus ~ .custom-control-label:before { -webkit-box-shadow: 0 0 0 .2rem rgba( var(--dci-green-rgb) ,.25); box-shadow: 0 0 0 .2rem rgba( var(--dci-green-rgb) ,.25); }


/* ***************************************************** */
/* GENERAL */
/* ***************************************************** */

body { min-width: 330px; font-family: var(--font-family); font-size: 13px; line-height: 1.4; color: var(--dci-darkgrey); }

a { color: var(--dci-bluegrey); }
a:hover { color: var(--dci-bluegrey-dark); }
a:focus { outline: none; }

.cover-image { background-position: center; background-repeat: no-repeat; background-size: cover; }

.logoBgShow { position: relative; }
.logoBg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; }
.logoBgInner { 
	transform: rotate(-5deg) ;
	-webkit-transform: rotate(-5deg) ;
	-moz-transform: rotate(-5deg) ;
	-o-transform: rotate(-5deg) ;
	-ms-transform: rotate(-5deg) ;
}
.logoBgInner svg { width: 122vw; margin-left: -13vw; margin-top: 5vh }
.logoBgInner svg .dciLogoFill { fill: rgba(255,255,255,0.05); }

.mapEmbed { position: relative; min-height: 50vh; }
.mapEmbed > iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; }

/* Input Label Float */
.labelFloat { position: relative; }
.labelFloat label {
	opacity: 0;
	position:absolute;
	pointer-events:none;
	left: .75rem;
	top: 0;
	margin: 0;
	font-size: 1rem;
	height: calc(1.5em + .75rem + 2px);
	transition:0.2s ease all; 
	-moz-transition:0.2s ease all; 
	-webkit-transition:0.2s ease all;
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
	-webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.labelFloat.showLabel label { opacity: 1; }
.labelFloat .form-control-lg ~ label { left: 1rem; font-size: 1rem; height: calc(1.5em + 1.25rem + 2px); }
.labelFloat .form-control:focus ~ label, .labelFloat .form-control.field--not-empty ~ label {
	top: -1.4em;
	font-size: 0.8em;
	height: 1.2em;
	color: var(--dci-grey);
}

@media (min-width: 576px) {
	.h1, h1 { font-size: 2.8rem; }
	.labelFloat .form-control-lg ~ label { font-size: 1.25rem; height: calc(1.5em + 1rem + 2px); }
}
@media (min-width: 768px) {
	body { font-size: 14px; }
	.h1, h1 { font-size: 3.2rem; }
	
	.dotsSeperator { position: relative; }
	.dotsSeperator:after { content: ""; position: absolute; top: 50%; right: -8px; width: 16px; height: 63px; margin-top: -31px; background: url('../images/dots-seperator.png') no-repeat 0 0; }
	.mediaRight.dotsSeperator:after { left: -8px; right: unset; }
}
@media (min-width: 992px) {
	body { font-size: 15px; }
	.h1, h1 { font-size: 3.8rem; }
}
@media (min-width: 1200px) {
	.h1, h1 { font-size: 4.3rem; }
}

/* MAX */
@media (max-width: 991.98px) {
	.container { max-width: 100%; }
}


/* ***************************************************** */
/* MODALS */
/* ***************************************************** */

.modal-content { border-radius: 0; border: none; }
.modal-header { border-radius: 0; background-color: var(--dci-bluegrey); color: #fff; }
.close { text-shadow: none; color: #fff; opacity: 1; }
.close:hover { color: #fff; opacity: 0.8; }
.modal-footer { border-radius: 0; background-color: #e9ecef; }
.modal-dialog { max-width: 600px; }
.modal-backdrop.show { opacity: .7; }
.modal-dialog.modal-small { max-width: 400px; font-size: 0.9em; }
.modal-dialog.modal-large { max-width: 800px; }
.modal-small .modal-body p:last-of-type { margin-bottom: 0; }
.modal-small .modal-footer { padding: 0.5em 0.6em; }


/* ***************************************************** */
/* HEADER */
/* ***************************************************** */

.loginPrompt { font-size: 11px; }
.loginPrompt > div { position: relative; }
.loginPrompt > div > div { position: absolute; top: 0; right: 0; z-index: 5; }
.fhb-dark .loginPrompt > div > div { webkit-filter: contrast(90%); filter: contrast(90%); }

.logoBox svg { max-width: 96px; width: 100%; }
.dciLogoFill { fill: var(--dci-green); }
.fhb-color-green .dciLogoFill { fill: #fff; }
.logoBox > span { color: var(--dci-grey); }
.fhb-dark .logoBox > span { color: #fff; }
.fhb-color-green .logoBox > span { color: var(--dci-bluegrey); }

nav.navbar { border-bottom: 1px solid var(--dci-bluegrey-dark); }

.fhb-color-image nav.navbar { background-color: rgba(255,255,255,0.8); }
.fhb-color-image.fhb-dark nav.navbar { background-color: rgba(0,0,0,0.8); }

.navbar-expand > .container, .navbar-expand > .container-fluid { padding-right: 15px; padding-left: 15px; }
.navbar-expand .navbar-nav .nav-link { padding-right: .7rem; padding-left: .7rem; }

.navbar-nav,
.navApply .btn { font-size: 1.1em; }
.navbar-nav a { color: var(--dci-darkgrey); }
.fhb-dark .navbar-nav a { color: #fff; }

.dropdown-menu { background-color: var(--dci-bluegrey-dark); }
.dropdown-menu a.dropdown-item { color: var(--dci-white); }
.dropdown-menu a.dropdown-item:hover { color: var(--dci-green); background-color: transparent; }
.dropdown-item.active, .dropdown-item:active,
.dropdown-item:focus { background-color: transparent; }

.flexibleHeadingBox { background-position: center; background-repeat: no-repeat; background-size: cover; }
.headerIntro { text-align: center; }

.fhb-color-image .bgimgFade { background-color: rgba(255,255,255,0.75); }
.fhb-color-image .bgimgFade h1,
.fhb-color-image .bgimgFade p { text-shadow: 1px 1px 0 #fff; }

.headerSwoosh { height: 30px; position: relative; z-index: 3; margin-top: 60px; }
.headerSwoosh div { position: absolute; bottom: 0; width: 100%; }
.headerSwoosh > div { height: 60px; z-index: -1; }
.headerSwoosh > div > div { height: 90px; z-index: -2; }

.swooshesBelow { border-bottom: 2px solid #fff; padding-bottom: 4vw; }
.swooshesBelow.swooshBelow-green { border-color: var(--dci-green); }
.swooshesBelow.swooshBelow-bluegrey { border-color: var(--dci-bluegrey); }
.swooshesBelow.swooshBelow-bluegrey-light { border-color: var(--dci-bluegrey-light); }

.fhb-color-image .swooshesBelow { min-height: 42vh; }

.swooshesBelow > .headerAreaContent { position: relative; z-index: 2; }

.headerSwooshes { position: absolute; bottom: 0; left: 0; right: 0; }
.headerSwooshes svg { margin-bottom: -1px; }
.swooshbase { fill: #fff; }
.swooshunder { fill: rgba(232, 232, 232, 0.2); }
.swooshtop { fill: rgba(115, 115, 115, 0.3); }

.swooshBelow-green .swooshbase { fill: var(--dci-green); }
.swooshBelow-green .swooshunder { fill: rgba( var(--dci-green-rgb) , 0.2); }
.swooshBelow-green .swooshtop { fill: rgba( var(--dci-green-rgb) , 0.3); }

.swooshBelow-bluegrey .swooshbase { fill: var(--dci-bluegrey); }
.swooshBelow-bluegrey .swooshunder { fill: rgba( var(--dci-bluegrey-rgb) , 0.2); }
.swooshBelow-bluegrey .swooshtop { fill: rgba( var(--dci-bluegrey-rgb) , 0.3); }

.swooshBelow-bluegrey-light .swooshbase { fill: var(--dci-bluegrey-light); }
.swooshBelow-bluegrey-light .swooshunder { fill: rgba( var(--dci-bluegrey-rgb) , 0.2); }
.swooshBelow-bluegrey-light .swooshtop { fill: rgba( var(--dci-bluegrey-rgb) , 0.3); }

.headerSwooshesHead { z-index: 1; }
.swooshHeadshot { position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; }

@media (min-width: 576px) {
	.loginPrompt { font-size: inherit; }
	.logoBox svg { width: 140px; max-width: 100%; }
	.navbar-nav,
	.navApply .btn { font-size: 1.2em; }
}
@media (min-width: 768px) {
	.headerIntro { text-align: initial; }
	.headerIntroArrow { position: relative; }
	.headerIntroArrow:after { content: ""; position: absolute; top: 100%; right: 0; width: 159px; height: 50px; background-image: url('https://res.cloudinary.com/dwao3b1us/image/upload/v1576509705/DCI/white-arrow.png'); background-repeat: no-repeat; background-position: 50% 50%; background-size: contain; }
	
	.fhb-color-image .bgimgFade { 
		background: -moz-linear-gradient(left,  rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.75) 48%, rgba(255,255,255,0.2) 70%, rgba(255,255,255,0) 100%);
		background: -webkit-linear-gradient(left,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 48%,rgba(255,255,255,0.2) 70%,rgba(255,255,255,0) 100%);
		background: linear-gradient(to right,  rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.75) 48%,rgba(255,255,255,0.2) 70%,rgba(255,255,255,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfffffff', endColorstr='#00ffffff',GradientType=1 );
	}
}


/* MAX */
@media (max-width: 991.98px) {
	
	body.nav-is-visible { overflow: hidden; }
	
	.navbar,
	.loginPrompt { padding-right: 15px; padding-left: 15px; }

	.navbar-expand .mainNavbar .navbar-nav .dropdown-menu { position: relative; }
	.navbar-dark .mainNavbar .navbar-nav .menu-item:not(.show) .nav-link.dropdown-toggle:focus { color: #fff; }
	
	.navbar-expand .mainNavbar .navbar-collapse { overflow-y: scroll; height: -moz-calc(100vh - 110px); height: -webkit-calc(100vh - 110px); height: -o-calc(100vh - 110px); height: calc(100vh - 110px); -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; }
	
	.logoBox,
	.loginPrompt > div,
	.navApply { position: relative; z-index: 50; }
	
	.navbar-nav a { color: #fff; }
	
	/* -------------------------------- 
	Slide out menu
	-------------------------------- */
	.navCover { z-index: 30; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,0);
		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		-o-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translateX(-100%);
		-moz-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		-o-transform: translateX(-100%);
		transform: translateX(-100%);
		-webkit-transition: background-color 0.4ss;
		-moz-transition: background-color 0.4s;
		transition: background-color 0.4s;
	}
	.navCover.nav-is-visible {
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
		background-color: rgba(0,0,0,0.5);
	}

	.mainNavbar {
		padding-top: 145px;
		position: absolute;
		top: 0;
		left: 0;
		width: 330px;
		height: 100%;
		min-height: 100vh;
		background: var(--dci-bluegrey);
		box-shadow: 4px 4px 20px transparent;
		z-index: 40;
		/* Force Hardware Acceleration in WebKit */
		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		-o-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translateX(-100%);
		-moz-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		-o-transform: translateX(-100%);
		transform: translateX(-100%);
		-webkit-transition: -webkit-transform 0.3s, box-shadow 0.3s;
		-moz-transition: -moz-transform 0.3s, box-shadow 0.3s;
		transition: transform 0.3s, box-shadow 0.3s;
	}
	.mainNavbar.nav-is-visible {
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		-o-transform: translateX(0);
		transform: translateX(0);
		box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
	}
	.mainNavbar.nav-is-visible .cd-close { opacity: 1; }
	
	.navbar-expand .navbar-nav .nav-link { padding-right: 15px; padding-left: 15px; }

	.navicon-button {
		display: inline-block;
		position: relative;
		z-index: 50;
		padding: 1.2rem 0.2rem;
		-webkit-transition: 0.25s;
		-moz-transition: 0.25s;
		transition: 0.25s;
		cursor: pointer;
		user-select: none;
	}
	.navicon-button .navicon:before, .navicon-button .navicon:after {
		-webkit-transition: 0.25s;
		-moz-transition: 0.25s;
		transition: 0.25s;
	}
	.navicon-button:hover {
		-webkit-transition: 0.5s;
		-moz-transition: 0.5s;
		transition: 0.5s;
	}
	.navicon-button:hover .navicon:before, .navicon-button:hover .navicon:after {
		-webkit-transition: 0.25s;
		-moz-transition: 0.25s;
		transition: 0.25s;
	}
	.navicon-button:hover .navicon:before { top: .825rem; }
	.navicon-button:hover .navicon:after { top: -.825rem; }
	.navicon {
		position: relative;
		width: 2.2em;
		height: .18rem;
		background: var(--dci-darkgrey);
		font-size: 16px;
		-webkit-transition: 0.5s;
		-moz-transition: 0.5s;
		transition: 0.5s;
	}
	.navicon:before, .navicon:after {
		display: block;
		content: "";
		height: .18rem;
		width: 2.2rem;
		background: var(--dci-darkgrey);
		position: absolute;
		z-index: -1;
		-webkit-transition: 0.5s 0.25s;
		-moz-transition: 0.5s 0.25s;
		transition: 0.5s 0.25s;
	}
	.navicon:before { top: .625rem; }
	.navicon:after { top: -.625rem; }
	
	.fhb-dark .navicon,
	.fhb-dark .navicon:before,
	.fhb-dark .navicon:after { background: #fff; }

	.nav-is-visible:not(.steps) .navicon:before,
	.nav-is-visible:not(.steps) .navicon:after {
		top: 0 !important;
	}

	.nav-is-visible .navicon:before,
	.nav-is-visible .navicon:after {
		background: #fff;
		-webkit-transition: 0.5s;
		-moz-transition: 0.5s;
		transition: 0.5s;
	}
	.nav-is-visible .navicon { background: transparent; }
	.nav-is-visible .navicon:before {	  
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.nav-is-visible .navicon:after {
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	/* navbar updates */
	.navbar-expand .navbar-nav {  
		width: 100%;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}

}
@media (max-width: 767.98px) {
	.mainNavbar { padding-top: 120px; }
}
@media (max-width: 575.98px) {
	.mainNavbar { padding-top: 95px; width: -moz-calc(100% - 65px); width: -webkit-calc(100% - 65px); width: -o-calc(100% - 65px); width: calc(100% - 65px); }
}

/* Sticky Nav */
@media (min-width: 992px) {
	.fixed-menu #wrapper-navbar { position: fixed; top: 0; width: 100%; background-color: #fff; z-index: 50; transform: translate(0,-100%); }
	.fixed-menu { margin-top:150px; }
	.fixed-menu #wrapper-navbar nav { padding:0 !important; } 
	.fixed-menu #wrapper-navbar nav .logoBox { transform: scale(0.7);margin: 12px 0; } 
	.fixed-menu #wrapper-navbar nav .navbar-nav,
	.fixed-menu #wrapper-navbar nav .navApply .btn { font-size:1em; } 
	.fixed-menu #wrapper-navbar #navbarNavDropdown,
	.fixed-menu #wrapper-navbar #navbarNavDropdown .navApply { padding-top: 0; }
	.fixed-menu #wrapper-navbar.slideDown { transform: translate(0,0);transition: transform linear 0.2s; }	
	.fixed-menu #wrapper-navbar .logoBox > span,
	.fixed-menu #wrapper-navbar .navbar-nav > li > a { color: #333; }	
}

/* Header Flags */
.headerFlags { padding-left: 5px; margin-top: -2px; display: inline-block; vertical-align: text-top; }
.headerFlags > .flag { margin: 0 5px; }
.headerFlags > img.flag { -webkit-box-shadow: 0px 0px 0px 2px var(--dci-bluegrey-darker); -moz-box-shadow: 0px 0px 0px 2px var(--dci-bluegrey-darker); box-shadow: 0px 0px 0px 2px var(--dci-bluegrey-darker); }
.headerFlags > a.flag:hover img { -webkit-box-shadow: 0px 0px 0px 2px var(--dci-green); -moz-box-shadow: 0px 0px 0px 2px var(--dci-green); box-shadow: 0px 0px 0px 2px var(--dci-green); }


/* Fuel Card List */
.tab-blue { background-color: var(--dci-blue); color: #fff; }
.tab-blue:hover { background-color: var(--dci-green); color: #fff; text-decoration: none; }
.roundNumberInput { font-size: 1em; position: absolute; bottom: 50%; right: 1em; z-index: 1; }
.roundNumberInput .input-group-btn { position: absolute; right: -1em; z-index: -1; }
.roundNumberInput .rni-plus { top: -1.3em; }
.roundNumberInput .rni-minus { top: 2.1em; }
.roundNumberInput .input-number-circle  { width: 2.8em; height: 2.8em; margin-bottom: -1.4em; }
.roundNumberInput .input-number-circle .input-number  { width: 80%; height: 1em; font-size: 1em; background-color: transparent; }
.roundNumberInput .input-number-circle .input-number:focus  { -webkit-box-shadow: none; box-shadow: none; }
.roundNumberInput .btn-number  { width: 2.2em; height: 2.2em; font-size: 0.9em; }
.roundNumberInput .btn-number i { vertical-align: inherit; }

@media (min-width: 576px) {
	.roundNumberInput { font-size: 1.3em; }
}
@media (min-width: 768px) {
	.roundNumberInput { font-size: 1em; }
	.fuelCardSearcher { position: absolute; top: 0; left: 15px; right: 15px; }
	.fuelCardSearcher:after { content: ""; position: absolute; z-index: -1; bottom: 20px; left: 10px; right: 10px; height: 70px; -webkit-box-shadow: -1px 20px 30px 0px rgba(0, 0, 0, 0.6); -moz-box-shadow: -1px 20px 30px 0px rgba(0, 0, 0, 0.6); box-shadow: -1px 20px 30px 0px rgba(0, 0, 0, 0.6); 	}
	.searchSpacer { min-height: 190px; }
}
@media (min-width: 1200px) {
	.roundNumberInput { font-size: 1.13em; }
}


/* ***************************************************** */
/* FOOTER */
/* ***************************************************** */

.footerWrapper { background: var(--dci-mediumgrey); color: var(--dci-grey); font-weight: 600; }

.footerLogoBox { text-align: center; }
.footerLogo svg { max-width: 100%; width: 110px; height: auto; }
.footerLogo svg .dciLogoFill { fill: var(--dci-grey); }

.footerAddressBox { font-size: 0.9em; }
.footerAddressBox a { color: var(--dci-grey); }

.footerCredits { border-top: 2px solid #d0d0d0; }

@media (min-width: 576px) {
	.footerAddressBox { font-size: 1em; }
}
@media (min-width: 992px) {
	.footerLogoBox { text-align: right; }
	.footerLogo svg { width: 140px; }
}



/* ***************************************************** */
/* FLEXIBLE CONTENT */
/* ***************************************************** */

/* Text and Image Boxes */
.text-and-image-box h3 { font-weight: 700; }
.text-and-image-box .bxSq { min-height: 100vw; }
@media (min-width: 576px) {
	.text-and-image-box .bxSq { min-height: 50vw; }
}
@media (min-width: 768px) {
	.text-and-image-box p,
	.text-and-image-box a { font-size: 1.1em; }
}
@media (min-width: 992px) {
	.text-and-image-box .bxSq { min-height: 33.333vw; }
}
@media (min-width: 1200px) {
	.text-and-image-box .bxSq { min-height: initial; }
	.text-and-image-box p,
	.text-and-image-box a { font-size: 1.2em; }
}

/* Text Columns */
@media (min-width: 992px) {
	.text_columns p,
	.text_columns a { font-size: 1.1em; }
}

/* Big Image and Text Column */
.bigImgHeight { height: 40vh; }

/* Heading and Text Display */
.imgBg { position: absolute; left: 0; bottom: 0; background-repeat: no-repeat; background-position: left bottom; background-size: contain; }
@media (min-width: 768px) {
	.imgBg { top: 0; }
}

/* Overflow Image and Text Row */
.overflowImg { margin-top: -1.6rem; text-align: center; }
.overflowImg.overflowImgBorder { border-bottom: 2px solid rgba(0,0,0,0.1); }
.overflowImg img { width: auto; max-height: 100%; }
@media (min-width: 768px) {
	.overflowImg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
	.overflowImg.overflowImgBorder { border-bottom: none; }
}

/* Text Block */
.text-block img { margin: 0 auto; display: block; padding: 0.5em 0; }
.doubleColumn { 
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-width: 260px;
	-moz-column-width: 260px;
	column-width: 260px; 
	-webkit-column-gap: 4em;
	-moz-column-gap: 4em;
	column-gap: 4em;
}
.keeptogether { display: inline-block; width: 100%; }

/* Dots Separator */
.dots_separator { height: 63px; background: url('../images/dots-seperator.png') no-repeat 50% 50%; } }

/* Savings Slider */
#plansUpper { background-color: #1face3; padding: 0 0 200px; }
.top-slider { width: 80%; display: block; position: relative; margin: 10px auto 60px; padding: 0 20px 0 118px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; min-height: 15px; }
.pricing_slider .ui-widget-content { background: #b9b9b9; border: 1px solid #a6a6a6; }
.pricing_slider > .ui-widget-content { -webkit-box-shadow: inset 1px 1px 5px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 1px 1px 5px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 1px 1px 5px 0px rgba(0, 0, 0, 0.2); }
.pricing_slider .ui-widget.ui-widget-content { border: none; background: transparent; }
.pricing_slider .ui-slider-horizontal .ui-slider-handle { margin-left: -110px; width: 120px; height: 38px; top: -11px; font-size: 1.05em; text-align: center; line-height: 36px; color: #fff; font-weight: 600; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; min-height: 15px; background: var(--dci-green); border-color: var(--dci-green); cursor: pointer; -webkit-box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1); box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1); }
#increase,
#decrease { position: absolute; top: -8px; font-size: 30px; color: var(--dci-bluegrey); line-height: 30px; }
#decrease { left: -35px; }
#increase { right: -35px; }
#increase:focus,
#decrease:focus {color: var(--dci-bluegrey); }
#increase:hover,
#decrease:hover {color: var(--dci-green); }

.savingsFigsRow > div { position: relative; }
.savingsFigsRow > div:before { content: ""; position: absolute; left: -moz-calc(50% - 1px); left: -webkit-calc(50% - 1px); left: -o-calc(50% - 1px); left: calc(50% - 1px); height: 3rem; top: -2.5rem; width: 2px; background-color: var(--dci-bluegrey); }
.savingsFigsRow > div:after { content: ""; position: absolute; top: 4px; left: -moz-calc(50% - 4px); left: -webkit-calc(50% - 4px); left: -o-calc(50% - 4px); left: calc(50% - 4px); width: 8px; height: 8px; background-color: var(--dci-bluegrey); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }

@media (min-width: 768px) {
	.top-slider { width: 90%; }
}

/* MAX */
@media (max-width: 767.98px) {
	.savingsFigsRow > div:nth-child(1):before,
	.savingsFigsRow > div:nth-child(3):before {
		transform: rotate(17deg) ;
		-webkit-transform: rotate(17deg) ;
		-moz-transform: rotate(17deg) ;
		-o-transform: rotate(17deg) ;
		-ms-transform: rotate(17deg) ;
		-webkit-transform-origin: right bottom;
		-moz-transform-origin: right bottom;
		-ms-transform-origin: right bottom;
		transform-origin: right bottom;
	}
	.savingsFigsRow > div:nth-child(2):before,
	.savingsFigsRow > div:nth-child(4):before {
		transform: rotate(-17deg) ;
		-webkit-transform: rotate(-17deg) ;
		-moz-transform: rotate(-17deg) ;
		-o-transform: rotate(-17deg) ;
		-ms-transform: rotate(-17deg) ;
		-webkit-transform-origin: right bottom;
		-moz-transform-origin: right bottom;
		-ms-transform-origin: right bottom;
		transform-origin: right bottom;
	}
}


/* Cards */
.cs-Upper { border-bottom: 20px solid var(--dci-lightgrey); }
.shadowStyle .cs-Upper { border-bottom: 5px solid var(--dci-lightgrey); }
.cardListImg { position: relative; }
.cardListImg img { position: relative; z-index: 1; }

@media (min-width: 768px) {
	.shadowStyle .cs-Upper { border-bottom: 2px solid var(--dci-lightgrey); 
		-webkit-box-shadow: 0px 35px 30px 0px var(--dci-lightgrey);
		-moz-box-shadow:    0px 35px 30px 0px var(--dci-lightgrey);
		box-shadow:         0px 35px 30px 0px var(--dci-lightgrey);
	}
	.cs-Upper > .container { padding-bottom: 17vw; }
	.cs-Lower { margin-top: -17vw; }
	.cardListImg:before { content: ""; position: absolute; left: -moz-calc(50% - 1px); left: -webkit-calc(50% - 1px); left: -o-calc(50% - 1px); left: calc(50% - 1px); height: 3rem; bottom: 1.2em; width: 2px; background-color: var(--dci-bluegrey); }
	.cardListImg:after { content: ""; position: absolute; bottom: -moz-calc(1.2em - 4px); bottom: -webkit-calc(1.2em - 4px); bottom: -o-calc(1.2em - 4px); bottom: calc(1.2em - 4px); left: -moz-calc(50% - 4px); left: -webkit-calc(50% - 4px); left: -o-calc(50% - 4px); left: calc(50% - 4px); width: 8px; height: 8px; background-color: var(--dci-bluegrey); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
}
@media (min-width: 992px) {
	.cs-Upper > .container { padding-bottom: 180px; }
	.cs-Lower { margin-top: -180px; }
}
@media (min-width: 1200px) {
	.cs-Upper > .container { padding-bottom: 210px; }
	.cs-Lower { margin-top: -210px; }
}

/* MAX */
@media (max-width: 767.98px) {
	.cardListImg:after { content: ""; position: absolute; top: 50%; right: -5px; width: 10px; height: 39px; margin-top: -19px; background: url('../images/dots-seperator.png') no-repeat 0 0; background-size: contain; }
	.cardRight.cardListImg:after { left: -5px; right: unset; }
}


/* Network Page */
.gmap iframe img{ max-height: none; }
.tab-pane span { font-size: 2rem; }
.nav-tabs .nav-link.active { opacity: 1; }
.nav-tabs .nav-link { opacity: 0.6; }

/* Fuelcard List */
body.page-template-fuelcards-list .leader { display:none}
body.page-template-fuelcards-list .cards-section  { opacity:0.4}


/* Accordion */
.accordion .card { border-color: var(--dci-bluegrey-darker); }
.accordion .card-header { cursor: pointer; border-color: var(--dci-bluegrey-darker); background-color: var(--dci-bluegrey-light); color: #fff; }
.accordion .card-header:hover { background-color: var(--dci-bluegrey); }
.accordion .card-header:not(.collapsed) { background-color: var(--dci-blue); cursor: default; }
.card-header:first-child { border-radius: calc(.25rem - 3px) calc(.25rem - 3px) 0 0; }

/* Feature Compare */
.compareRowHeader { background-color: #f3f3f3; }
.compareRowArea .compareRow { background-color: #f3f3f3; }
.compareRowArea .compareRow:nth-child(odd) { background-color: #f9f9f9; }
.compareRow i.optionalAst { position: relative; }
.compareRow i.optionalAst span { position: absolute }
.optionalNote { position: absolute; top: 0; right: 1.2em; text-transform: uppercase; font-size: 11px; line-height: 10px; padding: 0.3em 1em; background-color: var(--dci-blue); font-weight: 400; color: #fff; }
@media (min-width: 992px) {
	.compareRowHead { border-color: #fff !important; }
	.optionalNote { right: 0; }
}

/* Grey Image and Text Columns */
.greyBox-1 { background-color: #f3f3f3; }
.greyBox-2 { background-color: #f9f9f9; }