/*
Theme Name: BLUEPRINT INTERACTIVE Theme
Author: Blueprint Interactive
Author URI: https://blueprintinteractive.com
Description: Blueprint Interactive Custom Theme.
Version: 2.0
License: GNU General Public License
/* -------------------------------------------------------------- */
/* Normalize Reset 
-------------------------------------------------------------- */

* {
  box-sizing: border-box;
  font-family: "League Spartan", sans-serif;
  margin: 0;
  padding: 0;
}

html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
  max-width: 100%;
  /* overflow-x: hidden; */
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
  font-family: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

* html .clearfix {
  height: 1%;
}

.clearfix {
  display: block;
}

/* general styles */
body {
  overflow-x: hidden;
}

.inner {
  max-width: 1200px;
  margin: auto;
  width: 90%;
}

.font-display {
  font-family: "Source Serif 4", serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #19242e;
  font-family: "Source Serif 4", serif;
  margin: 20px 0;
  font-weight: 600;
}

h1 strong,
h2 strong,
h3 strong,
h4 strong,
h5 strong,
h6 strong,
h1 b,
h2 b,
h3 b,
h4 b,
h5 b,
h6 b {
  font-weight: 600;
  font-family: "Source Serif 4", serif;
}

h1 {
  color: #19242e;
  font-size: 45px;
  font-weight: 600;
  line-height: 1.1;
  /* 110% */
  letter-spacing: -0.5px;
}

h2 {
  font-size: 32px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.5px;
}

h3 {
  font-size: 30px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.5px;
}

h4 {
  font-size: 24px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.5px;
}

h5,
h6 {
  font-size: 20px;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.5px;
}

p,
summary {
  color: #242424;
  color: #35383b;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.4;
  margin: 20px 0;
}

ol,
ul {
  color: #242424;
  font-size: 18px;
  line-height: 1.4;
  margin: 20px 0;
  padding: 0 0 0 5%;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
p a,
table a,
ol li a,
ul li a {
  color: #1d75cc;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  font-family: inherit;
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
p a:hover,
table a:hover,
p a:hover,
ol li a:hover,
ul li a:hover {
  color: #264092;
}

ol li,
ul li {
  margin: 10px 0;
}

a {
  transition: all ease-in-out 0.4s;
}

p a {
  color: #1d75cc;
}

p a:hover {
  color: #264092;
  text-decoration: none;
}

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

iframe[src^="https://www.youtube.com/embed/"],
iframe[src^="https://youtube.com/embed/"],
iframe[src^="https://youtu.be/"]
{
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
}

iframe {
  width: 100%;
  height: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 400;
  color: #35383b;
}

table,
th,
td {
  border: 1px solid var(--Neutral-80, #c5c7ca);
}

table thead tr,
table thead th {
  font-weight: 400;
  background: var(--Neutral-95, #eff1f4);
  text-align: left;
}

table th,
table td {
  padding: 10px;
}

.wp-block-gallery.has-nested-images img {
  aspect-ratio: 16/9;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  font-size: 18px;
  display: none;
  cursor: pointer;
}

.wp-block-gallery.has-nested-images figure.wp-block-image:hover figcaption {
  display: block;
}

.block-margin {
  margin: 30px 0;
}

.border-wrapper {
  border-bottom: 2px solid #e2e3e5;
  margin-bottom: 20px;

  width: 100%;
}

.border-wrapper p {
  color: #19242e;
}

.cta-button {
  background-color: #0071ce;
  color: white;
  padding: 10px 20px;
  display: inline-block;
  border-radius: 4px;
  font-weight: 600;
  font-size: 18px;
  transition: all ease-in-out 0.4s;
  text-decoration: none;
  text-align: center;
}

.cta-button:hover {
  background-color: #19242e;
}

.yellow-button {
  background-color: #ffb100;
  color: #02335f !important;
  padding: 10px 20px;
  display: inline-block;
  border-radius: 4px;
  font-weight: 400;
  font-size: 18px;
  transition: all ease-in-out 0.4s;
  text-decoration: none;
}

.yellow-button:hover {
  background-color: #1d75cc;
  color: #fff !important;
  /* color: #0060A0;
	color: #02335F */
}

.wp-block-button__link,
.outline-button {
  background-color: transparent;
  color: #1d75cc;
  border-radius: 4px;
  border: 1px solid #1d75cc;
  padding: 10px 20px;
  display: inline-block;
  border-radius: 4px;
  font-weight: 500;
  font-size: 18px;
  transition: all ease-in-out 0.4s;
  text-decoration: none;
  margin: 40px auto;
  line-height: 1;
  max-width: 300px;
  display: block;
  text-align: center;
  width: fit-content;
}

.wp-block-button__link {
  margin: 10px;
}

.wp-block-button__link:hover,
.outline-button:hover {
  background-color: #1d75cc;
  color: white;
}

.outline-button.search-button {
  margin: 0;
  width: 20%;
  background-color: #1d75cc;
  color: white;
}

.outline-button.search-button:hover {
  background-color: #19242e;
  color: white;
}

.home .outline-button {
  font-weight: 400;
  font-size: 21px;
  border: 1.5px solid #1d75cc;
  padding: 13px 26px;
  margin: 40px auto 0;
}

.inner input {
  border: none;
  border-bottom: 2px solid #c6e2f1;
  color: #c6e2f1;
  font-size: 18px;
  font-weight: 400;
  line-height: 140%;
  background-color: transparent;
  padding: 5px;
}

.inner input:focus {
  outline-color: #ccc;
}

.inner input::placeholder {
  color: #c6e2f1;
}

.inner input[type="submit"] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background-color: #ffb100;
  border: none;
  border-radius: 4px;
  color: #02335f;
  font-size: 17px;
  font-weight: 500;
  line-height: 16px;
  padding: 15px 44px 12px 20px;
  letter-spacing: -0.34px;
  position: relative;
  cursor: pointer;
  transition: all ease-in-out 0.4s;
  width: 140px;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_4803_2519' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_4803_2519)'%3E%3Cpath d='M14 18L12.6 16.55L16.15 13H4V11H16.15L12.6 7.45L14 6L20 12L14 18Z' fill='%2302335F'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: right 12px center;
}

.inner input[type="submit"]:hover {
  background-position: right 8px center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_4803_2519' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23FFF'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_4803_2519)'%3E%3Cpath d='M14 18L12.6 16.55L16.15 13H4V11H16.15L12.6 7.45L14 6L20 12L14 18Z' fill='%23FFF'/%3E%3C/g%3E%3C/svg%3E");
  background-color: #1d75cc;
  color: #fff;
}

input[type="submit"] {
  cursor: pointer;
}

/* banner section */
.banner {
  background-color: #264092;
  color: #fff;
  padding: 10px 0;
  text-align: center;
  position: relative;
}

.banner a {
  color: inherit;
  text-decoration: none;
}

.banner p {
  margin: 0 auto;
}

.banner p a {
  text-decoration: underline;
}

.banner p a:hover {
  text-decoration: none;
}

.banner-close {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.banner-close .close-icon svg {
  transition: all ease-in-out 0.4s;
  cursor: pointer;
}

.banner-close .close-icon:hover svg {
  rotate: 180deg;
}

body {
  position: relative;
}

/* header menu */
.site-header {
  background: var(--APWU-Blue, #0060a0);
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  padding: 0px 0px;
  z-index: 1000;
  min-height: 50px;
}

.site-header.not-sticky {
  position: relative;
}

.menu-toggle {
  display: none;
}

.search-icon {
  display: none;
}

.mobile-menu {
  display: none;
}

.header-left {
  padding: 0px;
}

.logo {
  display: inline-block;
  transition: transform 0.3s ease, filter 0.3s ease;
}

.logo svg {
  display: block;
  transition: transform 0.3s ease, filter 0.3s ease;
  filter: drop-shadow(0 0 0 transparent);
}

.logo:hover {
  transform: scale(1.05);
}

.logo:hover svg {
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.6));
  animation: logo-glow 1.5s ease-in-out infinite;
}

@keyframes logo-glow {
  0%,
  100% {
    filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.6));
  }
  50% {
    filter: drop-shadow(0 0 12px rgba(0, 173, 255, 0.8));
  }
}

.site-header .inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1400px;
}

ul#menu-main-menu {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0px;
  list-style: none;
  margin: 0;
  padding: 0;
  /* margin-bottom: -8px; */
  align-items: stretch;
}

ul#menu-main-menu li {
  list-style: none;
  margin: 0;
}

ul#menu-main-menu li.join {
  background-color: #ffb100;
  /* height: 90%; */
}

ul#menu-main-menu li.join a {
  color: #02335f;
  padding: 20px 35px;
}

ul#menu-main-menu li a {
  color: #fff;
  text-decoration: none;
  font-weight: normal;
  padding: 20px;
  transition: all ease-in-out 0.4s;
  font-size: 17px;
  display: inline-block;
  display: inline-flex;
  align-self: stretch;
}

ul#menu-main-menu li a:hover {
  color: #ffb100;
}

ul#menu-main-menu li.menu-item-has-children a:first {
  height: 100%;
}

ul#menu-main-menu > li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-left: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  transition: transform 0.3s ease;
  vertical-align: top;
  position: relative;
  top: 7px;
}

ul#menu-main-menu li a:hover,
ul#menu-main-menu > li:hover a {
  background-color: #03335f;
  color: #ffffff;
}

ul#menu-main-menu ul {
  position: absolute;
  top: 72px;
  left: 0;
  width: 100vw;
  z-index: 1000;
  display: block;
  background-color: #03335f;
  margin: 0;
  padding: 0px 5%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  text-align: center;
}

ul#menu-main-menu li:hover ul {
  opacity: 1;
  visibility: visible;
}

ul#menu-main-menu .mega ul li a:first-child:not(.sub-menu .sub-menu a) {
  color: #c9cdd3;
  text-transform: uppercase;
  font-size: 16px;
  align-items: start;
  height: auto;
  letter-spacing: 1px;
  text-align: left;
  font-weight: 400;
  margin-bottom: 10px;
  cursor: default;
}

ul#menu-main-menu ul.sub-menu ul.sub-menu li a {
  color: #ffffff;
}

ul#menu-main-menu ul.sub-menu ul.sub-menu li a:hover {
  color: #ffb100 !important;
}

ul#menu-main-menu > li > ul.sub-menu > li:first-child {
  border-left: solid 1px #0060a0;
}

ul#menu-main-menu > li > ul.sub-menu > li {
  border-right: solid 1px #0060a0;
  width: 19%;
  display: inline-block;
  vertical-align: top;
  margin: 0;
  margin-right: 0;
  padding: 20px 20px;
  height: 410px;
  text-align: left;
}

ul#menu-main-menu > li > ul.sub-menu > li:last-child {
  margin-right: 0;
}

ul#menu-main-menu ul ul {
  position: relative;
  width: auto;
  padding: 0;
  top: 0;
}

ul#menu-main-menu ul.sub-menu ul.sub-menu li,
ul#menu-main-menu ul.sub-menu ul.sub-menu li:first-child {
  text-transform: none;
  margin: 10px 0;
  text-align: left;
}

ul#menu-main-menu ul ul li a,
ul#menu-main-menu ul ul li:first-child a {
  color: #ffffff !important;
  text-transform: none !important;
  font-size: 19px !important;
  letter-spacing: 0;
  font-weight: 300;
}

ul#menu-main-menu ul li a {
  padding: 0;
  color: #ffffff;
}

ul#menu-main-menu li.small .sub-menu {
  /* background-color: red; */
  width: auto;
  padding: 0 20px;
  width: auto;
  height: auto;
  left: auto;
}

ul#menu-main-menu > li.small > ul.sub-menu > li:first-child {
  border: none;
  height: auto;
  padding: 10px 0;
}

ul#menu-main-menu > li.small > ul.sub-menu > li {
  width: auto;
  display: block;
  height: auto;
  margin: 0;
  padding: 0 0 10px;
  border: none;
}

ul#menu-main-menu > li.small > ul.sub-menu > li a,
ul#menu-main-menu > li.small > ul.sub-menu > li:first-child a {
  color: #fff;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 300;
  font-size: 19px;
}

ul#menu-main-menu > li.small > ul.sub-menu > li a:hover {
  color: #ffb100;
}

ul#menu-main-menu > li.small > ul.sub-menu > li:last-child {
  border-right: none;
}

.site-header .social-wrapper {
  display: flex;
  justify-content: flex-start;
}

.site-header .social-wrapper a {
  padding: 5px;
}

/* hero section */
.hero-wrap {
  padding: 20px 5%;
  color: #fff;
}

.hero-wrap.database {
  padding: 20px 5% 50px;
}

.hero-wrap.database .hero-content {
  max-width: 1100px;
}

.hero-wrap h1 {
  color: #fff;
  font-size: 45px;
}

.hero-wrap.image {
  align-items: stretch;
  display: flex;
  padding: 0;
}

.hero-wrap.small .hero-content {
  max-width: 1200px;
  margin: 0 auto;
}

.hero-wrap.small.plain.contract p a,
.hero-wrap.small .hero-content p {
  color: #fff;
  font-size: 17px;
}

.hero-wrap.small.plain.contract p a:hover {
  color: #ffb100;
}

.hero-wrap.image .hero-content {
  padding: 40px 5% 50px;
  width: 45%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-wrap.image .hero-content h1 {
  margin-top: 0;
}

.hero-wrap.image .hero-content p {
  color: #fff;
  font-size: 17px;
}

.hero-wrap.image .hero-content a {
  color: #fff;
  text-decoration: none;
}

.hero-wrap.image .hero-content a svg {
  display: inline-block;
  vertical-align: middle;
}

.hero-wrap.image .hero-image {
  width: 55%;
  max-height: 400px;
  aspect-ratio: 16 / 9;
  position: relative;
}

p.image-caption {
  margin: 0 0 0 auto;
  width: fit-content;
  position: absolute;
  right: 5%;
  bottom: 0;
  color: #fff;
  font-style: italic;
  font-size: 13px;

}

.hero-wrap.image .hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero-wrap .mobile-hero-image {
  display: none;
}

.hero-wrap .desktop-hero-image {
  display: block;
}

.hero-wrap.pinned {
  display: flex;
  flex-direction: column;
  background-color: var(--deep-blue);
  /* match blue wave bg */
  color: white;
  padding-bottom: 2rem;
}

.hero-image.pinned img {
  width: 100%;
  height: auto;
  display: block;
}

.hero-content .inner {
  margin: 0 0 0 auto;
  max-width: 800px;
}

.hero-content p svg {
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}

/* social sharing popup */
.share-trigger {
  background: none;
  border: none;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: all ease-in-out 0.4s;
  color: #1d75cc;
}

.share-trigger:hover {
  transform: scale(1.05);
  color: #264092;
}

.share-trigger span {
  display: inline-block;
  vertical-align: middle;
}

.share-trigger svg path {
  fill: #1d75cc;
}

.share-popup {
  align-items: center;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100000;
}

.share-popup h3 {
  margin-top: 0;
  text-align: left;
  font-size: 24px;
}

.share-popup-content {
  background: #fff;
  border-radius: 8px;
  margin: 50px auto;
  max-width: 400px;
  padding: 20px 30px;
  position: relative;
  text-align: center;
  width: 90%;
}

.share-popup-close {
  border: none;
  cursor: pointer;
  font-size: 24px;
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}

.share-icons {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 1.5rem 0;
}

.icon-placeholder {
  height: auto;
  width: 60px;
}

.icon-placeholder img {
  transition: all ease-in-out 0.4s;
}

.icon-placeholder:hover img {
  transform: scale(1.05);
}

.share-link-box {
  display: flex;
  gap: 0.5rem;
}

.share-link-box input {
  flex-grow: 1;
  padding: 0.5rem;
  color: #35383b;
  font-weight: 400;
  border: none;
  border-radius: 4px;
  border: 1px solid #c5c7ca;
  background: #eff1f4;
}

#copy-share-link {
  cursor: pointer;
  padding: 0.5rem 1rem;
  margin: 0;
}

/* single post/article */
.article-top {
  align-items: center;
  /* align-items: flex-start; */
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.media-wrapper {
}

.media-wrapper img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.media-wrapper video {
  width: 100%;
}

.media-wrapper iframe {
  width: 100%;
}

.related-posts {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 3%;
  width: 100%;
}

.related-posts .border-wrapper {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.card-loop-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  /* gap: 3%; */
  width: 100%;
}

.card-loop-wrapper .news-card.related-item {
  width: 33%;
  border-right: 1px solid #c5c7ca;
}

.card-loop-wrapper .news-card.related-item p {
  margin-top: 10px;
}

.card-loop-wrapper .news-card.related-item:nth-of-type(3) {
  border-right: none;
}

.news-card.related-item {
  /* padding: 0; */
  width: 30.3%;
}

.related-posts.stacked-cards {
  flex-direction: column;
}

.related-posts.stacked-cards .news-card.related-item {
  margin: 0 0 20px;
  width: 100%;
}

.related-posts.square {
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}

.related-posts.square .news-card.related-item {
  width: 48%;
  margin: 0 0 20px;
}

/* .news-card.related-item:nth-of-type(3) {
	border-left: 2px solid #C5C7CA;
	border-right: 2px solid #C5C7CA;
} */

/* single event */
.single-event-page .inner {
  margin: 50px auto;
}

.single-event-page p svg {
  display: inline-block;
  margin-right: 10px;
  vertical-align: top;
}

.single-event-page p svg.line {
  vertical-align: middle;
  margin: 0 10px;
}

.single-event-page p svg.dot {
  vertical-align: top;
  margin: 8px;
}

.event-top {
  flex-wrap: wrap;
  display: flex;
  justify-content: space-between;
  align-items: self-start;
  margin-bottom: 20px;
  gap: 10px;
}

.event-top .post-deadline-message {
  /* border: 1px solid #0060a0; */
  border-radius: 5px;
  /* padding: 0 10px; */
  font-size: 14px;
  font-weight: 500;
  color: #0060a0;
  margin-bottom: 10px;
}

.event-top .post-deadline-message p {
  color: #0060a0;
}

.event-top p {
  color: #35383b;
  font-size: 18px;
  margin: 10px 0;
}

.event-top p span {
  color: inherit;
  /* font-weight: 500; */
  text-transform: none;
}

.event-top .yellow-button {
  margin-top: 12px;
  padding: 15px 50px 12px;
}

.event-details,
.event-top-left {
  width: calc(100% - 300px);
}

.event-top-right {
  width: 170px;
}

.single-news-page .inner {
  margin: 50px auto;
}

/* officer listing page */
.intro-officer {
  max-width: 1100px;
  width: 90%;
  margin: 50px auto;
  text-align: center;
}

.intro-officer a {
  color: #35383b;
  font-weight: 500;
  text-decoration: underline;
}

.intro-officer a:hover {
  color: #264092;
  text-decoration: none;
}

.officer-type-group {
  margin: 30px 0;
  padding: 50px 0;
  position: relative;
  z-index: 0;
}

.officer-type-group:nth-of-type(even)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  height: 100%;
  background-color: #e5f0f5;
  z-index: -1;
}

.officer-type-group .border-wrapper {
  margin-bottom: 50px;
}

.officer-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 40px 5%;
}

.officer-card {
  width: 21%;
  overflow: hidden;
}

.officer-card a {
  text-decoration: none;
  transition: all ease-in-out 0.4s;
}

.officer-card:hover h3 {
  color: #1d75cc;
  text-decoration: underline;
}

.officer-card:hover img {
  transform: scale(1.05) !important;
}

.officer-card:hover .headshot-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, #02335f 0%, #02335f 100%);
  opacity: 0.3;
  pointer-events: none;
}

.officer-card .headshot-wrapper {
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  position: relative;
}

.officer-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: top center;
  transition: all ease-in-out 0.4s;
}

.officer-card h3 {
  color: #35383b;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.4;
  margin: 5px 0;
}

.officer-card p {
  color: #71777d;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.6;
  margin: 0;
}

.officer-card p span:first-of-type {
  color: #71777d;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
  display: block;
}

.officer-card p a {
  color: #71777d;
}

.officer-card p a:hover {
  color: #264092;
}

/* video wrapper */
.video-wrapper {
  position: relative;
  aspect-ratio: 16/9;
  margin: auto;
  max-width: 600px;
}

.video-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 16/9;
}

.video-wrapper video {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
  display: block;
}

.video-wrapper .play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  width: auto;
  cursor: pointer;
  z-index: 1;
  transition: all ease-in-out 0.4s;
}

.slider-inner {
  position: relative;
  padding: 0 50px;
}

.slider-block .arrow {
  top: 50%;
  position: absolute;
  transform: translateY(-50%);
  cursor: pointer;
}

.slider-block .arrow.prev {
  left: -20px;
}

.slider-block .arrow.next {
  right: -20px;
}

/* search floating bar */
.officer-directory {
  position: relative;
}

.search-box-click {
  position: fixed;
  position: sticky;
  position: -webkit-sticky;
  top: 20%;
  right: 0;
  margin-left: auto;
  z-index: 1000;
  padding: 12px 14px;
  cursor: pointer;
  font-weight: bold;
  box-shadow: -1px 1px 6px rgba(0, 0, 0, 0.1);
  background: var(--Action-Yellow-Default, #ffb100);
  width: 160px;
  /* left: 90%; */
  z-index: 2;
  cursor: pointer;
  transition: all ease-in-out 0.4s;
}

.search-box-click:hover {
  background-color: #1d75cc;
  color: #fff;
}

.search-box-click:hover p {
  color: #fff;
}

.search-box-click:hover path {
  fill: #fff;
}

.search-box-click p,
.search-box-click path {
  transition: all ease-in-out 0.4s;
}

.search-box-click p {
  color: var(--Navy, #02335f);
  font-size: 17px;
  font-weight: 500;
  text-align: center;
  margin: 0;
}

.search-box-click p svg {
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}

.officer-filters {
  position: fixed;
  top: 0;
  right: -100%;
  width: 320px;
  height: 100vh;
  background: #f6f7f9;
  padding: 120px 25px 20px;
  box-shadow: -4px 0 12px rgba(0, 0, 0, 0.15);
  transition: right 0.3s ease;
  z-index: 999;
  overflow-y: auto;
}

.officer-filters .filter-by {
  color: var(--Neutral-20, #35383b);
  font-size: 17px;
  font-weight: 400;
  margin-bottom: 30px;
  text-align: center;
}

.officer-filters.open {
  right: 0;
}

.officer-filters select,
.officer-filters input {
  width: 100%;
  padding: 8px;
  border-radius: 6px;
  border: 1px solid #35383b;
}

.officer-filters input.keyword {
  background-color: transparent;
  border: none;
  border-bottom: 2px solid #35383b;
  border-radius: 0;
  font-weight: 400;
  color: #35383b;
}

.officer-filters input.keyword:focus {
  outline-color: #35383b;
  background-color: #fff;
}

.officer-filters input::placeholder {
  color: #35383b;
}

.close-filters {
  background: transparent;
  border: none;
  font-size: 14px;
  margin-bottom: 20px;
  cursor: pointer;
  text-align: right;
  display: block;
  color: var(--Neutral-20, #35383b);
  width: 100%;
}

.close-filters svg {
  display: inline-block;
  vertical-align: text-bottom;
  margin-left: 10px;
}

.close-filters:hover {
  color: #1d75cc;
}

.close-filters:hover svg {
  transform: rotate(180deg);
  transition: all 0.3s ease-in-out;
}

.checkbox-group {
  margin-top: 20px;
  border: none;
  padding: 0;
}

.checkbox-group legend {
  font-weight: bold;
  margin-bottom: 8px;
  font-size: 16px;
}

.checkbox-group label {
  display: block;
  margin-bottom: 6px;
  cursor: pointer;
}

.checkbox-group input[type="checkbox"] {
  margin-right: 6px;
}

/* Group container */
.filter-group {
  margin: 15px 0;
  border-bottom: 1px solid var(--Navy, #02335f);
}

/* Toggle button (e.g. "Issues") */
.filter-toggle {
  background: none;
  border: none;
  font-weight: bold;
  font-size: 16px;
  width: 100%;
  text-align: left;
  padding: 0;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--Navy, #02335f);
  font-weight: 400;
}

.filter-toggle .caret {
  font-size: 18px;
  transform: rotate(0deg);
  transition: transform 0.2s;
}

.filter-toggle.active .caret {
  transform: rotate(180deg);
}

.filter-search {
  position: relative;
  margin: 10px 0;
}

.filter-search input {
  width: 100%;
  padding: 8px 36px 8px 10px;
  border: 1px solid #35383b;
  border-radius: 0;
  font-size: 14px;
}

.filter-search .search-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  color: #35383b;
}

.checkbox-list {
  max-height: 180px;
  overflow-y: auto;
  /* border-bottom: 1px solid #35383b; */
  padding-bottom: 8px;
}

.checkbox-list label {
  display: flex;
  align-items: center;
  font-size: 15px;
  margin-bottom: 8px;
  cursor: pointer;

  color: var(--Neutral-20, #35383b);
}

.checkbox-list input[type="checkbox"] {
  appearance: none;
  width: 20px;
  height: 20px;
  margin-right: 12px;
  border-radius: 2px;
  border: 1.5px solid #35383b;
  background: white;
  cursor: pointer;
  position: relative;
}

.checkbox-list input[type="checkbox"]:checked {
  /* background-color: #35383b; */
  border-color: #35383b;
}

.checkbox-list input[type="checkbox"]:checked::after {
  content: "✓";
  /* content: "2713"; */
  color: white;
  color: #35383b;
  position: absolute;
  font-size: 16px;
  top: 2px;
  left: 3px;
}

.filter-options {
  display: none;
}

.search-results {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 16px 20px;
  font-size: 14px;
}

.page-template-page-template_search-php .search-results {
  margin: 16px 0px;
}

.search-results .result-label {
  padding: 10px 15px 8px;
  background: #e5f0f5;
  border: 1px solid #02335f;
  border-radius: 4px;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: all ease-in-out 0.4s;
  font-size: 14px;
  color: #02335f;
}

.search-results .result-label:hover {
  background: #1d75cc;
  color: #fff;
}

.search-results .result-label .remove-filter {
  margin-left: 8px;
  cursor: pointer;
  font-weight: bold;
  color: #02335f;
  transition: all ease-in-out 0.4s;
}

.search-results .result-label:hover .remove-filter {
  color: #fff;
}

.search-results .clear-all {
  margin-left: 10px;
  cursor: pointer;
}

.map-wrapper .inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.map-wrapper .inner .map path.selected {
  fill: #ffc94d;
}

.map-wrapper .color {
  display: flex;
  margin: 10px 0;
  align-items: center;
}

.map-wrapper .color-box {
  width: 25px;
  aspect-ratio: 1/1;
  display: inline-block;
  margin-right: 10px;
  background-color: #ffb100;
  border-radius: 4px;
}

.map-wrapper .north .color-box {
  background-color: #144556;
}

.map-wrapper .east .color-box {
  background-color: #298bcc;
}

.map-wrapper .south .color-box {
  background-color: #23628c;
}

.map-wrapper .central .color-box {
  background-color: #9bcff2;
}

.map-wrapper .western .color-box {
  background-color: #d4ebfa;
}

.map-wrapper .legend {
  width: 200px;
}

.map-wrapper .map {
  width: calc(100% - 250px);
}

.map-wrapper .map svg {
  height: auto;
}

.map-wrapper .map .state:hover {
  fill: #ffc94d;
}

/* single news cards */
.cards-wrapper {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  /* gap: 2%; */
  width: 100%;
}

.cards-wrapper .news-card {
  width: 33%;
}

.cards-wrapper .news-card.post {
  gap: 10px;
}

.cards-wrapper .news-card h3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* min-height: calc(1.3em * 3); */
  line-height: 1.3em;
  margin-bottom: 10px;
  font-size: 25px;
}

p.summary-p {
  line-height: 1.6em;
  /* min-height: calc(1.6em * 4); */
}

p.category {
  margin-top: 10px;
  color: var(--Neutral-50, #71777d);
  font-size: 15px;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
}

.pagination-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin: 50px auto;
  width: 100%;
}

.pagination-wrapper a {
  text-decoration: none;
  color: var(--Neutral-10, #19242e);
  font-size: 14px;
  transition: all ease-in-out 0.4s;
  vertical-align: middle;
  display: inline-block;
  padding: 12px 16px 9px;
  border-radius: 4px;
}

/* .pagination-wrapper a:not(.back-btn, .next-btn) {
	aspect-ratio: 1/1;
} */

.pagination-wrapper a svg {
  display: inline-block;
  vertical-align: middle;
}

.pagination-wrapper a.back-btn,
.pagination-wrapper a.next-btn {
  font-size: 16px;
}

.pagination-wrapper a.back-btn svg,
.pagination-wrapper a.next-btn svg {
  vertical-align: top;
}

.pagination-wrapper a:hover {
  background-color: var(--Action-Yellow-Default, #ffb100);
  color: #fff;
}

/* .pagination-wrapper a:hover svg {
	transform: translateX(5px);
} */

.pagination-wrapper a svg,
.pagination-wrapper a svg path {
  transition: all ease-in-out 0.4s;
}

.pagination-wrapper a:hover svg path {
  fill: #fff;
}

.pagination-wrapper a.current {
  background-color: var(--Action-Blue, #1d75cc);
  color: #fff;
}

#filter-type {
  padding-bottom: 10px;
}

#filter-type label {
  display: block;
  margin: 5px 0;
}

#filter-type input[type="radio"] {
  display: inline-block;
  width: auto;
  margin-right: 10px;
  vertical-align: top;
}

p.results-found {
  color: var(--Neutral-50, #71777d);
  font-size: 16px;
}

.filter-group.dates {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  border: none;
}

.date-field {
  display: flex;
  flex-direction: column;
  position: relative;
  color: #0a2f57;
  width: 48%;
  border-bottom: 1px solid var(--Navy, #02335f);
  padding-bottom: 12px;
}

.date-field label {
  font-size: 16px;
  margin-bottom: 6px;
  font-weight: 500;
  color: #0a2f57;
}

.date-field input {
  width: 100%;
  padding: 8px 10px 8px;
  border: 1px solid #35383b;
  border-radius: 0;
  font-size: 14px;
  cursor: pointer;
}

.filter-actions .outline-button {
  margin: 10px auto;
  width: 100%;
  cursor: pointer;
}

.blue-link {
  color: var(--Action-Blue, #1d75cc);
  font-size: 14px;
  text-decoration: none;
}

.blue-link:hover {
  text-decoration: underline;
}

.divider {
  border-left: 1.5px solid #d9d9d9;
  height: 36px;
  margin: 0 10px 0 4px;
}

.news-listing-content-wrapper .news-card.press-release,
.news-listing-content-wrapper .news-card.event,
.news-listing-content-wrapper .news-card.postal-wire-clip {
  border-bottom: 1px solid var(--Neutral-90, #e2e3e5);
  width: 100%;
  max-width: 850px;
  margin: auto;
  padding: 30px 0;
}

.news-listing-content-wrapper .news-card.press-release h3,
.news-listing-content-wrapper .news-card.event h3,
.cards-wrapper .news-card.postal-wire-clip h3 {
  min-height: unset;
  -webkit-line-clamp: unset;
}

p.date svg {
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px;
}

p.date span {
  font-weight: 500;
  color: #71777d;
}

p.event-date {
  margin: 7px 0;
}

.event-date svg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}

.event-date svg.line {
  margin-left: 10px;
}

.news-card.event {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: flex-start;
}

.news-card.event .content {
  display: inline-block;
  width: calc(100% - 150px);
}

.news-card.event .yellow-button {
  width: 100px;
  text-align: center;
  margin-top: 7px;
}

.news-card.event .yellow-button:hover {
  background-color: #1d75cc;
  color: #fff;
}

/* resource page */
a.file {
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  font-size: 18px;
  color: #0060a0;
}

a.file.outline-button {
  width: auto;
  max-width: 100%;
}

a.file img {
  width: auto;
  height: 30px;
  margin-right: 10px;
  vertical-align: middle;
  filter: brightness(0%) saturate(0%) invert(55%);
  transition: all ease-in-out 0.4s;
}

a.file:hover img {
  transform: scale(1.05);
  filter: brightness(0) invert(1);
}

/* a.file:hover {
	color: #02335F;
} */

/* single officer */
.officer-info-inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}

.officer-info-image {
  width: 400px;
  position: sticky;
  object-fit: cover;
  object-position: center;
  top: 75px;
  z-index: 1;
  position: -webkit-sticky;
}

.officer-info-image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 1/1;
  object-position: center;
}

.officer-bio {
  width: calc(100% - 450px);
}

.officer-bio.no-img {
  width: 100%;
}

.officer-bio h1 {
  margin-top: 0;
  font-size: 44px;
  line-height: 1.1;
}

.officer-bio h2 {
  font-size: 26px;
}

.officer-bio h2 span {
  display: block;
  color: var(--Neutral-20, #35383b);
  font-family: "League Spartan", sans-serif;
  font-weight: 400;
  font-size: 19px;
  margin-top: 2px;
}

.officer-info-image.mobile {
  display: none;
}

/* single news/press */
.article-top p {
  color: var(--Neutral-50, #71777d);
  margin: 10px 0;
}

.article-top p.date-p {
  font-size: 14px;
}

.article-top .author p {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.article-top .author p a {
  color: var(--Neutral-50, #71777d);
}

.article-top .author p a:hover {
  color: var(--Action-Blue, #1d75cc);
}

.title-wrap h1 {
  color: var(--Neutral-10, #19242e);
  font-size: 44px;
}

.title-wrap h2 {
  color: var(--Neutral-20, #35383b);
  font-size: 24px;
}

.post-categories a {
  color: var(--Neutral-50, #71777d);
  font-size: 15px;
  font-style: italic;
  font-weight: 400;
  text-decoration: none;
}

.post-categories a:hover {
  color: var(--Action-Blue, #1d75cc);
  text-decoration: underline;
}

.body-content {
  margin: 50px auto;
  max-width: 800px;
  width: 90%;
}

.bottom-title-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 20px 0 35px;
  gap: 15px;
  flex-wrap: wrap;
}

.bottom-title-wrap .outline-button {
  margin: 10px 0 10px;
  width: auto;
  max-width: 100%;
}

.arrow.slick-arrow {
  cursor: pointer;
}

.article-top.video {
  margin-bottom: 50px;
}

/* impact */
a.outline-button.impact {
  margin: 10px 0;
  width: fit-content;
  max-width: 100%;
}

/* podcast */
.body-content.podcast {
  max-width: 100%;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.podcast-body {
  width: calc(100% - 250px);
}

.podcast-links {
  display: flex;
  gap: 20px;
  flex-direction: column;
  width: 200px;
  margin-top: 20px;
}

/* hatch warning */
.hatch-warning-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9998;
}

.hatch-warning-popup {
  height: 100%;
  width: 100%;
  z-index: 9999;
}

.hatch-warning-content {
  max-height: 90vh;
  transform: translate(-50%, -50%);
  background: #fff;
  padding: 40px 50px;
  max-width: 900px;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  z-index: 10000;
  background: url(./images/hatch.png) no-repeat center center, #02335f;
  background-size: cover;
  background-blend-mode: soft-light, normal;
  overflow-y: auto;

  scrollbar-width: thin;
  scrollbar-color: #1d75cc #02335f;
}

/* For WebKit browsers (Chrome, Safari, Edge) */
.hatch-warning-content::-webkit-scrollbar {
  width: 8px;
  display: block;
}

.hatch-warning-content::-webkit-scrollbar-track {
  background: #02335f;
}

.hatch-warning-content::-webkit-scrollbar-thumb {
  background-color: #1d75cc;
  border-radius: 10px;
  border: 2px solid #02335f;
}

.hatch-warning-content h2,
.hatch-warning-content p {
  color: #fff;
}

.hatch-warning-content h2 {
  text-align: center;
}

.hatch-warning-content h2 a,
.hatch-warning-content p a {
  color: #ffb100;
  text-decoration: underline;
}

.hatch-warning-divider {
  margin: 20px auto;
  display: block;
}

.hatch-warning-content h2 a:hover,
.hatch-warning-content p a:hover {
  color: #fff;
  text-decoration: none;
}

.hatch-warning-content .hatch-warning-button.outline-button {
  color: #c6e2f1;
  border-color: #c6e2f1;
  cursor: pointer;
  margin-bottom: 0;
}

.hatch-warning-content .hatch-warning-button.outline-button:hover {
  background-color: #c6e2f1;
  border-color: #c6e2f1;
  color: #02335f;
}

/* live stream takeover */
.livestream-takeover {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  padding: 40px 0;
  background-color: #0e1a26;
  /* or any fallback background */
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 10000;
}

.livestream-takeover .container {
  max-width: 1100px;
  margin: 50px auto;
  position: relative;
}

.livestream-takeover .inner {
  align-items: self-start;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  flex-wrap: wrap;
}

.livestream-takeover .inner .full {
  /* flex: 1 1 65%; */
  flex: 1 1 calc(100% - 370px);
}

.livestream-takeover .inner .short {
  flex: 1 1 330px;
}

.livestream-left {
  flex: 2 1 60%;
}

.livestream-logo {
  width: 120px;
  height: auto;
  max-height: 50px;
  margin-bottom: 20px;
  object-fit: contain;
}

.livestream-title {
  margin-top: 0px;
  font-size: 30px;
}

.livestream-description .read-more-button {
  color: #ffb100;
  font-size: 19px;
}

.livestream-description .read-more-button:hover {
  color: #fff;
}

.livestream-takeover .outline-button {
  color: #c6e2f1;
  border-color: #c6e2f1;
  background: transparent;
  margin: 20px auto 0;
  border: 1px solid;
  font-weight: 500;
  font-size: 18px;
  /* max-width: 90%; */
}

.livestream-takeover .yellow-button {
  margin: 20px auto;
  width: 100%;
  display: block;
  max-width: 300px;
}

.livestream-takeover .yellow-button svg {
  vertical-align: middle;
}

.livestream-takeover .outline-button:hover {
  background-color: #c6e2f1;
  border-color: #c6e2f1;
  color: #02335f;
}

.continue-link {
  display: block;
  margin-top: 30px;
  padding: 12px 24px;
  text-decoration: none;
}

.livestream-right {
  flex: 1 1 35%;
}

.chat-box {
  border-radius: 12px;
  border: 1px solid var(--Neutral-40, #5b6064);
  background: #19242e;
  padding: 16px;
  /* height: 350px; */
  height: auto;
  overflow-y: auto;
  /* margin-bottom: 20px; */
  color: #fff;
  align-self: stretch;
}

.action-box {
  border-radius: 10px;
  border: 1px solid var(--Neutral-40, #5b6064);
  background: var(--Neutral-10, #19242e);
  padding: 20px;
  text-align: center;
}

.action-box h3 {
  margin: 0px auto;
  color: var(--Action-Yellow-Default, #ffb100);
  font-size: 17px;
  font-weight: 400;
  letter-spacing: 6px;
  text-transform: uppercase;
  font-family: "League Spartan", sans-serif;
}

.livestream-takeover .close-button {
  position: absolute;
  top: 0px;
  right: 20px;
  font-size: 24px;
  color: #fff;
  cursor: pointer;
  z-index: 10001;
  text-decoration: none;
  transition: all ease-in-out 0.4s;
}

.livestream-takeover .close-button:hover {
  color: #ffb100;
  transform: rotate(90deg);
}

.ui-autocomplete {
  z-index: 9999;
  background: white;
  border: 1px solid #71777d;
  max-height: 300px;
  overflow-y: auto;
  font-size: 16px;
  width: 100%;
  margin: 0;
  padding: 0px;
  list-style: none;
}

.ui-menu-item {
  padding: 0;
  margin: 0;
}

.ui-menu-item-wrapper {
  cursor: pointer;
  margin: 0;
  padding: 5px 10px;
  list-style: none;
}

.ui-state-active {
  background-color: #1d75cc;
  color: #fff;
}

.cards-wrapper .news-card.search-card {
  width: 100%;
  max-width: 100%;
  border-bottom: 1px solid var(--Neutral-90, #e2e3e5);
  padding: 30px 0;
  gap: 5px;
}

.cards-wrapper .news-card.search-card h3 {
  min-height: auto;
}

.styled-search-form {
  max-width: 100%;
  margin-top: 1rem;
  display: flex;
  gap: 20px;
  width: 100%;
}

.search-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  border: 2px solid var(--Navy, #02335f);
  border-radius: 5px;
  padding: 0.5rem 1rem;
  background: #fff;
  width: 80%;
}

.contract-search .search-input,
.inner input.search-input,
.inner input.autocomplete-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  color: #02335f;
  font-weight: 400;
  padding-left: 31px;

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><mask id="mask0_4752_7920" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_4752_7920)"><path d="M19.6 21L13.3 14.7C12.8 15.1 12.225 15.4167 11.575 15.65C10.925 15.8833 10.2333 16 9.5 16C7.68333 16 6.14583 15.3708 4.8875 14.1125C3.62917 12.8542 3 11.3167 3 9.5C3 7.68333 3.62917 6.14583 4.8875 4.8875C6.14583 3.62917 7.68333 3 9.5 3C11.3167 3 12.8542 3.62917 14.1125 4.8875C15.3708 6.14583 16 7.68333 16 9.5C16 10.2333 15.8833 10.925 15.65 11.575C15.4167 12.225 15.1 12.8 14.7 13.3L21 19.6L19.6 21ZM9.5 14C10.75 14 11.8125 13.5625 12.6875 12.6875C13.5625 11.8125 14 10.75 14 9.5C14 8.25 13.5625 7.1875 12.6875 6.3125C11.8125 5.4375 10.75 5 9.5 5C8.25 5 7.1875 5.4375 6.3125 6.3125C5.4375 7.1875 5 8.25 5 9.5C5 10.75 5.4375 11.8125 6.3125 12.6875C7.1875 13.5625 8.25 14 9.5 14Z" fill="%2371777D"/></g></svg>');
  background-repeat: no-repeat;
  background-position: center left;
  background-size: 24px;
  padding: 7px 15px 2px 32px;
}

.contract-search .search-input::placeholder,
.inner input.search-input::placeholder,
.inner input.autocomplete-input::placeholder {
  color: #71777d;
}

h2.no-results-found {
}

.search-button {
  background: none;
  border: none;
  font-size: 1.2rem;
  margin-left: 0.5rem;
  cursor: pointer;
  color: #1d75cc;
}

.clear-search {
  margin-left: 5px;
  cursor: pointer;
  text-decoration: none;
  color: var(--Action-Blue, #1d75cc);
  font-size: 14px;
  transition: all ease-in-out 0.4s;
}

.clear-search:hover {
  color: #0a2f57;
}

/* 404 */
.postcard-404 {
  background-image: url("./images/white-wave.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 80vh;
  padding: 100px 0;
}

.postcard-404 .postcard {
  background: url("./images/stamp.png");
  background-size: cover;
  padding: 30px 55px;
  transition: 0.25s ease-in-out;
  width: 800px;

  aspect-ratio: 845 / 600;
  display: flex;
  justify-content: space-between;
  color: #333;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.postcard-404 .left-side {
  width: 45%;
  padding-right: 1rem;
}

.postcard-404 .left-side h1 {
  font-size: 2rem;
  margin-bottom: 6px;
}

.postcard-404 .right-side {
  margin-top: 300px;
  width: 50%;
  padding-left: 1rem;
}

.postcard-404 .stamp-area {
  text-align: right;
  margin-bottom: 1rem;
}

.postcard-404 .stamp-area img {
  height: 50px;
}

.postcard-404 .airmail {
  font-size: 0.8rem;
  color: #224c72;
  text-transform: uppercase;
  letter-spacing: 2px;
}

#footer {
  background-color: #0060a0;
  background-image: url("./images/footerbg.png");
  background-position: bottom left;
  background-size: 22% auto;
  background-repeat: no-repeat;
  padding: 50px 0;
}

#footer .inner {
  max-width: 1400px;
  width: 95%;
}

#footer-logo img {
  width: 180px;
  height: auto;
  display: block;
  margin-bottom: 20px;
}

p#footer-address,
#footerbottom p {
  color: #ffffff;
  font-size: 15px;
  font-weight: normal;
  margin: 0;
  padding: 0;
}

#footerbottom p a {
  color: #ffffff;
  text-decoration: none;
  margin-left: 10px;
}

#footertop {
  padding-bottom: 50px;
  border-bottom: solid 0.5px #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}

#footerbottom {
  padding-top: 20px;
}

#footerbottom .social-wrapper a {
  text-decoration: none;
}

#footerbottom .disclaimer {
  display: inline-block;
  width: 49%;
  vertical-align: middle;
}

#footerbottom .social-wrapper {
  display: inline-block;
  width: 50%;
  text-align: right;
  vertical-align: middle;
}

#footerbottom .social-wrapper svg {
  height: 35px;
  width: auto;
}

#footerbottom .social-wrapper svg path,
#footerbottom .social-wrapper svg circle {
  transition: all 0.3s ease-in-out;
}

#footerbottom .social-wrapper a:hover svg path,
#footerbottom .social-wrapper a:hover svg circle {
  fill: #ffb100;
  fill: #c6e2f1;
}

.footer-left {
  width: 25%;
  width: 300px;
  display: inline-block;
  vertical-align: top;
}

.footer-right {
  width: 74%;
  width: calc(100% - 320px);
  display: inline-block;
  vertical-align: top;
}

.footer-right .footernavtop {
  margin-bottom: 20px;
}

.footer-right .footernav ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.footer-right .footernav ul li {
  text-transform: uppercase;
  font-size: 18px;
  margin-bottom: 0;
  width: 150px;
  width: 23%;
}

.footer-right .footernav ul ul {
  display: block;
  width: 100%;
}

.footer-right .footernav ul ul li {
  text-transform: none;
  display: block;
  width: 100%;
  line-height: 1.1;
}

.footer-right .footernav ul ul li a {
  font-size: 18px;
  line-height: 1.1;
}

.menu-container li a svg,
ul#menu-main-menu a svg,
.footer-right .footernav ul ul li a svg {
  margin-left: 5px;
  vertical-align: sub;
  height: 17px;
  width: auto;
  display: inline-block;
}

ul#menu-main-menu a svg {
  align-self: center;
}

.footer-right .footernav ul ul li a:hover {
  color: #ffb100;
}

.footer-right .footernav ul li a {
  color: #c0d7fb;
  text-decoration: none;
  font-size: 18px;
  font-weight: normal;
  transition: all 0.3s ease;
}

.footer-right .footernav {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  max-width: 995px;
}

.footerform {
  border: solid 3px #ffffff;
  width: 39%;
  width: 400px;
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  padding: 15px 20px;
  background: url("./images/footerstamp.png") no-repeat center center;
  background-size: 100% 100%;
  align-self: flex-end;
}

#footer .footerform input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 10px;
  margin: 15px 0;
  border-bottom: 1px solid #ffffff;
  border-radius: 0px;
  outline: none;
}

#footer .footerform input[type="submit"] {
  background-color: #ffb100;
  border-radius: 5px;
  font-weight: 400;
  font-size: 17px;
  padding: 15px 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  border: none;
}

#footer .footerform input[type="submit"]:hover {
  background-color: #002f5f;
  color: #ffffff;
}

/* search */

.search-modal {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  height: 400px;
  height: calc(100vh - 80px);
  background: white;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 30px;
  overflow-y: auto;
  transition: opacity 0.3s ease;
}

.search-modal.hidden {
  display: none;
}

.search-modal-inner {
  max-width: 800px;
  width: 100%;
  padding: 2rem;
}

.search-modal-close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  background: none;
  border: none;
  font-size: 2rem;
  cursor: pointer;
}

.search-modal-close:hover {
  transform: rotate(180deg);
  transition: all 0.3s ease-in-out;
}

.search-form {
  position: relative;
  display: flex;
  gap: 10px;
}

.autocomplete-input {
  width: 75%;
  padding: 1rem;
  font-size: 1.2rem;
  border: 1px solid #002f5f;
}

.clear-input {
  position: absolute;
  right: 27%;
  top: 20px;
  background: none;
  border: none;
  color: #0071ce;
  cursor: pointer;
}

.popular-searches h4 {
  color: #71777d;
  font-size: 14px;
  font-weight: 500;
  line-height: 160%;
  font-family: "League Spartan", sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.popular-searches ul {
  margin-top: 0;
  list-style: none;
  padding: 0;
}

.popular-searches ul li {
  margin: 0;
}

.popular-searches li a {
  display: block;
  color: #0071ce;
  padding: 3px 0;
  text-decoration: none;
}

popular-searches h4 {
  margin-bottom: 0;
}

.signup-step2-wrapper {
  display: flex;
  justify-content: space-between;
  width: 400px;
  max-width: 100%;
  margin: 100px auto;
}

.signup-step2-left {
  text-align: center;
}

.signup-step2-left h2 {
  color: var(--Neutral-50, #71777d);
  font-size: 14px;
  font-family: "League Spartan", sans-serif;
  font-weight: 500;
  line-height: 160%;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.signup-step2-left form .form-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.signup-step2-left form .form-group label {
  font-size: 0;
  font-weight: 400;
}

.signup-step2-left input {
  width: 100%;
  border-bottom: 2px solid var(--Navy, #02335f);
  color: var(--Navy, #02335f);
  font-family: "League Spartan", sans-serif;
  text-align: left;
  font-size: 14px;
  font-weight: 400;
  line-height: 160%;
}

.signup-step2-left input::placeholder {
  color: var(--Neutral-50, #02335f);
  font-family: "League Spartan", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 160%;
}

.signup-step2-left form .form-group label .opt-in {
  color: var(--Navy, #02335f);
  font-family: "League Spartan", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 160%;
}

.signup-step2-left form .form-group p {
  color: var(--Neutral-50, #71777d);
  font-size: 11px;
  text-align: left;
}

.contract-record-header p {
  margin: 20px 0;
}

.document-overview,
.document-ocr {
  margin-bottom: 20px;
}

.tab-buttons {
  display: flex;
  gap: 10px;
}

.tab-button {
  padding: 0.5rem 1rem;
  cursor: pointer;
  background: #f6f7f9;
  border: none;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.tab-button:hover {
  background: #0074cc;
  color: #fff;
}

.tab-button.active {
  background: #f0f0f0;
  color: #0074cc;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
  background-color: #f0f0f0;
  padding: 50px 5%;
}

.cards-wrapper .news-card.contract {
  width: 100%;
  border-bottom: 1px solid #e0e0e0;
}

.cards-wrapper .news-card.contract h3 {
  min-height: 0;
  padding-top: 0;
}

.cards-wrapper .news-card.contract:last-of-type {
  border-bottom: none;
}

.news-card.contract .cta-button {
  margin-top: 10px;
}

.news-card.contract .cta-button svg {
  vertical-align: sub;
  width: 20px;
  margin-left: 7px;
  height: auto;
}

.basic-page-wrapper.interior-page .inner:first-of-type {
  margin-top: 40px;
  margin-bottom: 40px;
  margin-top: 0px;
  margin-bottom: 0px;
}

.home .basic-page-wrapper.interior-page .inner:first-of-type {
  margin-bottom: 0;
}

.news-listing-content-wrapper .inner {
  margin-bottom: 50px;
}

table {
  max-width: 100% !important;
  /* overflow: scroll; */
}

/* Story Collection Page */
.storycollection .inner input[type="submit"] {
  width: auto;
}

.storycollection {
  padding-top: 70px;
}

.storycollection .colleft {
  width: 45%;
  display: inline-block;
  vertical-align: top;
  margin-right: 4%;
}

.storycollection .colright {
  width: 45%;
  display: inline-block;
  vertical-align: top;
}

.storycollection.step1 .colleft {
  width: 50%;
  margin-right: 11%;
}

.storycollection.step1 .colright {
  width: 35%;
}

.storycollection.step2 .colright {
  text-align: center;
}

.storycollection form {
  width: 100%;
}

.storycollection form input {
  font-weight: 600;
  display: block;
  width: 100%;
  margin-bottom: 20px;
  padding: 10px 20px;
  font-weight: 500;
  cursor: pointer;
  font-size: 15px;
  line-height: 20px;
  border: none;
  border-bottom: solid 2px #1a39a5;
}

.storycollection form input[type="submit"] {
  background-color: #ffffff;
  color: #1a39a5;
  border: solid 2px #1a39a5;
  border-radius: 25px;
  font-weight: 600;
  cursor: pointer;
  font-size: 16px;
  line-height: 20px;
  margin-top: 40px;
  width: auto;
}

.storycollection form input[type="submit"]:hover {
  color: #ffffff;
  background-color: #1a39a5;
  text-decoration: none;
}

/* Share Your Story Recorder */
#videostage {
  width: 100%;
  margin-bottom: 20px;
  position: relative;
}

#videostage video {
  max-width: 100%;
}

.share_mobileonly {
  display: none;
}

#videocountdown {
  font-size: 80px;
  line-height: 85px;
  color: #ffffff;
  font-weight: bold;
  position: absolute;
  width: 100%;
  left: 0;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  z-index: 100;
}

#videocountdown span {
  display: none;
}

.storycollection .mobileonly .recordbutton {
  font-size: 22px;
  padding: 20px 25px;
  position: relative;
  top: -70px;
  width: 100%;
}

.storycollection .mobileonly .sharesubhead button {
  font-size: 22px;
  padding: 20px 10px;
  width: 100%;
  margin-bottom: 10px;
}

.storycollection .recordrtc video.mobilepreview {
  width: 100%;
}

.storycollection #mobilevideo {
  width: 100%;
  position: relative;
  z-index: 12;
  opacity: 0;
  height: 80px;
}

.video-js {
  margin-bottom: 20px;
  max-width: 100%;
}

.storycollection #btn-start-recording,
.storycollection #stop-recording {
  color: #ffffff;
  border: none;
  padding: 19px 75px 15px 75px;
  background-color: #319dff;
  border-radius: 5px;
  cursor: pointer;
  text-transform: uppercase;
  box-sizing: border-box;
  max-width: 100%;
  font-size: 18px;
  width: auto;
  display: block;
  margin: 0 auto;
}

.storycollection #stop-recording,
.sharesubhead {
  display: none;
}

.storycollection #start-recording-over,
.storycollection #submit-recording {
  background-color: #319dff;
  border-radius: 5px;
  color: #ffffff;
  width: auto;
  display: inline-block;
  padding: 19px 17px 15px 17px;
  vertical-align: middle;
  margin-right: 2%;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: normal;
  cursor: pointer;
  border: none;
}

.storycollection .recordrtc button {
  font-size: inherit;
}

.storycollection .recordrtc,
.storycollection .recordrtc .header {
  display: block;
  padding-top: 0;
}

.storycollection .recordrtc video {
  width: 550px;
  height: 345px;
  background-color: #000000;
}

.storycollection .recordrtc option[disabled] {
  display: none;
}

.storycollection .video-js .vjs-time-control {
  font-size: 17px;
  line-height: 22px;
  padding-top: 7px;
}

.storycollection .inner input::placeholder {
  color: #868686;
}

.storycollection .inner input {
  outline: none;
  color: #2a2a2a;
}

/* SK edits */

.js-error_message {
  color: var(--Action-Yellow-Default, #ffb100) !important;
}

.ajax-loading {
  display: none;
}

.international_link-wrap {
  display: none;
}

.header-left .logo {
  padding-top: 5px;
}

.postcard .right-side p {
  text-align: center;
  font-size: 28px;
  line-height: 45px;
  margin-top: 27px;
  padding-left: 60px;
  padding-bottom: 9px;
}

ul#menu-main-menu ul {
  top: 63px;
}

.postcard .left-side p {
  font-size: 1.5rem;
  margin-top: 0px;
  margin-bottom: 4px;
}

.top-contracts-section .border-wrapper {
  width: 95%;
  margin: 0 auto 40px;
}

#video-share-wrap {
  display: none;
}

.related-posts.stacked-cards .news-card.related-item .content-wrapper {
  gap: 3px;
}

.wp-block-columns {
  justify-content: space-between;
}

.arrows {
  min-width: 60px;
}

/* Sticky Menu Styles */
.sticky-menu-wrapper {
  background: #E5F0F5;
  padding: 0;
  margin: 0;
  overflow-x: auto;
  white-space: nowrap;
  position: sticky;
  top: 64px;
  z-index: 1;
}

.sticky-menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0;
  min-width: max-content;
}

.sticky-menu li {
  margin: 0;
  padding: 0;
}

.sticky-menu-link {
  display: block;
  padding: 15px 20px 13px;
  color: #35383B;
  text-decoration: none;
  font-size: 16px;
  font-weight: 400;
  transition: all ease-in-out 0.3s;
  border-bottom: 3px solid transparent;
  white-space: nowrap;
}

.sticky-menu-link:hover {
  color: #1d75cc;
  background-color: #e5f0f5;
}

.sticky-menu-link.active {
  color: #1d75cc;
  background-color: #e5f0f5;
  border-bottom-color: #1d75cc;
}

/* SK Mobile edits */

@media screen and (max-width: 1175px) {
  .main-content a {
    word-break: break-word;
  }

  ul#menu-main-menu ul {
    top: 64px;
  }

  .site-header .inner {
    padding-top: 10px;
  }

  #menu-main-menu-1 {
    padding-top: 10px;
  }

  .mobile-menu-header {
    padding: 1rem 1rem 4px !important;
  }

  .header-left .logo {
    width: 95px;
    padding-top: 2px;
  }
}

@media (max-width: 950px) {
  .postcard-404 .postcard {
    transform: scale(0.9);
    transform-origin: top center;
  }
}

@media (max-width: 800px) {
  .postcard-404 .postcard {
    transform-origin: top center;
  }

  .postcard-404 .airmail {
    padding-right: 20px;
  }

  .postcard-404 .right-side {
    margin-top: 0;
    width: 50%;
    padding-left: 0;
    bottom: 30px;
    position: absolute;
    right: 30px;
  }

  .postcard .right-side p {
    text-align: center;
    font-size: 23px;
    line-height: 41px;
  }

  .postcard .left-side p {
    font-size: 1.2rem;
  }

  .postcard-404 {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .postcard-404 .postcard {
    width: 800px;
    height: auto;
    max-width: 100vw;
    aspect-ratio: 845 / 600;
  }
}

@media screen and (max-width: 400px) {
  .hero-wrap h1 {
    font-size: 35px;
  }
}

img[style*="float: left"] {
  margin-right: 20px;
}

img[style*="float: right"] {
  margin-left: 20px;
}

.hide-text ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.hide-text ul img {
  display: none;
}

.top-resource-wrap .r-arrow {
  display: none !important;
}

.sticky-menu-wrapper ul {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: center;
  max-width: 95%;
}

.wp-block-media-text {
  margin-bottom: 20px;
}