/*
Theme Name: EBRPHA
Description: The theme used for ebrpha.org - a child theme to Hello-Elementor.
Author: Neil Smith
Template: hello-elementor
Text Domain: gbr
Version: 0.0.13
*/

/* RESET -------------------------------------------------------------------- */

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

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  box-sizing: border-box;
}

ul,
ol {
  margin-bottom: 1em;
}

.list-unstyled {
  list-style: none;
  padding-left: 0 !important;
}

.list-inline {
  list-style: none;
  padding-left: 0;
}
.list-inline li {
  display: inline-block !important;
}

.list-v-space-sm li {
  margin-bottom: 0.8rem;
}
.list-v-space-lg li {
  margin-bottom: 1.6rem;
}

.px-3 {
  padding-left: 3rem;
  padding-right: 3rem;
}

.img-shadow {
  box-shadow: 5px 5px 10px 5px rgb(0 0 0 / 30%) !important;
}
.img-shadow-left {
  box-shadow: -5px 5px 10px 5px rgb(0 0 0 / 30%) !important;
}

.alignleft {
  margin-right: 4rem;
  margin-bottom: 4rem;
}
.alignright {
  margin-left: 4rem;
  margin-bottom: 4rem;
}

/* STICKY HEADER ------------------------------------------------------------ */
/* TODO: move the css vars into elementor's global or header widget's css */

.home header:not(.elementor-sticky--effects) {
  background-color: transparent !important;
  box-shadow: none !important;
}
/*.home header:not(.elementor-sticky--effects) a.elementor-item {*/
/*  color: #ffffff !important;*/
/*}*/

header.sticky-header {
  --sticky-header-height: 120px;
  --sticky-header-shrink-amount: 0.8;
  --sticky-header-home-background: transparent;
  --sticky-header-home-forground: #ffffff;
  --sticky-header-background: #ffffff;
  --sticky-header-transition: 0.3s ease-in-out;

  transition: background-color var(--sticky-header-transition);
}
header.sticky-header {
  background-color: var(--sticky-header-background) !important;
}
.home header.sticky-header {
  background-color: var(--sticky-header-home-background) !important;
}
.home header.sticky-header:not(.elementor-sticky--effects) {
  box-shadow: none !important;
}
header.sticky-header.elementor-sticky--effects {
  background-color: var(--sticky-header-background) !important;
}
header.sticky-header > .elementor-container {
  transition: min-height var(--sticky-header-transition);
}
header.sticky-header.elementor-sticky--effects > .elementor-container {
  min-height: calc(
    var(--sticky-header-height) * var(--sticky-header-shrink-amount)
  ) !important;
  height: calc(
    var(--sticky-header-height) * var(--sticky-header-shrink-amount)
  );
}
header.sticky-header .elementor-nav-menu .elementor-item {
  transition: padding var(--sticky-header-transition);
}
header.sticky-header.elementor-sticky--effects
  .elementor-nav-menu
  .elementor-item {
  padding-bottom: 10px !important;
  padding-top: 10px !important;
}
header.sticky-header > .elementor-container .logo img {
  transition: max-width var(--sticky-header-transition);
}
header.sticky-header.elementor-sticky--effects .logo img {
  max-width: calc(100% * var(--sticky-header-shrink-amount));
}

.nav-quick-link a {
  padding-top: 0 !important;
  padding-bottom: 4px !important;
  padding-left: 0 !important;
}

@media all and (min-width: 767px) {
  .home
    header.sticky-header:not(.elementor-sticky--effects)
    a:not(.elementor-sub-item) {
    color: var(--sticky-header-home-forground) !important;
  }
}

/* STRECH COLUMNS WITHIN A CONTAINER ---------------------------------------- */

section.equal-height-content div.elementor-widget-container {
  width: 100%;
}
section.equal-height-content div.elementor-widget-wrap > div {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  height: 100%;
}
@media all and (min-width: 767px) {
  section.equal-height-content div.elementor-widget-wrap > div {
    flex-direction: row;
  }
}

.cta-stretch .elementor-widget-container > a {
  height: 100%;
}

section.did-you-know .elementor-widget-wrap {
  height: 100%;
  flex-direction: column;
}
section.did-you-know .elementor-widget-text-editor {
  flex-grow: 1;
}
section.did-you-know .elementor-widget-text-editor .elementor-widget-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

/* VERTICALLY ALIGN CALL-TO-ACTION BOX CONTENT ------------------------------ */

.elementor-cta--valign-middle .elementor-cta__content {
  justify-content: center;
}

/* STRETCH A CALL-TO-ACTION TO ITS COLUMNS HEIGHT --------------------------- */

.cta-stretch div.elementor-cta {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
}
.cta-stretch div.elementor-cta__content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.cta-stretch div.elementor-cta__button-wrapper {
  margin-top: auto;
}

/* INLINE LISTS ------------------------------------------------------------- */

.inline-list {
  padding-left: 0;
}

.inline-list li {
  display: inline-block;
  margin: 0 2rem;
}

/* SCROLL BG ---------------------------------------------------------------- */

.scroll-bg {
  background-color: transparent;
  box-shadow: none;
  transition: all 0.2s ease-in;
}

.scroll-bg--active {
  background-color: #ffffff;
  box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 50%);
}

.scroll-bg .ubermenu-main .ubermenu-item-level-0 > .ubermenu-target {
  color: #ffffff !important;
  text-shadow: 1px 3px 2px rgba(0, 0, 0, .8);
}
.scroll-bg--active .ubermenu-main .ubermenu-item-level-0 > .ubermenu-target {
  color: #002b55 !important;
  text-shadow: none;
}

.scroll-bg
  .ubermenu.ubermenu-main
  .ubermenu-item-level-0:hover
  > .ubermenu-target,
.ubermenu-main .ubermenu-item-level-0.ubermenu-active > .ubermenu-target {
  color: #00aced;
}

.ubermenu-responsive-toggle {
  flex-direction: row-reverse !important;
  justify-content: space-between !important;
  align-items: center !important;
  outline: none !important;
  border: 0 !important;
  border-bottom: 2px solid #002b55 !important;
}
.ubermenu-responsive-toggle .fas {
  font-size: 28px;
  color: #002b55;
}
.ubermenu-response-toggle:focus {
  outline: none !important;
  border: 0 !important;
}

.ubermenu .ubermenu-row {
  margin-bottom: 0 !important;
}
.ubermenu .ubermenu-submenu-type-stack > .ubermenu-divider {
  padding-top: 0 !important;
}

@media screen and (max-width: 959px) {
  .ubermenu-responsive-toggle {
    display: flex !important;
  }
}


/* UBER MENU OVERRIDES ----------------------------------------------------- */
@media screen and (max-width: 959px) {
    .ubermenu-responsive-default.ubermenu.ubermenu-mobile-modal {
        max-width: 100% !important;
    }
}