/*
Theme Name: Minnesota Design Studio - Coster Water
Theme URI: https://www.minnesotadesign.com/
Author: Minnesota Design Studio
Author URI: https://www.minnesotadesign.com/
Description: Standalone custom WordPress and WooCommerce theme for Coster Water.
Version: 1.0.8
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: mds-coster-water
Tags: custom-logo, custom-menu, e-commerce, accessibility-ready, responsive-layout
*/

/* ==========================================================
   START: LOCAL OPEN SANS FONT FAMILY
   Three files cover regular copy, bold navigation/buttons and extra-bold
   headings. WordPress may synthesize uncommon intermediate weights.
   ========================================================== */

@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("assets/fonts/OpenSans-Regular.woff2") format("woff2");
}

@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("assets/fonts/OpenSans-Bold.woff2") format("woff2");
}

@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("assets/fonts/OpenSans-ExtraBold.woff2") format("woff2");
}

@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url("assets/fonts/OpenSans-ExtraBold.woff2") format("woff2");
}

/* ==========================================================
   END: LOCAL OPEN SANS FONT FAMILY
   ========================================================== */

:root {
	--coster-blue: #0083ca;
	--coster-bright-blue: #00aeef;
	--coster-deep-blue: #074a6f;
	--coster-navy: #182b3a;
	--coster-text: #373a5e;
	--coster-light: #eef8fd;
	--coster-white: #ffffff;
	--nv-primary-accent: #0083ca;
	--nv-secondary-accent: #0083ca;
	--nv-site-bg: #ffffff;
	--nv-light-bg: #f4f5f7;
	--nv-dark-bg: #121212;
	--nv-text-color: #373a5e;
	--nv-text-dark-bg: #ffffff;
	--nv-c-1: #00aeef;
	--nv-c-2: #be574b;
	--nv-fallback-ff: Arial, Helvetica, sans-serif;
	--bodyfontfamily: Arial, Helvetica, sans-serif;
	--headingsfontfamily: "Open Sans", Arial, Helvetica, sans-serif;
	--primarybtnbg: #0083ca;
	--primarybtnhoverbg: #006ca8;
	--primarybtncolor: #ffffff;
	--primarybtnhovercolor: #ffffff;
	--primarybtnshadow: none;
	--primarybtnhovershadow: none;
	--primarybtnborderradius: 4px;
	--bodyfontsize: 16px;
	--bodyletterspacing: normal;
	--btnfontweight: 700;
	--btnletterspacing: 0.02em;
	--btnlineheight: 1.3;
	--btntexttransform: none;
	--secondarybtnbg: #ffffff;
	--secondarybtncolor: #0083ca;
	--secondarybtnborderwidth: 1px;
	--secondarybtnborderradius: 4px;
	--secondarybtnpadding: 10px 14px;
	--formfieldbgcolor: #ffffff;
	--formfieldbordercolor: #dddddd;
	--formfieldcolor: #373a5e;
	--formfieldborderwidth: 2px;
	--formfieldborderradius: 3px;
	--formfieldpadding: 10px 12px;
	--formfieldtexttransform: none;
	--formfieldfontweight: 400;
	--formfieldfontsize: 16px;
	--formfieldletterspacing: normal;
	--formfieldlineheight: 1.4;
	--h2fontsize: 32px;
}

html {
	overflow-x: clip;
	scroll-behavior: smooth;
}

body {
	min-width: 0;
	overflow-x: clip;
	background: #ffffff;
	color: var(--coster-text);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.7;
}

body.admin-bar .site-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .site-header {
		top: 46px;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
	color: var(--coster-navy);
	font-family: var(--headingsfontfamily);
	font-weight: 900;
	line-height: 1.2;
}

p {
	margin: 0 0 1.4em;
}

a {
	color: var(--coster-blue);
}

img,
svg {
	max-width: 100%;
}

img {
	height: auto;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.wp-block-button__link {
	cursor: pointer;
	border: 0;
	border-radius: 4px;
	background: var(--coster-blue);
	color: #ffffff;
	font-weight: 700;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
input[type="number"],
select,
textarea {
	max-width: 100%;
	padding: 10px 12px;
	border: 2px solid #dddddd;
	border-radius: 3px;
	background: #ffffff;
	color: var(--coster-text);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

.screen-reader-text:focus,
.skip-link:focus {
	top: 8px;
	left: 8px;
	z-index: 10000;
	width: auto;
	height: auto;
	margin: 0;
	padding: 12px 18px;
	clip: auto;
	clip-path: none;
	background: #ffffff;
	color: #000000;
}

/* Shared header and accessible navigation. */
.site-header.header-area {
	position: sticky;
	top: 0;
	left: auto;
	right: auto;
	z-index: 10000;
	isolation: isolate;
	width: 100%;
	background: #ffffff;
	box-shadow: 0 2px 14px rgba(24, 43, 58, 0.08);
}

.main-header-area,
.menu_outer {
	position: relative;
}

.coster-header-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 96px;
	gap: 28px;
}

.site-header .logo {
	flex: 0 0 200px;
}

.site-header .logo a,
.site-header .logo img {
	display: block;
}

.site-header .logo img {
	width: 200px;
	height: auto;
}

.main-menu {
	min-width: 0;
	flex: 1 1 auto;
}

#primary-menu,
#primary-menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#primary-menu a {
	color: #111111;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
}

#primary-menu > li > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 46px;
	padding: 12px 7px;
}

#primary-menu > li > a::before {
	position: absolute;
	right: 7px;
	bottom: 7px;
	left: 7px;
	height: 2px;
	background: var(--coster-blue);
	content: "";
	transform: scaleX(0);
	transition: transform 180ms ease;
}

#primary-menu > li:hover > a::before,
#primary-menu > li:focus-within > a::before,
#primary-menu > .current-menu-item > a::before,
#primary-menu > .current-menu-ancestor > a::before {
	transform: scaleX(1);
}

#primary-menu .header_btn > a,
#primary-menu .menu-item-contact > a {
	margin-left: 5px;
	min-height: 46px;
	padding: 0 18px;
	border-radius: 999px;
	background: var(--coster-blue);
	color: #ffffff;
	font-size: 12px;
	line-height: 1;
	text-transform: uppercase;
	box-shadow: 0 8px 18px rgba(0, 131, 202, 0.18);
	transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

#primary-menu .header_btn > a::before,
#primary-menu .menu-item-contact > a::before {
	display: none;
}

#primary-menu .header_btn > a:hover,
#primary-menu .header_btn > a:focus-visible,
#primary-menu .menu-item-contact > a:hover,
#primary-menu .menu-item-contact > a:focus-visible {
	background: #006ca8;
	box-shadow: 0 10px 22px rgba(0, 108, 168, 0.28);
	color: #ffffff;
	transform: translateY(-1px);
}

.header-contact-icon {
	width: 18px;
	height: 18px;
	margin-right: 7px;
	fill: currentColor;
}

.submenu-toggle {
	display: none;
}

.mobile_menu {
	display: none;
}

.mobile-menu-placeholder {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 48px;
	height: 44px;
	padding: 10px;
	border: 0;
	border-radius: 5px;
	background: var(--coster-blue);
}

.mobile-menu-placeholder span {
	display: block;
	width: 100%;
	height: 3px;
	border-radius: 3px;
	background: #ffffff;
	transform-origin: center;
	transition: opacity 160ms ease, transform 160ms ease;
}

@media (min-width: 992px) {
	#primary-menu {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 2px;
	}

	#primary-menu li {
		position: relative;
	}

	#primary-menu .sub-menu {
		position: absolute;
		top: calc(100% + 8px);
		left: 0;
		z-index: 40;
		min-width: 240px;
		padding: 10px 0;
		border: 1px solid rgba(0, 131, 202, 0.14);
		border-radius: 8px;
		background: #ffffff;
		box-shadow: 0 16px 34px rgba(24, 43, 58, 0.14);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
	}

	#primary-menu li:hover > .sub-menu,
	#primary-menu li:focus-within > .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	#primary-menu .sub-menu a {
		display: block;
		padding: 10px 18px;
		font-size: 12px;
	}

	#primary-menu .sub-menu a:hover,
	#primary-menu .sub-menu a:focus {
		background: #eef8fd;
		color: #006ca8;
	}

	#primary-menu .sub-menu .sub-menu {
		top: -10px;
		left: calc(100% - 1px);
	}

	#primary-menu .menu-item-has-children > a {
		padding-right: 20px;
	}

	#primary-menu .menu-item-has-children > a::after {
		position: absolute;
		right: 6px;
		top: 50%;
		width: 7px;
		height: 7px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		content: "";
		transform: translateY(-70%) rotate(45deg);
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.site-header .logo {
		flex-basis: 165px;
	}

	.site-header .logo img {
		width: 165px;
	}

	.coster-header-row {
		gap: 12px;
	}

	#primary-menu > li > a {
		padding-right: 5px;
		padding-left: 5px;
		font-size: 10px !important;
	}
}

@media (max-width: 991.98px) {
	.site-header.header-area,
	.main-header-area,
	.menu_outer,
	.coster-header-row,
	.main-menu[data-mobile-menu-panel],
	#primary-menu {
		width: 100%;
		max-width: 100%;
	}

	.coster-header-row {
		min-height: 82px;
	}

	.site-header .logo {
		flex-basis: 175px;
	}

	.site-header .logo img {
		width: 175px;
	}

	.mobile_menu {
		display: block;
		margin-left: auto;
	}

	.mobile-menu-placeholder[aria-expanded="true"] span:nth-child(1) {
		transform: translateY(8px) rotate(45deg);
	}

	.mobile-menu-placeholder[aria-expanded="true"] span:nth-child(2) {
		opacity: 0;
	}

	.mobile-menu-placeholder[aria-expanded="true"] span:nth-child(3) {
		transform: translateY(-8px) rotate(-45deg);
	}

	.main-menu[data-mobile-menu-panel] {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		z-index: 100;
		display: block;
		max-height: calc(100svh - 82px);
		overflow-x: hidden;
		overflow-y: auto;
		border-top: 1px solid #e5edf2;
		background: #ffffff;
		box-shadow: 0 16px 30px rgba(24, 43, 58, 0.16);
		opacity: 0;
		pointer-events: none;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
	}

	.main-menu[data-mobile-menu-panel].is-open {
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
		transform: translateY(0);
	}

	#primary-menu li {
		position: relative;
		display: block;
	}

	#primary-menu a {
		display: block;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		padding: 13px max(20px, calc((100vw - 930px) / 2));
		border-bottom: 1px solid #edf2f5;
		font-size: 14px;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	#primary-menu .header_btn,
	#primary-menu .menu-item-contact {
		padding: 12px 15px;
	}

	#primary-menu .header_btn > a,
	#primary-menu .menu-item-contact > a {
		display: flex;
		width: 100%;
		max-width: 100%;
		min-height: 48px;
		margin: 0;
		padding: 12px 20px;
		justify-content: center;
		border: 0;
		border-radius: 999px;
	}

	#primary-menu .menu-item-has-children > a {
		padding-right: 62px;
	}

	#primary-menu .sub-menu {
		display: none;
		background: #f3f9fc;
	}

	#primary-menu .menu-item-open > .sub-menu {
		display: block;
	}

	#primary-menu .sub-menu a {
		padding-left: max(36px, calc((100vw - 900px) / 2));
		font-size: 13px;
	}

	#primary-menu .submenu-toggle {
		position: absolute;
		top: 0;
		right: max(10px, calc((100vw - 960px) / 2));
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--coster-blue);
	}

	#primary-menu .submenu-toggle::before {
		width: 9px;
		height: 9px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		content: "";
		transform: rotate(45deg);
	}

	#primary-menu .submenu-toggle[aria-expanded="true"]::before {
		transform: rotate(-135deg);
	}

}

/* Shared interior title and content shell. */
.bradcam_area {
	position: relative;
	isolation: isolate;
	padding: 54px 0;
	background-color: #075478;
	background-image: linear-gradient(rgba(3, 54, 78, 0.72), rgba(3, 54, 78, 0.72)), var(--coster-banner-image, url("assets/images/water-jugs.webp"));
	background-position: center;
	background-size: cover;
}

.bradcam_text h1,
.bradcam_text h2 {
	margin: 0;
	color: #ffffff;
	font-size: clamp(32px, 5vw, 54px);
	text-align: center;
}

.site-main {
	min-height: 35vh;
}

.service_page_css,
.content-area,
.blog-shell,
.single-post-shell {
	padding: 70px 0;
}

.entry-content::after {
	display: table;
	clear: both;
	content: "";
}

/* ==========================================================
   START: WORDPRESS ALIGNED IMAGE AND CAPTION WRAPPING
   ========================================================== */

.entry-content .alignright,
.default_content .alignright,
.service_page_css .alignright {
	float: right;
	margin: 0 0 28px 36px;
}

.entry-content .alignleft,
.default_content .alignleft,
.service_page_css .alignleft {
	float: left;
	margin: 0 36px 28px 0;
}

.entry-content .aligncenter,
.default_content .aligncenter,
.service_page_css .aligncenter {
	display: block;
	margin: 28px auto;
}

.entry-content figure.wp-caption,
.default_content figure.wp-caption,
.service_page_css figure.wp-caption {
	max-width: 100%;
}

.entry-content figure.wp-caption img,
.default_content figure.wp-caption img,
.service_page_css figure.wp-caption img {
	display: block;
	width: 100%;
	height: auto;
}

.entry-content .wp-caption-text,
.default_content .wp-caption-text,
.service_page_css .wp-caption-text {
	margin: 8px 0 0;
	color: #373a5e;
	font-size: 15px;
	line-height: 1.55;
}

@media (max-width: 767.98px) {
	.entry-content .alignright,
	.entry-content .alignleft,
	.entry-content .aligncenter,
	.default_content .alignright,
	.default_content .alignleft,
	.default_content .aligncenter,
	.service_page_css .alignright,
	.service_page_css .alignleft,
	.service_page_css .aligncenter {
		float: none !important;
		display: block;
		width: 100% !important;
		max-width: 520px !important;
		margin: 24px auto !important;
	}
}

/* ==========================================================
   END: WORDPRESS ALIGNED IMAGE AND CAPTION WRAPPING
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

	/* ==========================================================
	   START: MINIMAL BOOTSTRAP STRUCTURE
	   Source formerly loaded from /css/bootstrap.min.css
	   ========================================================== */

/* ==========================================================
   COSTER WATER MINIMAL BOOTSTRAP STRUCTURE
   Based on Bootstrap 4.4.1

   Retained only for:
   - Responsive containers and grid columns
   - Desktop/mobile menu visibility and positioning
   - Header, footer and homepage alignment helpers
   - WooCommerce form-row compatibility
   - Document Library button compatibility

   Full Bootstrap components and unused utilities removed.
   ========================================================== */

/* ==========================================================
   START: Structural Baseline
   ========================================================== */

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

body {
	margin: 0;
}

img {
	vertical-align: middle;
	border-style: none;
}

button,
input,
optgroup,
select,
textarea {
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/* ==========================================================
   END: Structural Baseline
   ========================================================== */

/* ==========================================================
   START: Containers
   ========================================================== */

.container,
.container-fluid {
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 576px) {
	.container {
		max-width: 540px;
	}
}

@media (min-width: 768px) {
	.container {
		max-width: 720px;
	}
}

@media (min-width: 992px) {
	.container {
		max-width: 960px;
	}
}

@media (min-width: 1200px) {
	.container {
		max-width: calc(100% - 60px);
	}
}

@media (min-width: 1600px) {
	.container {
		max-width: 1700px;
	}
}

@media (min-width: 2200px) {
	.container {
		max-width: 2000px;
	}
}

/* ==========================================================
   END: Containers
   ========================================================== */

/* ==========================================================
   START: Grid
   ========================================================== */

.row,
.form-row {
	display: flex;
	flex-wrap: wrap;
}

.row {
	margin-right: -15px;
	margin-left: -15px;
}

.form-row {
	margin-right: -5px;
	margin-left: -5px;
}

.col,
[class^="col-"],
[class*=" col-"] {
	position: relative;
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
}

.form-row > .col,
.form-row > [class^="col-"],
.form-row > [class*=" col-"] {
	padding-right: 5px;
	padding-left: 5px;
}

.no-gutters {
	margin-right: 0;
	margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class^="col-"],
.no-gutters > [class*=" col-"] {
	padding-right: 0;
	padding-left: 0;
}

/* ==========================================================
   START: FIX HEADER MOBILE ROW HORIZONTAL OVERFLOW
   ========================================================== */

.row.no-gutters {
	margin-right: 0 !important;
	margin-left: 0 !important;
}

.row.no-gutters > [class*="col-"] {
	padding-right: 0 !important;
	padding-left: 0 !important;
}

/* ==========================================================
   END: FIX HEADER MOBILE ROW HORIZONTAL OVERFLOW
   ========================================================== */

.col {
	flex-basis: 0;
	flex-grow: 1;
	max-width: 100%;
}

.col-12 {
	flex: 0 0 100%;
	max-width: 100%;
}

@media (min-width: 576px) {
	.col-sm-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.col-sm-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media (min-width: 768px) {
	.col-md-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.col-md-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media (min-width: 992px) {
	.col-lg-2 {
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}

	.col-lg-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.col-lg-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.col-lg-10 {
		flex: 0 0 83.333333%;
		max-width: 83.333333%;
	}

	.col-lg-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media (min-width: 1200px) {
	.col-xl-2 {
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}

	.col-xl-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.col-xl-10 {
		flex: 0 0 83.333333%;
		max-width: 83.333333%;
	}

	.col-xl-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

/* ==========================================================
   END: Grid
   ========================================================== */

/* ==========================================================
   START: Responsive Display and Layout Utilities
   ========================================================== */

.d-none {
	display: none !important;
}

.d-block {
	display: block !important;
}

@media (min-width: 992px) {
	.d-lg-none {
		display: none !important;
	}

	.d-lg-block {
		display: block !important;
	}
}

.float-right {
	float: right !important;
}

.text-left {
	text-align: left !important;
}

.text-center {
	text-align: center !important;
}

.text-right {
	text-align: right !important;
}

.align-items-center {
	align-items: center !important;
}

.p-0 {
	padding: 0 !important;
}

.w-100 {
	width: 100% !important;
}

.clearfix::after {
	display: block;
	clear: both;
	content: "";
}

/* ==========================================================
   END: Responsive Display and Layout Utilities
   ========================================================== */

/* ==========================================================
   START: Document Library Button Compatibility
   Used on Support and Operators and Parts Manuals pages.
   ========================================================== */

.btn {
	display: inline-block;
	font-weight: 400;
	color: #212529;
	text-align: center;
	vertical-align: middle;
	user-select: none;
	background-color: transparent;
	border: 1px solid transparent;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: 0.25rem;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
		border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn:hover {
	color: #212529;
	text-decoration: none;
}

.btn:focus,
.btn.focus {
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.btn:disabled,
.btn.disabled {
	opacity: 0.65;
}

a.btn.disabled,
fieldset:disabled a.btn {
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.btn {
		transition: none;
	}
}

/* ==========================================================
   END: Document Library Button Compatibility
   ========================================================== */

/* ==========================================================
   START: COSTER DOCUMENT LIBRARY ACTION BUTTONS
   ========================================================== */

.dlp-grid-card-document-link-wrap {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.dlp-grid-card-document-link-wrap .document-library-pro-button,
.dlp-grid-card-document-link-wrap .dlp-download-button,
.dlp-grid-card-document-link-wrap .dlp-preview-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 46px;
	margin: 0;
	padding: 10px 17px;
	border: 2px solid var(--coster-blue);
	border-radius: 999px;
	background: var(--coster-blue);
	box-shadow: 0 8px 18px rgba(0, 131, 202, 0.16);
	color: #ffffff;
	font-weight: 800;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.dlp-grid-card-document-link-wrap .dlp-preview-button {
	width: 46px;
	padding-right: 0;
	padding-left: 0;
	background: #ffffff;
	color: var(--coster-blue);
}

.dlp-grid-card-document-link-wrap .document-library-pro-button:hover,
.dlp-grid-card-document-link-wrap .document-library-pro-button:focus-visible {
	border-color: #006ca8;
	background: #006ca8;
	color: #ffffff;
	text-decoration: none;
	transform: translateY(-2px);
}

.dlp-grid-card-document-link-wrap .dlp-preview-button:hover,
.dlp-grid-card-document-link-wrap .dlp-preview-button:focus-visible {
	border-color: #006ca8;
	background: #eef8fd;
	color: #006ca8;
}

.dlp-grid-card-document-link-wrap .dlp-button-icon {
	flex: 0 0 auto;
}

@media (max-width: 480px) {
	.dlp-grid-card-document-link-wrap .dlp-download-button {
		flex: 1 1 auto;
	}
}

/* ==========================================================
   END: COSTER DOCUMENT LIBRARY ACTION BUTTONS
   ========================================================== */

/* ==========================================================
   END: MINIMAL BOOTSTRAP STRUCTURE
   ========================================================== */

/**welcome start**/
.welcome_outer{
	margin:0px;
	padding:0px;
	background:url(assets/images/slider1.webp) center no-repeat;
	background-size:cover;
	position:relative;
}
.welcome_outer .container {
	position: relative;
	/* Keep the glass above the wave so its base extends into the white section. */
	z-index: 4;
}
.welcome_outer h1.welcome-title,
.welcome_outer h2{
	font-family: "Open Sans", sans-serif;
    font-size: 60px;
	font-weight:900;
	line-height: 65px;
	display: block;
	max-width: 760px;
    padding: 0px;
    color: #fff!important;
	overflow-wrap: break-word;
}
.welcome_outer span{
	font-family: "Open Sans", sans-serif;
    font-size: 22px;
    font-weight: 600;
	display: block;
	max-width: 820px;
    padding: 0px;
    color: #ffffff;
	text-transform:uppercase;
	overflow-wrap: break-word;
}
.welcome_overlay:before {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    content: '';
    background: #1B1B1B;
	background: -webkit-linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
	background: -moz-linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
	background: linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1B1B1B", endColorstr="#00AEEF", GradientType=1);
}
.welcome_img img{
	max-width:450px;
	margin-bottom: -100px;
    z-index: 3;
    position: relative;
}
/* ==========================================================
   START: HERO IMAGE POSITION OVERRIDE
   Moved from WordPress Additional CSS.
   ========================================================== */

.welcome_img img {
  
    margin-bottom: -200px;

}

/* ==========================================================
   END: HERO IMAGE POSITION OVERRIDE
   ========================================================== */

/**welcome end**/

/**about start**/
.about_outer{
    margin: 0px;
    padding: 100px 0px 50px 0px;
    background: #fff;
    position: relative;
    z-index: 2;
}
.about_outer::before {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 22px;
    margin: 0px;
    content: '';
    top: -22px;
	
	background-size:cover;
}
.about_outer h2 {
	font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #212b37;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
	text-align:center;
}
.about_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
	line-height:22px;
    color: #0083ca;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
	display: block;
	text-transform:uppercase;
}

.about_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 25px 0px;
	text-align:center;
}
.about_btn {
    background: #014286;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    line-height: 35px;
    outline: none;
    padding: 8px 15px;
    text-align: center;
    transition: all linear 300ms;
    text-decoration: none;
    font-weight: 500;
    width: 170px;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    display: inline-block;
    border-radius: 10px 10px 10px 0;
	border: solid 1px #014286;
}
.about_btn:hover {
    background: #1b1b1b;
    color: #fff;
    cursor: pointer;
	text-decoration: none;
	border: solid 1px #1b1b1b;
}
.about_img_css{
	margin:0px;
	position: relative;
	text-align: center;
}
.about_img_css img {
	position: relative;
	border-radius:30px 30px 30px 0px;
}
/* ==========================================================
   START: ABOUT SECTION DIVIDER
   Moved from WordPress Additional CSS.
   ========================================================== */

.about_outer::before {
    position: absolute;
    top: -22px;
    left: 0;
    width: 100%;
    height: 22px;
    content: '';
    background: url('assets/images/sec-divider.svg') repeat-x;
    background-size: 120px 23px;
    z-index: 3;
    pointer-events: none;
}

/* ==========================================================
   END: ABOUT SECTION DIVIDER
   ========================================================== */

/**about end**/

/**featured product start**/
.product_outer{
    margin: 0px;
    padding: 50px 0px;
    background: #f1f6fb;
    position: relative;
    z-index: 2;
}

/* ==========================================================
   START: FEATURED PRODUCTS ROW HORIZONTAL OVERFLOW FIX
   WPBakery rows use -15px side margins by default. This
   section intentionally has no .container, so neutralize only
   its outer row without changing rows anywhere else.
   ========================================================== */

.product_outer > .vc_row {
	margin-right: 0 !important;
	margin-left: 0 !important;
}

/* ==========================================================
   END: FEATURED PRODUCTS ROW HORIZONTAL OVERFLOW FIX
   ========================================================== */

.product_outer h2 {
	font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #212b37;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 30px 0px;
    position: relative;
	text-align:center;
}
.product_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
	line-height:22px;
    color: #0083ca;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
	display: block;
	text-transform:uppercase;
}

.product_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 25px 0px;
	text-align:center;
}
.product_box{
	margin: 15px 0px;
    padding: 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 8px #00000003;
	text-align:center;
}
.product_box h3 {
	font-size: 18px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #212b37;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
	text-align:center;
}
.product_btn {
    background: #0083ca;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    outline: none;
    padding: 8px 20px;
    text-align: center;
    transition: all linear 300ms;
    text-decoration: none;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    display: inline-block;
    border-radius: 50px;
}
.product_btn:hover {
    background: #0083ca;
    color: #fff;
	text-decoration: none;
}
/* ============================================================
   START: Coster Water Featured Products Image Size Fix
   Smart Slider 3 - Featured Products
   ============================================================ */

.product_outer #n2-ss-4 .n2-ss-item-image-content {
	width: 100% !important;
	height: 330px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	overflow: hidden !important;
}

.product_outer #n2-ss-4 .n2-ss-item-image-content picture {
	width: 100% !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.product_outer #n2-ss-4 .n2-ss-item-image-content img {
	width: 100% !important;
	height: 100% !important;
	max-width: 360px !important;
	max-height: 330px !important;
	object-fit: contain !important;
	object-position: center center !important;
	display: block !important;
	margin: 0 auto !important;
}

/* Keep product title/button from jumping because of image height differences */
.product_outer #n2-ss-4 .n2-ss-section-main-content {
	justify-content: flex-start !important;
}

@media (max-width: 767px) {
	.product_outer #n2-ss-4 .n2-ss-item-image-content {
		height: 260px !important;
	}

	.product_outer #n2-ss-4 .n2-ss-item-image-content img {
		max-width: 300px !important;
		max-height: 260px !important;
	}
}

/* ============================================================
   END: Coster Water Featured Products Image Size Fix
   ============================================================ */

/**featured product end**/

/**water system start**/
.water_system_outer{
    margin: 0px;
    padding: 100px 0px;
    background: #f1f6fb;
    position: relative;
    z-index: 2;
	background:url(assets/images/slider1.webp) no-repeat;
	background-size:cover;
}
.water_system_overlay::before {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    margin: 0px;
    content: '';
    top: 0px;
	background:#000;
	opacity: .5;
}
.water_system_outer h2 {
	font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #fff;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 10px 0px;
    position: relative;
	text-align:center;
}
.water_system_outer span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    line-height: 22px;
    color: #fff;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
    display: block;
    text-transform: uppercase;
}
.water_system_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
	line-height:22px;
    color: #0083ca;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
	display: block;
	text-transform:uppercase;
}

.water_system_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #fff;
    padding: 0px;
    margin: 0px 0px 25px 0px;
	text-align:center;
}
.water_system_box_outer{
	margin:0px;
	padding:0px;
}
.water_system_box{
	margin: 70px 0px 15px 0px;
    padding: 20px 50px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 8px #00000003;
	text-align:center;
}
.water_system_box img{
	margin:-70px 0px 0px 0px;
	padding:0px;
	max-width:70px;
}
.water_system_box h3 {
	font-size: 23px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 30px;
    color: #e07800;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
	text-align:center;
}
.water_system_box p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 25px 0px;
    text-align: center;
}
.water_system_btn {
    background: #0083ca;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    outline: none;
    padding: 8px 20px;
    text-align: center;
    transition: all linear 300ms;
    text-decoration: none;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    display: inline-block;
    border-radius: 50px;
}
.water_system_btn:hover {
    background: #0083ca;
    color: #fff;
	text-decoration: none;
}
/**water system end**/

/**vending machine start**/
.vending_machine_outer{
    margin: 0px;
    padding: 100px 0px 50px 0px;
    background: #fff;
    position: relative;
    z-index: 2;
}
.vending_machine_outer::before {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 22px;
    margin: 0px;
    content: '';
    top: -22px;
	
	background-size:cover;
}
.vending_machine_outer h2 {
	font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #212b37;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
}
.vending_machine_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
	line-height:22px;
    color: #0083ca;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
	display: block;
	text-transform:uppercase;
}

.vending_machine_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 25px 0px;
}
.vending_machine_img_css{
	margin:0px;
	position: relative;
	text-align: center;
}
.vending_machine_img_css img {
	position: relative;
	border-radius:10px;
}
/* ==========================================================
   START: VENDING SECTION DIVIDER
   Moved from WordPress Additional CSS.
   ========================================================== */

.vending_machine_outer::before {
    position: absolute;
    top: -22px;
    left: 0;
    width: 100%;
    height: 22px;
    content: '';
    background: url('assets/images/sec-divider.svg') repeat-x;
    background-size: 120px 23px;
    z-index: 3;
    pointer-events: none;
}

/* ==========================================================
   END: VENDING SECTION DIVIDER
   ========================================================== */

/**vending machine end**/

/**osmosis water system start**/
.osmosis_system_outer{
    margin: 0px;
    padding: 50px 0px 0px 0px;
    background: #fff;
    position: relative;
    z-index: 2;
}
.osmosis_system_outer h2 {
	font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #fff;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
}
.osmosis_system_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
	line-height:22px;
    color: #fff;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
	display: block;
	text-transform:uppercase;
}

.osmosis_system_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #fff;
    padding: 0px;
    margin: 0px 0px 25px 0px;
}
.osmosis_system_bg{
	margin:0px;
	padding:100px 70px!important;
	background:#212b37;
}
.osmosis_system_img_css{
	margin:0px;
	padding:0px;
	background:url(assets/images/osmosis_system_img.webp) no-repeat;
	background-size:cover;
	min-height:400px;
}
/* ==========================================================
   START: MOBILE OSMOSIS SECTION SPACING
   Moved from WordPress Additional CSS.
   ========================================================== */

@media only screen and (max-width: 768px) {
    .osmosis_system_bg {
        padding: 100px 30px !important;
    }
}

/* ==========================================================
   END: MOBILE OSMOSIS SECTION SPACING
   ========================================================== */

/**osmosis water system end**/

/**form area start**/
.form_outer{
	margin: 0px;
    padding:100px 0px;
	position:relative;
	background:#e5f2fa;
}
/*.form_outer::after {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 85px;
    margin: 0px;
    content: '';
    top: 0px;
	background-image: none;
}*/

.custom_zindex{
	z-index: 10;
}
.form_outer h2 {
    font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    line-height: 50px;
    color: #212b37;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    position: relative;
}
.form_outer h2 span {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    line-height: 22px;
    color: #0083ca;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
    display: block;
    text-transform: uppercase;
}
.form_custom_css{
    background: #fff;
    box-shadow: 0px 0px 20px #00000042;
    border-radius: 30px;
    padding: 35px 40px 30px;
    position: relative;
    z-index: 1;
}
#contact-form{
	margin-top: 20px;
}
select.form-control:not([size]):not([multiple]) {
    height: calc(2.25rem + 12px);
}
.request_a_quote_form{
	padding: 0px 0px 0px 0px;
}
.request_a_quote_form .form-control {
	display: block;
    width: 100%;
    height: 45px;
    padding: 10px;
    margin-bottom: 0px;
    font-size: 16px;
    line-height: 1.5;
    outline: none;
    border-radius: 0;
    background-color: #fff;
    background-clip: padding-box;
    border-radius:5px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    color: #494949;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.textarea_min_h{
	min-height: 100px;
}
.submit_btn_css {
	background: #066aab;
    box-shadow: none;
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    line-height: 25px;
    outline: none;
    padding: 10px 30px;
	margin-top:15px;
    text-align: center;
    transition: all linear 300ms;
    text-decoration: none;
    font-weight: 600;
    border-radius: 5px;
    font-family: "Open Sans", sans-serif;
	text-transform:uppercase;
	display:inline-block;
}
.submit_btn_css:hover {
    background: #1b1b1b;
    color: #fff;
	text-decoration: none;
}
.quick_address {
    padding: 0px;
    position: relative;
}
.quick_address_text{
	margin: 0px;
    padding:0px 20px 0px;
	z-index: 1;
    position: relative;
}
.quick_address_text h3 {
	font-size:40px;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    line-height: 40px;
    color: #233545;
    padding: 20px 0px 40px 0px;
    margin: 0px;
    position: relative;
	text-transform:uppercase;
}
.quick_address_text h3 span {
    font-size: 30px;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
	line-height:35px;
    color: #58764f;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 15px 0px;
	display: block;
	text-transform:capitalize;
}
.quick_address_text h3::after {
	position: absolute;
    left: 0px;
    right: 0px;
    width: 72px;
    height: 28px;
    margin: 0px;
    content: '';
    bottom: 0px;
	background: url("assets/images/sec-divider.svg") repeat-x;
}
.form_outer p {
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 25px 0px;
}
.form_outer label {
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 30px;
    color: #2c2c2c;
    padding: 0px;
    margin: 0px 0px 10px 0px;
	display:inline-block;
}
.form_outer label span{
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #f00;
    padding: 0px;
    margin: 00px;
	display:inline-block;
}
.form_outer span.form_bottom_label{
    font-size: 15px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 30px;
    color: #767676;
    padding: 0px;
    margin: 00px;
    display: inline-block;
}
.quick_address h5 {
    padding-left: 38px;
    line-height: 22px;
    color: #13191f;
	font-family: "Montserrat", sans-serif;
    font-weight: 400;
    margin: 0px 0px 30px 40px;
	font-size: 18px;
	position: relative;
}
.quick_address h5 em{
    padding-left: 0px;
    line-height: 22px;
    color: #fff;
	font-family: "Montserrat", sans-serif;
    margin: 0px!important;
	font-size: 18px;
	font-weight: 400;
	font-style: normal;
}
.quick_address h5 span{
	font-size: 24px;
    margin: 0px;
	display: block;
	padding-bottom: 10px;
	text-align: left;
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    color: #1b1b1b;
}
.quick_address h5 a{
	font-size: 16px;
	font-weight: 400;
    color: #13191f;
    margin: 0px;
	display: block;
	line-height: 22px;
	text-decoration: none;
}
.quick_address h5.address_custom::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -25px;
    content: '';
	background: #3489ca;
    display: block;
    border-radius: 10px;
}
.quick_address h5.phone_custom::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -25px;
    content: '';
	background: #3489ca;
    display: block;
    border-radius: 10px;
}
.quick_address h5.email_custom::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -25px;
    content: '';
	background: #3489ca;
    display: block;
    border-radius: 10px;
}
.quick_address .hl {
    font-weight: bold;
    min-width: 70px;
    float: left;
}
.quick_address .text {
    width: 80%;
    /*float: left;*/
}

.quick_address1{
	margin-top: 0px;
	margin-left: 50px;
}
.quick_address1 h5 {
    padding-left: 38px;
    line-height: 22px;
    color: #7dc2c0;
	font-family: "Montserrat", sans-serif;
    margin: 0px 0px 30px;
	font-size: 17px;
	font-weight: 500;
	position: relative;
}
.quick_address1 h5 em{
    padding-left: 0px;
    line-height: 22px;
    color: #7dc2c0;
	font-family: "Montserrat", sans-serif;
    margin: 0px!important;
	font-size: 14px;
	font-weight: 500;
	font-style: normal;
}
.quick_address1 h5 span{
	font-size: 22px;
	font-weight: 600;
    margin: 0px;
	display: block;
	padding-bottom: 10px;
	text-align: left;
	font-family: 'Roboto Slab', serif;
    color: #7dc2c0;
}
.quick_address1 h5 a{
	font-size: 16px;
	font-weight: 400;
    color: #7dc2c0;
    margin: 0px;
	display: block;
	line-height: 22px;
	text-decoration: none;
}
.quick_address1 h5.address_custom1::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -20px;
    content: '';
	background: #7dc2c0;
    display: block;
    border-radius: 100%;
}
.quick_address1 h5.phone_custom1::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -20px;
    content: '';
	background: #7dc2c0;
    display: block;
    border-radius: 100%;
}
.quick_address1 h5.email_custom1::before {
    width: 50px;
    height: 50px;
    position: absolute;
    left: -20px;
    content: '';
	background: #7dc2c0;
    display: block;
    border-radius: 100%;
}
.quick_address1 .hl {
    font-weight: bold;
    min-width: 70px;
    float: left;
}
.quick_address1 .text {
    width: 80%;
    /*float: left;*/
}
/* ==========================================================
   START: FORM PLUGIN ADJUSTMENTS
   Moved from WordPress Additional CSS.
   ========================================================== */

.nf-form-fields-required {
    display: none;
}

/* ==========================================================
   END: FORM PLUGIN ADJUSTMENTS
   ========================================================== */

/**form area end**/

/**footer start**/
.footer-section {
	background:#212b37;
	padding-top: 40px;
	padding-bottom: 0;
	position: relative;
}
.footer_section_overlay::before {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 22px;
    margin: 0px;
    content: '';
    top: -22px;
    background-size: cover;
}
.footer-section .footer-widget {
	margin-bottom: 40px;
}

.footer-section .footer-widget h4 {
  font-size: 18px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
  	color: #00aeef;
	padding: 0px 0px 5px 0px;
	margin:0px 0px 15px 0px;
	position: relative;
	text-transform:uppercase;
}
.footer-section .footer-widget h4::before {
    position: absolute;
    left: 0px;
    width: 75px;
    height: 3px;
    margin: 0 auto;
    content: '';
    bottom: 0px;
    background: #00aeef;
}
.footer-section .footer-widget p {
    color: #fff;
    line-height: 22px;
	margin-top: 25px;
    margin-bottom: 22px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
}
.footer-section .footer-widget ul {
	margin-bottom: 20px;
}
.footer-section .footer-widget ul li {
	list-style: none;
}

.footer-section .footer-widget ul li a{
	color: #fff;
	font-size: 14px;
	line-height: 20px;
	padding: 0px 0px 10px 22px;
	text-decoration: none;
	font-family: "Open Sans", sans-serif;
    font-weight: 500;
	-webkit-transition: all 0.1s;
	transition: all 0.1s;
	display: block;
	position:relative;
}
.footer-section .footer-widget ul li a:before {
    position: absolute;
    width: 8px;
    height: 8px;
    background: #fff;
    content: '';
    top: 5px;
    left: 0px;
	border-radius:100%;
}
.get_in_touch ul li a:before{
	display:none;
}
.footer-section .footer-widget ul li a:hover:before {
    position: absolute;
    width: 8px;
    height: 8px;
    background: #00aeef;
    content: '';
    top: 5px;
    left: 0px;
	border-radius:100%;
}
.footer-section .footer-widget ul li a:hover{
	padding: 0px 0px 10px 25px;
	color: #00aeef;
}
.footer-section .footer-widget ul.style-2 {
    position: relative;
    padding-bottom: 0px;
}
.footer-section .footer-widget ul.style-2 li {
    position: relative;
    padding: 0;
    border: 0;
    margin-bottom: 5px;
}
.footer-section .footer-widget ul.style-2 li i {
    color: #00aeef;
	font-size: 17px;
}
.footer-section .footer-widget ul.style-2 li a{
	color: #fff;
    font-size: 15px;
    line-height: 20px;
    padding-left: 0;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    -webkit-transition: all 0.1s;
    transition: all 0.1s;
    background: no-repeat;
	text-transform: inherit;
	text-transform:uppercase;
}
.footer-section .footer-widget ul.style-2 li a strong{
	font-size: 14px;
} 
.footer-section .footer-widget ul.style-2 li a:hover{
	color: #00aeef;
}
.footer-section .footer-widget ul.style-2 .hl {
    font-weight: bold;
    min-width: 25px;
    float: left;
}
.footer-section .footer-widget ul.style-2 .text {
    width: 80%;
    float: left;
}
.footer_logo_box {
	margin:0px;
	padding:0px;
    position: relative;
}
.footer_logo_box .footer_logo_img {
    display:block;
}

.footer_logo_box .footer_logo_text {
    width: 65%;
    padding: 10px 0px 0px 20px;
    transition: .5s;
    display: inline-block;
}

.footer_logo_box .footer_logo_text p {
    color: #b29a52;
    font-size: 15px;
    margin-bottom: 0px;
	font-family: "Open Sans", sans-serif;
	font-weight: 500;
}
.footer-bottom-outer{
	
}
.footer-bottom {
	padding: 20px 0px;
	background: #00aeef;
}

.copyright {
	color: #0e1017;
	font-size: 14px;
	margin-bottom: 0px;
}

.copyright p {
	color: #fff;
	font-size: 15px;
	margin-left: 0px;
	margin-bottom: 0px;
	-webkit-transition: all 0.1s;
	transition: all 0.1s;
	font-family: "Open Sans", sans-serif;
    font-weight: 400;
}
.footer_social_links a {
  font-size: 18px;
  color: #fff;
  margin-right: 5px;
	transition: all linear 300ms;
	text-align: center;
}

.footer_social_links a:hover {
  color: #fff;
}
.footer_social_links a i{
	width: 30px;
    height: 30px;
    background: #3489ca;
    border-radius: 30px;
    line-height: 30px;
    font-size: 15px;
}
/* ==========================================================
   START: FOOTER SECTION DIVIDER
   Moved from WordPress Additional CSS.
   ========================================================== */

.footer_section_overlay::before {
    position: absolute;
    top: -22px;
    left: 0;
    width: 100%;
    height: 22px;
    content: '';
    background: url('assets/images/sec-divider-dark.svg') repeat-x;
    background-size: 120px 23px;
    z-index: 3;
    pointer-events: none;
}

/* ==========================================================
   END: FOOTER SECTION DIVIDER
   ========================================================== */

/**footer end**/

/**inner css start**/
.bradcam_area {
	background-size: cover;
    background-position: center;
      padding: 50px 0 25px 0;
    background-repeat: no-repeat;
    position: relative;
}
.breadcam_bg {
    background-image: url(assets/images/slider1.webp);
}
.breadcam_overlay::before {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    margin: 0px auto;
    content: '';
    bottom: 0px;
    background: #1B1B1B;
    background: -webkit-linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
    background: -moz-linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
    background: linear-gradient(90deg, rgba(27, 27, 27, 1) 0%, rgba(0, 174, 239, 0.23) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1B1B1B", endColorstr="#00AEEF", GradientType=1);
    opacity: .8;
}
.bradcam_area h2 {
    font-size: 50px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
	line-height:50px;
    color: #fff;
    padding: 0px 0px 35px 0px;
    margin: 0px;
    position: relative;
    text-align: center;
}
.bradcam_area p {
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 25px;
    color: #fff;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 0px 0px;
	display: block;
	text-transform:uppercase;
	text-align:center;
}
.service_page_css{
	padding: 60px 0px;
}
.service_sidebar_css{
	margin: 0px;
	padding: 20px 0px 20px 0px;
	background: #212b37;
    border-radius:20px;
}
.service_sidebar_css h3 {
  	font-size: 22px;
	font-family: "Open Sans", sans-serif;
    font-weight: 900;
  	color: #fff;
	padding: 0px 20px 10px 20px;
    margin: 30px 0px 20px 0px;
	position: relative;
}
.sidebar_quick_address{
	margin-top: 0px;
	margin-left: 40px;
}
.sidebar_quick_address h5 {
    padding-left: 28px;
    line-height: 20px;
    color: #fff;
	font-family: "Open Sans", sans-serif;
    margin: 0px 0px 20px;
	font-size: 14px;
	font-weight: 400;
	position: relative;
}
.sidebar_quick_address h5 span{
	font-size: 14px;
	font-weight: 600;
    color: #fff;
    margin: 0px;
	display: block;
	padding-bottom: 10px;
	text-align: left;
	font-family: "Open Sans", sans-serif;
	text-transform: uppercase;
}
.sidebar_quick_address h5 a{
	font-size: 16px;
	font-weight: 400;
    color: #333333;
    margin: 0px;
	display: block;
	line-height: 22px;
	text-decoration: none;
}
.sidebar_quick_address h5.address_custom::before {
	width: 40px;
    height: 40px;
    position: absolute;
    left: -20px;
    content: '';
	background: #1b1b1b;
    background-size: 16px;
    display: block;
    border-radius: 100%;
}
.sidebar_quick_address h5.phone_custom::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: -20px;
    content: '';
	background: #1b1b1b;
	background-size: 20px;
    display: block;
    border-radius: 100%;
}
.sidebar_quick_address h5.email_custom::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: -20px;
    content: '';
	background: #1b1b1b;
	background-size: 20px;
    display: block;
    border-radius: 100%;
}
.quick_address .hl {
    font-weight: bold;
    min-width: 70px;
    float: left;
}
.sidebar_quick_address .text {
    width: 80%;
    /*float: left;*/
}
.sep{
	margin: 15px 20px 15px 20px;
	padding: 0px;
	height: 1px;
	background: #2f3c4c;
}
.service_sidebar_css h3::after {
	position: absolute;
    left: 20px;
    right: 0px;
    width: 70px;
    height: 1px;
    margin: 0px;
    content: '';
    bottom: 0px;
    background: #cecece;
}
.service_sidebar_css ul{
	margin: 0px;
	padding: 0px;
}
.service_sidebar_css ul li{
	margin: 0px;
	padding: 0px;
	list-style: none;
}
.service_sidebar_css ul li a{
	margin: 0px;
	padding: 10px 0px 10px 40px;
	font-size: 15px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    line-height: 25px;
    color: #fff;
	position: relative;
	text-decoration: none;
	display: block;
	background: url(assets/images/service_arrow.webp) 20px 17px no-repeat;
	transition: all linear 300ms;
	text-transform:uppercase;
}
.service_sidebar_css ul li a:hover{
	margin: 0px;
	padding: 10px 0px 10px 35px;
	color: #fff;
	background:#066aab url(assets/images/service_arrow.webp) 20px 17px no-repeat;
}
.service_sidebar_social{
	margin: 15px 20px 15px 20px;
	padding: 0px;
}
.service_sidebar_social a {
  font-size: 18px;
  color: #fff;
  margin-right: 5px;
	transition: all linear 300ms;
	text-align: center;
}

.service_sidebar_social a:hover {
  color: #fff;
}
.service_sidebar_social a i{
    width: 40px;
    height: 40px;
    background: #1b1b1b;
    border-radius: 30px;
    line-height: 40px;
    font-size: 20px;
}
.service_page_css h4 {
  	font-size: 25px;
	font-family: "Open Sans", sans-serif;
    font-weight: 700;
  	color: #1b1b1b;
	padding: 0px 0px 5px 0px;
    margin: 30px 0px 10px 0px;
	position: relative;
}
.service_page_css h4 span {
    font-size: 25px;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 35px;
    color: #734a2b;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 15px 0px;
    text-transform: capitalize;
}
.service_page_css h4::after {
	position: absolute;
    left: 0px;
    right: 0px;
    width: 70px;
    height: 1px;
    margin: 0px;
    content: '';
    bottom: 0px;
    background: #cecece;
}
.service_page_css ul.custom_ul{
	margin: 25px 0px 0px;
	padding: 0px;
}
.service_page_css ul.custom_ul li{
    margin: 0px;
    padding: 0px 0px 12px 30px;
    font-size: 17px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 26px;
    color: #0abc6a;
    list-style: none;
    position: relative;
    text-decoration: none;
    display: block;
    transition: all linear 300ms;
}
.service_page_css ul.custom_ul li::before {
	position: absolute;
    left: 0px;
    right: 0px;
    width: 20px;
    height: 20px;
    margin: 0px;
    content: '';
    top: 3px;
	background: url("assets/images/service_arrow.webp") no-repeat;
}
.service_page_css ul li strong{
    font-size: 18px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 26px;
    color: #373a5e;
    padding: 10px 0px 10px 0px;
    margin: 10px 0px 0px 0px;
}
.service_page_css strong{
    font-size: 18px;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 26px;
    color: #373a5e;
    padding: 10px 0px 10px 0px;
    margin: 10px 0px 0px 0px;
}
.service_page_css p {
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
    line-height: 25px;
    color: #373a5e;
    padding: 0px 0px 10px 0px;
    margin: 10px 0px 0px 0px;
}
.service_page_css img.service_small_css{
	margin:10px 0px 20px 0px;
	padding:0px;
	border-radius: 30px;
}
.service_sideimg_css img{
	border-radius: 30px;
}

/* ==========================================================
   START: INTEGRATED INNER-PAGE AND SERVICE STYLES
   Moved from WordPress Additional CSS.
   ========================================================== */

.entry-header {
    display: none;
}

li.meta.author.vcard {
    display: none;
}

.excerpt-wrap ol, .excerpt-wrap ul, .nv-content-wrap ol, .nv-content-wrap ul {
       margin: 15px 0 20px 0px;
    margin-left: 20px;
}

.service_page_css h1,
.service_page_css h2,
.service_page_css h3,
.service_page_css h4,
.service_page_css h5,
.service_page_css h6,
.service_page_css .h1,
.service_page_css .h2,
.service_page_css .h3,
.service_page_css .h4,
.service_page_css .h5,
.service_page_css .h6 {
    font-family: "Open Sans", sans-serif !important;
    font-weight: 900 !important;
    color: #212b37;
}
 
.excerpt-wrap li, .nv-content-wrap li {
    margin-top: 10px;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
    line-height: 25px;
    color: #373a5e;
    /* padding: 0px 0px 10px 0px; */
    /* margin: 10px 0px 0px 0px; */
}

/* ===========================
   STANDARD FEATURES TABLE CSS START
   =========================== */

.standard-features {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
  margin-top: 10px;
}

.standard-features th,
.standard-features td {
  padding: 12px;
  text-align: left;
  border: 1px solid #ccc;
}

.standard-features tr:nth-child(even) {
  background-color: #f9f9f9;
}

.standard-features tr:nth-child(odd) {
  background-color: #ffffff;
}

@media (max-width: 600px) {
  .standard-features td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .standard-features tr {
    display: block;
    margin-bottom: 10px;
  }
  .standard-features th {
    display: none;
  }
}

/* ===========================
   STANDARD FEATURES TABLE CSS END
   =========================== */


/* ===========================
   SPECIFICATIONS TABLE CSS START
   =========================== */

.specifications-table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
  margin-top: 10px;
}

.specifications-table th,
.specifications-table td {
  padding: 12px;
  text-align: left;
  border: 1px solid #ccc;
  vertical-align: top;
}

.specifications-table tr:nth-child(even) {
  background-color: #f9f9f9;
}

.specifications-table tr:nth-child(odd) {
  background-color: #ffffff;
}

.specifications-table th {
  background-color: #eee;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

@media (max-width: 600px) {
  .specifications-table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .specifications-table tr {
    display: block;
    margin-bottom: 10px;
  }
  .specifications-table th {
    display: none;
  }
}

/* ===========================
   SPECIFICATIONS TABLE CSS END
   =========================== */

/* ===============================
   DARK OVERLAY FOR HEADER BACKGROUND
   This section adds a semi-transparent
   black overlay to the background image
   in the .bradcam_area_bg section to 
   improve white text readability.
   =============================== */

.bradcam_area_bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* Black overlay with 40% opacity */
    z-index: 1;
    pointer-events: none; /* Ensures clicks go through */
}

.bradcam_area_bg {
    position: relative;
    z-index: 0; /* Establish stacking context */
}

.bradcam_text {
    position: relative;
    z-index: 2; /* Places text above the overlay */
}

/* ===============================
   END DARK OVERLAY STYLING
   =============================== */

/* Force side-by-side layout using flex */
/* DESKTOP LAYOUT */
/* ===================== DESKTOP LAYOUT ===================== */
@media (min-width: 961px) {
    .service_page_css .container {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 20px;
        flex-wrap: nowrap;
    }

    .nv-sidebar-wrap.col-sm-12 {
        width: 25% !important;
        max-width: 300px;
        flex-shrink: 0;
        padding-left: 5px !important;
        padding-right: 5px !important;
        margin: 0 !important;
        position: relative;
        z-index: 1;
    }

    .nv-index-posts.col {
        width: 75%;
        flex-grow: 1;
        padding-left: 20px !important;
        padding-right: 0 !important;
        margin: 0 !important;
    }
}

/* ===================== MOBILE/TABLET FLYOUT SIDEBAR ===================== */
@media (max-width: 960px) {
    .service_page_css .container {
        display: block;
    }

    .nv-sidebar-wrap.col-sm-12 {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: #212b37;
        z-index: 9999;
        overflow-y: auto;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        padding: 20px;
        box-sizing: border-box;
    }

    .nv-sidebar-wrap.col-sm-12.active {
        transform: translateX(0);
    }

    .nv-index-posts.col {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.sidebar-open {
        overflow: hidden;
    }
}

/* ===================== SHARED STYLES ===================== */

/* Reduce vertical padding on service section */
.service_page_css {
    padding: 30px 0;
}

/* ========== SIDEBAR WRAPPER STYLING ========== */
/* This applies padding, background color, and border radius to the entire sidebar */
.nv-sidebar-wrap {
    margin: 0;
    padding: 20px 0;
    background: #212b37;
    border-radius: 20px;
}

/* ========== SIDEBAR LINKS DEFAULT STYLING ========== */
/* This styles all links inside the sidebar, including font, spacing, and the background arrow */
.nv-sidebar-wrap a {
    margin: 0;
    padding: 10px 0 10px 40px;
    font-size: 15px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    line-height: 25px;
    color: #fff;
    position: relative;
    text-decoration: none;
    display: block;
    background: url(assets/images/service_arrow.webp) 20px 17px no-repeat;
    transition: all linear 300ms;
    text-transform: uppercase;
}


/* ========== SIDEBAR LINKS HOVER STYLING ========== */
/* This changes padding and background color when the sidebar link is hovered */
.nv-sidebar-wrap a:hover {
    padding: 10px 0 10px 35px;
    color: #fff;
    background: #066aab url(assets/images/service_arrow.webp) 20px 17px no-repeat;
}

/* ========== SIDEBAR WIDGET TITLES ========== */
/* This styles headings like "Product Categories" or other widget titles */
.nv-sidebar-wrap .widget-title {
    font-size: 22px;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    color: #fff;
    padding: 0 20px 10px 20px;
    margin: 30px 0 20px 0;
    position: relative;
}

/* ========== UNDERLINE EFFECT BELOW TITLES ========== */
/* Adds a subtle underline using a pseudo-element */
.nv-sidebar-wrap .widget-title::after {
    position: absolute;
    left: 20px;
    right: 0;
    width: 70px;
    height: 1px;
    margin: 0;
    content: '';
    bottom: 0;
    background: #cecece;
}

@media (max-width: 768px) {
  .alignright.wp-caption,
  .alignleft.wp-caption,
  .aligncenter.wp-caption {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    display: block;
    margin: 20px auto !important;
  }

  .alignright.wp-caption img,
  .alignleft.wp-caption img,
  .aligncenter.wp-caption img {
    width: 100% !important;
    height: auto !important;
    display: block;
  }

  .alignright.wp-caption .wp-caption-text,
  .alignleft.wp-caption .wp-caption-text,
  .aligncenter.wp-caption .wp-caption-text {
    text-align: center;
    font-size: 0.95em;
    padding-top: 5px;
  }
}

/* ==========================================================
   END: INTEGRATED INNER-PAGE AND SERVICE STYLES
   ========================================================== */

/**sample area end**/


/* Standalone shell refinements. */
.footer-widget h2 {
	position: relative;
	display: inline-block;
	margin: 0 0 24px;
	padding-bottom: 8px;
	color: #00aeef;
	font-size: 20px;
	font-weight: 900;
	text-transform: uppercase;
}

.footer-widget h2::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 3px;
	background: #00aeef;
	content: "";
}

.footer-brand img {
	display: block;
	width: min(100%, 386px);
	height: auto;
	margin-bottom: 26px;
}

.get_in_touch .style-2 li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.get_in_touch .style-2 .hl {
	flex: 0 0 24px;
}

.get_in_touch .style-2 svg {
	display: block;
	width: 24px;
	height: 24px;
	fill: #00aeef;
}

.footer-bottom .copyright,
.website-credit {
	margin: 0;
	text-align: center;
}

.website-credit {
	padding: 12px 15px;
	background: #ffffff;
	color: #425462;
}

.page-builder-content,
.front-page-content {
	min-width: 0;
}

.vc_row:not(.container),
.wpb_row:not(.container),
.vc_row-fluid:not(.container) {
	max-width: 100%;
}

.entry-content,
.entry-content .wpb_wrapper,
.page-builder-content,
.page-builder-content .wpb_wrapper {
	min-width: 0;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content p,
.entry-content li,
.page-builder-content h1,
.page-builder-content h2,
.page-builder-content h3,
.page-builder-content h4,
.page-builder-content p,
.page-builder-content li {
	overflow-wrap: break-word;
}

@media (max-width: 767px) {
	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		font-size: clamp(38px, 11vw, 52px);
		line-height: 1.08;
	}

	.welcome_outer span {
		font-size: 17px;
		line-height: 1.5;
	}
}

@media (max-width: 767px) {
	.service_page_css,
	.content-area,
	.blog-shell,
	.single-post-shell {
		padding: 45px 0;
	}

	.bradcam_area {
		padding: 40px 0;
	}
}

/* ==========================================================
   START: RESPONSIVE PREMIUM HEADER AND MOBILE MENU STATES
   ========================================================== */

.site-header.header-area {
	transition: box-shadow 220ms ease;
}

.coster-header-row,
.site-header .logo,
.site-header .logo img,
#primary-menu > li > a,
#primary-menu .header_btn > a,
#primary-menu .menu-item-contact > a {
	transition: min-height 220ms ease, width 220ms ease, flex-basis 220ms ease, padding 220ms ease, font-size 220ms ease, background-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

@media (min-width: 992px) {
	.coster-header-row {
		min-height: 108px;
	}

	.site-header .logo {
		flex-basis: 225px;
	}

	.site-header .logo img {
		width: 225px;
	}

	#primary-menu > li > a {
		min-height: 50px;
		font-size: 14px;
	}

	#primary-menu .header_btn > a,
	#primary-menu .menu-item-contact > a {
		min-height: 50px;
		padding-right: 21px;
		padding-left: 21px;
		font-size: 13px;
	}

	.site-header.is-scrolled {
		box-shadow: 0 8px 24px rgba(24, 43, 58, 0.13);
	}

	.site-header.is-scrolled .coster-header-row {
		min-height: 78px;
	}

	.site-header.is-scrolled .logo {
		flex-basis: 170px;
	}

	.site-header.is-scrolled .logo img {
		width: 170px;
	}

	.site-header.is-scrolled #primary-menu > li > a {
		min-height: 42px;
		padding-top: 9px;
		padding-bottom: 9px;
		font-size: 12.5px;
	}

	.site-header.is-scrolled #primary-menu .header_btn > a,
	.site-header.is-scrolled #primary-menu .menu-item-contact > a {
		min-height: 42px;
		padding-right: 17px;
		padding-left: 17px;
		font-size: 11.5px;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.coster-header-row {
		min-height: 96px;
		gap: 10px;
	}

	.site-header .logo {
		flex-basis: 174px;
	}

	.site-header .logo img {
		width: 174px;
	}

	#primary-menu > li > a {
		font-size: 11px !important;
	}

	#primary-menu .header_btn > a,
	#primary-menu .menu-item-contact > a {
		padding-right: 13px;
		padding-left: 13px;
		font-size: 10.5px;
	}

	.site-header.is-scrolled .coster-header-row {
		min-height: 74px;
	}

	.site-header.is-scrolled .logo {
		flex-basis: 148px;
	}

	.site-header.is-scrolled .logo img {
		width: 148px;
	}

	.site-header.is-scrolled #primary-menu > li > a {
		font-size: 10.5px !important;
	}
}

@media (min-width: 1600px) {
	.coster-header-row {
		min-height: 118px;
		gap: 32px;
	}

	.site-header .logo {
		flex-basis: 245px;
	}

	.site-header .logo img {
		width: 245px;
	}

	#primary-menu {
		gap: 5px;
	}

	#primary-menu > li > a {
		min-height: 54px;
		padding-right: 9px;
		padding-left: 9px;
		font-size: 15px;
	}

	#primary-menu .header_btn > a,
	#primary-menu .menu-item-contact > a {
		min-height: 52px;
		padding-right: 24px;
		padding-left: 24px;
		font-size: 13px;
	}

	.site-header.is-scrolled .coster-header-row {
		min-height: 82px;
	}

	.site-header.is-scrolled .logo {
		flex-basis: 182px;
	}

	.site-header.is-scrolled .logo img {
		width: 182px;
	}

	.site-header.is-scrolled #primary-menu > li > a {
		font-size: 13px;
	}
}

@media (max-width: 991.98px) {
	#primary-menu > li > a::before {
		display: none;
	}

	#primary-menu > li:not(.header_btn):not(.menu-item-contact) > a:hover,
	#primary-menu > li:not(.header_btn):not(.menu-item-contact) > a:focus-visible {
		background: #f2faff;
		color: #006ca8;
		box-shadow: inset 4px 0 0 rgba(0, 131, 202, 0.38);
		outline: 0;
	}

	#primary-menu > .current-menu-item:not(.header_btn):not(.menu-item-contact) > a,
	#primary-menu > .current-menu-ancestor:not(.header_btn):not(.menu-item-contact) > a,
	#primary-menu .sub-menu .current-menu-item > a {
		background: #e7f6fd;
		color: #006ca8;
		box-shadow: inset 4px 0 0 #0083ca;
	}
}

/* ==========================================================
   END: RESPONSIVE PREMIUM HEADER AND MOBILE MENU STATES
   ========================================================== */

/* ==========================================================
   START: LARGE-SCREEN HOMEPAGE HERO SCALE
   ========================================================== */

@media (min-width: 1600px) {
	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		max-width: 900px;
		margin-left: 24px;
		font-size: 72px;
		line-height: 1.05;
	}

	.welcome_outer span {
		max-width: 940px;
		margin-left: 24px;
		font-size: 23px;
	}
}

@media (min-width: 2000px) {
	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		max-width: 980px;
		margin-left: 36px;
		font-size: 78px;
	}

	.welcome_outer span {
		margin-left: 36px;
		font-size: 24px;
	}
}

/* ==========================================================
   END: LARGE-SCREEN HOMEPAGE HERO SCALE
   ========================================================== */

/* ==========================================================
   START: RESPONSIVE INTERIOR PAGE TITLE BANNERS
   ========================================================== */

.bradcam_area {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 132px;
	padding: 26px 0 !important;
}

.bradcam_area > .container,
.bradcam_text {
	width: 100%;
}

.bradcam_text h1,
.bradcam_text h2,
.bradcam_area h1,
.bradcam_area h2 {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 34px;
	line-height: 1.12;
	text-align: center;
}

@media (min-width: 768px) {
	.bradcam_area {
		min-height: 155px;
		padding: 30px 0 !important;
	}

	.bradcam_text h1,
	.bradcam_text h2,
	.bradcam_area h1,
	.bradcam_area h2 {
		font-size: 44px;
	}
}

@media (min-width: 1200px) {
	.bradcam_area {
		min-height: 178px;
	}

	.bradcam_text h1,
	.bradcam_text h2,
	.bradcam_area h1,
	.bradcam_area h2 {
		font-size: 52px;
	}
}

@media (min-width: 1600px) {
	.bradcam_area {
		min-height: 235px;
		padding: 36px 0 !important;
	}

	.bradcam_text h1,
	.bradcam_text h2,
	.bradcam_area h1,
	.bradcam_area h2 {
		font-size: 60px;
	}
}

@media (min-width: 2200px) {
	.bradcam_area {
		min-height: 250px;
	}
}

/* ==========================================================
   END: RESPONSIVE INTERIOR PAGE TITLE BANNERS
   ========================================================== */

/* ==========================================================
   START: PREMIUM COSTER WATER FOOTER
   ========================================================== */

.footer-section {
	position: relative;
	padding: 0;
	background:
		radial-gradient(circle at 12% 18%, rgba(0, 174, 239, 0.12), transparent 28%),
		radial-gradient(circle at 88% 75%, rgba(0, 131, 202, 0.1), transparent 32%),
		#182532;
	color: #ffffff;
}

.footer-section .footer-main {
	padding-top: 76px;
	padding-bottom: 58px;
}

.footer-grid {
	display: grid;
	grid-template-columns: 1.12fr 0.72fr 1.28fr 1.18fr;
	gap: clamp(32px, 3.4vw, 68px);
	align-items: start;
}

.footer-section .footer-widget {
	min-width: 0;
	margin: 0;
}

.footer-section .footer-widget h2 {
	position: relative;
	display: inline-block;
	margin: 0 0 25px;
	padding: 0 0 11px;
	color: #20b7f0;
	font-size: 18px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.footer-section .footer-widget h2::after {
	position: absolute;
	right: auto;
	bottom: 0;
	left: 0;
	width: 48px;
	height: 3px;
	border-radius: 3px;
	background: linear-gradient(90deg, #20b7f0, #0083ca);
	content: "";
}

.footer-brand-link {
	display: inline-block;
	transition: transform 180ms ease, filter 180ms ease;
}

.footer-brand-link:hover,
.footer-brand-link:focus-visible {
	filter: drop-shadow(0 8px 16px rgba(0, 174, 239, 0.2));
	transform: translateY(-2px);
	outline: 0;
}

.footer-section .footer-brand img {
	display: block;
	width: 246px;
	max-width: 100%;
	height: auto;
	margin: 0;
}

.footer-section .footer-widget .footer-brand-description {
	max-width: 360px;
	margin: 26px 0 0;
	color: #d7e5ef;
	font-size: 15px;
	line-height: 1.75;
}

.footer-section .footer-widget .footer-link-list,
.footer-section .footer-widget .footer-contact-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-section .footer-widget .footer-link-list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-section .footer-widget .footer-link-list li a {
	position: relative;
	display: block;
	padding: 7px 0 7px 20px;
	color: #edf6fb;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition: color 180ms ease, transform 180ms ease;
}

.footer-section .footer-widget .footer-link-list li a::before,
.footer-section .footer-widget .footer-link-list li a:hover::before {
	position: absolute;
	top: 50%;
	left: 1px;
	display: block;
	width: 7px;
	height: 7px;
	border-top: 2px solid #20b7f0;
	border-right: 2px solid #20b7f0;
	border-radius: 0;
	background: transparent;
	content: "";
	transform: translateY(-50%) rotate(45deg);
	transition: border-color 180ms ease, transform 180ms ease;
}

.footer-section .footer-widget .footer-link-list li a:hover,
.footer-section .footer-widget .footer-link-list li a:focus-visible {
	padding: 7px 0 7px 20px;
	color: #35c3f6;
	transform: translateX(4px);
	outline: 0;
}

.footer-section .footer-widget .footer-link-list li a:hover::before,
.footer-section .footer-widget .footer-link-list li a:focus-visible::before {
	border-color: #ffffff;
	transform: translate(3px, -50%) rotate(45deg);
}

.footer-section .footer-widget .footer-contact-list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0 0 11px;
	padding: 0;
	list-style: none;
}

.footer-section .footer-widget .footer-contact-list a {
	min-width: 0;
	padding: 7px 0 0;
	color: #edf6fb;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	text-decoration: none;
	text-transform: none;
	overflow-wrap: anywhere;
	transition: color 180ms ease, transform 180ms ease;
}

.footer-section .footer-widget .footer-contact-list a::before {
	display: none;
}

.footer-section .footer-widget .footer-contact-list li:hover a,
.footer-section .footer-widget .footer-contact-list a:focus-visible {
	color: #35c3f6;
	transform: translateX(2px);
	outline: 0;
}

.footer-contact-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(53, 195, 246, 0.25);
	border-radius: 9px;
	background: rgba(0, 131, 202, 0.13);
	box-shadow: 0 5px 14px rgba(0, 0, 0, 0.12);
	transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.footer-contact-icon svg {
	display: block;
	width: 19px;
	height: 19px;
	fill: #20b7f0;
	transition: fill 180ms ease, transform 180ms ease;
}

.footer-contact-list li:hover .footer-contact-icon,
.footer-hours-title:hover .footer-contact-icon {
	border-color: rgba(53, 195, 246, 0.7);
	background: #0083ca;
	box-shadow: 0 8px 20px rgba(0, 131, 202, 0.3);
	transform: translateY(-2px) scale(1.04);
}

.footer-contact-list li:hover .footer-contact-icon svg,
.footer-hours-title:hover .footer-contact-icon svg {
	fill: #ffffff;
	transform: scale(1.08);
}

.footer-hours {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid rgba(181, 214, 232, 0.16);
}

.footer-hours-title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
	color: #ffffff;
}

.footer-hours-title strong {
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.footer-section .footer-widget .footer-hours p {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	max-width: 310px;
	margin: 0;
	padding: 3px 0 3px 48px;
	color: #d7e5ef;
	font-size: 13px;
	line-height: 1.5;
}

.footer-section .footer-widget .footer-hours p span:last-child {
	color: #ffffff;
	font-weight: 700;
	white-space: nowrap;
}

.footer-lower {
	border-top: 1px solid rgba(181, 214, 232, 0.15);
	background: rgba(8, 21, 32, 0.34);
}

.footer-lower-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	min-height: 78px;
	padding-top: 18px;
	padding-bottom: 18px;
}

.footer-section .footer-lower .copyright,
.footer-section .footer-lower .website-credit {
	margin: 0;
	padding: 0;
	background: transparent;
	color: #aec2cf;
	font-size: 13px;
	line-height: 1.5;
	text-align: left;
}

.footer-section .footer-lower .website-credit {
	text-align: right;
}

.footer-section .footer-lower .website-credit a {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-left: 4px;
	color: #35c3f6;
	font-weight: 800;
	text-decoration: none;
	text-shadow: 0 0 18px rgba(53, 195, 246, 0.16);
}

.footer-section .footer-lower .website-credit a::after {
	position: absolute;
	right: 21px;
	bottom: -4px;
	left: 0;
	height: 2px;
	background: linear-gradient(90deg, #35c3f6, #0083ca);
	content: "";
	transform: scaleX(0.28);
	transform-origin: left;
	transition: transform 180ms ease;
}

.footer-section .footer-lower .website-credit svg {
	width: 17px;
	height: 17px;
	fill: currentColor;
	transition: transform 180ms ease;
}

.footer-section .footer-lower .website-credit a:hover,
.footer-section .footer-lower .website-credit a:focus-visible {
	color: #ffffff;
	outline: 0;
}

.footer-section .footer-lower .website-credit a:hover::after,
.footer-section .footer-lower .website-credit a:focus-visible::after {
	transform: scaleX(1);
}

.footer-section .footer-lower .website-credit a:hover svg,
.footer-section .footer-lower .website-credit a:focus-visible svg {
	transform: translateX(4px);
}

@media (max-width: 1199px) {
	.footer-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 48px 54px;
	}
}

@media (max-width: 680px) {
	.footer-section .footer-main {
		padding-top: 58px;
		padding-bottom: 42px;
	}

	.footer-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 38px;
	}

	.footer-section .footer-widget .footer-brand-description {
		max-width: none;
	}

	.footer-lower-inner {
		align-items: flex-start;
		flex-direction: column;
		gap: 10px;
		min-height: 0;
		padding-top: 22px;
		padding-bottom: 22px;
	}

	.footer-section .footer-lower .website-credit {
		text-align: left;
	}
}

/* ==========================================================
   END: PREMIUM COSTER WATER FOOTER
   ========================================================== */

/* ==========================================================
   START: PREMIUM DESKTOP NAVIGATION DROPDOWNS
   ========================================================== */

@media (min-width: 992px) {
	#primary-menu > li > .sub-menu {
		top: calc(100% + 12px);
		min-width: 300px;
		padding: 12px;
		border: 1px solid rgba(0, 131, 202, 0.2);
		border-radius: 14px;
		background: linear-gradient(180deg, #ffffff 0%, #f9fcfe 100%);
		box-shadow: 0 26px 58px rgba(17, 42, 59, 0.2), 0 8px 20px rgba(0, 131, 202, 0.09);
	}

	#primary-menu > li > .sub-menu::before {
		position: absolute;
		top: 0;
		right: 18px;
		left: 18px;
		height: 3px;
		border-radius: 0 0 4px 4px;
		background: linear-gradient(90deg, #20b7f0, #0083ca);
		content: "";
	}

	#primary-menu > li > .sub-menu::after {
		position: absolute;
		top: -7px;
		left: 34px;
		width: 13px;
		height: 13px;
		border-top: 1px solid rgba(0, 131, 202, 0.2);
		border-left: 1px solid rgba(0, 131, 202, 0.2);
		background: #ffffff;
		content: "";
		transform: rotate(45deg);
	}

	#primary-menu .sub-menu a {
		position: relative;
		margin: 1px 0;
		padding: 12px 15px;
		border-radius: 9px;
		color: #182b39;
		font-size: 13px;
		font-weight: 700;
		line-height: 1.4;
		transition: background-color 170ms ease, color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
	}

	#primary-menu .sub-menu a:hover,
	#primary-menu .sub-menu a:focus-visible {
		background: linear-gradient(90deg, #e8f7fd 0%, #f4fbfe 100%);
		box-shadow: inset 3px 0 0 #0083ca;
		color: #006ca8;
		transform: translateX(3px);
		outline: 0;
	}

	#primary-menu .sub-menu .current-menu-item > a,
	#primary-menu .sub-menu .current-menu-ancestor > a {
		background: linear-gradient(90deg, #def2fb 0%, #edf8fd 100%);
		box-shadow: inset 3px 0 0 #0083ca;
		color: #006ca8;
	}

	#primary-menu .sub-menu .sub-menu {
		top: -12px;
		left: calc(100% + 10px);
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	#primary-menu > li > .sub-menu {
		min-width: 260px;
	}

	#primary-menu .sub-menu a {
		padding: 10px 13px;
		font-size: 12px;
	}
}

/* ==========================================================
   END: PREMIUM DESKTOP NAVIGATION DROPDOWNS
   ========================================================== */

/* ==========================================================
   START: MOBILE AND TABLET HOMEPAGE HERO REFINEMENT
   Adds breathing room below the header and scales the glass
   without changing the approved desktop composition.
   ========================================================== */

@media (min-width: 768px) and (max-width: 991.98px) {
	.welcome_outer {
		padding-top: 38px;
	}

	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		max-width: 780px;
		margin-top: 0;
		font-size: 56px;
		line-height: 1.07;
	}

	.welcome_outer span {
		max-width: 760px;
		margin-top: 22px;
		font-size: 19px;
		line-height: 1.45;
	}

	.welcome_img img {
		display: block;
		width: 360px;
		max-width: 44vw;
		height: auto;
		margin: 30px auto -145px;
	}
}

@media (max-width: 767px) {
	.welcome_outer {
		padding-top: 32px;
	}

	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		max-width: 100%;
		margin-top: 0;
		font-size: clamp(38px, 10.5vw, 46px);
		line-height: 1.08;
	}

	.welcome_outer span {
		max-width: 100%;
		margin-top: 24px;
		font-size: clamp(15px, 4.4vw, 18px);
		line-height: 1.5;
	}

	.welcome_img img {
		display: block;
		width: min(78vw, 320px);
		max-width: 78vw;
		height: auto;
		margin: 28px auto -115px;
	}
}

@media (max-width: 400px) {
	.welcome_outer {
		padding-top: 28px;
	}

	.welcome_outer h1.welcome-title,
	.welcome_outer h2 {
		font-size: clamp(36px, 10.8vw, 40px);
	}

	.welcome_img img {
		width: min(76vw, 280px);
		max-width: 76vw;
		margin-bottom: -95px;
	}
}

/* ==========================================================
   END: MOBILE AND TABLET HOMEPAGE HERO REFINEMENT
   ========================================================== */

/* ==========================================================
   START: PREMIUM FOOTER SOCIAL LINKS
   ========================================================== */

.footer-social {
	margin-top: 25px;
}

.footer-social-label {
	display: block;
	margin-bottom: 11px;
	color: #a9c2d1;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.footer-social-links {
	display: flex;
	align-items: center;
	gap: 10px;
}

.footer-social-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border: 1px solid rgba(53, 195, 246, 0.28);
	border-radius: 11px;
	background: rgba(0, 131, 202, 0.13);
	box-shadow: 0 7px 18px rgba(0, 0, 0, 0.14);
	color: #20b7f0;
	transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease;
}

.footer-social-links svg {
	width: 21px;
	height: 21px;
	fill: currentColor;
	transition: transform 180ms ease;
}

.footer-social-links a:hover,
.footer-social-links a:focus-visible {
	border-color: #35c3f6;
	background: linear-gradient(135deg, #0aa7df, #0083ca);
	box-shadow: 0 11px 24px rgba(0, 131, 202, 0.32);
	color: #ffffff;
	transform: translateY(-3px);
	outline: 0;
}

.footer-social-links a:hover svg,
.footer-social-links a:focus-visible svg {
	transform: scale(1.08);
}

/* ==========================================================
   END: PREMIUM FOOTER SOCIAL LINKS
   ========================================================== */