body {
  --bs-nhri-blue: #036;
  --bs-nhri-blue-rgb: 0, 51, 102;
  --bs-nhri-blue-dark: #002952;
  --bs-nhri-blue-dark-rgb: 0, 41, 82;
  --bs-nhri-blue-light: #3a507e;
  --bs-nhri-blue-light-rgb: 50, 80, 126;
  --bs-nhri-blue-lighter: #627097;
  --bs-nhri-blue-lighter-rgb: 98, 112, 151;
  --bs-nhri-blue-lightest: #8892b0;
  --bs-nhri-blue-lightest-rgb: 136, 146, 176;
  --bs-nhri-orange: #F35B04;
  --bs-nhri-orange-rgb: 243, 91, 4;
  --bs-nhri-orange-dark: #DB5204;
  --bs-nhri-orange-dark-rgb: 219, 82, 4;
  --bs-nhri-orange-light: #ff9561;
  --bs-nhri-orange-light-rgb: 255, 149, 97;
  --bs-primary: var(--bs-nhri-blue);
  --bs-primary-rgb: var(--bs-nhri-blue-rgb);
  --bs-border-radius: 0.125rem;
  --bs-border-radius-sm: 0.0625rem;
  --bs-border-radius-lg: 0.25rem;
  --bs-border-radius-xl: 0.5rem;
  --bs-border-radius-xxl: 1rem;
  --bs-link-color: var(--bs-nhri-blue);
  --bs-link-color-rgb: var(--bs-nhri-blue-rgb);
  --bs-link-hover-color: var(--bs-nhri-orange);
  --bs-link-hover-color-rgb: var(--bs-nhri-orange-rgb);
  --animation-timing: cubic-bezier(0.17, 0.04, 0.03, 0.94);
  --text-shadow: rgba(0, 0, 0, 0.8) 0 0 12px;
}

.btn-primary {
  --bs-btn-bg: var(--bs-nhri-blue);
  --bs-btn-border-color: var(--bs-nhri-blue);
  --bs-btn-hover-bg: var(--bs-nhri-blue-dark);
  --bs-btn-hover-border-color: var(--bs-nhri-blue-dark);
  --bs-btn-focus-shadow-rgb: var(--bs-nhri-blue-dark-rgb);
  --bs-btn-active-bg: var(--bs-nhri-blue-dark);
  --bs-btn-active-border-color: var(--bs-nhri-blue-dark);
  --bs-btn-disabled-bg: var(--bs-nhri-blue);
  --bs-btn-disabled-border-color: var(--bs-nhri-blue);
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-nhri-blue);
  --bs-btn-border-color: var(--bs-nhri-blue);
  --bs-btn-hover-bg: var(--bs-nhri-blue);
  --bs-btn-hover-border-color: var(--bs-nhri-blue);
  --bs-btn-focus-shadow-rgb: var(--bs-nhri-blue-dark-rgb);
  --bs-btn-active-bg: var(--bs-nhri-blue);
  --bs-btn-active-border-color: var(--bs-nhri-blue);
  --bs-btn-disabled-color: var(--bs-nhri-blue);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--bs-nhri-blue);
}

.btn-secondary {
  --bs-btn-bg: var(--bs-nhri-orange);
  --bs-btn-border-color: var(--bs-nhri-orange);
  --bs-btn-hover-bg: var(--bs-nhri-orange-dark);
  --bs-btn-hover-border-color: var(--bs-nhri-orange-dark);
  --bs-btn-focus-shadow-rgb: var(--bs-nhri-orange-dark-rgb);
  --bs-btn-active-bg: var(--bs-nhri-orange-dark);
  --bs-btn-active-border-color: var(--bs-nhri-orange-dark);
  --bs-btn-disabled-bg: var(--bs-nhri-orange);
  --bs-btn-disabled-border-color: var(--bs-nhri-orange);
}

.text-orange{
  --bs-text-opacity: 1;
  color: rgba(var(--bs-nhri-orange-rgb),var(--bs-text-opacity)) !important;
}

.card {
  --bs-card-border-width: 0;
  --bs-card-border-radius: var(--bs-border-radius);
  --bs-card-cap-bg: transparent;
}

.offcanvas.offcanvas-end {
  --bs-offcanvas-width: 16rem;
}

.offcanvas.offcanvas-bottom {
  --bs-offcanvas-height: 16rem;
}

#loaderSpin {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 40;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
}

header:not(.header-pinned) .navbar {
  background-color: transparent;
  transition: all 500ms var(--animation-timing);
  --bs-navbar-brand-color: var(--bs-white);
  --bs-navbar-brand-hover-color: var(--bs-link-hover-color);
  --bs-navbar-padding-y: 1.5rem;
}

header.header-pinned {
  box-shadow: var(--bs-box-shadow);
}

header.header-pinned .navbar {
  background-color: var(--bs-primary);
  --bs-navbar-brand-color: var(--bs-white);
  --bs-navbar-brand-hover-color: var(--bs-white);
  --bs-navbar-padding-y: 0.5rem;
}

#fp-nav {
  z-index: 30;
}

#fp-nav ul li a span, .fp-slidesNav ul li a span {
  background: var(--bs-nhri-blue);
  box-shadow: rgba(255, 255, 255, 0.75) 0 0 1px 2px;
}

#fp-nav .fp-tooltip {
  background-color: rgba(var(--bs-primary-rgb), 0.5);
  padding: 2px 4px;
  border-radius: var(--bs-border-radius);
}

/* Backgrounds will cover all the section */
.section,
.slide {
  position: relative;
  background-size: cover;
  overflow: hidden;
}

.section.hero {
  text-shadow: var(--text-shadow);
  background-color: rgba(0,0,0,.2);
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADAQMAAABs5if8AAAAA3NCSVQICAjb4U/gAAAABlBMVEUAAAD///+l2Z/dAAAAAnRSTlP/AOW3MEoAAAAJcEhZcwAAAuwAAALsAe0ztPoAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDQvMTMvMTGrW0T6AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M1cbXjNgAAAA5JREFUCJljSGBYwHAAAASGAcENz5GAAAAAAElFTkSuQmCC");
  background-repeat: repeat;
  background-size: auto;
}

.overlay-video {
  position: absolute;
  right: 0;
  bottom: 0;
  top:0;
  right:0;
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: black; /* in case the video doesn't fit the whole page*/
  background-position: center center;
  background-size: cover;
  object-fit: cover; /*cover video background */
  z-index: -100;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Layer with position absolute in order to have it over the video */
.section.hero .layer{
  /*
  * Preventing flicker on some browsers
  * See http://stackoverflow.com/a/36671466/1081396  or issue #183
  */
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}