/* fira-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/fira-sans-v17-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/fira-sans-v17-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/fira-sans-v17-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/fira-sans-v17-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* fira-sans-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/fira-sans-v17-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

:root {
  --black: #000000;
  --white: #fff;
  --primary-10: #143677;
  --primary-20: #4f6899;
  --primary-30: #899abb;
  --primary-40: #ced4f3;

  --secondary-10: #96152b;
  --secondary-20: #b05060;
  --secondary-30: #cb8a95;
  --secondary-40: #e5c4ca;

  --accent-10: #60b4be;
  --accent-20: #88c7ce;
  --accent-30: #afd9df;
  --accent-40: #d7ecef;

  --purple-10: #a6beea;
  --purple-20: #bcceef;
  --purple-30: #d3dff5;
  --purple-40: #e9effa;
}

body.bp-search .bp-search-ac {
  -webkit-transform: translate(35%, 10px);
  -ms-transform: translate(35%, 10px);
  transform: translate(35%, 10px);
  max-height: -webkit-calc(80vh - 76px);
  max-height: calc(80vh - 76px);
}
body.admin-bar.bp-search .bp-search-ac {
  max-height: -webkit-calc(80vh - 108px);
  max-height: calc(80vh - 108px);
}
body.bp-search
  .bp-search-ac
  > li:not(.bbls-view_all_type-type)
  .item-avatar
  > i {
  width: 30px;
  height: 30px;
  font-size: 15px;
}
body.bp-search .bp-search-ac > li:not(.bbls-view_all_type-type) .item-avatar {
  width: 30px;
}
.site-header .site-header-container,
.header-search-wrap,
.header-search-wrap input.search-field,
.header-search-wrap form.search-form {
  height: var(--bb-header-height) !important;
}
@media (max-width: 800px) {
  .elementor-widget-header-bar .site-header .menu-item-has-children .sub-menu,
  .elementor-widget-header-bar .site-header .notification-dropdown {
    left: auto !important;
    right: 10px !important;
    top: calc(var(--bb-header-height) + 10px);
  }
}
/* My Account */
.bsMyAccount {
  gap: 20px;
}

.woocommerce .bsMyAccount--dashboard .woocommerce-Address-title {
  display: inherit;
}

.woocommerce table.my_account_orders .button {
  white-space: pre-wrap;
}

.elementor-9
  .elementor-element.elementor-element-3d631cc9
  .woocommerce-info
  a:hover,
.elementor-9
  .elementor-element.elementor-element-3d631cc9
  .woocommerce-MyAccount-content
  .button:hover,
.elementor-9
  .elementor-element.elementor-element-3d631cc9
  .woocommerce-info
  a:focus,
.elementor-9
  .elementor-element.elementor-element-3d631cc9
  .woocommerce-MyAccount-content
  .button:focus {
  background-color: var(--bb-primary-button-background-hover);
}

/*
* Search Styling
*/
.forum-archive .bp-search-ac.ui-autocomplete.bp-forum-search-ac-header {
  left: 50% !important;
  right: 50% !important;
  transform: translateX(-50%);
}

/*
* Member Spotlight Content Type Styling
*/
.single-members-highlight {
  main {
    background-color: #e9effa;
  }

  * {
    font-family: "Kulim Park", Sans-serif;
  }

  h1,
  h2,
  h3,
  h4,
  h5 {
    color: #143878;
    margin-bottom: 0;
  }

  h1 {
    font-size: 70px !important;
  }

  h2 {
    font-size: 35px !important;
  }

  h3 {
    font-size: 24px !important;
  }

  h4 {
    font-size: 20px !important;
  }

  h6 {
    font-size: 24px !important;
    font-weight: 400;
  }

  #acue-logo {
    width: 85px;
    height: auto;
  }

  .post-thumbnail {
    max-width: 200px;
  }

  @media (max-width: 767px) {
    h1 {
      font-size: 40px !important;
    }

    h2 {
      font-size: 30px !important;
    }
  }
}