@charset "UTF-8";

/*
Theme Name: WAV LOWVOL
Theme URI: https://wearevolume.com
Author: the WAV team
Author URI: https://wearevolume.com
Description: nuts 'n bolts wordpress theme
Requires at least: 5.9
Tested up to: 6.0
Requires PHP: 7.4
Version: 1.4.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

WAV LOWVOL WordPress Theme, (C) 2022 wearevolume.com
WAV LOWVOL is distributed under the terms of the GNU GPL.
*/


html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display: block;
}

nav ul {
  list-style :none;
  padding: 0;
}

nav ul li {
	margin-bottom: 0;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input, select {
  vertical-align :middle;
}



@font-face {
	font-family: 'Open Sans';
	font-weight: 300;
	src: url('fonts/OpenSans-Light.ttf');
}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 300;
		font-style: italic;
		src: url('fonts/OpenSans-LightItalic.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 400;
		src: url('fonts/OpenSans-Regular.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 400;
		font-style: italic;
		src: url('fonts/OpenSans-Italic.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 500;
		src: url('fonts/OpenSans-Medium.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 500;
		font-style: italic;
		src: url('fonts/OpenSans-MediumItalic.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 600;
		src: url('fonts/OpenSans-SemiBold.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 600;
		font-style: italic;
		src: url('fonts/OpenSans-SemiBoldItalic.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 700;
		src: url('fonts/OpenSans-Bold.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 700;
		font-style: italic;
		src: url('fonts/OpenSans-BoldItalic.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 800;
		src: url('fonts/OpenSans-ExtraBold.ttf');
	}

	@font-face {
		font-family: 'Open Sans';
		font-weight: 800;
		font-style: italic;
		src: url('fonts/OpenSans-ExtraBoldItalic.ttf');
	}

:root {
	/* Colors */
	--color-primary: #00549E;
	--color-secondary: #5A99D2;
	--color-secondary-26: #5A99D242;
	--color-tertiary: #F28411;
	--color-grays: #707171;
	--color-dark-blue: #002140;
	--color-green: #0C7C59;
	--color-red: #DB5461;
	--color-black: #1E1E28;
	--color-white: #FFFFFF;

	/* Gradients */
	--gradient-1: linear-gradient(90deg, #F28411 0%, #5196D0 36.3%, #005CAB 53.08%, #5196D0 100%);
	--gradient-2: linear-gradient(0.25deg, #F28411 0%, #5196D0 36.3%, #005CAB 53.08%, #5196D0 100%);
	--gradient-3: linear-gradient(180deg, #004E90 0%, #002140 100%);
	--gradient-4: linear-gradient(90deg, #F2841180 0%, #5596CB80 31.76%, #FFFFFF 100%);
	--gradient-5: linear-gradient(0deg, #D3B18D 0%, #5596CB 100%);
	/*--gradient-hero-bg: linear-gradient(37deg, #F2841150 -10%, #5596CB40 23.76%, #FFFFFF 50%);*/
	--gradient-hero-bg: linear-gradient(0deg, rgba(242,132,17,.1) 0%, rgba(81,150,208,.1) 50%, rgba(0,92,171,.1) 70%, rgba(81,150,208,.1) 100%);

	--radius-bss: 36px;
}

html {
	scroll-behavior: smooth;
	font-size: 62.5%!important;  /* 1rem = 10px */
	scroll-padding-top: 164px;
}


body {
	font-family: 'Open Sans', sans-serif;
	
}

h1, .h1, h2, .h2, h3, h4, h5 {
	color: var(--color-primary);
}

h1, .h1 {
	font-weight: 300;
	font-size: clamp(2.7rem, 5.66vw, 5.8rem);
	line-height: 1.07;
}

h2, .h2 {
	font-weight: 300;
	font-size: clamp(2.3rem, 4.68vw, 4.8rem);
	line-height: 1.29;
}

h3 {
	font-weight: 300;
	font-size: clamp(2rem, 3.71vw, 3.8rem);
	line-height: 1.37;
}

h4 {
	font-weight: 400;
	font-size: clamp(1.7rem, 2.92vw, 3rem);
	line-height: 1.23;
}

h5 {
	font-weight: 700;
	font-size: clamp(1.5rem, 1.75vw, 1.8rem);
	line-height: 1;
}

h6, .overline {
	font-size: clamp(1.3rem, 1.74vw, 1.7rem);
  font-weight: bold;
  line-height: 1.82;
  letter-spacing: 2.5px;
  color: var(--color-tertiary);
  text-transform: uppercase;
}

@media screen and (max-width: 979px) {
	h6, .overline {
		line-height: 18px;
		letter-spacing: 1.61px;
	}

	h1, .h1 {
		line-height: 1.185;
		letter-spacing: normal;
	}
}

p {
	font-size: 1.6rem;
	font-weight: 400;
	color: var(--color-grays);
}

.large {
	font-size: clamp(1.5rem, 1.75vw, 1.8rem);
	line-height: 1.6;
	color: var(--color-grays);
}

.small {
	font-size: clamp(1.3rem, 1.46vw, 1.5rem);
	font-weight: 300;
	line-height: 1.6;
	color: #5c5f5f;
}



a {
	color: var(--color-primary);
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

sup {
    vertical-align: super;
    /* font-size: small; */
	font-size: 35%;
}

sub {
	vertical-align: sub;
	font-size: small;
}

body.home  .img-w img {
	width: 100%; 
	height: auto;
}

.wrapper {
	max-width: 1260px;
	padding: 0 30px;
	margin: auto;
}

.aligncenter {
	display: block;
    margin: 0 auto 1.5em;
}

#blog_cta_button {
	text-decoration: none;
}

.btn {
	cursor: pointer;
}

.btn.primary {
	/* width: 200px; */
	width: 100%;
	height: 50px;
	border-radius: 50px;
	border: 2px solid var(--color-tertiary);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 22.5px;
	padding-right: 18px;
	background: var(--color-tertiary);
	color: var(--color-white);
	transition: all 0.35s ease;
}

.btn.primary .label {
	padding: 0;
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 16px;
	width: 100%;
	text-align: center;
}

.btn.primary .icon {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
}

.btn.primary .icon .arrow {
	position: absolute;
	bottom: 1px;
	opacity: 1;
	transition: all 0.35s ease;
}

.btn.primary .icon .hover-arrow {
	position: absolute;
	bottom: 1px;
	opacity: 0;
	transition: all 0.35s ease;
}

.btn.primary:hover {
	background: transparent;
	color: var(--color-tertiary);
}

.btn.primary:hover .arrow {
	opacity: 0;
}

.btn.primary:hover .hover-arrow {
	opacity: 1;
}

@media not all and (min-resolution:.001dpcm) { 
	@supports (-webkit-appearance:none) {
		.btn.primary:hover {

		}
		.btn.primary:hover .arrow {
			opacity: 1;
		}
		
		.btn.primary:hover .hover-arrow {
			opacity: 0;
		}
	}
}

@media screen and (max-width: 979px) {
	.btn.primary {
		margin: auto;
	}
}

.btn.secondary {
	/* width: 193px; */
	width: 100%;
	height: 50px;
	margin: auto;
	border: 2px solid var(--color-primary);
	border-radius: 25px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 13px 38px 13px 50px;
	transition: all 0.35s ease;
	cursor: pointer;
}

.btn.secondary .label {
	text-align: left;
	font-size: 1.4rem;
	font-weight: 500;
	margin: 0;
}

.btn.secondary .icon {
	position: relative;
	width: 18px;
	height: 18px;
	transform: rotate(180deg);
}

.btn.secondary .icon .arrow {
	position: absolute;
	opacity: 1;
	transition: all 0.35s ease;
}

.btn.secondary .icon .hover-arrow {
	position: absolute;
	opacity: 0;
	transition: all 0.35s ease;
}

.btn.secondary:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.btn.secondary:hover .icon .arrow {
	opacity: 0;
}

.btn.secondary:hover .icon .hover-arrow {
	opacity: 1;
}


@media not all and (min-resolution:.001dpcm) { 
	@supports (-webkit-appearance:none) {
		.btn.secondary:hover {
		}
		
		.btn.secondary:hover .icon .arrow {
			opacity: 1;
		}
		
		.btn.secondary:hover .icon .hover-arrow {
			opacity: 0;
		}
	}
}


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

body:not(.home) header {
	position: sticky;
	top: 0;
	z-index: 10000;
	box-shadow: -2px 4px 11px 3px rgba(0,84,158,0.09);
	background: var(--color-white);
	/* transform: translateY(-100%); */
	/* opacity: 0; */
}

@media screen and (max-width: 1024px) {
	header {
		position: sticky;
		top: 0;
		z-index: 10000;
		box-shadow: -2px 4px 11px 3px rgba(0,84,158,0.09);
		background: var(--color-white);
		/* transform: translateY(-100%); */
		/* opacity: 0; */
	}
}

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

	body.home header.scrolled {
		position: sticky;
		top: 0;
		z-index: 10000;
		box-shadow: -2px 4px 11px 3px rgba(0,84,158,0.09);
		background: var(--color-white);
		/* transform: translateY(-100%); */
		/* opacity: 0; */
	}

	body.home header.scrolled.fadeOut {
		animation: fadeInRollDown 0.5s linear reverse forwards;
	}

	body.home header.scrolled.fadeIn {
		animation: fadeInRollDown 0.5s linear forwards;
	}
}


@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes rollDown {
	0%{
		transform: translateY(-100%);
	}

	100%{
		transform: translateY(0);
	}
}

@keyframes fadeInRollDown {
	0% {
		opacity: 0;
		transform: translateY(-100%);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}


.top-bar {
	background: linear-gradient(13deg, #005cab 0%, #5196d0 63.39%, #6aace3 100%);
	color: var(--color-white);
	position: relative;
}

.top-bar-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	font-size: 1.6rem;
}

.top-bar-wrapper a {
	color: inherit;
}

span#top-bar-primary-span {
	font-weight: 700;
}

span#top-bar-secondary-span {
	font-weight: 500;
	margin-left: 5px;
}

span#top-bar-link {
	font-weight: 500;
}

.nav-bar {
	position: relative;
	z-index: 10000;
}


/* .scrolled .nav-bar {
	background: var(--color-white);
} */

body:not(.home) .nav-bar {
	background: var(--color-white);
}

body.home .scrolled .nav-bar {
	background: var(--color-white);
}

.nav-wrapper {
	display: flex;
	max-width: 1260px;
	padding: 0 30px;
	margin: auto;
	justify-content: space-between;
	align-items: center;
}

.site-logo {
	padding: 25px 0;
}

nav sup {
    font-size: x-small;
    top: -5px;
    position: relative;
	vertical-align: unset;
	line-height: 1;
}

nav.desktop-nav {
	width: 850px;
	/* margin-left: 100px; */
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.menu-main-container {
	width: 100%;
	max-width: 705px;
}



.desktop-nav ul#menu-main {
	display: flex;
	justify-content: space-between;
	padding: 0;
	margin-bottom: 0;
}

.desktop-nav ul#menu-main li {
	position: relative;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--color-dark-blue);
	line-height: 1;
	line-height: 1.3;
	z-index: 10000;
}

.desktop-nav ul#menu-main>li {
	height: 114px;
	line-height: 114px;
}

.desktop-nav ul#menu-main>li.current-menu-parent>a {
	text-decoration: underline 2px var(--color-tertiary);
}

.desktop-nav ul#menu-main li.menu-item-has-children>a::after {
	content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='8.57959px' height='5px' viewBox='0 0 8.57959 5' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='iconchevronnav'%3E%3Cpath d='M4.28977 5C4.10795 5 3.92614 4.93087 3.78788 4.79167L0 1.00379L1.00379 0L4.28977 3.28504L7.57576 0L8.57955 1.00379L4.79167 4.79167C4.65341 4.93087 4.47159 5 4.28977 5' id='iconchevronnav' fill='%23002140' fill-rule='evenodd' stroke='none' /%3E%3C/g%3E%3C/svg%3E");
	margin-left: 5px;
	display: inline-block;
	transition: all 0.35s ease-in-out;
}

.desktop-nav ul#menu-main li.menu-item-has-children:hover>a::after
/* ,
.desktop-nav ul#menu-main li.menu-item-has-children:active>a::after,
.desktop-nav ul#menu-main li.menu-item-has-children:focus>a::after,
.desktop-nav ul#menu-main li.menu-item-has-children:focus-within>a::after */{ 
  transform: rotate(-180deg) translateY(-5px);
}

.desktop-nav ul#menu-main li.menu-item-has-children:hover ul.sub-menu
/* , .desktop-nav ul#menu-main li.menu-item-has-children:active ul.sub-menu,
.desktop-nav ul#menu-main li.menu-item-has-children:focus ul.sub-menu,
.desktop-nav ul#menu-main li.menu-item-has-children:focus-within ul.sub-menu */{ 
	display: block;
	
}

.desktop-nav ul#menu-main li a {
	text-decoration: none;
	color: inherit;
	font-weight: inherit;
	display: flex;
}

.desktop-nav ul.sub-menu {
	display: none;
	position: absolute;
	padding: 23px 24px 32px 29px;
	width: 295px;
	background-color: #F1F7FC;
	/* background: linear-gradient(0deg, #ffffff, #ffffff), #F1F7FC;
	background-size: 100% 50px;
	background-position: top center, center 50px;
	background-repeat: no-repeat; */
	box-shadow: 9px 13px 30px -11px rgba(0,33,64,0.23);
  border-radius: 0 0 0 35px;
}

.desktop-nav ul#menu-main li:last-child ul.sub-menu {
	right: -90px;
}

.desktop-nav ul.sub-menu li {
	padding: 12px 0;
	border-bottom: 1px solid var(--color-secondary-26);
}

.desktop-nav ul.sub-menu li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-right: 40px;
	padding-left: 5px;
}

.desktop-nav ul.sub-menu li:last-child {
	border-bottom: none;
	/* border-radius: 0 0 0 15px; */
}

.desktop-nav ul#menu-main li ul.sub-menu li:hover {
	background-color: #D9E8F6;
	color: var(--color-primary);
	font-weight: 600;
}

/* ul.sub-menu li:hover>a,
ul.sub-menu li:active>a,
ul.sub-menu li:focus>a,
ul.sub-menu li:focus-within>a {
	display: flex;
	justify-content: space-between;
} */

.desktop-nav ul.sub-menu li:hover>a,
.desktop-nav ul.sub-menu li:active>a,
.desktop-nav ul.sub-menu li:focus>a,
.desktop-nav ul.sub-menu li:focus-within>a {
	padding-right: 15px;
}

.desktop-nav ul.sub-menu li:hover>a::after,
.desktop-nav ul.sub-menu li:active>a::after,
.desktop-nav ul.sub-menu li:focus>a::after,
.desktop-nav ul.sub-menu li:focus-within>a::after {
	content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='8.57959px' height='5px' viewBox='0 0 8.57959 5' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='iconchevronnav'%3E%3Cpath d='M4.28977 5C4.10795 5 3.92614 4.93087 3.78788 4.79167L0 1.00379L1.00379 0L4.28977 3.28504L7.57576 0L8.57955 1.00379L4.79167 4.79167C4.65341 4.93087 4.47159 5 4.28977 5' id='iconchevronnav' fill='%2300549E' fill-rule='evenodd' stroke='none' /%3E%3C/g%3E%3C/svg%3E");
	display: inline-block;
	margin-left: 5px;
	transform: rotate(-90deg);
	height: 9px;
}

/* Mobile Menu */


@media screen and (max-width: 1024px) {
	body.noScroll {
		overflow: hidden;
		height: 100vw;
	}
}


nav.mobile-nav {
	display: none;

}

.menu-button {
	width: 18px;
	height: 12px;
	margin-left: 25px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	cursor: pointer;
}

.menu-button .line {
	height: 2px;
	background-color: var(--color-primary);
	/* width: 100%; */
	transition: all 0.35s ease-in-out;
}

.mobile-nav.open .menu-button .line:nth-child(1) {
	transform: translate(0px, 5px) rotate(225deg);
}

.mobile-nav.open .menu-button .line:nth-child(2) {
	opacity: 0;
}

.mobile-nav.open .menu-button .line:nth-child(3) {
	transform: translate(0px, -5px) rotate(-225deg);
}

.mobile-drop-down-menu {
	display: none;
	/* position: absolute; */
	position: fixed;
	top: 100px;
	bottom: 0;
	left: 0;
	right: 0;
	overflow-y: auto;
	background-color: var(--color-white);
	padding: 15px;
	transition: all 0.35s ease-in-out;
	z-index: -1;
}



.mobile-drop-down-menu a {
	text-decoration: none;
	color: inherit;
}

.mobile-nav.open .mobile-drop-down-menu {
	display: block;
}

.mobile-nav ul#menu-main-1>li {
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 3;
	color: var(--color-dark-blue);
	border-bottom: 1px solid var(--color-secondary-26);
}

.mobile-nav ul#menu-main-1>li>a {
	padding: 0 15px;
}

.mobile-nav ul#menu-main-1>li.menu-item-has-children a {
	display: flex;
	justify-content: space-between;
}

.mobile-nav ul#menu-main-1 li.menu-item-has-children>a::after {
	content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='8.57959px' height='5px' viewBox='0 0 8.57959 5' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='iconchevronnav'%3E%3Cpath d='M4.28977 5C4.10795 5 3.92614 4.93087 3.78788 4.79167L0 1.00379L1.00379 0L4.28977 3.28504L7.57576 0L8.57955 1.00379L4.79167 4.79167C4.65341 4.93087 4.47159 5 4.28977 5' id='iconchevronnav' fill='%23002140' fill-rule='evenodd' stroke='none' /%3E%3C/g%3E%3C/svg%3E");
	margin-left: 5px;
	display: inline-block;
	transition: all 0.35s ease-in-out;
}

.mobile-nav ul#menu-main-1 li.menu-item-has-children.show-sub>a::after {
  transform: rotate(-180deg) translateY(-5px);
}

.mobile-nav ul.sub-menu {
	max-height: 0;
	overflow: hidden;
	padding: 0;
	margin-bottom: 0;
}

.mobile-nav li.menu-item-has-children.show-sub>ul.sub-menu {
	max-height: unset;
	border-top: 2px solid var(--color-tertiary);
	background: #F1F7FC;
	padding: 20px 0 0;
	animation: rollOutMobileMenu 0.5s ease-in-out;
}

@keyframes rollOutMobileMenu {
	0% {
		max-height: 0;
	}
	100% {
		max-height: 300px;
	}
}

.mobile-nav ul.sub-menu>li {
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.25;
	border-bottom: 1px solid var(--color-secondary-26);
	padding-top: 10px;
	padding-bottom: 10px;
}

.mobile-nav ul.sub-menu>li>a {
	padding-left: 30px;
	padding-right: 15px;
	color: var(--color-dark-blue);
}

.mobile-nav ul.sub-menu>li:last-child {
	border-bottom: none;
}

@media screen and (max-width: 1024px) {
	nav.mobile-nav {
		display: flex;
	}
	nav.desktop-nav {
		display: none;
	}

	.site-logo {
		padding: 11px 0 18px;
		width: 127px;
	}

	.site-logo img {
		width: 100%;
	}

	.top-bar-wrapper {
		display: flex;
		flex-direction: column;
		height: 44px;
		font-size: 1.1rem;
		line-height: 1.363;
	}

	span.top-bar-divider {
		display: none;
	}

	span#top-bar-primary-span {
		font-weight: 700;
	}
	
	span#top-bar-secondary-span {
		font-weight: 300;
	}

	span#top-bar-link {
		font-weight: 600;
	}

}

.desktop-nav .search-menu {
	margin-left: 36px;
	position: relative;
}

.desktop-nav .search-menu img, .desktop-nav .search-menu svg {
	cursor: pointer;
	padding-top: 1px;
}

.desktop-nav .searchform {
    transform: translatey(-50%);
    position: absolute;
    /* right: 100%; */
	right: -16px;
    top: 50%;
	z-index: -1;
	overflow: hidden;
	height: 114px;
    display: flex;
    align-items: center;
}

.desktop-nav .searchform form.form-search {
	/* transform: translateX(100%); */
	opacity: 0;
}

.desktop-nav .searchform.show {
	z-index: 10001;
}


.desktop-nav .searchform.show form.form-search {
	/* animation: searchFormSlideOut 1s ease-in forwards; */
	animation: searchIconFadeOut 0.5s ease-in reverse forwards;
}

.desktop-nav .searchform.show+svg {
	animation: searchIconFadeOut 0.5s ease-in forwards;
}

@keyframes searchFormSlideOut {
	0%{
		transform: translateX(100%);
	}
	100% {
		transform: translateX(0);
	}
	
}

@keyframes searchIconFadeOut {
	0%{
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
	
}

@keyframes searchIconFade30 {
	0%{
		opacity: 1;
	}
	100% {
		opacity: 0.3;
	}
	
}

.mobile-nav .search-menu {
}

.mobile-nav .search-menu img, .mobile-nav .search-menu svg {
	cursor: pointer;
}

.mobile-nav .searchform {
    position: absolute;
	right: 0;
	/* left: 0; */
    top: 100%;
	z-index: -1;
	overflow: hidden;
}



.mobile-nav .searchform form.form-search {
	/* transform: translateX(100%); */
	opacity: 0;
}

.mobile-nav .searchform.show {
	z-index: 10001;
}


.mobile-nav .searchform.show form.form-search {
	/* animation: searchFormSlideOut 1s ease-in forwards; */
	animation: searchIconFadeOut 0.5s ease-in reverse forwards;
}

.mobile-nav .searchform.show+svg {
	animation: searchIconFade30 0.5s ease-in forwards;
}



form.form-search {
    display: flex;
    align-items: stretch;
	border: 2px solid var(--color-white);
    border-radius: 5px;
}

.mobile-nav form.form-search {
	border-right: none;
    border-radius: 5px 0 0 5px;
}

.close-icon {
    width: 38px;
    display: grid;
    place-items: center;
    border-right: 1px solid var(--color-secondary);
    border-radius: 5px 0 0 5px;
    background: #eaf2fa;
	cursor: pointer;
}

.mobile-nav .close-icon {
	border-radius: 0;
}

input#s {
    height: 38px;
    width: 325px;
    border: none;
    background: #eaf2fa;
	padding: 0 10px!important;
	font-size: 1.5rem;
	font-weight: 500;
	border-radius: 0;
	appearance: unset;
}

input#s::placeholder {
	color: var(--color-secondary);
	opacity: 0.55;
}

input#s:focus-visible {
	
    outline: var(--color-secondary) auto 1px;
}

input[type="submit"]#hidden_submit {
    width: 0;
    height: 0;
    line-height: 0;
    font-size: 0;
    padding: 0;
    margin: 0;
    border: none;
    position: absolute;
}

.search-label {
    display: grid;
    place-items: center;
    width: 43px;
    background: var(--color-primary);
    border-radius: 0 5px 5px 0;
	cursor: pointer;
}

.mobile-nav .search-label {
	border-radius: 0;
}


@media screen and (max-width: 425px) {
	.mobile-nav .searchform {
		left: 0;
	}
	.mobile-nav form.form-search {
		border-left: none;
		border-radius: 0;
	}
}



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

footer {
	background: var(--color-primary);
	color: var(--color-white);
	padding: 37px 0 52px;
}

footer ul {
	list-style: none;
	display: flex;
	padding: 0;
}

footer a {
	color: var(--color-white);
	text-decoration: none;
}

footer .footer-top-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 25.5px;
}

footer .footer-logo .logo-svg>svg {
    width: 449px;
    height: auto;
}

footer .footer-logo .logo-copy {
	font-size: 1.4rem;
	font-weight: 500;
	font-style: italic;
	margin-top: 16px;
    margin-left: 47px;
}

footer .footer-menu-badge {
    display: flex;
    align-items: center;
}

footer .footer-menu-badge ul {
	flex-wrap: wrap;
	gap: 35px;
	margin: 0 34px;
	padding: 0;
}

footer .footer-menu-badge ul li {
	font-size: 1.5rem;
	font-weight: 500;
}

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

footer .badge img {
    height: 149px;
    width: auto;
}

footer .footer-line {
	width: 100%;
	height: 1px;
	background: var(--color-secondary);
	margin-bottom: 46.5px;
}

footer .footer-bottom-container {
    display: flex;
    justify-content: space-between;
}

footer #footer-disclaimer p,
footer #footer-copyright p {
	font-size: 1.3rem;
	letter-spacing: -0.09px;
	color: var(--color-white);
	line-height: 1.15;
}

footer .footer-disclaimer-copyright {
    max-width: 549px;
}

footer #footer-disclaimer {
    margin-bottom: 46.5px;
}

footer #footer-social-menu {
	max-width: 330px;
	width: 100%;
}

footer #footer-social-menu ul {
	justify-content: space-between;
	align-items: center;
	padding: 0;
}

#footer-social-menu li:hover>a>.icon svg {
	background: var(--color-white);
}

#footer-social-menu li:hover>a>.icon #Footer-DT {
	fill: var(--color-primary);
}


@media screen and (max-width: 1024px) {
	footer {
		padding: 68px 0 48px;
	}

	footer .footer-top-container, footer .footer-menu-badge {
		flex-direction: column;
	}

	footer .footer-bottom-container {
		flex-direction: column-reverse;
	}

	footer .footer-menu-badge ul {
		margin-top: 41px;
		display: grid;
		grid-template-columns: 1fr 1fr;
		/* place-items: center; */
		width: 236px;
		margin-bottom: 19px;
	}

	footer .footer-menu-badge ul li {
		
	}

	footer .footer-logo .logo-svg>svg {
		width: 100%;
	}

	footer .footer-logo .logo-copy {
		margin-left: 0;
		margin-top: 8px;
		text-align: center;
	}

	footer .badge img {
		margin-bottom: -50%;
		width: 163px;
		height: auto;
	}

	footer .footer-line {
		margin-bottom: 86px;
	}

	footer .footer-bottom-container {
		align-items: center;
	}
	footer #footer-social-menu {
		margin-bottom: 20px;
	}
	footer #footer-copyright p {
		text-align: center;
	}
}


/* ========== */
/* HOME PAGE */
/* ======== */



/* ************** */
/* **   HERO   ** */
/* ************** */

#hero {
  	/* padding-top: 27px; */
	padding-top: 177px;
  	background: linear-gradient(208deg, #b0895f33 0%, #ffffff33 65.07%, #ffffff33 100%);
	background-size: 200%;
	margin-top: -150px;
	z-index: -1;
    position: relative;
}
#hero>.wrapper {
	position: relative;
}

#hero .hero-images {
	position: absolute;
	top: 4px;
	right: 30px;
	z-index: -1;
}

#hero .hero-image-container {
	opacity: 0;
	position: relative;
	width: 849px;
	width: clamp(500px, 63.35vw, 849px);
}

/* #hero .hero-image-container:first-child {
	opacity: 1;
} */

#hero .hero-image-container img {
	position: absolute;
}

#hero .hero-image-container img.desktop {
	border-radius: 0 94px 0 94px;
}

#hero .hero-image-container img.mobile {
	/* border-radius: 0 36px 0 36px; */
	border-radius: 0 9.6vw 0 9.6vw;
	display: none;
}

#hero .who-we-are {
	position: relative;
	left: 80px;
	top: 156px;
	top: clamp( 31px, 11.64vw, 156px);
	max-width: 548px;
	width: 52%;
}

#hero .headline {
	position: relative;
	/* top: 290px; */
	top: clamp(0px, 21.64vw, 290px);
	/* font-size: 18rem; */
	font-size: clamp( 7rem, 13.43vw,18rem);
	font-weight: 600;
	/* letter-spacing: -8.88px; */
	letter-spacing: clamp(-8.88px, -0.66vw, -3.46px);
	color: var(--color-primary);
}

/* #hero .headline .line-1,  */
#hero .headline .line-2, 
#hero .headline .line-3, 
#hero .headline .line-4 {
	opacity: 0;
}

#hero .headline .line-1 {
	font-weight: 300;
	/* margin-left: 36px; */
	margin-left: clamp(23px, 2.68vw, 36px);
}

#hero .headline .line-2, #hero .headline .line-4 {
	margin-left: clamp(54px, 11.5vw, 114px);
	margin-top: clamp(-20px, -1.49vw, -8px);
}

#hero .headline .line-3 {
	/* margin-top: -40px; */
	margin-top: clamp(-40px, -2.98vw, -14px)
}

#hero .headline .line-4 span {
	font-weight: 300;
	/* font-size: 5.8rem; */
	/* font-size: clamp( 2.27rem, 4.32vw, 5.8rem); */
	font-size: clamp( 2.27rem, 2.98vw, 4rem);
	position: relative;
	/* top: 16px; */
	top: clamp(6px , 1.19vw, 16px);
	/* left: 25px; */
	left: clamp(12px, 1.86vw, 25px);
	vertical-align: top;
}

#hero .what-we-do {
	position: relative;
	/* top: -10px; */
	top: clamp(-15px, -3.9vw, -10px);
	left: 50%;
	max-width: 530px;
	width: 50%;
}

#hero .copy h4 {
	letter-spacing: -0.4px;
}

#hero .what-we-do .copy h4 {
	line-height: 1.367;
	margin-bottom: 30px;
}

#hero .copy p {
	font-size: 1.8rem;
	font-size: clamp( 1.5rem, 1.34vw, 1.8rem);
	line-height: 1.611;
	padding-right: 30px;
}

#hero .overline {
	margin-bottom: 30px;
}

@media screen and (max-width: 1024px) {
	.wrapper {
		padding: 0 6.67%;
	}

	#hero .hero-image-container img.mobile {
		display: block;
	}

	#hero .hero-image-container img.desktop {
		display: none;
	}

	#hero .hero-images {
		position: relative;
		top: 0;
		right: unset;
		z-index: -1;
		width: 100%;
		height: 114.75vw;
	}

	#hero .hero-image-container {
		width: 100%;
	}

	#hero .copy h4 {
		font-weight: 300;
	}

	#hero .who-we-are {
		/* position: relative; */
		left: unset;
		top: unset;
		width: 92%;
		max-width: 525px;
		text-align: center;
		margin: auto;
		margin-top: 32px;
	}

	#hero .headline {
		position: static;
		margin-top: 36px;
		/* margin-left: -25px; */
		margin-left: -3.33%;
		margin-bottom: -44vw;
		font-size: clamp(7rem, 15.625vw, 16rem);
	}

	#hero .overline {
		margin-bottom: 18px;
	}

	#hero .what-we-do {
		position: static;
		max-width: 525px;
		width: 100%;
		margin: auto;
		margin-top: 52px;
		text-align: center;
	}

	#hero .what-we-do .copy h4 {
		margin-bottom: 20px;
	}

	#hero .copy p {
		padding-right: 0px;
	}

	#hero .copy {
		padding: 0 8px;
	}

}

@media screen and (max-width: 525px) {
	#hero .headline {
		margin-bottom: -198px;
	}
}





/* ************** */
/* Find out More */
/* ************ */

#find-out-more {
	padding-top: 97px;
}

#find-out-more .cards-container {
	display: flex;
	gap: 78px;
	max-width: 1093px;
	margin: auto;
}

#find-out-more .card .icon {
	height: 115px;
	margin-bottom: 27px;
}

#find-out-more .card .icon img {
	width: auto;
	height: 100%;
}

#find-out-more .card .title {
	margin-bottom: 17px;
}

#find-out-more .card:nth-child(3) .description {
	width: 390px;
}

#find-out-more .cta-button {
	width: 280px;
	margin: auto;
}

#find-out-more .cta-button a {
	text-decoration: none;
}

#find-out-more .cta-button .btn.primary {
	margin-top: 50px;
	width: 100%;
}

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

	#find-out-more {
		padding-top: 0;
	}

	#find-out-more .cards-container {
		display: block;
		max-width: 525px;
	}

	#find-out-more .card {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		margin-top: 34px;
	}

	#find-out-more .card:nth-child(3) .description {
		width: unset;
	}

	#find-out-more .cta-button .btn.primary {
		width: unset;
	}
}

/* ***************** */
/* Best Slept Self  */
/* *************** */

#best-slept-self {
	padding-top: 136px;
	overflow: hidden;
}

#best-slept-self .bss-image-carousel {
	display: flex;
	gap: 30px;
	width: max-content;
	position: relative;
	transform: translateX(-200px);
	z-index: -1;
}

#best-slept-self .carousel-image-container {
	width: 338px;
	z-index: -1;
}

#best-slept-self .rounded-corner-container {
	max-width: 1105px;
	margin: auto;
	background: white;
	border-radius: 0 clamp(30px, 5.2vw, 100px) 0 0;
	margin-top: calc(-1 * clamp(32px, 8vw, 110px));
	text-align: center;
}

#best-slept-self .section-icon {
	width: 125px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 14px;
	position: relative;
	top: -50px;
	margin: auto;
	margin-bottom: -25px;
	border-radius: 100px;
	background: white;
}

#best-slept-self .section-icon img {
	width: unset;
}

#best-slept-self .overline {
	margin-bottom: 49px;
}



@media screen and (max-width: 1024px) {
	#best-slept-self {
		padding-top: 72px;
	}
	#best-slept-self .rounded-corner-container {
		margin-left: 8.8%;
		margin-right: 8.8%;
		padding-left: 8px;
		padding-right: 8px;
	}

	#best-slept-self .section-icon {
		width: 85px;
		width: clamp(85px, 12.22vw, 125px);
		top: -35px;
		padding-top: 8px;
		margin-bottom: -19px;
	}

	#best-slept-self .section-icon img {
		width: 217px;
		width: clamp(217px, 30.76vw, 315px);
	}

	#best-slept-self .bss-image-carousel {
		transform: translateX(-90px);
		gap: 12px;
	}

	#best-slept-self .carousel-image-container {
		width: 130px;
		width: clamp(130px, 33vw, 338px);
	}
}

@media screen and (min-width: 1600px) {
	#best-slept-self .carousel-image-container {
		width: 21.125vw;
	}
}



/* ******************* */
/* Resources ******** */
/* ***************** */


#resources {
	padding-bottom: 121px;
}

#resources-header-copy {
    display: flex;
    align-items: flex-end;
	gap: 82px;
	padding-top: 135px;
	max-width: 1105px;
    margin: auto;
}

#resources-header-copy .header-container {
    font-size: 12.9rem;
	font-size: clamp(7rem, 12.6vw, 12.9rem);
    font-weight: 300;
	letter-spacing: -7px;
	letter-spacing: clamp(-7px, -0.68vw, -3.5px);
    color: var(--color-primary);
}

#resources-header-copy .overline {
	margin-bottom: 32px;
}

#resources-header-copy .copy h4 {
	max-width: 453px;
}

#resources-grid-wrapper {
	padding-top: 168px;
}

#filters-wrapper {
	overflow-x: auto;
}

#resources ul.filters {
	display: flex;
	justify-content: space-between;
	width: 1120px;
	margin: 0 auto 42px;
	padding: 0 20px;
}

#resources ul.filters>li.filter {
	width: 212px;
	height: 50px;
	border: 2px solid var(--color-grays);
	border-radius: 99px;
	background-color: var(--color-white);
	color: var(--color-primary);
	display: grid;
	place-items: center;
	font-size: 1.4rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.35s ease-in-out;
}

#resources ul.filters>li.filter:hover, 
#resources ul.filters>li.filter.current {
	border: 2px solid var(--color-primary);
	color: var(--color-white);
	background-color: var(--color-primary);
}

#resources-grid-wrapper.hide-some #max-height-wrapper {
	overflow: hidden;
}

#resources-grid {
	display: grid;
	grid-gap: 9px;
	grid-template-columns: repeat( auto-fill, minmax(min(300px, 32vw), 1fr) );
	grid-template-rows: repeat(4, 1fr);
	margin-bottom: 24px;
}

#resources-grid article.resource-container {
	text-align: center;
}

#resources-grid article.resource-container.hide {
	display: none;
}

#resources-grid article.resource-container.off-center {
	position: relative;
    left: 100%;
    top: 100%;
	opacity: 0;
}


#resources-grid article.resource-container img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
    object-fit: contain;
}

#resources-grid article.resource-container .title {
	font-size: clamp(1.5rem, 2.15vw, 2.2rem);
	font-weight: 300;
	color: var(--color-dark-blue);
	line-height: 1.227;
	margin-top: 19px;
	margin-bottom: 14px;
}

#resources-grid article.resource-container a {
	font-size: 1.4rem;
	font-weight: 500;
	color: var(--color-primary);
	text-decoration: none;
}

#resources-grid article.resource-container a:hover {
	text-decoration: underline;
}

#resources-grid article.resource-container a.learn-more::after {
	background-image: url('img/arrow_right_textlink.svg');
	background-position: center center;
	background-repeat: no-repeat;
	content: "";
	display: inline-block;
	margin: 0 0 -1px 5px;
	width: 12px;
	height: 12px;
}

#show-more-button, #show-less-button {
	margin: auto;
	width: 193px;
	height: 50px;
	border: 2px solid var(--color-primary);
	border-radius: 99px;
	font-size: 1.4rem;
	font-weight: 500;
	background-color: var(--color-white);
	color: var(--color-primary);
	/* display: none; */
	gap: 9px;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.35s ease-in-out;
}

#show-more-button {
	display: none;
}

#show-less-button {
	display: flex;
}

#show-more-button #mask-2-show-more,
#show-more-button #icon-plus-expand,
#show-less-button #mask-2-show-less,
#show-less-button #icon-minus-show-less {
	transition: all 0.35s ease-in-out;
}

#show-more-button:hover, #show-less-button:hover {
	background-color: var(--color-primary);
	color: var(--color-white);
}

#show-more-button:hover #mask-2-show-more,
#show-less-button:hover #mask-2-show-less {
	fill: var(--color-primary);
}

#show-more-button:hover #icon-plus-expand,
#show-less-button:hover #icon-minus-show-less {
	fill: var(--color-white);
}


#resources-grid-wrapper.hide-some #resources-grid {
	overflow: hidden;
}

#resources-grid-wrapper.hide-some #show-more-button {
	display: flex;
}

#resources-grid-wrapper.hide-some #show-less-button {
	display: none;
}

#resources-grid-wrapper.hide-button #show-more-button,
#resources-grid-wrapper.hide-button #show-less-button {
	display: none;
}

#resources-grid-wrapper.hide-button #resources-grid {
	grid-template-rows: repeat(1, 1fr);
}


@media screen and (max-width: 1024px) {
	#resources {
		padding-bottom: 68px;
	}
	#resources-header-copy {
		flex-direction: column;
		align-items: center;
		gap: 45px;
		padding-top: 50px;
		text-align: center;
	}
	#resources-header-copy .overline {
		margin-bottom: 18px;
	}
	#resources ul.filters {
		width: 670px;
		padding: 0 10px;
	}
	#resources ul.filters>li.filter {
		width: 120px;
	}
	#resources-grid article.resource-container {
		padding-bottom: 24px;
	}
	#resources-grid article.resource-container .title {
		margin-top: 15px;
	}
	#resources-grid article.resource-container .title br {
		display: none;
	}
	#resources-grid-wrapper {
		padding-top: 40px;
	}
}
@media screen and (max-width: 500px) {
	#resources-header-copy .overline {
		min-width: 225px;
		width: 50%;
		margin-left: auto;
		margin-right: auto;
	}
}

@media screen and (min-width: 1845px) {
	#resources-grid {
		grid-template-rows: repeat(3, 1fr);
	}
}

@media screen and (min-width: 2462px) {
	#resources-grid {
		grid-template-rows: repeat(2, 1fr);
	}
}





/* ***************** */
/* Explore our blog  */
/* *************** */
#explore-blog {
	background-image: var(--gradient-hero-bg);
	padding-bottom: 93px;
}

	#explore-blog-articles {
		display: flex;
		justify-content: space-between;
		padding: 45px 0;
	}

		.explore-blog-article {
			width: 276px;
		}

			.explore-blog-article img {
				border-top-right-radius: 50px;
				margin-bottom: 18px;
				aspect-ratio: 4/3;
    object-fit: cover;
			}

			.explore-blog-article h5 {
				line-height: 1.333;
				margin-bottom: 10px;
			}

			.explore-blog-article p {
				font-size: 1.5rem;
				line-height: 1.69;
				min-height: 140px;
			}

			.explore-blog-article a {
				display: block;
				font-weight: 500;
				font-size: 1.5rem;
				line-height: 1.5;
				margin-top: 15px;
				text-decoration: none;
			}

				.explore-blog-article .cta a::after {
					background-image: url('img/arrow_right_textlink.svg');
					background-position: center center;
					background-repeat: no-repeat;
					content: "";
					display: inline-block;
					margin: 0 0 -1px 5px;
					width: 12px;
					height: 12px;
				}

				.explore-blog-article a:hover {
					text-decoration: underline;
				}

#explore-blog .cta-button .btn.primary {
	box-sizing: border-box;
	margin: 0 auto;
	max-width: 315px;
}

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

	#explore-blog {
		padding-bottom: 63px;
	}
	
	#explore-blog-articles {
		align-items: center;
		flex-direction: column;
	}

		.explore-blog-article {
			margin-bottom: 30px;
		}

			.explore-blog-article:last-child {
				margin-bottom: 0;
			}
}


#follow-us {
	padding-bottom: 89px;
}

@media screen and (max-width: 1024px) {
	#follow-us {
		padding-bottom: 59px;
	}
}



/* ***************** */
/* Social Buttons  */
/* *************** */
#social-buttons {
	display: flex;
	justify-content: space-between;
	margin: 58px auto 118px;
	/* width: 826px; */
}

	#social-buttons .cta-button {
		/* width: 193px; */
		width: 175px;
	}

	#social-buttons .btn.secondary .icon {
		transform: rotate(0);
	}

	#social-buttons .cta-button .btn.secondary {
		box-sizing: border-box;
		justify-content: center;
		text-decoration: none;
		padding: 0;
	}

		#social-buttons .icon {
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			mask-size: cover;
			margin-right: 12px;
			width: 22px;
			height: 22px;
			
		}

			#social-buttons .icon svg .stroke {
				fill: #5581b5;
				transition: all 0.35s ease;
			}

			#social-buttons .cta-button .btn.secondary:hover .icon {
				background-color: transparent;
			}

			#social-buttons .cta-button .btn.secondary:hover .icon svg .stroke {
				fill: #fff;
			}

#back-to-top-container .btn.secondary {
	width:  193px;
}

	#back-to-top-container .btn.secondary .icon {
		transform: rotate(0);
		width: 18px;
		/* height: 20px; */
		height: auto;
	}

		#back-to-top-container .btn.secondary:hover .icon svg .oval {
			fill: #fff;
		}

		#back-to-top-container .btn.secondary:hover .icon svg .arr {
			fill: #00549E;
		}

@media screen and (max-width: 1024px) {
	#social-buttons {
		flex-direction: column;
		align-items: center;
		margin-bottom: 56px;
		margin-top: 25px;
		width: 100%;
		gap: 10px;
	}

	#social-buttons > div {
		width: calc(100% - 10px);
    	justify-content: center;
    	display: flex;
	}

		#social-buttons .cta-button {
			/* margin-bottom: 32px; */
			width: 100%;
			max-width: 260px;
		}
}



/* ***************** */
/* MISC  */
/* *************** */
#bss-graphic {
	background-image: var(--gradient-3);
	border-top-right-radius: var(--radius-bss);
	border-top-left-radius: var(--radius-bss);
	/* margin-top: 37px; */
	margin-top: clamp(5px, calc(9.36vw * 0.355), 37px);
	position: relative;
}

	#bss-graphic::before {
		background-image: url('img/bss-point.png');
		background-size: contain;
		background-repeat: no-repeat;
		content:  "";
		display: block;
		left: 50%;
		/* margin-left: -5.15rem; */
		position: absolute;
		top: 2px;
		transform: translate(-50%, -100%);
		width:  103px;
		width: clamp(10px, 9.36vw, 103px);
		height: 41px;
		height: clamp(5px, calc(9.36vw * 0.39805), 41px);
	}

	#bss-intro {
		font-size: 3rem;
		margin-top: 24px;
		text-align: center;
	}

		#bss-graphic h4 {
			color: #fff;
			font-weight: 300;
		}

	#be-your-best-slept-self-container,
	#bss-tips {
		border-top-right-radius: var(--radius-bss);
		border-top-left-radius: var(--radius-bss);
	}


	#be-your-best-slept-self-container {
		box-shadow: -6px -1px 9px 9px rgba(0,0,0,.1);
		position: relative;
		width: 966px;
		margin: 0 auto;
		margin-top: 292px;
	}

		#bss-cycle {
			transform: translateY(calc(-50% + -6px));
			text-align: center;
			position: absolute;
			right: 0;
			left: 0;
		}

		#be-your-best-slept-self-container,
		#bss-tips,
		#bss-evening-list {
			border-bottom-right-radius: var(--radius-bss);
		}

		#bss-tips {
			background: linear-gradient(180deg, rgba(243,164,75,1) 0%, rgba(229,129,40,1) 33%, rgba(184,136,93,1) 53%, rgba(145,141,139,1) 79%, rgba(84,143,202,1) 100%);
			display: flex;
		}

			#bss-tips > div {
				width: 50%;
			}

				#bss-tips > div:last-child {
					margin-left: auto;
					width: calc(50% - 1px);
				}

				.bss-hdr {
					align-items: center;
					display: flex;
					height: 141px;
				}

					.bss-hdr h4 {
						font-weight: 300;
						padding-left: 56px;
						position: relative;
					}

						.bss-hdr h4::before {
							background-repeat: no-repeat;
							background-size: contain;
							content: "";
							position: absolute;
							width: 47px;
							height: 47px;
							transform:  translateX(calc(-100% - 9px))
						}

					#bss-daytime-hdr {
						background: linear-gradient(90deg, rgba(247, 181, 64, 1) 0%, rgba(236, 129, 33, 1) 39%, rgba(145, 141, 139, 1) 55%, rgba(84, 143, 202, 1) 69%, rgba(44, 89, 162, 1) 85%, rgba(29, 69, 147, 1) 92%, rgba(29, 69, 147, 1) 100%);
						border-top-left-radius: var(--radius-bss);
						padding-left: 90px;
					}

						#bss-daytime-hdr h4::before {
							background-image: url('img/BSS-tips/tip-day.svg');
						}

					#bss-evening-hdr {
						background: linear-gradient(90deg, rgba(236, 129, 33, 1) 0%, rgba(145, 141, 139, 1) 31%, rgba(84, 143, 202, 1) 57%, rgba(44, 89, 162, 1) 82%, rgba(29, 69, 147, 1) 92%, rgba(29, 69, 147, 1) 100%);
							border-top-right-radius: var(--radius-bss);
							justify-content: flex-end;
							padding-right: 90px;
					}

						#bss-evening-hdr h4::before {
							background-image: url('img/BSS-tips/tip-evening.svg');
						}

				.bss-list {
					background-color: #fff;
					min-height: 560px;
					padding-top: 40px;
					padding-bottom: 14px;
				}

					.bss-list h5 {
						font-weight: 700;
						font-size: 1.8rem;
						line-height: 1;
						margin-bottom: 6px;
					}

						#bss-daytime-list h5 {
							color: #F28411;
						}

						#bss-evening-list h5 {
							color: #00539F;
						}

					.bss-list ul {
						list-style-type: none;
						width: 100%;
						padding: 0;
					}

						.bss-list li {
							border-bottom: 1px solid rgba(90, 52, 109, .26);
							margin-bottom: 24px;
							padding-top: 20px;
							padding-bottom: 39px;
							padding-left: 88px;
						}

							.bss-list li::before {
								background-repeat: no-repeat;
								background-size: contain;
								content: "";
								position: absolute;
								width: 65px;
								height: 65px;
								transform:  translateX(calc(-100% - 18px))
							}

							.bss-list li:last-child {
								border-bottom: 0 none;
								margin-bottom: 0;
							}

							#tip-1::before {
								background-image: url('img/BSS-tips/Tip1.svg');
							}

							#tip-2::before {
								background-image: url('img/BSS-tips/Tip2.svg');
							}

							#tip-3::before {
								background-image: url('img/BSS-tips/Tip3.svg');
							}

							#tip-4::before {
								background-image: url('img/BSS-tips/Tip4.svg');
							}

							#tip-5::before {
								background-image: url('img/BSS-tips/Tip5.svg');
							}

							#tip-6::before {
								background-image: url('img/BSS-tips/Tip6.svg');
							}

					.bss-list p {
						font-size: 1.5rem;
						line-height: 1.55;
					}

					#bss-daytime-list {
						padding-left: 70px;
						padding-right: 74px;
					}

					#bss-evening-list {
						padding-right: 70px;
						padding-left: 74px;
					}

		#bss-graphic .video-container {
			max-width: 1105px;
			margin: 96px auto 0;
			
			position: relative;
		}
		
		#bss-graphic .video-container img, #bss-graphic .video-container iframe, #bss-graphic .video-container #featured_video {
			width: 100%;
			height: auto;
			aspect-ratio: 16 / 9;
		}

		@supports (-webkit-appearance:none) {
			#bss-graphic .video-container img, #bss-graphic .video-container iframe, #bss-graphic .video-container #featured_video {
				height: calc(min(1105px, 100vw) * .5625);
			}
		}

		@media only screen and (min-resolution:.001dpcm) and (max-width: 500px) { 
			@supports (-webkit-appearance:none) {
				#bss-graphic .video-container img, #bss-graphic .video-container iframe, #bss-graphic .video-container #featured_video {
					height: 240px;
				}
			}
	   }
		
		#bss-graphic .video-container #video-overlay {
			position: absolute;
			top: 133%;
			left: 50%;
			transform: translate(-50%, 0);

			/* display: none; */
		}

		#bss-graphic .video-container #video-play-button {
			width: 185px;
			height: 50px;
			background-color: var(--color-white);
			border: 1px solid #979797;
			border-radius: 99px;
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 19px;
			font-size: 1.4rem;
			font-weight: 500;
			color: var(--color-primary);
			cursor: pointer;
		}

		#bss-graphic .video-container #video-play-button:hover {
			background-color: var(--color-primary);
			color: var(--color-white);
			border-color: var(--color-primary);
		}

		#bss-graphic .video-container #video-play-button:hover #iconplay {
			fill: var(--color-white);
		}


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

	#bss-graphic {
		--radius-bss: 20px;
	}
	#be-your-best-slept-self-container {
		margin-top: 250px;
		width: 100%;
		max-width: 460px;
	}

	#bss-intro {
		width: 50%;
    	min-width: 210px;
		margin: auto;
	}

	#bss-cycle img {
		width: 268px;
		height: 265px;
	}

	#bss-tips {
		flex-direction: column;
	}
		#bss-tips .bss-hdr {
			height: 57px;
			justify-content: center;
			padding: 0;
		}
		#bss-tips #bss-daytime .bss-hdr {
			align-items: flex-end;
			padding: 0 0 13px;
			background-size: 200%;
		}
		

		#bss-cycle {
			transform: translateY(calc(-100% + 40px));
		}

		.bss-hdr h4 {
			display: flex;
		}
		.bss-hdr h4::before {
			width: 30px;
			height: 30px;
			align-self: center;
		}
		#bss-evening-hdr {
			border-top-right-radius: unset;
			background-size: 150%;
			background-position: right;
			background-repeat: no-repeat;
			height: 70px!important;
		}

		#bss-tips > div,
		#bss-tips > div:last-child {
			width:  100%;
		}

		#bss-tips > div:last-child {
			margin-left: 0;
		}

		.bss-list {
			min-height: unset;
		}

		#bss-daytime-list,
		#bss-evening-list {
			padding-right: 23px;
			padding-left: 23px;
		}

	#bss-graphic .video-container {
		margin-top: 64px;
		
	}

	#bss-graphic .video-container #video-play-button {
		width: 135px;
		height: 30px;
		gap: 6px;
		font-size: 1.2rem;
	}

	#bss-graphic .video-container #video-play-button svg {
		width: 19px;
		height: 19px;
	}

}





/* ***************** */
/* MISC  */
/* *************** */
.wrapper.container-b {
	max-width: 964px;
}

.sec-mar-a {
	padding: 96px 0 0;
}

	.sec-hdr {
		text-align: center;
	}

		.sec-hdr h6 {
			font-weight: 700;
			margin-bottom: 20px;
		}

		.sec-hdr h3 {
			margin-bottom: 25px;
		}

		.sec-hdr h2 {
			/* font-weight: 300;
			font-size: 3.8rem;
			line-height: 1.5; */
			margin: 21px 0;
		}

		.sec-hdr p {
			/* font-size: 1.8rem;
			line-height: 1.5; */
		}

.cta-button .btn.secondary {
	box-sizing: border-box;
	color: #5581b5;
	text-decoration: none;
}

	.cta-button .btn.secondary:hover {
		color: #fff;
	}


@media screen and (max-width: 1024px) {
	.sec-mar-a {
		padding: 62px 0 0;
	}
	.wrapper.container-b {
		max-width: 460px;
	}
	.sec-hdr p {
		min-width: 290px;
		width: 85%;
		margin-left: auto;
		margin-right: auto;
	}

	.sec-hdr p br {
		display: none;
	}
}



/* 1/7/2025 badge width for svg display */
.badge{
	min-width: 187px;
}