/*
  Custom theme
*/

/* Wellbe Life zendesk theme */

body{ font-size:18px; }

/*
brand_color | is the brand color for major navigational elements
brand_text_color | is the brand color for hover and active states
text_color | is the text color for body and heading elements
link_color | is the text color for link elements
background_color | is the background color of your help center
heading_font | is the font for headings
text_font | is the font for body text
logo | is the company logo
favicon | is the icon displayed in the address bar of your browser
homepage_background_image | is the hero image on the home page
community_background_image | is the hero image on the community topics page
community_image | is the image for the community section on the home page
*/



/*
rgba(255, 153, 0, 1)      | is the brand color for major navigational elements
rgba(0, 162, 20, 1)   | is the brand color for hover and active states
rgba(0, 0, 0, 1)        | is the text color for body and heading elements
rgba(36, 84, 248, 1)        | is the text color for link elements
rgba(243, 237, 228, 1)  | is the background color of your help center
-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif       | is the font for headings
-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif         | is the font for body text
/hc/theming_assets/01JH5N418RN4JP5V2XZ6FF9B82               | is the company logo
/hc/theming_assets/01JH5N418RN4JP5V2XZ6FF9B82           | is the icon displayed in the address bar of your browser
/hc/theming_assets/01JH5N7P1PSHF1B395JSH8F4D3   | is the hero image on the home page
/hc/theming_assets/01JH5NREJT51XD26PXBXWWHZ2N   | is the hero image on the community topics page
/hc/theming_assets/01JH5N7YZKQGP8Y26SAYJ42QWS             | is the image for the community section on the home page
*/

/* BREAKS
@media (min-width: 768px) {}
@media (min-width: 991px) {}
@media (min-width: 1368px) {}
*/

/* HANDY DEFAULT CLASSES
.visibility-hidden
*/

#preview-bar-container{ display:block; opacity:0.5 !important; }

html{ overflow-x:hidden; }

/*
  TYPOGRAPHY
*/
h1, .h1{ font-size:46px; line-height:1.2; }
h2, .h2, .sidenav-title{ font-size:30px; line-height:1.2; display:block; }

.wb-hero h1,
.wb-hero h2,
.wb-hero .wb-subnav .breadcrumbs li:last-child a,
.h1{ font-size:7vw; }

@media (min-width: 750px){
  .wb-hero h1,
  .wb-hero h2,
  .wb-hero .wb-subnav .breadcrumbs li:last-child a,
  .h1{ font-size:53px; }
}
@media (min-width: 1024px){
  
}



/*
  NAVIGATIE
*/
.wb-nav .user-nav .user-nav-list{ display:none; }

  /*mobile*/
@media (max-width: 990px) {
  .wb-nav{ background:#fff; }
}
.wb-nav header .nav-wrapper-mobile{}
.wb-nav header .nav-wrapper-mobile button.menu-button-mobile{}
.wb-nav header .nav-wrapper-mobile nav.menu-list-mobile{}
.wb-nav header .nav-wrapper-mobile nav.menu-list-mobile ul.menu-list-mobile-items{}
.wb-nav header .nav-wrapper-mobile nav.menu-list-mobile ul.menu-list-mobile-items li{}
/*desktop*/
@media (min-width: 991px) {
  .wb-nav{ z-index:100; position:absolute; top:20px; right:2vw; left:2vw; margin:0 auto; width:96vw; height:83px !important; border-radius:100px; box-shadow: 0 0 16px rgba(0,0,0, .1); transition: border-radius 0.08s ease; }
  .wb-nav header{ height:83px; }
    .wb-nav.wb-sticky{ position:fixed; top:0; right:0; left:0; width:100vw; margin-top:0; box-shadow: 0 0 6px rgba(0,0,0, 0.2); border-radius:0; }
}
.wb-nav header .nav-wrapper-desktop{}
.wb-nav header .nav-wrapper-desktop nav.user-nav{}
.wb-nav header .nav-wrapper-desktop nav.user-nav ul.user-nav-list{}
.wb-nav header .nav-wrapper-desktop nav.user-nav ul.user-nav-list li{}




/*
  HERO
*/
.wb-hero{ position:relative; padding-top:90px !important; padding-bottom:140px !important; background-color:#2454f7; }
.wb-hero .container, .wb-hero .container .sub-nav{ display:flex; flex-direction:column; flex-wrap:no-wrap; justify-content:flex-start; gap:25px; }
.wb-hero.wb-hero-hp .hero-inner{ max-width:600px; }

.wb-hero .search-title h1, .wb-hero .search-title h2{ line-height:1; margin:0; color:#fff; }
.wb-hero form.search{ margin-left:-3px; max-width:600px; }
.wb-hero form.search input[type="search"]{ padding-top:15px; padding-bottom:15px; height:auto; }
.wb-hero .search-icon { color: #a08a7b; }

.wb-hero .breadcrumbs li a, .wb-hero .breadcrumbs li::before{ color:#fff; }

@media (min-width: 600px){
  .wb-hero:not(.wb-hero-hp) form.search{ max-width:300px; }
}
@media (min-width: 1024px){
  .wb-hero{ padding-top:200px !important; }
  .wb-hero.wb-hero-searchresults{ padding-top:140px; padding-bottom:90px !important; }
}




/*
  LAYOUT
*/
.wb-content{ margin-top:0; padding-top:0; position:relative; top:-60px; }
.section-tree section, .article-answer, .article-sidebar{padding: 25px;background-color: #fff;border-radius: 25px;}

/* curve */
.curve{ position:absolute; left:0; bottom:0; width:100vw; height:44px; }
.curve #shape{ width:100vw; height:44px; }
.curve #shape .st0{ fill:#f3ede4; }

/* buttons */
.wb-button-wrap{ margin-top:25px; padding:12.5px 0; text-align:center; }
.wb-button{ display:inline-block; margin:12.5 auto; padding:15px 20px; font-weight:bold; color:#a08a7b !important; border:1px solid #a08a7b; border-radius:50px; }


/*
  HOMEPAGE
*/
.blocks-list .blocks-item{ box-shadow:0 10px 16px rgba(0,0,0,.1); }
.blocks-list .blocks-item .blocks-item-link{ position:relative; padding:25px; min-height:142px; font-weight:600; }
.blocks-list .blocks-item .blocks-item-link::after{ content:"\f054"; display:block; font-family: 'Font Awesome 6 Free'; font-weight:900; position:absolute; right:25px; }



/*
  CATEGORY PAGE
*/
.category-container .wb-content .section-tree{ gap:25px; }

.category-container .wb-content .section-tree{ flex-direction: column; }
/*
.category-container .wb-content .section-tree ul.article-list{ display:flex; flex-direction:column; flex-wrap: wrap; gap:12.5px; }
.category-container .wb-content .section-tree li{ position:relative; padding-left:25px; }
.category-container .wb-content .section-tree li::before{ content:"\f054"; display:block; font-family: 'Font Awesome 6 Free'; font-weight:900; position:absolute; left:0; color:#2454f7;  }
.category-container .wb-content .section-tree li a{ padding:12.5px 0; }
*/

ul.article-list{ display:flex; flex-direction:column; flex-wrap: wrap; gap:12.5px; }
ul.article-list li{ position:relative; padding-left:25px; }
ul.article-list li::before{ content:"\f054"; display:block; font-family: 'Font Awesome 6 Free'; font-weight:900; position:absolute; left:0; color:#2454f7;  }
ul.article-list li a{ padding:12.5px 0; }

@media (min-width: 1024px){
  ul.article-list{ display:flex; flex-wrap: wrap; flex-direction:row; gap:10px;  }
  ul.article-list li.article-list-item{ flex: 0 0 calc(50% - 12.5px); box-sizing: border-box; }
}



/*
  SECTION PAGE
*/
.section-container {}
.section-container .wb-content .container{  }

.wb-hero .wb-subnav .breadcrumbs{ display: flex; flex-wrap: wrap; list-style: none; max-width:500px; }
.wb-hero .wb-subnav .breadcrumbs li:last-child{ flex-basis:100%; flex-grow: 1; display:block; margin-top: 0.50em; width:100% !important; white-space: nowrap; overflow:visible; }
.wb-hero .wb-subnav .breadcrumbs li:last-child::before{ display:none; }






/*
  ARTICLE CONTAINER
*/
.article-container .article{ display:flex; flex-direction:column; gap:25px; }
.article-container .article .article-answer{ display:flex; flex-direction:column; gap:25px; }
.article-container .article .article-answer .article-content{ flex:0 0 75%; }
.article-container .article .article-answer .article-header{ padding:inherit; border-color:#a08a7b; border-style: solid; border-width: 1px 0 0 0; }

.article-container .article-sidebar ul{ display:flex; flex-direction:column; gap:25px; }
.article-container .article-sidebar ul li{ position:relative; padding-left:25px; }
.article-container .article-sidebar ul li::before{ content:"\f054"; display:block; font-family: 'Font Awesome 6 Free'; font-weight:900; position:absolute; left:0; color:#2454f7;  }
.article-container .article-sidebar ul li a{ }

.article-container .sidenav-title{ margin-bottom:25px !important; }

@media (min-width: 1024px){
  .article-container{ flex-direction:column; }
  .article-container .article .article-answer{ flex-direction:row; }
  .article-container .article .article-answer .article-header{ border-width: 0 0 0 1px; }

  .article-container .article-sidebar ul{ flex-wrap: wrap; flex-direction:row; }
  .article-container .article-sidebar ul li{ flex: 0 0 calc(50% - 12.5px); box-sizing: border-box; }
}




/*
  SEARCH RESULTS
*/
.wb-searchresults{  }
.multibrand-filter-list{ display:none; }

.wb-searchresults .search-results{ display:flex; flex-direction:column; gap:25px; padding:25px; background-color:#fff; border-radius:25px; }
.wb-searchresults .search-results .search-results-list{ display:flex; flex-direction:column; gap:25px; }
.wb-searchresults .search-results .search-results-list > li{ padding:25px 0; }
.wb-searchresults .search-results .search-results-list > li + li{ border-top:1px solid #a08a7b; }


@media (min-width: 1024px){
  .wb-searchresults .search-results .search-results-list > li article h2,
  .wb-searchresults .search-results .search-results-list > li article p{ max-width:600px; }
}



/*
  FOOTER
*/
footer.footer{ margin-top:75px; padding-top:35px; padding-bottom:25px; color:#fff; background-color:#1c1c8d; }
footer.footer .logo{ display:block; max-width:160px; margin:0 auto;  }
footer.footer .footer-inner{ display:flex; flex-direction:column; gap:25px; font-size:15px; }
footer.footer .footer-inner > div{ display:flex; flex-direction:column; gap:25px; justify-content:space-between; }
footer.footer .footer-inner > div + div{ padding-top:25px; font-size:16px; }
footer.footer .footer-inner > div + div:first-child{ border-top:1px solid #fff; }
footer.footer .footer-inner > .footer-top > div{ padding-top:50px; }
footer.footer .footer-inner > .footer-top > div:first-child,
footer.footer .footer-inner > .footer-top > div:nth-child(3){ padding-top:0; }
footer.footer .footer-inner > div > div{ display:flex; flex-direction:column; }

.footer-links{ display:flex; flex-direction:column; margin:0; padding:0; gap:25px; }
.footer-links li{ position:relative; margin:0; padding:0 0 0 25px; list-style:none; }
.footer-links li::before{ content:"\f054"; display:block; font-family: 'Font Awesome 6 Free'; font-weight:900; position:absolute; left:0; color:#2454F8; font-size:14px; }
.footer-links li a{ color:#fff; }
.footer-links li a:hover{ text-decoration:none; }

.footer-socials{ display:flex; flex-direction:row; justify-content:flex-start; gap:4px; margin:0; padding:0; list-style:none; }
.footer-socials li{ padding-top:6px; text-align:center; width:40px; height:40px; background-color:#2454F8; border-radius:300px; }
.footer-socials li a{ display:block; width:40px; height:40px; }
.footer-socials li a i{ color:#fff; font-size:18px; line-height:32px; }

footer .footer-mid{ margin:25px 0; border-top:1px solid rgba(255, 255, 255, 0.2);  }
footer .footer-mid ul{ display:flex; flex-direction:column; justify-content:space-between; gap:25px; }
footer .footer-mid li{ text-align:left; }
footer .footer-mid li a{ color:rgba(255,255,2455,0.6); }

footer .footer-mid, footer .footer-bottom{ display:flex; flex-direction:column; justify-content:center; padding:25px 0; }


footer .footer-bottom{ color:rgba(255,255,2455,0.6); }

@media (min-width: 1024px){
  footer.footer{ padding-top:35px; padding-bottom:25px; }
  footer.footer .footer-inner{  }
  footer.footer .footer-inner .footer-top{ display:flex; flex-direction: row;}
  footer.footer .footer-inner > div > div{ width:25%; }

  footer.footer .footer-inner > .footer-top > div:nth-child(3){ padding-top:50px; }
  footer.footer .footer-inner > .footer-top > div:first-child{ padding-top:0; }

  /* .footer-socials li{ padding-top:5px; text-align:center; width:40px; height:40px; background-color:#2454F8; border-radius:300px; }
  .footer-socials li a{ display:block; padding:0; width:40px; height:40px; }
  .footer-socials{ display:flex; flex-direction:row; }
  .footer-socials li a i{ font-size:18px; line-height:32px; } */

  footer .footer-mid{ }
  footer .footer-mid ul{ flex-direction:row; gap:25px; }
  footer .footer-mid li{ text-align:center; }
  footer .footer-mid li a{ color:rgba(255,255,2455,0.6); }

  footer .footer-mid, footer .footer-bottom{ padding:0 50px; }

  footer .footer-bottom{ opacity:0.33; text-align:center; }

}