/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
  font-family: roboto, sans-serif;
  font-weight: 400;
  letter-spacing: 0.01em;
}

/*
    * Remove text-shadow in selection highlight:
    * https://twitter.com/miketaylr/status/12228805301
    *
    * Vendor-prefixed and regular ::selection selectors cannot be combined:
    * https://stackoverflow.com/a/16982510/7133471
    *
    * Customize the background color to match your design.
    */

/* Custom Scroll Bar
   ---------------------------*/

::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #fff;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #1f364a;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #1f364a;
}

.grecaptcha-badge {
  display: none !important;
}

.logo-container {
  position: relative;
}

.logo-container img {
  width: 100%;
  margin: 0 auto 30px;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
    * A better looking default horizontal rule
    */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
    * Remove the gap between audio, canvas, iframes,
    * images, videos and the bottom of their containers:
    * https://github.com/h5bp/html5-boilerplate/issues/440
    */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
    * Remove default fieldset styles.
    */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
    * Allow only vertical resizing of textareas.
    */

textarea {
  resize: vertical;
}

a {
  color: #f5f5f5;
  text-decoration: none;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

p a,
li a {
  color: #dab66f;
}

p {
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 20px;
  line-height: 1.4em;
}

p.large {
  font-size: 1.2rem;
}

input {
  border-radius: 50px;
  line-height: 40px;
  height: 40px;
  -webkit-box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
}

b,
strong {
  font-weight: 800;
}

/* ==========================================================================
      Author's custom styles
      ========================================================================== */

/*--------------------------
       Global 
   --------------------------*/

* {
  box-sizing: border-box;
}

body {
  width: 100vw;
  overflow-x: hidden;
  position: relative;
  border-top: 30px solid transparent;
}

body.home {
  border-top: none !important;
}

.attachment-full.size-full {
  height: auto !important;
}

body .slick-dots {
  bottom: -45px;
}

body .slick-dots li button:before {
  color: #eee;
  font-size: 20px;
}

body .slick-dots li.slick-active button:before {
  color: #dab66f;
}

body .flex-slider-container {
  max-height: 120vh;
  overflow: hidden;
}

.flex-slider-container {
  width: 100%;
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
}

.slick-slider img {
  border-radius: 0px;
}

/*--------------------------
       Text
   --------------------------*/

h1,
h2 {
  font-family: "adobe-caslon-pro", serif;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 15px;
  color: #1f364a;
  font-weight: 600;
}

h3, h4, h5 {
  font-family: roboto;
}

.text-white {
  color: #fff !important;
}

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

/*--------------------------
       Layout
   --------------------------*/

.full-width-section,
.section {
  width: 100%;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

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

.inner-wrapper {
  max-width: 1600px;
  margin-right: auto;
  margin-left: auto;
  display: block;
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.inner-wrapper.side-padded {
  padding-left: 20px;
  padding-right: 20px;
}

img.branded-icon {
  display: block;
  width: 210px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  position: relative;
  margin-bottom: 20px;
}

span.branded-icon.white {
  width: 200px;
  height: 200px;
  background-image: url(../img/white-brand-icon.png);
  background-size: 100% auto;
  display: block;
  background-repeat: no-repeat;
  margin: 0 auto;
  text-align: center;
  margin-bottom: 10px;
}

span.branded-icon.blank {
  opacity: 0 !important;
}

span.branded-icon.small-left {
  margin-left: 0;
  width: 100px;
  height: 40px;
}

.video-box {
  margin-bottom: 40px;
  -webkit-box-shadow: 0 0 20px 0 rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 20px 0 rgba(255, 255, 255, 0.2);
  overflow: hidden;
  border-radius: 10px;
  border: 2px solid #fff;
}

.video-box iframe,
.video-box video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

#home-video .button {
  display: block;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
}

#home-video .video-box {
  margin-top: 40px;
}

img.header-watermark {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  opacity: 0.1;
  z-index: 0;
  width: 30%;
  max-width: 300px;
}

.hero-placeholder-bg {
  background-image: url(../img/background-placeholder-2.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-2 {
  background-image: url(../img/background-place-holder-12.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-3 {
  background-image: url(../img/background-placeholder-4.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-14 {
  background-image: url(../img/background-placeholder-14.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-15 {
  background-image: url(../img/survivors-fund/background-placeholder-15.png);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-16 {
  background-image: url(../img/background-placeholder-16.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-19 {
  background-image: url(../img/background-placeholder-19.jpg);
  background-size: cover;
  background-position: center center;
}

.hero-placeholder-bg-20 {
  background-image: url(../img/background-placeholder-20.jpg);
  background-size: cover;
  background-position: center center;
}

.searchwp-live-search-results a {
  color: #121f43;
  font-weight: 600;
}

.hero-crossover {
  position: absolute;
  display: flex;
  background: #fefefe;
  border-radius: 0px;
  bottom: 0;
  min-height: 38vh;
  align-items: center;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
  -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  z-index: 100000;
}

.hero-crossover h2 {
}

.crossover-offset {
  padding-top: 40vh;
}

.crossover-content {
  float: left;
  padding: 40px;
}

.crossover-content h2 {
  font-size: 2.4rem;
  text-transform: uppercase;
  line-height: 1.2em;
}

.circle-offset {
  background: #ccc;
  border-radius: 50%;
  position: absolute;
  right: 0%;
  bottom: 0%;
  padding-top: 30%;
  width: 30%;
  z-index: 100000000;
  transform: translateX(15%) translateY(15%);
  background-image: url(../img/circle-bg.jpg);
  background-size: cover;
  background-position: center center;
  outline: 2px solid #fff;
}

.circle-offset.survivors-fund {
  background-image: url(../img/circle-b-survivors-fund.jpg);
}

.blue-bg {
  background: #121e42;
}

.gray-bg {
  background: #f5f5f5;
}

.white-bg {
  background: #fff;
}

.button.gold {
  background: #243548;
}

body .button {
  color: #fefefe;
}

/*--------------------------
     Inner Pages
   --------------------------*/

.main-container {
}

.main-container.no-hero {
  margin-top: 120px;
}

.page-hero {
  width: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 30vh;
  height: 90vh;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1;
}

.page-hero.page-hero-short {
  height: 65vh;
}

.page-hero:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
}

.page-hero-content {
  z-index: 1000000;
  position: absolute;
  left: 20px;
  bottom: 40px;
}

.page-hero-content h2 {
  color: #fff;
}

.page-hero-content p {
  color: #fff;
  font-size: 1.2rem;
}

.page-hero-content h1 {
  text-transform: uppercase;
  color: #fff;
  font-size: 3.4rem;
}

.inner-hero-search-container form {
  width: 80%;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  display: block;
  max-width: 600px;
}

.inner-hero-search-container form input {
  width: 100%;
  height: 50px;
  text-align: center;
  padding: 10px 15px;
  font-weight: 600;
}

/*--------------------------
     Home Intro
   --------------------------*/
#heroes-intro {
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  overflow: hidden;
}

#heroes-intro video {
  position: absolute;
  min-width: 100%;
  height: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  opacity: .3;
}

#heros-intro .text-box {
  text-align: center;
}

#heroes-intro .inner-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

#heroes-intro .two-fifths {
  position: relative;
}

#heroes-intro .two-fifths img.badge {
  width: 150px;
  margin-bottom: 15px;
}

#heroes-intro .text-box {
  padding: 40px;
  position: relative;
}

#heroes-intro .text-box h2 {
  font-size: 3rem;
  text-align: center;
}

#heroes-intro .three-fifths {
  position: realtive;
}

#heroes-intro .three-fifths img {
  width: 100%;
}

/*--------------------------
     Home News
   --------------------------*/

#latest-partners .slick-track {
  width: 100% !important;
}


.partner-card {
  position: relative;
  margin-right: 5px;
  margin-left: 5px;
  border-radius: 0px;
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  -webkit-box-shadow: -30px 15px 30px 0 rgb(0 0 0 / 19%);
  box-shadow: 0px 10px 30px 0 rgb(0 0 0 / 15%);
  width: 31%;
  min-width: 400px;
  margin-right: 1%;
  margin-left: 1%;
  overflow: hidden;
  text-align: center;
  padding-bottom: 20px;
  margin-bottom: 30px;
  background: #1f364a;
}

.partner-card .partner-card-photo {
  width: 100%;
  height: 290px;
  overflow: hidden;
}

.partner-card img {
  width: 100% !important;
  margin-bottom: 15px;
  height: auto !important;
}

.partner-card .partner-info {
  padding: 10px;
  padding-top: 10px;
}

.partner-info a {
  margin-left: auto;
  margin-right: auto;
}

#latest-partners .flex {
  max-width: 100%;
  width: 100%;
  padding-left: 20px;
  padding-right: 0px;
  display: flex;
}

.partner-info h4 {
  margin-bottom: 0;
  padding-bottom: 30px;
  color: #fff;
  font-size: 2rem;
  margin-top: 0;
}

.partner-info h5 {
  margin-bottom: 0;
  padding-bottom: 0;
  color: #fff;
}

/*--------------------------
       Header
   --------------------------*/

#header-wrapper {
  width: 100%;
  height: 140px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000000;
  background: rgba(36, 53, 72, 1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(0px);
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#header-wrapper .top-header {
  border-bottom: 1px solid #666;
  width: 100%;
  height: 30px;
  position: relative;
  display: flex;
  justify-content: space-between;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 20px;
  padding-right: 20px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  overflow: hidden;
}

#header-wrapper.scrolling {
  height: 110px;
  background: 0 0;
}

#header-wrapper.scrolling #header {
  background: rgba(36, 53, 72, 1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(20px);
}

#header-wrapper.scrolling .top-header {
  height: 0;
  padding-top: 0;
  padding-bottom: 0;
}

#header-wrapper .top-header a.top-social {
  font-size: 1rem;
  margin-right: 4px;
  position: relative;
  width: 18px;
  height: 18px;
  display: inline-block;
}

#header-wrapper .top-header a.top-social img {
  height: 65%;
  position: absolute;
  left: 50%;
  top: 75%;
  transform: translateX(-50%) translateY(-50%);
}

#header-wrapper .top-header span,
#header-wrapper .top-header p,
#header-wrapper .top-header a {
  color: #fff;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 0.775rem;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  letter-spacing: 0.02em;
}

#header-wrapper #header {
  height: 110px;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
  -webkit-box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.18);
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  margin-right: auto;
  margin-left: auto;
}

#header-wrapper #header #top-logo {
  background-image: url(../img/top-logo.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 100%;
  display: block;
  position: absolute;
  left: 10px;
  top: 0;
  width: 200px;
  height: 110px;
}

.page-template-home-page #header-wrapper #header #top-logo {
  height: 175px;
  width: 257px;
}

#header-wrapper.scrolling #header #top-logo {
  width: 200px;
  height: 100px;
  margin-top: 5px;
}

#header-wrapper #header-nav {
  position: absolute;
  right: 0;
  top: 0;
  height: 110px;
  padding-right: 115px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#header-wrapper #header-nav a.nav-text-link {
  display: block;
  color: #fff;
  line-height: 110px;
  padding-left: 0px;
  padding-right: 30px;
  font-weight: 600;
  text-transform: uppercase;
  float: left;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  font-size: 0.875rem;
}

#header-wrapper #header-nav a.nav-text-link:hover {
  color: #dab66f;
}

#header-wrapper #menu-icon {
  display: inline-block;
  height: 110px;
  width: 110px;
  text-align: center;
  right: 10px;
  top: 20px;
  border-left: 1px solid #dab66f;
  position: absolute;
  top: 0;
  right: 0;
  background: #dab66f;
  color: #fff;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#header-wrapper.still #menu-icon:hover {
  background: transparent;
}

#header-wrapper #menu-icon:hover {
  background: #243548;
}

#header-wrapper #menu-icon:hover {
  cursor: pointer;
}

#header-wrapper #menu-icon i {
  font-size: 3rem;
  color: #fff;
  line-height: 100px;
}

#header-wrapper #header-nav a.button {
  position: relative;
  display: inline-block;
  max-width: 220px;
  min-width: 100px;
  margin-top: 35px;
  margin-right: 20px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  font-size: 0.875rem;
}

/* Still Header */

#header-wrapper.still #header {
  background: transparent;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  -webkit-box-shadow: 0 20px 30px 0 rgb(0 0 0 / 0);
  box-shadow: 0 20px 30px 0 rgb(0 0 0 / 0);
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#header-wrapper .button.gold {
  background: #fff;
  color: #243548;
}

#header-wrapper.still {
  background: transparent;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  border-bottom: none;
}

#header-wrapper.still .top-header {
  background: transparent;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  border-bottom: none;
}

#header-wrapper.still #header-nav a.nav-text-link {
  color: #fff;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#header-wrapper.still .top-header span,
#header-wrapper.still .top-header p,
#header-wrapper.still .top-header a {
  color: #fff;
}

#header-wrapper.still #menu-icon {
  background: transparent;
  border-color: transparent;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  height: 112px;
}

#menu-icon .menu-icon-button {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url(../img/menu-icon.png);
  background-size: 50% auto;
  background-position: center center;
  background-repeat: no-repeat;
}

#header-wrapper.still #header-nav {
  padding-right: 90px;
}

#header-wrapper .top-given {
  display: block;
  position: absolute;
  left: 10px;
  top: 0;
  height: 30px;
  line-height: 30px;
  font-weight: 600;
}

.contact-box {
  position: absolute;
  right: 6px;
  top: 0px;
  height: 30px;
  padding-top: 3px;
}

/*--------------------------
       Navigation 
   --------------------------*/

#navigation-overlay {
  background: #1f364a;
  position: fixed;
  width: 100%;
  height: 100vh;
  z-index: 1000000;
  transform: translateX(100%);
  top: 0;
  right: 0;
}

#navigation-overlay.active {
  width: 30vw;
  height: 100vh;
  z-index: 1000000;
  transform: translateX(0%);
  -webkit-box-shadow: -20px 0 15px 0 rgba(0,0,0,.18);
  box-shadow: -20px 0 15px 0 rgba(0,0,0,.18);
}

#navigation-overlay #header-nav-video {
  position: relative;
  width: 100%;
}

.nav-overlay-header {
  width: 100%;
  position: relative;
  margin-bottom: 30px;
}

#navigation-overlay {
  position: fixed;
  width: 30vw;
  height: 100vh;
  -webkit-transition: all 150ms ease-out;
  -moz-transition: all 150ms ease-out;
  -ms-transition: all 150ms ease-out;
  -o-transition: all 150ms ease-out;
  transition: all 150ms ease-out;
  z-index: 1000000000;
  justify-content: space-around;
  opacity: 0;
  z-index: -1;
}

#navigation-overlay #close-menu {
  position: absolute;
  top: 10px;
  right: 20px;
  width: 40px;
  height: 40px;
  display: block;
  text-align: center;
  color: #fff;
  font-size: 2rem;
  line-height: 40px;
  z-index: 100000;
}

#navigation-overlay #close-menu:hover {
  cursor: pointer;
}

#navigation-overlay.active {
  z-index: 10000000000;
  opacity: 1;
}

#navigation-overlay .two-thirds {
  position: relative;
}

#navigation-overlay .two-thirds img {
  width: 100%;
  border-radius: 25px;
}

#navigation-overlay .nav-logo {
  width: 30%;
  margin: 0 auto 30px;
  display: block;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

#navigation-overlay .nav-link-container {
  overflow-y: auto;
  padding-right: 40px;
  padding-left: 40px;
  background: #1f364a;
  z-index: 100000;
  position: relative;
  overflow-y: auto;
}

#navigation-overlay .nav-link-container a {
  text-transform: uppercase;
  color: #fff;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#navigation-overlay .nav-link-container a:hover {
  color: #95a5a6;
}

.nav-link-container a.top-link,
.nav-link-container span.text-link {
  font-size: 2.4rem;
}

#navigation-overlay .overlay-footer {
  padding: 30px;
  padding-top: 40px;
  align-items: center;
  position: relative;
}

#navigation-overlay .overlay-footer img {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  display: block;
  text-align: center;
}

.overlay-contact {
  display: flex;
  justify-content: space-around;
  padding-top: 30px;
  align-items: flex-start;
  flex-direction: column;
}

.overlay-contact p {
  color: #fff;
  font-size: 1rem;
}

#navigation-overlay .overlay-footer .overlay-logo img {
  width: 100%;
  margin-bottom: 40px;
}

#navigation-overlay h5 {
  text-align: left;
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 1.5rem;
  padding-bottom: 10px;
  margin-bottom: 0px;
  margin-top: 40px;
}

#navigation-overlay a {
  color: #f5f5f5;
}

.overlay-social-box a {
  color: #fff;
  display: inline-block;
  margin-right: 10px;
  font-size: 2rem;
  padding-top: 30px;
}

span.dropdown {
  position: relative;
  width: 100%;
  padding-top: 0;
  padding-bottom: 0;
  display: block;
  height: 1em;
  height: 60px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

span.dropdown .text-link {
  display: inline-block;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

span.dropdown.active {
  height: auto;
}

span.dropdown .text-link:hover {
  cursor: pointer;
  color: #ccc;
}

span.dropdown .text-link:after {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background-image: url(../img/down-arrow.png);
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: -35px;
  top: 20px;
  -webkit-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -ms-transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  transition: all 100ms ease-in-out;
}

span.dropdown.active .text-link:after {
  transform: rotate(180deg);
  top: 15px;
}

span.dropdown span {
  font-size: 1.2em;
  text-transform: uppercase;
  color: #fff;
  padding-top: 0px;
  padding-bottom: 0px;
  display: block;
  font-weight: 600;
  position: relative;
  display: block;
  height: 60px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

.nav-link-container a.top-link {
  font-weight: 600;
  height: 60px;
  display: block;
}

ul.nav-drop {
  margin: 0;
  padding: 0;
  overflow: hidden;
  padding-top: 0;
  padding-bottom: 0;
  height: auto;
  max-height: 0;
  list-style-type: none;
}

.dropdown.active ul.nav-drop {
  max-height: 1000px;
  padding-top: 0;
  padding-bottom: 10px;
}

.dropdown ul.nav-drop li a {
  font-size: 1.2rem;
  font-weight: 600;
  display: block;
  padding-bottom: 5px;
}

.sidebar-quote {
  position: absolute;
  bottom: 10px;
  font-weight: 300;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  color: #fff;
  font-style: italic;
  text-align: center;
}

/*--------------------------
       Home Page
   --------------------------*/

#hero {
  width: 100%;
  height: 95vh;
  position: relative;
  overflow: hidden;
}

#hero .hero-content {
  position: absolute;
  top: 50%;
  left: 20%;
  width: 660px;
  text-align: left;
  z-index: 100000;
}

#hero .hero-overlay {
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#hero #bgvid {
  width: auto;
  margin: 0 auto;
  min-height: 100vh;
  display: block;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: auto !important;
  height: 100vh;
  z-index: 10;
}

#hero-content {
  position: absolute;
  bottom: 15%;
  z-index: 2;
  width: 100%;
  max-width: 66%;
  z-index: 10000;
  left: 5%;
  text-align: left;
}

@media screen and (min-width: 1500px) {
  #hero #bgvid {
    width: 100% !important;
    margin: 0 auto;
    min-height: 0vh;
    display: block;
    text-align: center;
    position: relative;
    left: 0%;
    top: 0%;
    transform: translateX(0%) translateY(0%);
    height: auto;
    z-index: 10;
    margin-top: -100px;
  }
}

#hero-content h3,
#hero-content h2,
#hero-content p {
  color: #fff;
}

#hero-content h2 {
  font-size: 5rem;
  margin-top: 0;
  margin-bottom: 10px;
  padding-bottom: 0;
  line-height: 1.2em;
  max-width: 80%;
}

#hero-content h3 {
  font-weight: 300;
  margin-top: 0;
  text-transform: uppercase;
}

#hero-content p {
  font-size: 1.2rem;
  margin-bottom: 15px;
}

#hero .bottom-fade {
  z-index: 100;
  bottom: 0;
  height: 50vh;
  width: 100%;
  display: block;
  position: absolute;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.65) 100%
  ); /* FF3.6-15 */
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.65) 100%
  ); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.65) 100%
  ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
}

/*---------------------------
    Recent Hero Callout
   ---------------------------*/

#hero-photo {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  padding-top: 45%;
  position: relative;
}

#hero-photo img {
  width: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  border: 3px solid #c3b59b;
}

#fallen-hero-callout {
  background: #1f364a;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding-top: 20px;
  padding-bottom: 20px;
}

#fallen-hero-callout .one-fourth {
  position: relative;
  padding-left: 10px;
  padding-right: 10px;
}

#fallen-hero-callout h2 {
  color: #fff;
}

#fallen-hero-callout h3 {
  color: #fff;
  font-size: 1rem;
  padding-top: 10px;
  text-align: left;
}

#fallen-hero-callout .lead {
  color: #fff;
}

#fallen-hero-callout .one-fourth img {
  width: 30%;
  margin: 0 auto;
  text-align: center;
  margin-bottom: 10px;
}

#fallen-hero-callout .step-block {
  text-align: center;
}

#fallen-hero-callout .step-block h4 {
  padding-left: 10px;
  padding-right: 10px;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
}

#fallen-hero-callout img.water-mark {
  position: absolute;
  opacity: 0.03;
  left: 50%;
  top: 0;
  transform: translateX(-50%) translateY(0%);
  width: 100%;
}

#recent-hero {
  width: 100%;
  background: #f5f5f5;
}

#hero-highlight {
  flex-direction: column;
}

.hero-info {
  height: 75%;
  padding: 60px;
  justify-content: center;
  display: flex;
  position: relative;
  flex-direction: column;
}

.hero-info img.blue-watermark {
  width: 40%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.hero-info p {
  font-size: 1rem;
  margin-top: 20px;
  margin-top: 10px;
  width: 90%;
  margin-bottom: 15px;
}

.hero-info h2 {
  font-size: 3.4rem;
  text-transform: uppercase;
  color: #1f364a;
  padding-bottom: 5px;
}

.hero-info h3 {
  color: #777;
  padding-bottom: 15px;
  font-weight: 600;
  font-size: 1rem;
}

.hero-search {
  background: #1f364a;
  height: 25%;
  padding: 15px;
  padding-left: 30px;
  padding-right: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
}

.hero-search form {
  position: relative;
}

.hero-search .hero-search-bar {
  width: 100%;
  height: 50px;
  border: 2px solid #ccc;
  padding-left: 20px;
  margin-right: 10px;
}

.hero-search h3 {
  font-size: 1.4rem;
  color: #fff;
  margin: 0;
  padding-bottom: 0;
  text-transform: uppercase;
  width: 35%;
}

.hero-search .icon-search {
  position: absolute;
  right: 0;
  top: 0;
  height: 40px;
  font-size: 2rem;
  right: 15px;
  top: 5px;
}

.hero-search .icon-search:hover {
  cursor: pointer;
}

.hero-search form {
  width: 90%;
}

.page-template-fallen-heros .searchwp-live-search-results-showing {
  top: 55vh !important;
}

/*---------------------------
    Our Impact
   ---------------------------*/

#our-impact {
  text-align: center;
  background: #f5f5f5;
}

#counter-box {
  width: 100%;
  padding-left: 40px;
  padding-right: 40px;
  margin-top: 60px;
  margin-bottom: 60px;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

#counter-box h2 {
  font-size: 5rem;
  color: #1f364a;
}

#counter-box p {
  color: #1f364a;
  font-weight: 600;
}

#conter-box .dollar-sign::before {
  content: "$";
}

/* -------------------------
     Home News
   ---------------------------*/

.news-card-wrapper {
  padding-top: 30px;
  padding-bottom: 0px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  align-items: stretch;
  flex-wrap: wrap;
  max-width: 90%;
  margin-right: auto;
  margin-left: auto;
}

.cat-tag {
  width: 40%;
  margin-right: auto;
  margin-left: auto;
  font-size: 0.875rem;
  display: block;
  color: #fff;
  background: #29442b;
  text-align: center;
  border-radius: 50px;
  text-transform: uppercase;
  line-height: 1.8em;
  font-weight: 800;
  padding-top: 4px;
  padding-bottom: 4px;
  margin-bottom: 15px;
}

/*--------------------------
     Membership Callout
   --------------------------*/

#member-callout-ribbon {
  width: 100%;
  position: relative;
  margin: 0 auto 30px;
  background: #1f364a;
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 30px;
  padding-bottom: 30px;
  -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
  margin-bottom: 0;
}

#member-callout-ribbon h2 {
  color: #fff;
  text-transform: uppercase;
  font-size: 1.8rem;
  text-align: center;
  padding-bottom: 20px;
  padding-top: 30px;
  line-height: 1em;
}

#member-callout-ribbon .inner-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

#member-callout-ribbon img {
  max-width: 265px;
  position: absolute;
  left: 20px;
  z-index: 100000;
}

#member-callout-ribbon .button {
  position: absolute;
  right: 20px;
  margin-right: 0;
}

/*--------------------------
     Get Involved
   --------------------------*/

#get-involved-box {
  padding-bottom: 0;
  padding-top: 0;
  margin-bottom: -60px;
  background: #243548;
}

#get-involved-links {
  width: 80%;
  border-radius: 0px;
  background: #f5f5f5;
  transform: translateY(-50%);
  overflow: hidden;
  -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.18);
}

.get-involved-header-box {
  width: 100%;
  height: 40vh;
  background-size: cover;
  background-position: top center;
}

#get-involved-links {
  display: flex;
}

.get-involved-content {
  padding: 60px;
}

#get-involved-links .get-involved-content a {
  color: #f5f5f5;
}
#get-involved-links .get-involved-content a:hover {
  color: #1f364a;
}
.get-involved-content h2 {

  font-size: 3.4rem;
  padding-bottom: 0px;
}

.get-involved-content {

}

#get-involved-box .callout-nav {
  border-left: 1px solid #243548;
  padding-left: 45px;
  margin-top: 50px;
}

#get-involved-box .callout-nav {
  margin-top: 60px;
  margin-bottom: 30px;
}

#get-involved-box .callout-nav a {
  display: block;
  color: #1f364a;
  font-weight: 500;
  padding-bottom: 5px;
}

#get-involved-box .callout-nav a:hover {
}

.social-box-container {
  width: 100%;
  display: flex;
  align-items: flex-start;
  margin-top: 20px;
}

.social-box-container a {
  width: 25px;
  height: 25px;
  margin-right: 10px;
  position: relative;
}

.social-box-container a img {
  width: 100%;
}

/*--------------------------
       Hero Wall
   --------------------------*/

#hero-wall {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}

#wall-filter {
  justify-content: center;
  align-items: center;
  text-align: center;
  padding-top: 40px;
  margin-bottom: 30px;
}

#wall-filter .button {
  min-width: 220px;
}

#wall-filter .button.active {
  cursor: pointer;
  background: #243548;
  color: #fff;
}

#hero-wall-conatainer {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 60px;
}

.page-template-fallen-heros #our-mission-bar {
  padding-bottom: 20px;
}

#wall-filter a {
  display: block;
}

.hero-block {
  width: 23%;
  background: #f5f5f5;
  padding: 20px 15px;
  margin-right: 1%;
  margin-left: 1%;
  background-size: auto 100%;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 0px;
  margin-bottom: 2%;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  display: none;
}

.hero-block.active {
  display: block;
}

.hero-block:hover {
  cursor: pointer;
  -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
}

.hero-block h3 {
  color: #243548;
  padding-bottom: 0;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  font-size: 1.3rem;
  margin-bottom: 10px;
}

.hero-block h4 {
  margin-top: 5px;
}

.hero-block h3 a {
  color: #1f364a;
  font-size: 1.2rem;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

.hero-block .date {
  font-size: 0.875rem;
  color: #333;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

.hero-block:hover h3,
.hero-block:hover a,
.hero-block:hover .date {
  color: #fff;
}

.hero-block.police-force {
  background-image: url(../img/police-force-icon.png);
}

.hero-block.firefighter {
  background-image: url(../img/firefighter-icon.png);
}

.hero-block.animal {
  background-image: url(../img/animal-icon.png);
}

.hero-block.police-force:hover {
  background-color: #1f364a;
  background-image: url(../img/police-force-icon.png);
}

.hero-block.firefighter:hover {
  background-color: #1f364a;
  background-image: url(../img/firefighter-icon.png);
}

.hero-block.animal:hover {
  background-color: #1f364a;
  background-image: url(../img/animal-icon.png);
}

.inner-hero-search-container form {
  position: relative;
}

.inner-hero-search-container .icon-search {
  position: absolute;
  right: 20px;
  top: 16px;
}

/*--------------------------
     Hero Page
   --------------------------*/

.hero-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  margin-top: 80px;
  padding-top: 140px;
  padding-bottom: 60px;
  
}

.hero-wrapper .hero-bio {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 40px;
  padding-top: 0;
}

.hero-wrapper .hero-bio h3 {
  padding-bottom: 5px;
  font-size: 0.875rem;
  text-transform: uppercase;
}

.hero-wrapper .hero-bio h1 {
  font-size: 3.1rem;
  padding-bottom: 0;
  line-height: 1em;
  margin-bottom: 0;
  color: #1f364a;
}

.hero-wrapper .hero-bio h4 {
  font-weight: 800;
  margin-bottom: 20px;
  border-bottom: 3px solid #243548;
  padding-bottom: 15px;
  margin-top: 5px;
}

.hero-wrapper .hero-bio h5 {
  margin-top: 0;
  margin-bottom: 20px;
}

.hero-wrapper .hero-bio p {
  margin-bottom: 0px;
  padding-bottom: 30px;
}

.hero-wrapper img {
  max-width: 600px;
  -webkit-box-shadow: 10px 10px 40px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 10px 10px 40px 0 rgba(0, 0, 0, 0.18);
}

.hero-photo {
  padding-right: 40px;
}

.hero-photo img {
  max-width: 500px !important;
}

.single-heros #site-content {
  background-size: cover;
  background-position: top left;
}

.single-heros #flag-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: .3;
}

/*--------------------------
     Life Protecting Equipment
   --------------------------*/

.video-box {
  position: relative;
  padding: 0;
  margin: 0 auto 60px;
  padding-top: 44.25%;
  -webkit-box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
  border: 2px solid #1f364a;
}

.video-box iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
}

/*--------------------------
     Leadership & Staff
   --------------------------*/

.staff-wrapper {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-top: 40px;
  padding-bottom: 40px;
}

body .staff-block {
  width: 31%;
  margin-right: 1%;
  margin-left: 1%;
  background: #13204a;
  border-radius: 0px;
  padding: 20px;
  -webkit-box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 18%);
  position: relative;
  margin-bottom: 2%;
}

body .staff-block img {
  width: 100%;
}

.position-list {
  display: flex;
  padding-top: 60px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.position-list .one-fifth {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  display: block;
  border-radius: 0px;
  width: 18%;
  margin-left: 1%;
  margin-right: 1%;
  margin-bottom: 2%;
  background: #13204a;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.18);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  position: relative;
  z-index: 100;
}

.position-list .one-fifth img {
  border: 1px solid #fff;
}

.position-list .one-fifth h4 {
  margin-top: 10px;
}

.position-list .one-fifth h3 {
  font-size: 1.1rem;
  padding-bottom: 5px;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 10px;
  padding-bottom: 0;
}

.position-list .one-fifth .position {
  color: #fff;
  font-style: italic;
  font-weight: 300;
  font-size: 0.875rem;
}

.position-list .position-block h4 {
  margin-top: 10px;

}

.staff-block img {
  margin-bottom: 20px;
  border: 2px solid #fff;
}

.staff-block h3 {
  font-size: 1.8rem;
  color: #fff;
  padding-bottom: 4px;
  margin-bottom: 5px;
}

.staff-block h4.title {
  font-size: 0.875rem;
  font-style: italic;
  margin-top: 10px;
}

.staff-block .title {
  color: #fff;
  font-weight: 300;
}

/*--------------------------
       What We Do
   --------------------------*/

#our-process-blocks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 20px;
  padding-top: 60px;
}

body .process-card {
  width: 100%;
  margin-bottom: 20px;
  text-align: left;
  display: flex;
  align-items: flex-start;
  background: #ccc;
  border-radius: 0px;
  margin-bottom: 2%;
  padding: 20px;
  background: #1f364a;
  -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1f364a+0,192660+100 */
  background: #1f364a; /* Old browsers */
  outline: 2px solid #dab66f;
  outline-offset: -10px;
  display: flex;
  min-height: 35vh;
}

body .process-card .icon-circle {
  width: 30%;
  height: 35vh;
  position: relative;
  background-image: url(../img/background-place-holder-1.jpg);
  background-size: cover;
}

body .process-card .icon-circle h5 {
  font-size: 81px;
  color: transparent;
  display: block;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #fff;
  position: absolute;
  left: 10px;
  bottom: 20px;
  margin: 0;
  width: auto;
}

body .process-card .icon-circle img {
  width: 70%;
  margin: 0 auto;
  display: block;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

body .process-card .step-card-info {
  width: 80%;
  padding-top: 30px;
  padding-left: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

body .process-card h4 {
  color: #fff;
  text-transform: uppercase;
  font-size: 1.8rem;
}

body .process-card.speaker h4 {
  color: #fff;
  text-transform: uppercase;
  font-size: 1.8rem;
  margin-top: 0;
}

body .process-card.speaker h3 {
  font-size: 3rem;
  color: #fff;
  margin-bottom: 10px;
  margin-top: 0;
}

body .process-card p {
  color: #fff;
}

#support-we-offer {
  position: relative;
}

#support-we-offer .support-card {
  border-radius: 0px;
  background: #1f364a;
  margin: 0 auto 30px;
  padding: 40px;
  display: flex;
  position: relative;
  max-width: 950px;
  -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
}

#support-we-offer .support-card .support-image {
  padding-top: 25%;
  background: #fff;
  border-radius: 50%;
  background-size: cover;
  background-position: center center;
}

#support-we-offer .support-card h3 {
  font-size: 2rem;
  color: #fff;
  text-transform: uppercase;
}

#support-we-offer .support-card p {
  color: #fff;
  font-weight: 300;
}

.support-card .three-fourths {
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 40px;
}

#areas-we-cover {
  position: relative;
}

#areas-we-cover .inner-wrapper {
  padding-top: 60px;
}

#areas-we-cover .map {
  position: relative;
}

#areas-we-cover .map img {
  width: 100%;
}

#areas-we-cover .inner-wrapper {
  max-width: 1200px;
}

#areas-we-cover .small-text {
  font-size: 0.875rem;
  color: #ccc;
  text-align: center;
  display: block;
}

ul.areas {
  display: flex;
  list-style-type: none;
  margin-left: 0;
  flex-wrap: wrap;
}

ul.areas li {
  width: 48%;
  padding-left: 2%;
  font-weight: 600;
  margin-bottom: 4px;
}

ul.areas.single-column li {
  width: 100% !important;
}

#map-coverage {
  position: relative;
  overflow: hidden;
  padding-top: 50%;
  outline: 1px solid #ccc;
  background-image:url(../img/coverage-map.png);
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
}



#map-coverage img.extended {
  width: 400%;
  height: 400%;
  position: absolute;
  top: -132%;
  right: -12%;
  opacity: 1;
}

#map-coverage img.state {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
}

#map-filter {
  padding-left: 30px;
  padding-right: 30px;
  justify-content: center;
  margin-bottom: 0px;
}

#map-filter .button {
  max-width: 210px;
  min-width: 0;
  width: 100%;
  font-size: 0.775rem;
}

#map-filter .button.active {
  background: #bb935a;
  color: #fff;
}

#map-selector {
  padding-bottom: 60px;
}

#map-selector .membership-level {
  margin-right: 1%;
  margin-left: 1%;
  width: 31%;
  text-align: center;
  padding: 30px;
  padding-bottom: 120px;
}

.area-items {
  width: 50%;
  padding-left: 40px;
  height: 100%;
  position: relative;
}

.area-items .coverage-area {
  -webkit-transition: all 350ms ease-in-out;
  -moz-transition: all 350ms ease-in-out;
  -ms-transition: all 350ms ease-in-out;
  -o-transition: all 350ms ease-in-out;
  transition: all 350ms ease-in-out;
  top: 40px;
  opacity: 0;
  height: auto;
  max-height: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
}

.area-items .coverage-area.active {
  top: 0;
  opacity: 100;
  max-height: 10000px;
}

.coverage-area h2 {
  text-transform: uppercase;
  font-size: 2rem;
}

.coverage-area hr.clear-pretty {
  border: none;
  background: #1f364a;
  margin-top: 10px;
  margin-bottom: 20px;
}

/*--------------------------
    Membership Page
--------------------------*/

.membership-wrap {
  padding-top: 0px;
  padding-bottom: 0px;
  display: flex;
  justify-content: center;
  opacity: 0;
  transform: translateY(0);
  max-height: 0;
  overflow: hidden;
  -webkit-transition: all 50ms ease-in-out;
  -moz-transition: all 50ms ease-in-out;
  -ms-transition: all 50ms ease-in-out;
  -o-transition: all 50ms ease-in-out;
  transition: all 50ms ease-in-out;
  flex-wrap: wrap;
}

.membership-wrap.active {
  opacity: 1;
  transform: translateY(0);
  max-height: 1000000px;
  padding-top: 20px;
  padding-bottom: 60px;
}

#membership-filter {
  padding-left: 30px;
  padding-right: 30px;
  justify-content: center;
  margin-bottom: 60px;
}

#membership-filter .button {
  max-width: 210px;
  min-width: 0;
  width: 100%;
  font-size: 0.775rem;
}

#membership-filter .button.active {
  background: #bb935a;
  color: #fff;
}

.membership-level {
  border-radius: 0px;
  background: #fff;
  border: 1px solid #eee;
  -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  position: relative;
  -webkit-transition: all 50ms ease-in-out;
  -moz-transition: all 50ms ease-in-out;
  -ms-transition: all 50ms ease-in-out;
  -o-transition: all 50ms ease-in-out;
  transition: all 50ms ease-in-out;
  margin-bottom: 20px;
}

.membership-wrap hr.clear {
  width: 100%;
  clear: both;
  border: none;
}

.membership-level img {
  width: 95%;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  display: block;
  padding: 30px;
}

#membership-selector {
  padding-bottom: 60px;
}

#membership-selector .membership-level {
  margin-right: 1%;
  margin-left: 1%;
  width: 31%;
  text-align: center;
  padding: 30px;
  padding-bottom: 80px;
}

.membership-level .button {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
}

.membership-content h2 {
  border-bottom: 1px solid #ccc;
  margin-bottom: 21px;
  padding-bottom: 10px;
  font-size: 1.8rem;
  line-height: 1.1em;
  padding-bottom: 10px;
}

.membership-content h3 {
  font-size: 1rem;
  font-weight: 600;
}

.membership-content ul.benefits {
  list-style-type: none;
  padding-left: 0;
}

.membership-content ul.benefits li {
  text-align: center;
  padding-bottom: 4px;
}

.giving-popup {
  width: 100vw;
  height: 100vh;
  position: fixed;
  transform: translateY(-110%);
  z-index: 100000000;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  top:0;
  left: 0;
  background: #fff;
}

.giving-popup .close {
  position: absolute;
  top: 10px;
  right: 30px;
  width: 20px;
  height: 20px;
  color: #fff;
  font-size: 2rem;
}


.giving-popup .close:hover {
  cursor: pointer;
}

.giving-popup iframe {
  width: 100% !important;
  height: 100% !important;
}

.giving-popup.active {
   transform: translateY(0%);
}

/* ----------------------
     Give Page
   -----------------------*/

#give-page .inner-wrapper {
  max-width: 1200px;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
}

#give-header {
  padding-top: 210px;
}

#give-page .inner-wrapper .give-info {
  padding-right: 40px;
}

#give-page .inner-wrapper .give-info img {
  display: block;
  margin: 15px auto;
  text-align: center;
}

img.give-example {
  margin: 0 auto;
  display: block;
  margin-bottom: 30px;
}

.page-template-give-page .sub-header-wrap {
  padding-bottom: 0;
}

.sub-header-wrap p {
  max-width: 800px;
}

/*--------------------------
     History Step
   ---------------------------*/

#our-history {
  padding-bottom: 10px;
}

.history-step {
  width: 100%;
  margin: 0 auto 30px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: relative;
  max-height: 60vh;
  overflow: hidden;
  border-bottom: 1px solid #eee;
  max-width: 1200px;
}

.history-step .history-point .content-card {
  display: flex;
  padding: 50px;
  flex-direction: column;
  justify-content: center;
  background: #13204a;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
}

.history-step.reverse {
  flex-direction: row-reverse;
}

.history-step .img-block {
  position: relative;
  padding: 60px;
  height: 100%;
}

.history-step .img-block img {
  width: 750px;
  height: 750px;
  border: 2px solid rgba(29, 32, 74, 0.85);
  overflow: hidden;
  -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.18);
}

.reverse.history-step svg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}

.history-step svg {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
}

.history-step .content-card h2,
.history-step .content-card h3,
.history-step .content-card p {
  color: #fff;
}

.history-step .content-card h3 {
  font-size: 1rem;
  border-bottom: 1px solid #fff;
  padding-bottom: 7px;
  margin-bottom: 10px;
  font-weight: 300;
}

.history-step .content-card h2 {
  font-size: 2.1rem;
  text-transform: uppercase;
  line-height: 1em;
  margin-top: 20px;
  margin-bottom: 10px;
}

.image-slider {
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}

.image-slider img {
  width: 100%;
}

#club-today {
  overflow: hidden;
  margin-bottom: 0px;
  max-height: 200vh;
  overflow: hidden;
  padding-bottom: 60px;
}

/*--------------------------
       Heros Banquet
   --------------------------*/

.nomination-forms {
  display: flex;
  justify-content: space-around;
  margin-bottom: 40px;
}

.nomination-forms .one-third {
  padding-left: 30px;
  padding-right: 30px;
}

.nomination-forms .one-third img {
  width: 50%;
  margin: 0 auto 15px;
  display: block;
  text-align: center;
}

.nomination-forms .one-third.center-box {
  border-left: 2px solid #ccc;
  border-right: 2px solid #ccc;
}

ul.nomination-list li {
  line-height: 1.5em;
  text-align: left;
}

ul.nomination-list li a {
  color: #1f364a;
  font-weight: 600;
}

.nominations-form {
  border-radius: 0px;
  background: #1f364a;
  margin: 0 auto 30px;
  padding: 40px;
  -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.18);
}

.nominations-form h2 {
  color: #fff;
}

.nominations-form p {
  color: #fff;
}

.nomination-box {
  padding-left: 30px;
  padding-right: 30px;
  text-align: center;
}

.nomination-box.center {
  border-left: 2px solid #ccc;
  border-right: 2px solid #ccc;
}

.nomination-box img {
  position: relative;
  margin: 10px auto;
  display: block;
  width: 100%;
}

.nomination-box h2 {
  text-transform: uppercase;
  text-align: center;
}

.rules-for-nominations ul li {
  padding-top: 4px;
  padding-bottom: 4px;
}

#gallery-image-holder {
  display: none !important;
}

.winners-slick-slider button {
  background: transparent;
}

.winners-slick-slider .slick-prev {
  left: 20px;
  z-index: 1;
}

.winners-slick-slider .slick-next {
  right: 20px;
}

/*--------------------------
       Fiscal Information
   --------------------------*/

body .financial-documents {
  width: 31%;
  margin-right: 1%;
  margin-left: 1%;
  background: #13204a;
  padding: 20px;
  text-align: center;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
}

body .financial-documents h2 {
  color: #fff;
}

.financial-documents-title {
  margin-bottom: 30px;
  color: #fff;
}

/*--------------------------
     Survivors Fund
   ---------------------------*/

.points-block {
  margin-top: 60px;
}

.points-block .row {
  display: flex;
  padding: 50px;
  background: #13204a;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  padding: 50px;
  background: #13204a;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  margin-bottom: 30px;
}

.points-block .flex .points-content {
  display: flex;
  padding: 50px;
  flex-direction: column;
  justify-content: center;
  background: #13204a;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
}

.points-block .row h2 {
  color: #fff;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

.points-block .row p {
  color: #fff;
}

.points-block .flex img {
  border-radius: 50%;
  overflow: hidden;
}

.points-block .point-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 40px;
}

.points-block .point-content h2 {
  font-size: 2.4rem;
  text-transform: uppercase;
}

/*--------------------------
       Instagram Feed
   --------------------------*/

#instagram-feed {
  padding-top: 40px;
  padding-bottom: 0;
  overflow: hidden;
  background-size: 100% auto;
}

.eui-widget-title,
.eapps-instagram-feed-posts-grid-load-more {
  display: none !important;
}

#instagram-feed.padded {
  padding-top: 40px;
}

#instagram-feed h2.section-title {
  font-size: 2rem;
}

.instagram-container {
  margin-top: 10px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.instagram-container .instagram-item {
  width: 25%;
  padding-top: 25%;
  background-size: cover;
  position: relative;
  background-size: cover;
  background-position: center center;
}

.instagram-container .instagram-item img {
  -webkit-transition: all 150ms ease-in-out;
  -moz-transition: all 150ms ease-in-out;
  -ms-transition: all 150ms ease-in-out;
  -o-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20%;
  opacity: 0;
  transform: translateX(-50%) translateY(-30%);
}

.instagram-container .instagram-item:hover img {
  opacity: 1;
  transform: translateX(-50%) translateY(-50%);
}

/*--------------------------
     FAQs
   ---------------------------*/

.faq-question {
  border-radius: 0px;
  padding: 40px;
  padding-top: 30px;
  padding-bottom: 30px;
  background: #243548;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  margin-bottom: 20px;
  position: relative;
}

.faq-question:hover {
  cursor: pointer;
}

#faq-container {
  padding-bottom: 60px;
}

.faq-question h2 {
  color: #fff;
  font-size: 1.4rem;
  padding-right: 80px;
}

.faq-answer {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  height: auto;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

.faq-answer p,
.faq-answer li,
.faq-answer span,
.faq-answer h2,
.faq-answer h3 {
  color: #fff;
}

.faq-question span.faq-expand {
  width: 30px;
  height: 30px;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -o-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  position: absolute;
  background-image: url(../img/down-arrow.png);
  background-size: 100% auto;
  display: block;
  top: 40px;
  right: 30px;
}

.faq-question span.faq-expand:hover {
  cursor: pointer;
}

.faq-question.active .faq-answer {
  padding-top: 20px;
  padding-bottom: 20px;
  max-height: 10000px;
  -moz-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

.faq-question.active .faq-expand {
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.faq-footer {
  color: #666;
  font-size: 1.4rem;
  max-width: 800px;
}

hr.clear-pretty.faq-clear {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

hr.clear-pretty.centered {
  display: block;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
}

/*--------------------------
     Article Page
   --------------------------*/

.post-template-default {
  padding-top: 120px;
}

.post-template-default .entry-header {
  text-align: center;

  margin-bottom: 20px;
}

.post-template-default .entry-header {
  margin-bottom: 60px;
}

.post-template-default .entry-header img {
  -webkit-box-shadow: 10px 10px 40px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 10px 10px 40px 0 rgba(0, 0, 0, 0.18);
}

.post-template-default .entry-title {
  text-align: left;
  font-size: 3rem;
}

.post-template-default time {
  border-bottom: 1px solid #ccc;
  display: block;
  margin-bottom: 30px;
}

.entry-content {
  background: #f5f5f5;
  border-radius: 0px;
  margin-bottom: 60px;
  padding: 40px;
}

/*--------------------------
       Contact Us
   --------------------------*/

#inquiry-form {
  background: #13204a;
  border-radius0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  padding: 50px;
  border-radius: 0px;
  -webkit-box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.18);
  margin-bottom: 30px;
  max-width: 600px;
  margin-right: auto;
  margin-left: auto;
}

#inquiry-form input,
#inquiry-form textarea {
  display: block;
  width: 100%;
  outline: none;
  border: 1px solid #ccc;
  margin: 0 auto 15px;
  border-radius: 0px;
  -webkit-box-shadow: 0 4px 8px 0 rgb(0 0 0 / 0);
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 0);
  padding-left: 1em;
}

#inquiry-form label {
  color: #fff;
}
#contact-info .two-thirds {
  padding-left: 40px;
}

#contact-info {
  margin-bottom: 60px;
}

#contact-info h3,
#contact-info a {
  color: #fff;
}

#inquiry-form h3 {
  color: #fff;
  margin-bottom: 20px;
}

#inquiry-form textarea {
  height: 100px;
}

#inquiry-form input,
#inquiry-form textarea {
  padding-left: 5px;
  background: #fff;
}

#form-submit:hover {
  background: #abb8c3;
  cursor: pointer;
}

#fileToUpload {
  height: 55px;
  padding-top: 4px;
  padding-bottom: 4px;
}

/*--------------------------
       Newsroom
   --------------------------*/

.newsroom-template-default {
  padding-top: 140px;
}

.entry-content {
  background: #fff;
}

.newsroom-template-default .entry-title {
  font-size: 2.4rem;
  text-align: center;
}

.newsroom-template-default .date-time {
  text-align: center;
  font-size: 1rem;
  display: block;
  font-weight: 600;
  margin-bottom: 10px;
}

.newsroom-template-default .entry-title {
  margin-bottom: 20px;
  padding-bottom: 0px;
  font-size: 3rem;
  border-bottom: 2px solid #ccc;
}

.newsroom-template-default .entry-content {
  max-width: 880px;
  background: #f5f5f5;
  margin-top: 30px;
}

.newsroom-template-default img {
  max-width: 880px;
}

/*--------------------------
     404 People
   ---------------------------*/

.error-404-container {
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.error-404-container h2 {
  font-size: 6rem;
}
/*--------------------------
       Default Pages
   ---------------------------*/

.page-template-default {
  padding-top: 140px;
}

.page-template-default .entry-title {
  text-align: center;
}

/*--------------------------
       Popup
   --------------------------*/

.pop-up {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(250%);
  max-width: 1400px;
  z-index: 100000000;
  -webkit-transition: all 150ms ease-in-out;
  -moz-transition: all 150ms ease-in-out;
  -ms-transition: all 150ms ease-in-out;
  -o-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
  -webkit-box-shadow: 0 0 40px 80px rgba(0, 0, 0, 0.18);
  box-shadow: 0 0 40px 80px rgba(0, 0, 0, 0.18);
}

.pop-up.active {
  transform: translateX(-50%) translateY(-50%);
}

.pop-up img {
  width: 100%;
  position: relative;
}

.pop-up .close {
  position: absolute;
  top: 10px;
  right: 20px;
  width: 40px;
  height: 40px;
  display: block;
  text-align: center;
  color: #fff;
  font-size: 2rem;
  line-height: 40px;
  z-index: 100000;
}

.pop-up .close:hover {
  cursor: pointer;
}

/*=========================
      Ticker
===========================*/

 :root {
    --bg: #ffffff;
    --card: #f5f6f8;
    --card-border: #e6e8ec;
    --gap: 2.5rem;
    --speed: 30s;
  }

  .sponsor-tricker-list-wrapper {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: var(--gap);

  }

  .ticker-row {
    display: flex;
    overflow: hidden;
  }

  /* Track holds exactly TWO copies of the logo set side by side.
     Translating by -50% moves it by exactly one copy, so copy #2
     lands where copy #1 was — a seamless, gapless loop. */
  .ticker-track {
    display: flex;
    gap: var(--gap);
    padding-right: var(--gap); /* keep spacing consistent across the seam */
    flex-shrink: 0;
    align-items: center;
    min-width: 100%;
  }

  .ticker-row--ltr .ticker-track { animation: scroll-left var(--speed) linear infinite; }
  .ticker-row--rtl .ticker-track { animation: scroll-right var(--speed) linear infinite; }


  .sponsor-item {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--card);
    border: 1px solid var(--card-border);
    border-radius: 0px;
    padding: 1.75rem 2.5rem;
    height: 300px;
    min-width: 500px;
    transition: transform .3s ease, box-shadow .3s ease;
    background-size: cover;
    background-position: center center;
    border-radius: 4px;
  }



  .sponsor-item img {
    max-height: 64px;
    max-width: 130px;
    width: auto;
    height: auto;
    object-fit: contain;
  }

  @keyframes scroll-left {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }
  @keyframes scroll-right {
    from { transform: translateX(-50%); }
    to   { transform: translateX(0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .ticker-track { animation: none !important; }
    .ticker-row { overflow-x: auto; }
  }

/*========================
    Timeline
=========================*/

/* Timeline Container */
.timeline {
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  padding: 1rem 0;
  padding-top: 60px;
  margin-top: 60px;
}


/* Central Vertical Spine Line */
.timeline::after {
  content: '';
  position: absolute;
  width: 3px;
  background-color: #ccc;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

/* Individual Timeline Block */
.timeline-item {
  padding: 10px 40px;
  position: relative;
  width: 50%;
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Scroll Animation Target */
.timeline-item.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* Left and Right Alternating Layout */
.timeline-item.left {
  left: 0;
}

.timeline-item.right {
  left: 50%;
}

/* Nodes / Dots on the spine */
.timeline-dot {
  position: absolute;
  width: 20px;
  height: 20px;
  right: -10px;
  background-color: #dab66f;
  border: 4px solid #dab66f;;
  top: 25px;
  border-radius: 50%;
  z-index: 2;
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.timeline-item.right .timeline-dot {
  left: -10px;
}

.timeline-item:hover .timeline-dot {
  transform: scale(1.3);
  background-color: #dab66f;
}

/* Content Card */
.timeline-card {
  background: #243548;
  border-radius: 0px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  border: 1px solid #e2e8f0;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.timeline-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
}

/* Card Image Header */
.timeline .card-img-wrapper {
  position: relative;
  width: 100%;
  height: 40vh;
  overflow: hidden;
  cursor: pointer;
}

.timeline .card-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
  object-position: top center;
}

.timeline .card-img-wrapper:hover img {
  transform: scale(1.06);
}

.timeline .card-date {
  position: absolute;
  top: 12px;
  right: 12px;
  background:#dab66f;
  backdrop-filter: blur(4px);
  color: #ffffff;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 600;
}

/* Card Text Body */
.timeline .card-body {
  padding: 1.5rem;
}

.timeline .card-title {
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
  color: #fff;
  font-family: roboto;
}

.timeline .card-desc {
  color: #fff;
  font-size: 0.925rem;
  margin-bottom: 1rem;
}

.timeline .card-tags {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.timeline .tag {
  font-size: 0.75rem;
  font-weight: 600;
  background: #dbeafe;
  color: #2563eb;
  padding: 3px 10px;
  border-radius: 6px;
}

/* =======================================
   RESPONSIVE BREAKPOINTS (Mobile View)
   ======================================= */
@media screen and (max-width: 768px) {
  /* Move spine to left edge */
  .timeline::after {
    left: 20px;
    z-index: -1;
  }

  /* Stack items vertically */
  .timeline-item {
    width: 100%;
    padding-left: 50px;
    padding-right: 10px;
  }

  .timeline-item.right {
    left: 0;
  }

  /* Align dots along the left line */
  .timeline-dot,
  .timeline-item.right .timeline-dot {
    left: 10px;
    right: auto;
  }
}

/*========================
    Loader Box
==========================*/

 /* ===== Loading overlay ===== */


  :root {
    --box-size: 46px;
    --box-gap: 22px;
    --box-color: #4f7cff;
    --overlay-bg: #0d1117;
  }

  .loader {
    position: fixed;
    inset: 0;
    z-index: 9999999999;
    background: var(--overlay-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 1.5s ease, visibility 1.5s ease;
  }

  .loader.hidden {
    opacity: 0;
    visibility: hidden;
  }

  /* The box container is the positioning context.
     Sized to hold three boxes in a row. */
  .box-stage {
    position: relative;
    width: calc(var(--box-size) * 3 + var(--box-gap) * 2);
    height: var(--box-size);
  }

  .loader-box {
    position: absolute;
    top: 0;
    width: var(--box-size);
    height: var(--box-size);
    background: var(--box-color);
    /* smooth movement when we transition to merged state */
    transition: left .6s cubic-bezier(.65, 0, .35, 1),
                opacity .5s ease .15s,
                transform .6s cubic-bezier(.65, 0, .35, 1);
  }

  /* Starting positions: left, center, right */
  .box--1 { left: 0; }
  .box--2 { left: calc(var(--box-size) + var(--box-gap)); }
  .box--3 { left: calc((var(--box-size) + var(--box-gap)) * 2); }

  /* Loading bounce animation, staggered per box */
  .loader:not(.merged) .box {
    animation: bounce 1.2s ease-in-out infinite;
  }
  .loader:not(.merged) .box--1 { animation-delay: 0s; }
  .loader:not(.merged) .box--2 { animation-delay: .15s; }
  .loader:not(.merged) .box--3 { animation-delay: .3s; }

  @keyframes bounce {
    0%, 100% { transform: translateY(0) scale(1); }
    40%      { transform: translateY(-22px) scale(1.05); }
  }

  /* ===== Merged state: all boxes slide to center ===== */
  /* Center = middle box position. Boxes 1 and 3 move onto box 2. */
  .loader.merged .loader-box {
    left: calc(var(--box-size) + var(--box-gap));
    transform: translateY(0) scale(1);
  }
  /* Outer boxes fade away as they arrive, leaving one solid box */
  .loader.merged .box--1,
  .loader.merged .box--3 {
    opacity: 0;
  }
  /* The surviving center box gives a little confirming pulse */
  .loader.merged .box--2 {
    animation: pop .5s ease .4s both;
  }

  @keyframes pop {
    0%   { transform: scale(1); }
    45%  { transform: scale(1.25); border-radius: 14px; }
    100% { transform: scale(1); }
  }

  @media (prefers-reduced-motion: reduce) {
    .loader-box { animation: none !important; transition: opacity .4s ease, left .4s ease; }
  }

/*--------------------------
       Footer
   --------------------------*/

#footer {
  width: 100%;
  padding-top: 60px;
  padding-bottom: 20px;
  background: #231f20;
  background-image: url("../img/footer-bg.jpg");
  background-size: cover;
  padding-left: 20px;
  padding-right: 20px;
  z-index: 1000;
  position: relative;
  overflow: hidden;
}

#footer #footer-video {
  min-width: 100%;
  height: auto;
  z-index: -1;
  position: absolute;
  left: 0;
  bottom: 0;
  
}

#footer a.foot-link {
  line-height: 25px;
  font-weight: 400;
  color: #fff;
  letter-spacing: 0.02em;
  font-size: 0.675rem;
  text-transform: uppercase;
  float: right;
}

#footer .foot-link.copyright {
  color: #fff;
  float: left;
  font-size: 0.875rem;
}

#footer .foot-fair {
  height: 25px;
  float: right;
}

.sub-footer {
  width: 100%;
  padding-top: 5px;
  padding-right: 50px;
  border-top: 1px solid #fff;
  margin-top: 20px;
}

.sub-footer .terms {
  color: #fff;
  float: right;
}

#footer .inner-wrapper {
  display: flex;
  justify-content: space-around;
  padding-left: 0;
  padding-right: 0;
  max-width: 100%;
}

#footer .inner-wrapper .one-fifth {
  position: relative;
}


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

#footer a {
  color: #fff;
}

#footer p {
  color: #fff;
}

#footer h3 {
  color: #fff;
  border-bottom: 2px solid #fff;
  width: 90%;
  margin-bottom: 15px;
  padding-bottom: 5px;
}

.footer-social a {
  font-size: 2rem;
  margin-right: 8px;
}

.foot-logo {
  position: relative;
  padding: 20px;
}

.foot-logo img {
  margin-bottom: 30px;
  width: 80%;
}

#footer .flex.logo-container {
  width: 100%;
  display: flex;
  position: relative;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

#footer .flex.logo-container h4 {
  color: #fff;
}

#footer .flex.logo-container img.bbb-logo {
  width: 50%;
}

#footer .flex.logo-container img.star-logo {
  width: 40%;
  margin-right: auto;
  margin-left: auto;
  text-align:center;
}

/* ==========================================================================
      Helper classes
      ========================================================================== */

/*--------------------------
     Layout
   ---------------------------*/

.one-half {
  width: 50%;
}

.one-third {
  width: 33%;
}

.one-fourth {
  width: 25%;
}

.three-fourths {
  width: 75%;
}

.two-thirds {
  width: 66%;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

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

.one-fifth {
  width: 20%;
}

.two-fifths {
  width: 40%;
}

.three-fifths {
  width: 60%;
}

.four-fifths {
  width: 80%;
}

.box-centered {
  margin-right: auto;
  margin-left: auto;
}

.box-centered.button {
  margin-right: auto !important;
  margin-left: auto !important;
  display: block;
}

.flex {
  display: flex;
}

hr.clear-pretty {
  width: 100%;
  max-width: 80px;
  height: 3px;
  width: 100%;
  max-width: 110px;
  height: 5px;
  background: #1f364a;
}

hr.clear-pretty.blue {
  background: #1f364a;
}

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

.button {
  min-width: 310px;
  padding: 0.8em 1.35em;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  letter-spacing: 0.04em;
  font-size: 14px;
  font-weight: 700;
  -webkit-transition: all 150ms ease-in-out;
  -moz-transition: all 150ms ease-in-out;
  -o-transition: all 150ms ease-in-out;
  transition: all 150ms ease-in-out;
  text-transform: uppercase;
  max-width: 280px;
  background: #dab66f;
  font-size: 1rem;
  color: #fff;
  text-align: center;
  border-radius: 0px;
  position: relative;
  display: inline-block;
  margin-right: 20px;
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.18);
}

.button.center {
  margin-right: auto;
  margin-left: auto;
  display: block;
}

.button.white {
  background: #fff;
  color: #231f20;
}

.button:hover {
  cursor: pointer;
  background: #eee;
  color: #1f364a;
}

.button.white:hover {
  background: #1f364a;
  color: #fff;
}

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

h2.section-title {
  font-size: 3.1rem;
  color: #1f364a;
  text-transform: uppercase;
  max-width: 980px;
  margin-right: auto;
  margin-left: auto;
  line-height: 1.1em;
}

h3.super-title {
  color: #666;
  padding-bottom: 5px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.sub-header-wrap {
  padding-bottom: 30px;
  position: relative;
}

.blue-block-bg {
  width: 100%;
  height: 30vh;
  background: #13204a;
}

hr.clear-pretty {
  width: 210px;
  height: 5px;
  background: #fff;
  margin: 0 0 30px 0;
}

/*
    * Hide visually and from screen readers
    */

.hidden,
[hidden] {
  display: none !important;
}

/*
    * Hide only visually, but have it available for screen readers:
    * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
    *
    * 1. For long content, line feeds are not interpreted as spaces and small width
    *    causes content to wrap 1 word per line:
    *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
    */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
    * Extends the .sr-only class to allow the element
    * to be focusable when navigated to via the keyboard:
    * https://www.drupal.org/node/897638
    */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
    * Hide visually and from screen readers, but maintain layout
    */

.invisible {
  visibility: hidden;
}

/*
    * Clearfix: contain floats
    *
    * For modern browsers
    * 1. The space content is one way to avoid an Opera bug when the
    *    `contenteditable` attribute is included anywhere else in the document.
    *    Otherwise it causes space to appear at the top and bottom of elements
    *    that receive the `clearfix` class.
    * 2. The use of `table` rather than `block` is only necessary if using
    *    `:before` to contain the top-margins of child elements.
    */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
      EXAMPLE Media Queries for Responsive Design.
      These examples override the primary ('mobile first') styles.
      Modify as content requires.
      ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
      Print styles.
      Inlined to avoid the additional HTTP request:
      https://www.phpied.com/delay-loading-your-print-css/
      ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
      * Don't show links that are fragment identifiers,
      * or use the `javascript:` pseudo protocol
      */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
      * Printing Tables:
      * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
      */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

#brand-social {
  display: flex;
  width: 100%;
  justify-content: center;
}

#brand-social a {
  border-radius: 5px;
  background: #dab66f;
  padding: 5px;
  text-align: center;
}
#brand-social a {
  width: 40px;
  height: 40px;
  margin-left: 5px;
  margin-right: 5px;
  color: #333;
}