@charset "UTF-8";

/***** CUSTOM FONTS *****/
@font-face {
    font-family: "Adelle Sans";
    font-weight: 400;
    src: url("/hc/theming_assets/01JMQ0WRQX88HN9E0TF50RKB8Q");
  }
  
@font-face {
    font-family: "Adelle Sans";
    font-weight: 600;
    src: url("/hc/theming_assets/01JMQ0WRQSAAKT9389A1Y67DVT");
}

@font-face {
    font-family: "Operator Mono";
    src: url("/hc/theming_assets/01JMQ0WRW9BV3E9ZNFJWACE5A9");
}

body {
    color: #ffffff;
    -webkit-font-smoothing: antialiased;
  }
  
  
  body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol {
    margin: 9px 0;
    padding: 0;
  }
  
  ul, ol {
    list-style: none;
    padding: 0;
  }
  
  html:focus-within {
    scroll-behavior: smooth;
  }
  
  body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    line-height: 1.5;
  }
  
  a {
    text-decoration: none;
    color: inherit;
  }
  
  img, picture, svg {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border: 0;
  }

  li {
    line-height: 18px;
  } 

body {
  color: #ffffff;
  -webkit-font-smoothing: antialiased;
}

h1 {
  font-family: "Adelle Sans";
  font-size: 80px;
  line-height: 96px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h1 {
    font-size: 48px;
    line-height: 56px;
  }
}
@media (max-width: 767px) {
  h1 {
    font-size: 32px;
    line-height: 40px;
  }
}

h2 {
  font-family: "Adelle Sans";
  font-size: 48px;
  line-height: 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h2 {
    font-size: 32px;
    line-height: 44px;
  }
}
@media (max-width: 767px) {
  h2 {
    font-size: 26px;
    line-height: 32px;
  }
}

h3 {
  font-family: "Adelle Sans";
  font-size: 36px;
  line-height: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h3 {
    font-size: 28px;
    line-height: 36px;
  }
}
@media (max-width: 767px) {
  h3 {
    font-size: 24px;
    line-height: 32px;
  }
}

h4 {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h4 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  h4 {
    font-size: 20px;
    line-height: 28px;
  }
}

h5 {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h5 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h5 {
    font-size: 18px;
    line-height: 24px;
  }
}

h6 {
  font-family: "Operator Mono";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h6 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h6 {
    font-size: 18px;
    line-height: 24px;
  }
}

/**
 * It might seem strange to use mixins instead of applying styles directly to
 * the relevant selectors — h1, h2, etc. We use the mixins because these styles
 * aren't just for HTML we control. We also use them for our help center hosted
 * on Help Scout Docs. The mixins let us override Help Scout's styles without
 * using `!important`.
 */
h1 {
  font-family: "Adelle Sans";
  font-size: 80px;
  line-height: 96px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h1 {
    font-size: 48px;
    line-height: 56px;
  }
}
@media (max-width: 767px) {
  h1 {
    font-size: 32px;
    line-height: 40px;
  }
}

h2 {
  font-family: "Adelle Sans";
  font-size: 48px;
  line-height: 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h2 {
    font-size: 32px;
    line-height: 44px;
  }
}
@media (max-width: 767px) {
  h2 {
    font-size: 26px;
    line-height: 32px;
  }
}

h3 {
  font-family: "Adelle Sans";
  font-size: 36px;
  line-height: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h3 {
    font-size: 28px;
    line-height: 36px;
  }
}
@media (max-width: 767px) {
  h3 {
    font-size: 24px;
    line-height: 32px;
  }
}

h4 {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h4 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  h4 {
    font-size: 20px;
    line-height: 28px;
  }
}

h5 {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h5 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h5 {
    font-size: 18px;
    line-height: 24px;
  }
}

h6 {
  font-family: "Operator Mono";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h6 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h6 {
    font-size: 18px;
    line-height: 24px;
  }
}

/**
 * It might seem strange to use mixins instead of applying styles directly to
 * the relevant selectors — h1, h2, etc. We use the mixins because these styles
 * aren't just for HTML we control. We also use them for our help center hosted
 * on Help Scout Docs. The mixins let us override Help Scout's styles without
 * using `!important`.
 */
h1 {
  font-family: "Adelle Sans";
  font-size: 80px;
  line-height: 96px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h1 {
    font-size: 48px;
    line-height: 56px;
  }
}
@media (max-width: 767px) {
  h1 {
    font-size: 32px;
    line-height: 40px;
  }
}

h2 {
  font-family: "Adelle Sans";
  font-size: 48px;
  line-height: 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h2 {
    font-size: 32px;
    line-height: 44px;
  }
}
@media (max-width: 767px) {
  h2 {
    font-size: 26px;
    line-height: 32px;
  }
}

h3 {
  font-family: "Adelle Sans";
  font-size: 36px;
  line-height: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h3 {
    font-size: 28px;
    line-height: 36px;
  }
}
@media (max-width: 767px) {
  h3 {
    font-size: 24px;
    line-height: 32px;
  }
}

h4 {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h4 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  h4 {
    font-size: 20px;
    line-height: 28px;
  }
}

h5 {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h5 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h5 {
    font-size: 18px;
    line-height: 24px;
  }
}

h6 {
  font-family: "Operator Mono";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h6 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h6 {
    font-size: 18px;
    line-height: 24px;
  }
}

/**
 * It might seem strange to use mixins instead of applying styles directly to
 * the relevant selectors — h1, h2, etc. We use the mixins because these styles
 * aren't just for HTML we control. We also use them for our help center hosted
 * on Help Scout Docs. The mixins let us override Help Scout's styles without
 * using `!important`.
 */
h1 {
  font-family: "Adelle Sans";
  font-size: 80px;
  line-height: 96px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h1 {
    font-size: 48px;
    line-height: 56px;
  }
}
@media (max-width: 767px) {
  h1 {
    font-size: 32px;
    line-height: 40px;
  }
}

h2 {
  font-family: "Adelle Sans";
  font-size: 48px;
  line-height: 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h2 {
    font-size: 32px;
    line-height: 44px;
  }
}
@media (max-width: 767px) {
  h2 {
    font-size: 26px;
    line-height: 32px;
  }
}

h3 {
  font-family: "Adelle Sans";
  font-size: 36px;
  line-height: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h3 {
    font-size: 28px;
    line-height: 36px;
  }
}
@media (max-width: 767px) {
  h3 {
    font-size: 24px;
    line-height: 32px;
  }
}

h4 {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h4 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  h4 {
    font-size: 20px;
    line-height: 28px;
  }
}

h5 {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h5 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h5 {
    font-size: 18px;
    line-height: 24px;
  }
}

h6 {
  font-family: "Operator Mono";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  h6 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  h6 {
    font-size: 18px;
    line-height: 24px;
  }
}

.navbar {
  display: flex;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.6);
}
.navbar .navbarContent {
  display: flex;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  max-width: 1312px;
  padding: 24px 64px;
  gap: 8px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  .navbar .navbarContent {
    max-width: 1200px;
    padding: 24px 32px;
  }
}
@media (max-width: 767px) {
  .navbar .navbarContent {
    max-width: 768px;
    padding: 24px;
  }
}
.navbar .navbarContent .navbarLeft {
  display: flex;
  gap: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  .navbar .navbarContent .navbarLeft {
    gap: 24px;
  }
}
.navbar .navbarContent .navbarLeft .navbarWordmark {
  z-index: 3;
}
.navbar .navbarContent .navbarLeft .navbarWordmark img {
  width: 210px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  .navbar .navbarContent .navbarLeft .navbarWordmark img {
    width: 133.74px;
  }
}
@media (max-width: 767px) {
  .navbar .navbarContent .navbarLeft .navbarWordmark img {
    width: 155px;
    position: relative;
    top: -3px;
  }
}
@media (max-width: 350px) {
  .navbar .navbarContent .navbarLeft .navbarWordmark img {
    width: 106px;
  }
}
.navbar .navbarContent .navbarRight {
  z-index: 2;
}
.navbar .navbarContent .navbarRight a {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: #ffffff;
  text-decoration: none !important;
  border-bottom: none !important;
}
@media (min-width: 768px) and (max-width: 1199px) {
  .navbar .navbarContent .navbarRight a {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  .navbar .navbarContent .navbarRight a {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 350px) {
  .navbar .navbarContent .navbarRight a {
    font-size: 12px;
    white-space: nowrap;
  }
}
.navbar .navbarContent .navbarRight a:hover, .navbar .navbarContent .navbarRight a:active, .navbar .navbarContent .navbarRight a:focus {
  text-decoration: none !important; 
  color: rgba(255, 255, 255, 0.8);
  border-bottom: none !important;
}

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 112px;
  padding-bottom: 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer {
    padding-top: 56px;
    padding-bottom: 32px;
  }
}
@media (max-width: 767px) {
  footer {
    padding-top: 96px;
    padding-bottom: 24px;
  }
}
footer .footerContent {
  flex: 1;
  width: 100%;
  max-width: 1312px;
  padding: 0 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent {
    padding: 0 32px;
  }
}
@media (max-width: 767px) {
  footer .footerContent {
    padding: 0 24px;
  }
}
footer .footerContent .footerTop {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  footer .footerContent .footerTop {
    flex-direction: column;
    gap: 64px;
  }
}
footer .footerContent .footerTop .tagline {
  display: inline-block;
}
footer .footerContent .footerTop .tagline.wide {
  background: radial-gradient(61.42% 1213.78% at 18.1% 57.03%, #ffffff, rgba(255, 255, 255, 0.6));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: none;
}
@media (min-width: 1440px) {
  footer .footerContent .footerTop .tagline.wide {
    display: block;
  }
}
footer .footerContent .footerTop .tagline.narrow {
  background: radial-gradient(75.93% 1509.49% at 15.28% 23.96%, #ffffff, rgba(255, 255, 255, 0.6));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media (min-width: 1440px) {
  footer .footerContent .footerTop .tagline.narrow {
    display: none;
  }
}
footer .footerContent .footerTop .footerLinks {
  display: flex;
  gap: 16px;
}
@media (max-width: 767px) {
  footer .footerContent .footerTop .footerLinks {
    flex-flow: wrap;
    gap: 48px;
  }
}
footer .footerContent .footerTop .footerLinks .linkColumn {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 120px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent .footerTop .footerLinks .linkColumn {
    width: 86px;
  }
}
@media (max-width: 767px) {
  footer .footerContent .footerTop .footerLinks .linkColumn {
    width: 86px;
  }
}
footer .footerContent .footerTop .footerLinks .linkColumn .linkColumnTitle {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  font-family: "Adelle Sans";
  color: #ffffff;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent .footerTop .footerLinks .linkColumn .linkColumnTitle {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  footer .footerContent .footerTop .footerLinks .linkColumn .linkColumnTitle {
    font-size: 15px;
    line-height: 24px;
  }
}
footer .footerContent .footerTop .footerLinks ul {
  padding-inline-start: 0; 
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  list-style: none;
}
footer .footerContent .footerTop .footerLinks ul li a {
  display: flex;
  align-items: center;
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  transition: color 0.3s ease;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent .footerTop .footerLinks ul li a {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  footer .footerContent .footerTop .footerLinks ul li a {
    font-size: 15px;
    line-height: 24px;
  }
}
footer .footerContent .footerTop .footerLinks ul li a:hover {
  color: #ffffff;
}
footer .footerContent .footerTop .footerLinks ul li .heartEmoji {
  padding: 0 0 2px 4px;
}
footer .footerContent .footerDivider {
  width: 100%;
  max-width: 1312px;
  height: 2px;
  background: rgba(255, 255, 255, 0.15);
  margin-top: 120px;
  margin-bottom: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent .footerDivider {
    margin-top: 68px;
  }
}
@media (max-width: 767px) {
  footer .footerContent .footerDivider {
    margin-top: 40px;
  }
}
footer .footerContent .footerBottom {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  footer .footerContent .footerBottom {
    flex-direction: column;
    gap: 32px;
  }
}
footer .footerContent .footerBottom .footerLogotype img {
  width: 224px;
}
footer .footerContent .footerBottom .footerLogotype img.medium, footer .footerContent .footerBottom .footerLogotype img.small {
  display: none;
}
@media (min-width: 768px) and (max-width: 1199px) {
  footer .footerContent .footerBottom .footerLogotype img {
    width: 144.44px;
  }
  footer .footerContent .footerBottom .footerLogotype img.large {
    display: none;
  }
  footer .footerContent .footerBottom .footerLogotype img.medium {
    display: block;
  }
}
@media (max-width: 767px) {
  footer .footerContent .footerBottom .footerLogotype img {
    width: 127.87px;
  }
  footer .footerContent .footerBottom .footerLogotype img.large {
    display: none;
  }
  footer .footerContent .footerBottom .footerLogotype img.small {
    display: block;
  }
}
footer .footerContent .footerBottom .socialLinks {
  display: flex;
  gap: 48px;
}
footer .footerContent .footerBottom .socialLinks a {
  width: 24px;
  height: 24px;
  opacity: 0.7;
  transition: opacity 0.3s ease;
}
@media (max-width: 767px) {
  footer .footerContent .footerBottom .socialLinks a {
    width: 18px;
    height: auto;
  }
}
footer .footerContent .footerBottom .socialLinks a:hover {
  opacity: 1;
}

.article-count,
.icon-article-doc,
#categoryHead .sort,
.sort,
.printArticle {
  display: none;
}

body {
  background: #000000;
  padding: 0;
}
@media (max-width: 767px) {
  body {
    padding: 0;
  }
}
body .background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
  }

body .background.visible {
    opacity: 1;
}
body .background .blue {
  width: 1845px;
  height: 1230px;
  background: radial-gradient(50% 50% at 50% 50%, rgba(92, 195, 250, 0.28) 0%, rgba(92, 195, 250, 0) 100%);
  opacity: 0.8;
  position: absolute;
  left: -665px;
  top: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  body .background .blue {
    width: 1200px;
    height: 806px;
  }
}
@media (max-width: 767px) {
  body .background .blue {
    width: 1731.88px;
    height: 1127.35px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  body .background .blue {
    left: -440px;
  }
}
@media (max-width: 767px) {
  body .background .blue {
    left: -1000px;
  }
}
body .background .pink {
  width: 1845px;
  height: 1230px;
  background: radial-gradient(50% 50% at 50% 50%, rgba(250, 117, 248, 0.28) 0%, rgba(250, 117, 248, 0) 100%);
  opacity: 0.7;
  position: absolute;
  left: 483px;
  top: 12px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  body .background .pink {
    width: 1200px;
    height: 806px;
  }
}
@media (max-width: 767px) {
  body .background .pink {
    width: 1731.88px;
    height: 1127.35px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  body .background .pink {
    left: 300px;
  }
}
@media (max-width: 767px) {
  body .background .pink {
    left: 20px;
  }
}

.navbar, #main-content {
  margin: 0;
}

.navbar .brand {
  display: none;
}

footer p {
  text-align: left;
  margin-bottom: 0;
}

#docsSearch {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  background: transparent;
  border-bottom: none;
  margin: 0;
  padding-top: 88px;
  padding-bottom: 136px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch {
    gap: 40px;
    padding-bottom: 104px;
  }
}
@media (max-width: 767px) {
  #docsSearch {
    padding: 40px 24px 80px 24px;
    margin: 0;
    gap: 32px;
  }
}
@media (max-width: 767px) {
  #docsSearch {
    padding: 24px 24px 40px 24px;
    margin: 0;
    gap: 16px;
  }
}
#docsSearch h2 {
  margin: 0;
  background: radial-gradient(70.54% 70.54% at 50% 50%, #ffffff 0%, rgba(255, 255, 255, 0.5729) 92.71%, rgba(255, 255, 255, 0.6) 92.72%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#docsSearch #searchBar {
  display: flex;
  gap: 8px;
  padding: 0;
  width: 528px;
}
@media (max-width: 767px) {
  #docsSearch #searchBar {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
}
#docsSearch #searchBar .search-query {
  flex: 1;
  max-width: 372px;
  padding: 0px 24px;
  outline-style: solid;
  outline-color: rgba(255, 255, 255, 0.2);
  transition: outline-color 0.3s ease;
  background: rgba(255, 255, 255, 0.05);
  color: #ffffff;
  border: none;
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 100%;
  height: 64px;
  outline-width: 2px;
  border-radius: 8px;
}
#docsSearch #searchBar .search-query:focus {
  outline-color: #ffffff;
  box-shadow: none;
}
#docsSearch #searchBar .search-query::placeholder {
  color: rgba(255, 255, 255, 0.7);
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar .search-query {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar .search-query {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar .search-query {
    height: 48px;
    outline-width: 1px;
    border-radius: 4px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar .search-query {
    height: 40px;
    outline-width: 1px;
    border-radius: 4px;
  }
}
#docsSearch #searchBar .search-query:focus {
  outline: 2px solid white !important;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar .search-query:focus {
    outline: 1px solid white !important;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar .search-query {
    flex: unset;
    max-width: unset;
    margin: 0;
  }
  #docsSearch #searchBar .search-query:focus {
    outline: 1px solid white !important;
  }
}
#docsSearch #searchBar button {
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(273.81deg, #FA75F8, #9E6EE5);
  border: none;
  cursor: pointer;
  position: relative;
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 100%;
  height: 64px;
  padding: 22px 32px 18px 32px;
  border-radius: 6px;
  flex: 0.4;
  position: relative;
  top: 0 !important;
  padding: 0;
  border: none;
  text-shadow: none;
}
#docsSearch #searchBar button:hover {
  text-decoration: none;
}
#docsSearch #searchBar button:hover::after {
  opacity: 1;
}
#docsSearch #searchBar button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 4px;
  border: 1px solid transparent;
  mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  inset: -1px;
  background: linear-gradient(#FA75F8, #9E6EE5) border-box;
}
#docsSearch #searchBar button div, #docsSearch #searchBar button span {
  z-index: 1;
}
#docsSearch #searchBar button::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 3px;
  background: linear-gradient(273.81deg, #914694, #62438B);
  z-index: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
#docsSearch #searchBar button:disabled {
  background: transparent;
  cursor: not-allowed;
}
#docsSearch #searchBar button:disabled:hover::after {
  opacity: 0;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar button {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar button {
    font-size: 18px;
  }
}
#docsSearch #searchBar button::before {
  border-radius: 8px;
  border: 2px solid transparent;
  inset: -2px;
}
#docsSearch #searchBar button::after {
  border-radius: 6px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar button {
    height: 48px;
    padding: 2px 16px 0 16px;
    border-radius: 3px;
  }
  #docsSearch #searchBar button::before {
    inset: -1px;
    border-width: 1px;
    border-radius: 4px;
  }
  #docsSearch #searchBar button::after {
    border-radius: 3px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar button {
    height: 40px;
    padding: 2px 16px 0 16px;
    border-radius: 3px;
  }
  #docsSearch #searchBar button::before {
    inset: -1px;
    border-width: 1px;
    border-radius: 4px;
  }
  #docsSearch #searchBar button::after {
    border-radius: 3px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar button {
    flex: unset;
    padding: 0;
    right: 0;
    width: 100%;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar button .icon-search {
    display: none;
  }
}
#docsSearch #searchBar button span {
  position: relative;
  top: 2px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar button span {
    top: 1px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar button span {
    width: 100%;
    font-size: 18px;
    text-indent: 0;
  }
}
#docsSearch #searchBar #serp-dd {
  box-shadow: none;
  border-radius: 4px;
  background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%);
  backdrop-filter: blur(29px);
  -webkit-backdrop-filter: blur(29px);
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 8px;
}
#docsSearch #searchBar #serp-dd.sb {
  width: 100%;
  border-width: 1px;
  border-radius: 4px;
  box-sizing: border-box;
  top: 42px;
}
#docsSearch #searchBar #serp-dd .result a {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
  transition: color 0.3s ease;
  padding-left: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar #serp-dd .result a {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar #serp-dd .result a {
    font-size: 15px;
    line-height: 24px;
  }
}
#docsSearch #searchBar #serp-dd .result a:hover {
  background: transparent;
}
#docsSearch #searchBar #serp-dd .result .active {
  background: transparent;
}
#docsSearch #searchBar #serp-dd .result .active a {
  color: #ffffff;
}
#docsSearch #searchBar #serp-dd .result .noResults {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  padding-left: 24px;
  color: rgba(255, 255, 255, 0.7);
}
@media (min-width: 768px) and (max-width: 1199px) {
  #docsSearch #searchBar #serp-dd .result .noResults {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #docsSearch #searchBar #serp-dd .result .noResults {
    font-size: 15px;
    line-height: 24px;
  }
}

#contentArea {
  max-width: 1312px;
  padding: 0 64px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea {
    max-width: 1200px;
    padding: 0 32px;
  }
}
@media (max-width: 767px) {
  #contentArea {
    max-width: 768px;
    padding: 0 24px;
  }
}
#contentArea .category-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 32px;
  margin: 0;
  padding-bottom: 80px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .category-list {
    padding-bottom: 120px;
  }
}
@media (max-width: 767px) {
  #contentArea .category-list {
    padding-bottom: 0;
    gap: 24px;
  }
}
#contentArea .category-list .category {
  text-align: center;
  display: inline-block;
  width: 29%;
  cursor: pointer;
  transition: background .15s;
  vertical-align: top;
  position: relative;
  box-sizing: border-box;
  flex: 0 0 calc(33.333% - 21.333px);
  margin: 0;
  background: linear-gradient(273.81deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.15));
  border: none;
  border-radius: 10px;
  padding: 32px;
  font-family: "Adelle Sans";
}

#contentArea .category-list .category::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 10px;
  border: 2px solid transparent;
  mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  background: linear-gradient(93.9deg, rgba(255, 255, 255, 0.3) 2.26%, rgba(255, 255, 255, 0.15)) border-box;
  opacity: 0;
  transition: opacity 0.3s ease;
}
#contentArea .category-list .category:hover::before {
  opacity: 1;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .category-list .category::before {
    border-width: 1px;
  }
}
@media (max-width: 767px) {
  #contentArea .category-list .category {
    flex: 0 0 100%;
    padding: 24px;
  }
  #contentArea .category-list .category::before {
    border-width: 1px;
  }
}
#contentArea .category-list .category h3, #contentArea .category-list .category p {
  color: #ffffff;
}
#contentArea .category-list .category h3 {
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .category-list .category h3 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  #contentArea .category-list .category h3 {
    font-size: 18px;
    line-height: 24px;
  }
}
#contentArea .category-list .category p {
  font-family: "Adelle Sans";
  font-size: 15px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .category-list .category p {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .category-list .category p {
    font-size: 15px;
    line-height: 24px;
  }
}
#contentArea .category-list .category .categoryIcon {
  width: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .category-list .category .categoryIcon {
    width: 40px;
  }
}
@media (max-width: 767px) {
  #contentArea .category-list .category .categoryIcon {
    width: 32px;
  }
}
#contentArea .articleRatings {
  justify-content: left;
  background: none;
  border: none;
  padding: 0;
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .articleRatings {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .articleRatings {
    font-size: 15px;
    line-height: 24px;
  }
}
#contentArea .articleRatings .articleRatings-actions {
  width: auto;
  margin-bottom: 4px;
}
#contentArea .articleRatings .rateAction {
  border-radius: 8px;
  border: none;
  background: none;
  box-shadow: none;
  padding: 4px 8px 2.5px;
  width: auto;
}
#contentArea .articleRatings .rateAction.selected::after {
  margin-left: 4px;
  margin-top: 2px;
  width: 35px;
  border: 2px solid #ffffff;
  border-radius: 8px;
  animation: fadeIn 0.3s ease-in-out;
}
#contentArea .articleRatings .articleRatings-question {
  color: white;
}
#contentArea .articleRatings .rateAction--positive {
  background: rgba(255, 255, 255, 0.1);
}
#contentArea .articleRatings .rateAction--positive span {
  color: #c2f0cd;
}
#contentArea .articleRatings .rateAction--negative {
  background: rgba(255, 255, 255, 0.1);
}
#contentArea .articleRatings .rateAction--negative span {
  color: #e5a6a1;
}
#contentArea .articleRatings button {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .articleRatings button {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .articleRatings button {
    font-size: 15px;
    line-height: 24px;
  }
}
#contentArea .hidden {
  display: none !important;
}
#contentArea .collectionTitle {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
  pointer-events: none;
  cursor: default;
  text-decoration: none;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .collectionTitle {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  #contentArea .collectionTitle {
    font-size: 18px;
    line-height: 24px;
  }
}
#contentArea .collectionTitle a {
  color: white;
}
#contentArea #widgetContainer {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 0 0 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea #widgetContainer {
    gap: 32px;
  }
}
@media (max-width: 767px) {
  #contentArea #widgetContainer {
    flex-direction: column;
    gap: 16px;
    margin-bottom: 64px;
  }
}
#contentArea #widgetContainer .inboxZero {
  width: 48%;
  max-height: 368px;
  object-fit: contain;
  align-self: end;
}
@media (max-width: 767px) {
  #contentArea #widgetContainer .inboxZero {
    width: 100%;
    min-width: none;
  }
}
@media (max-width: 767px) {
  #contentArea #widgetContainer {
    flex-direction: column;
  }
  #contentArea #widgetContainer .widgetWrapper {
    margin-right: 32px;
    width: 100%;
  }
}
#contentArea .widgetWrapper, #contentArea .headerWrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: left;
  align-self: center;
  padding-top: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .widgetWrapper, #contentArea .headerWrapper {
    padding-top: 16px;
  }
}
@media (max-width: 767px) {
  #contentArea .widgetWrapper, #contentArea .headerWrapper {
    padding-top: 16px;
  }
}
#contentArea .guideDescription {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .guideDescription {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .guideDescription {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .guideDescription {
    max-width: 320px;
  }
}
#contentArea #headerContainer {
  display: flex;
  gap: 16px;
  text-align: left;
  width: 1fr;
  flex-direction: row-reverse;
  place-content: start;
}
#contentArea .headerTitle {
  margin: 0;
  background: radial-gradient(70.54% 70.54% at 50% 50%, #ffffff 0%, rgba(255, 255, 255, 0.5729) 92.71%, rgba(255, 255, 255, 0.6) 92.72%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 48px;
  line-height: 64px;
}
@media (max-width: 767px) {
  #contentArea .headerTitle {
    font-size: 32px;
    line-height: 40px;
  }
}
#contentArea .navigationWrapper {
  display: flex;
  gap: 24px;
}
#contentArea .navigationWrapper a {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: white;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .navigationWrapper a {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .navigationWrapper a {
    font-size: 15px;
    line-height: 24px;
  }
}
#contentArea .liveTrainingDiv {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  display: flex;
  flex-direction: column;
  padding: 32px;
  align-items: flex-start;
  gap: 16px;
  border-radius: 10px;
  border: 1px solid var(--glass-gradients-stroke-1, rgba(255, 255, 255, 0.3));
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .liveTrainingDiv {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #contentArea .liveTrainingDiv {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .liveTrainingDiv {
    padding: 16px;
  }
}
@media (max-width: 767px) {
  #contentArea .liveTrainingDiv {
    padding: 16px;
    width: 156px;
  }
}
#contentArea .liveTrainingDiv a {
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(273.81deg, #FA75F8, #9E6EE5);
  border: none;
  cursor: pointer;
  position: relative;
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 100%;
  height: 40px;
  padding: 3.5px 24px 2px;
  border-radius: 3px;
}
#contentArea .liveTrainingDiv a:hover {
  text-decoration: none;
}
#contentArea .liveTrainingDiv a:hover::after {
  opacity: 1;
}
#contentArea .liveTrainingDiv a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 4px;
  border: 1px solid transparent;
  mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  inset: -1px;
  background: linear-gradient(#FA75F8, #9E6EE5) border-box;
}
#contentArea .liveTrainingDiv a div, #contentArea .liveTrainingDiv a span {
  z-index: 1;
}
#contentArea .liveTrainingDiv a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 3px;
  background: linear-gradient(273.81deg, #914694, #62438B);
  z-index: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
#contentArea .liveTrainingDiv a:disabled {
  background: transparent;
  cursor: not-allowed;
}
#contentArea .liveTrainingDiv a:disabled:hover::after {
  opacity: 0;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .liveTrainingDiv a {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  #contentArea .liveTrainingDiv a {
    font-size: 15px;
  }
}
#contentArea .liveTrainingDiv a::before {
  border-radius: 4px;
  border: 1px solid transparent;
  inset: -1px;
}
#contentArea .liveTrainingDiv a::after {
  border-radius: 3px;
}
#contentArea .liveTrainingDiv a .textWrapper {
  height: min-content;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .liveTrainingDiv a {
    height: 32px;
    padding: 4px 16px 2px;
  }
}
@media (max-width: 767px) {
  #contentArea .liveTrainingDiv a {
    height: 28px;
    padding: 4px 16px 2px;
  }
}

/* Center the container-fluid */
.container-fluid {
    max-width: 1312px;
    margin: 0 auto;
    padding-left: 64px;
    padding-right: 64px;
}

@media (min-width: 768px) and (max-width: 1199px) {
    .container-fluid {
        padding-left: 32px;
        padding-right: 32px;
    }
}

@media (max-width: 767px) {
    .container-fluid {
        padding-left: 24px;
        padding-right: 24px;
    }
}

.row-fluid {
    width: 100%;
    *zoom:1}

.row-fluid:after,.row-fluid:before {
    display: table;
    content: "";
    line-height: 0
}

.row-fluid:after {
    clear: both
}

.row-fluid [class*=span] {
    display: block;
    width: 100%;
    min-height: 28px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    margin-left: 2.76243094%;
    *margin-left: 2.70923945%
}

.row-fluid [class*=span]:first-child {
    margin-left: 0
}

.row-fluid .controls-row [class*=span]+[class*=span] {
    margin-left: 2.76243094%
}

.row-fluid .span12 {
    width: 100%;
    *width: 99.94680851%
}

.row-fluid .span11 {
    width: 91.43646409%;
    *width: 91.3832726%
}

.row-fluid .span10 {
    width: 82.87292818%;
    *width: 82.81973669%
}

.row-fluid .span9 {
    width: 74.30939227%;
    *width: 74.25620078%
}

.row-fluid .span8 {
    width: 65.74585635%;
    *width: 65.69266486%
}

.row-fluid .span7 {
    width: 57.18232044%;
    *width: 57.12912895%
}

.row-fluid .span6 {
    width: 48.61878453%;
    *width: 48.56559304%
}

.row-fluid .span5 {
    width: 40.05524862%;
    *width: 40.00205713%
}

.row-fluid .span4 {
    width: 31.49171271%;
    *width: 31.43852122%
}

.row-fluid .span3 {
    width: 22.9281768%;
    *width: 22.87498531%
}

.row-fluid .span2 {
    width: 14.36464088%;
    *width: 14.31144939%
}

.row-fluid .span1 {
    width: 5.80110497%;
    *width: 5.74791348%
}

.row-fluid .offset12 {
    margin-left: 105.52486188%;
    *margin-left: 105.4184789%
}

.row-fluid .offset12:first-child {
    margin-left: 102.76243094%;
    *margin-left: 102.65604796%
}

.row-fluid .offset11 {
    margin-left: 96.96132597%;
    *margin-left: 96.85494299%
}

.row-fluid .offset11:first-child {
    margin-left: 94.19889503%;
    *margin-left: 94.09251205%
}

.row-fluid .offset10 {
    margin-left: 88.39779006%;
    *margin-left: 88.29140708%
}

.row-fluid .offset10:first-child {
    margin-left: 85.63535912%;
    *margin-left: 85.52897614%
}

.row-fluid .offset9 {
    margin-left: 79.83425414%;
    *margin-left: 79.72787116%
}

.row-fluid .offset9:first-child {
    margin-left: 77.0718232%;
    *margin-left: 76.96544023%
}

.row-fluid .offset8 {
    margin-left: 71.27071823%;
    *margin-left: 71.16433525%
}

.row-fluid .offset8:first-child {
    margin-left: 68.50828729%;
    *margin-left: 68.40190431%
}

.row-fluid .offset7 {
    margin-left: 62.70718232%;
    *margin-left: 62.60079934%
}

.row-fluid .offset7:first-child {
    margin-left: 59.94475138%;
    *margin-left: 59.8383684%
}

.row-fluid .offset6 {
    margin-left: 54.14364641%;
    *margin-left: 54.03726343%
}

.row-fluid .offset6:first-child {
    margin-left: 51.38121547%;
    *margin-left: 51.27483249%
}

.row-fluid .offset5 {
    margin-left: 45.5801105%;
    *margin-left: 45.47372752%
}

.row-fluid .offset5:first-child {
    margin-left: 42.81767956%;
    *margin-left: 42.71129658%
}

.row-fluid .offset4 {
    margin-left: 37.01657459%;
    *margin-left: 36.91019161%
}

.row-fluid .offset4:first-child {
    margin-left: 34.25414365%;
    *margin-left: 34.14776067%
}

.row-fluid .offset3 {
    margin-left: 28.45303867%;
    *margin-left: 28.3466557%
}

.row-fluid .offset3:first-child {
    margin-left: 25.69060773%;
    *margin-left: 25.58422476%
}

.row-fluid .offset2 {
    margin-left: 19.88950276%;
    *margin-left: 19.78311978%
}

.row-fluid .offset2:first-child {
    margin-left: 17.12707182%;
    *margin-left: 17.02068884%
}

.row-fluid .offset1 {
    margin-left: 11.32596685%;
    *margin-left: 11.21958387%
}

.row-fluid .offset1:first-child {
    margin-left: 8.56353591%;
    *margin-left: 8.45715293%
}

.row-fluid .offset10 {
    margin-left: 87.23404255%;
    *margin-left: 87.12765957%
}

.row-fluid .offset10:first-child {
    margin-left: 85.10638298%;
    *margin-left: 85%
}

.row-fluid .offset9 {
    margin-left: 78.72340426%;
    *margin-left: 78.61702128%
}

.row-fluid .offset9:first-child {
    margin-left: 76.59574468%;
    *margin-left: 76.4893617%
}

.row-fluid .offset8 {
    margin-left: 70.21276596%;
    *margin-left: 70.10638298%
}

.row-fluid .offset8:first-child {
    margin-left: 68.08510638%;
    *margin-left: 67.9787234%
}

.row-fluid .offset7 {
    margin-left: 61.70212766%;
    *margin-left: 61.59574468%
}

.row-fluid .offset7:first-child {
    margin-left: 59.57446809%;
    *margin-left: 59.46808511%
}

.row-fluid .offset6 {
    margin-left: 53.19148936%;
    *margin-left: 53.08510638%
}

.row-fluid .offset6:first-child {
    margin-left: 51.06382979%;
    *margin-left: 50.95744681%
}

.row-fluid .offset5 {
    margin-left: 44.68085106%;
    *margin-left: 44.57446809%
}

.row-fluid .offset5:first-child {
    margin-left: 42.55319149%;
    *margin-left: 42.44680851%
}

.row-fluid .offset4 {
    margin-left: 36.17021277%;
    *margin-left: 36.06382979%
}

.row-fluid .offset4:first-child {
    margin-left: 34.04255319%;
    *margin-left: 33.93617021%
}

.row-fluid .offset3 {
    margin-left: 27.65957447%;
    *margin-left: 27.55319149%
}

.row-fluid .offset3:first-child {
    margin-left: 25.53191489%;
    *margin-left: 25.42553191%
}

.row-fluid .offset2 {
    margin-left: 19.14893617%;
    *margin-left: 19.04255319%
}

.row-fluid .offset2:first-child {
    margin-left: 17.0212766%;
    *margin-left: 16.91489362%
}

.row-fluid .offset1 {
    margin-left: 10.63829787%;
    *margin-left: 10.53191489%
}

.row-fluid .offset1:first-child {
    margin-left: 8.5106383%;
    *margin-left: 8.40425532%
}

.row-fluid [class*=span].hide,[class*=span].hide {
    display: none
}

.row-fluid [class*=span].pull-right,[class*=span].pull-right {
    float: right
}

.row-fluid [class*=span],.uneditable-input[class*=span],[class*=span] {
    float: none;
    display: block;
    margin-left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.row-fluid .span12,.span12 {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.row-fluid [class*=offset]:first-child {
    margin-left: 0
}

@media (max-width: 768px) {
    body {
        padding-left:20px;
        padding-right: 20px
    }

    .navbar-fixed-bottom,.navbar-fixed-top,.navbar-static-top {
        margin-left: -20px;
        margin-right: -20px
    }

    .container-fluid {
        padding: 0
    }

    .dl-horizontal dt {
        float: none;
        clear: none;
        width: auto;
        text-align: left
    }

    .dl-horizontal dd {
        margin-left: 0
    }

    .container {
        width: auto
    }

    .row-fluid {
        width: 100%
    }

    .row,.thumbnails {
        margin-left: 0
    }

    .thumbnails>li {
        float: none;
        margin-left: 0
    }

    .row-fluid [class*=span],.uneditable-input[class*=span],[class*=span] {
        float: none;
        display: block;
        width: 100%;
        margin-left: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .row-fluid .span12,.span12 {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .row-fluid [class*=offset]:first-child {
        margin-left: 0
    }

    .input-large,.input-xlarge,.input-xxlarge,.uneditable-input,input[class*=span],select[class*=span],textarea[class*=span] {
        display: block;
        width: 100%;
        min-height: 28px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .input-append input,.input-append input[class*=span],.input-prepend input,.input-prepend input[class*=span] {
        display: inline-block;
        width: auto
    }

    .controls-row [class*=span]+[class*=span] {
        margin-left: 0
    }

    .modal {
        position: fixed;
        top: 20px;
        left: 20px;
        right: 20px;
        width: auto;
        margin: 0
    }

    .modal.fade {
        top: -100px
    }

    .modal.fade.in {
        top: 20px
    }
}


/* Remove underlines from all links in all states */
a,
a:link,
a:visited,
a:hover,
a:active,
a:focus {
  text-decoration: none !important;
}

/* Ensure no elements inside links get underlines */
a *,
a > * {
  text-decoration: none !important;
}

#main-content {
  padding-left: 0;
  float: right;
  margin-bottom: 2em;
  padding: 32px 0;
}
#main-content .contentWrapper {
  background: rgba(255, 255, 255, 0.05);
  border: none;
  border-radius: 10px;
  padding: 48px 80px;
  font-family: 'Adelle Sans';
}
#main-content .contentWrapper h1 {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 40px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper h1 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper h1 {
    font-size: 20px;
    line-height: 28px;
  }
}
#main-content .contentWrapper h2 {
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 32px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper h2 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper h2 {
    font-size: 18px;
    line-height: 24px;
  }
}
#main-content .contentWrapper h3 {
  font-family: "Operator Mono";
  font-size: 24px;
  line-height: 32px;
  font-family: "Adelle Sans";
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper h3 {
    font-size: 20px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper h3 {
    font-size: 18px;
    line-height: 24px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper {
    padding: 32px 32px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper {
    padding: 32px 24px;
  }
}
#main-content .contentWrapper #categoryHead h1, #main-content .contentWrapper #categoryHead h2, #main-content .contentWrapper #categoryHead h3, #main-content .contentWrapper #categoryHead h4, #main-content .contentWrapper #categoryHead p, #main-content .contentWrapper #categoryHead li,
#main-content .contentWrapper .articleList h1,
#main-content .contentWrapper .articleList h2,
#main-content .contentWrapper .articleList h3,
#main-content .contentWrapper .articleList h4,
#main-content .contentWrapper .articleList p,
#main-content .contentWrapper .articleList li,
#main-content .contentWrapper #fullArticle h1,
#main-content .contentWrapper #fullArticle h2,
#main-content .contentWrapper #fullArticle h3,
#main-content .contentWrapper #fullArticle h4,
#main-content .contentWrapper #fullArticle p,
#main-content .contentWrapper #fullArticle li,
#main-content .contentWrapper #serp h1,
#main-content .contentWrapper #serp h2,
#main-content .contentWrapper #serp h3,
#main-content .contentWrapper #serp h4,
#main-content .contentWrapper #serp p,
#main-content .contentWrapper #serp li {
  color: #ffffff;
}
#main-content .contentWrapper #categoryHead h1, #main-content .contentWrapper #categoryHead h2, #main-content .contentWrapper #categoryHead h3, #main-content .contentWrapper #categoryHead h4, #main-content .contentWrapper #categoryHead p, #main-content .contentWrapper #categoryHead ol, #main-content .contentWrapper #categoryHead ul,
#main-content .contentWrapper .articleList h1,
#main-content .contentWrapper .articleList h2,
#main-content .contentWrapper .articleList h3,
#main-content .contentWrapper .articleList h4,
#main-content .contentWrapper .articleList p,
#main-content .contentWrapper .articleList ol,
#main-content .contentWrapper .articleList ul,
#main-content .contentWrapper #fullArticle h1,
#main-content .contentWrapper #fullArticle h2,
#main-content .contentWrapper #fullArticle h3,
#main-content .contentWrapper #fullArticle h4,
#main-content .contentWrapper #fullArticle p,
#main-content .contentWrapper #fullArticle ol,
#main-content .contentWrapper #fullArticle ul,
#main-content .contentWrapper #serp h1,
#main-content .contentWrapper #serp h2,
#main-content .contentWrapper #serp h3,
#main-content .contentWrapper #serp h4,
#main-content .contentWrapper #serp p,
#main-content .contentWrapper #serp ol,
#main-content .contentWrapper #serp ul {
  margin-bottom: 24px;
}
#main-content .contentWrapper #categoryHead p, #main-content .contentWrapper #categoryHead li,
#main-content .contentWrapper .articleList p,
#main-content .contentWrapper .articleList li,
#main-content .contentWrapper #fullArticle p,
#main-content .contentWrapper #fullArticle li,
#main-content .contentWrapper #serp p,
#main-content .contentWrapper #serp li {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper #categoryHead p, #main-content .contentWrapper #categoryHead li,
  #main-content .contentWrapper .articleList p,
  #main-content .contentWrapper .articleList li,
  #main-content .contentWrapper #fullArticle p,
  #main-content .contentWrapper #fullArticle li,
  #main-content .contentWrapper #serp p,
  #main-content .contentWrapper #serp li {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper #categoryHead p, #main-content .contentWrapper #categoryHead li,
  #main-content .contentWrapper .articleList p,
  #main-content .contentWrapper .articleList li,
  #main-content .contentWrapper #fullArticle p,
  #main-content .contentWrapper #fullArticle li,
  #main-content .contentWrapper #serp p,
  #main-content .contentWrapper #serp li {
    font-size: 15px;
    line-height: 24px;
  }
}
#main-content .contentWrapper #categoryHead p,
#main-content .contentWrapper .articleList p,
#main-content .contentWrapper #fullArticle p,
#main-content .contentWrapper #serp p {
  margin-top: 0;
}
#main-content .contentWrapper #categoryHead img,
#main-content .contentWrapper .articleList img,
#main-content .contentWrapper #fullArticle img,
#main-content .contentWrapper #serp img {
  border: none;
}
#main-content .contentWrapper #categoryHead br,
#main-content .contentWrapper .articleList br,
#main-content .contentWrapper #fullArticle br,
#main-content .contentWrapper #serp br {
  display: none;
}
#main-content .contentWrapper #categoryHead a,
#main-content .contentWrapper .articleList a,
#main-content .contentWrapper #fullArticle a,
#main-content .contentWrapper #serp a {
  background: linear-gradient(273.81deg, #F991F9, #B38BEB);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
}
#main-content .contentWrapper #categoryHead a:hover, #main-content .contentWrapper #categoryHead a:focus, #main-content .contentWrapper #categoryHead a:active,
#main-content .contentWrapper .articleList a:hover,
#main-content .contentWrapper .articleList a:focus,
#main-content .contentWrapper .articleList a:active,
#main-content .contentWrapper #fullArticle a:hover,
#main-content .contentWrapper #fullArticle a:focus,
#main-content .contentWrapper #fullArticle a:active,
#main-content .contentWrapper #serp a:hover,
#main-content .contentWrapper #serp a:focus,
#main-content .contentWrapper #serp a:active {
  background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#main-content .contentWrapper #categoryHead .nextPageButton,
#main-content .contentWrapper .articleList .nextPageButton,
#main-content .contentWrapper #fullArticle .nextPageButton,
#main-content .contentWrapper #serp .nextPageButton {
  text-align: left;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 32px;
}
#main-content .contentWrapper #categoryHead .nextPageButton p,
#main-content .contentWrapper .articleList .nextPageButton p,
#main-content .contentWrapper #fullArticle .nextPageButton p,
#main-content .contentWrapper #serp .nextPageButton p {
  margin-bottom: 0;
}
#main-content .contentWrapper #categoryHead .nextPageButton a,
#main-content .contentWrapper .articleList .nextPageButton a,
#main-content .contentWrapper #fullArticle .nextPageButton a,
#main-content .contentWrapper #serp .nextPageButton a {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 48px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper #categoryHead .nextPageButton a,
  #main-content .contentWrapper .articleList .nextPageButton a,
  #main-content .contentWrapper #fullArticle .nextPageButton a,
  #main-content .contentWrapper #serp .nextPageButton a {
    font-size: 24px;
    line-height: 40px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper #categoryHead .nextPageButton a,
  #main-content .contentWrapper .articleList .nextPageButton a,
  #main-content .contentWrapper #fullArticle .nextPageButton a,
  #main-content .contentWrapper #serp .nextPageButton a {
    font-size: 20px;
    line-height: 32px;
  }
}
#main-content .contentWrapper #categoryHead .nextPageButton a.training201Link,
#main-content .contentWrapper .articleList .nextPageButton a.training201Link,
#main-content .contentWrapper #fullArticle .nextPageButton a.training201Link,
#main-content .contentWrapper #serp .nextPageButton a.training201Link {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper #categoryHead .nextPageButton a.training201Link,
  #main-content .contentWrapper .articleList .nextPageButton a.training201Link,
  #main-content .contentWrapper #fullArticle .nextPageButton a.training201Link,
  #main-content .contentWrapper #serp .nextPageButton a.training201Link {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper #categoryHead .nextPageButton a.training201Link,
  #main-content .contentWrapper .articleList .nextPageButton a.training201Link,
  #main-content .contentWrapper #fullArticle .nextPageButton a.training201Link,
  #main-content .contentWrapper #serp .nextPageButton a.training201Link {
    font-size: 15px;
    line-height: 24px;
  }
}
#main-content .contentWrapper #categoryHead .nextPageButton .congratsTitle,
#main-content .contentWrapper .articleList .nextPageButton .congratsTitle,
#main-content .contentWrapper #fullArticle .nextPageButton .congratsTitle,
#main-content .contentWrapper #serp .nextPageButton .congratsTitle {
  font-family: "Adelle Sans";
  font-size: 32px;
  line-height: 48px;
  color: #ffffff;
  margin-bottom: 0;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper #categoryHead .nextPageButton .congratsTitle,
  #main-content .contentWrapper .articleList .nextPageButton .congratsTitle,
  #main-content .contentWrapper #fullArticle .nextPageButton .congratsTitle,
  #main-content .contentWrapper #serp .nextPageButton .congratsTitle {
    font-size: 24px;
    line-height: 40px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper #categoryHead .nextPageButton .congratsTitle,
  #main-content .contentWrapper .articleList .nextPageButton .congratsTitle,
  #main-content .contentWrapper #fullArticle .nextPageButton .congratsTitle,
  #main-content .contentWrapper #serp .nextPageButton .congratsTitle {
    font-size: 20px;
    line-height: 32px;
  }
}
@media (min-width: 1440px) {
  #main-content .contentWrapper #categoryHead {
    padding-top: 8px;
  }
}
@media (min-width: 1200px) and (max-width: 1439px) {
  #main-content .contentWrapper #categoryHead {
    padding-top: 8px;
  }
}

#main-content .contentWrapper #fullArticle strong {
  color: #ffffff;
}
#main-content .contentWrapper #serp h1 {
  overflow-wrap: break-word;
}
#main-content .contentWrapper #serp p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#main-content .contentWrapper #serp .articleList li {
  padding-left: 0;
}
#main-content .contentWrapper #serp .articleList li a {
  margin-left: 0;
}
#main-content .contentWrapper blockquote {
  font-style: normal;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 4px;
}
#main-content .contentWrapper blockquote p {
  margin-bottom: 0;
}
#main-content .contentWrapper .articleFoot {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: start;
  justify-content: space-between;
  margin-top: 0;
  padding-top: 32px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
#main-content .contentWrapper .articleFoot .lu {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  font-style: normal;
  color: #a0a0a0;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper .articleFoot .lu {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper .articleFoot .lu {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper .articleFoot .lu {
    margin: 0;
  }
}
#main-content .contentWrapper .articleFoot .feedbackDiv {
  color: #ffffff;
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 768px) and (max-width: 1199px) {
  #main-content .contentWrapper .articleFoot .feedbackDiv {
    font-size: 15px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #main-content .contentWrapper .articleFoot .feedbackDiv {
    font-size: 15px;
    line-height: 24px;
  }
}
#main-content .contentWrapper .articleFoot .feedbackDiv a {
  background: linear-gradient(273.81deg, #F991F9, #B38BEB);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
}
#main-content .contentWrapper .articleFoot .feedbackDiv a:hover, #main-content .contentWrapper .articleFoot .feedbackDiv a:focus, #main-content .contentWrapper .articleFoot .feedbackDiv a:active {
  background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media (max-width: 767px) {
  #main-content .contentWrapper .articleFoot {
    flex-direction: column;
    gap: 16px;
  }
}

.contentWrapper p.descrip {
    font-size: 15px;
    margin-bottom: 20px;
    color: #757575
}

.articleList {
    list-style: none;
    margin: 0 0 38px 0;
    font-size: 1.3em;
}

.articleList li {
    margin: 1.4em 0;
    padding-left: 25px
}

.articleList a {
    line-height: 1.5em;
    margin-left: -24px;
    text-decoration: none
}

.articleList a:hover span {
    text-decoration: underline
}

#main-content .related {
  border: none;
  border-radius: 10px;
}
#main-content .related h3 {
  text-transform: none;
}
#main-content .related ul li a {
  background: linear-gradient(273.81deg, #F991F9, #B38BEB);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
}
#main-content .related ul li a:hover, #main-content .related ul li a:focus, #main-content .related ul li a:active {
  background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Base style for the homepage link */
a[title="Home"] {
    background: linear-gradient(273.81deg, #F991F9, #B38BEB);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration: none;
  }
  
  /* Hover, focus, and active states for the homepage link */
  a[title="Home"]:hover, 
  a[title="Home"]:focus, 
  a[title="Home"]:active {
    background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

#searchBar {
    text-align: center;
    margin-bottom: 0;
    padding: 2em 0;
    position: relative;
    width: 620px;
    margin: 0 auto
}

#searchBar .search-query {
    border-radius: 5px;
    font-size: 18px;
    line-height: 22px;
    width: 100%;
    height: 50px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

#searchBar button {
    color: #fff;
    text-shadow: 0 -1px 1px rgba(0,0,0,.4);
    background: #4F92CA;
    border-radius: 0 5px 5px 0;
    border: 1px solid #407FB3;
    font-size: 18px;
    padding: 0 1.5em;
    height: 50px;
    position: absolute;
    top: 24px;
    right: -1px
}

#searchBar button .icon-search {
    display: none
}

#searchBar button:hover {
    background: #4689C2
}

#searchBar.sm {
    width: 100%;
    padding: 0;
    margin-bottom: 30px;
}

#searchBar.sm button {
    height: 40px;
    top: 0
}

#searchBar.sm button:hover {
    background: 0 0
}

#searchBar.sm button .icon-search {
    display: block;
    text-shadow: none
}

#sidebar {
    width: calc((100% - 352px) / 12 * 3 + 64px);
  }

  @media (max-width: 767px) {
    #sidebar {
      width: unset;
      margin-top: 0;
      padding-top: 64px;
      padding-bottom: 0;
    }
  }
  #sidebar h3 {
    display: none;
  }
  #sidebar #searchBar .search-query {
    padding: 4px 24px 0px 24px;
    outline-style: solid;
    outline-color: rgba(255, 255, 255, 0.2);
    transition: outline-color 0.3s ease;
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
    border: none;
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 100%;
    height: 40px;
    outline-width: 1px;
    border-radius: 4px;
    padding-left: 24px;
    border-radius: 4px;
  }
  #sidebar #searchBar .search-query:focus {
    outline-color: #ffffff;
    box-shadow: none;
  }
  #sidebar #searchBar .search-query::placeholder {
    color: rgba(255, 255, 255, 0.7);
  }
  @media (min-width: 768px) and (max-width: 1199px) {
    #sidebar #searchBar .search-query {
      font-size: 15px;
    }
  }
  @media (max-width: 767px) {
    #sidebar #searchBar .search-query {
      font-size: 15px;
    }
  }
  #sidebar #searchBar .search-query:focus {
    outline: 1px solid white !important;
  }
  #sidebar #serp-dd {
    box-shadow: none;
    border-radius: 4px;
    background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%);
    backdrop-filter: blur(29px);
    -webkit-backdrop-filter: blur(29px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
  }
  #sidebar #serp-dd.sb {
    width: 100%;
    border-width: 1px;
    border-radius: 4px;
    box-sizing: border-box;
    top: 42px;
  }
  #sidebar #serp-dd .result a {
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 24px;
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.3s ease;
    padding-left: 24px;
  }
  @media (min-width: 768px) and (max-width: 1199px) {
    #sidebar #serp-dd .result a {
      font-size: 15px;
      line-height: 24px;
    }
  }
  @media (max-width: 767px) {
    #sidebar #serp-dd .result a {
      font-size: 15px;
      line-height: 24px;
    }
  }
  #sidebar #serp-dd .result a:hover {
    background: transparent;
  }
  #sidebar #serp-dd .result .active {
    background: transparent;
  }
  #sidebar #serp-dd .result .active a {
    color: #ffffff;
  }
  #sidebar #serp-dd .result .noResults {
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 24px;
    padding-left: 24px;
    color: rgba(255, 255, 255, 0.7);
  }
  @media (min-width: 768px) and (max-width: 1199px) {
    #sidebar #serp-dd .result .noResults {
      font-size: 15px;
      line-height: 24px;
    }
  }
  @media (max-width: 767px) {
    #sidebar #serp-dd .result .noResults {
      font-size: 15px;
      line-height: 24px;
    }
  }
  #sidebar .nav.nav-list a {
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 24px;
    text-shadow: none;
    color: #ffffff;
  }
  @media (min-width: 768px) and (max-width: 1199px) {
    #sidebar .nav.nav-list a {
      font-size: 15px;
      line-height: 24px;
    }
  }
  @media (max-width: 767px) {
    #sidebar .nav.nav-list a {
      font-size: 15px;
      line-height: 24px;
    }
  }
  #sidebar .nav.nav-list a:hover {
    background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  #sidebar .nav.nav-list .active a {
    background: linear-gradient(273.81deg, #F991F9, #B38BEB);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration: none;
  }
  #sidebar .nav.nav-list .active a:hover, #sidebar .nav.nav-list .active a:focus, #sidebar .nav.nav-list .active a:active {
    background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  #sidebar .nav.nav-list .active .icon-arrow, #sidebar .nav.nav-list .active a:hover .icon-arrow {
    display: none;
  }

#sidebar {
    margin: 32px 0 0 0;
}

#sidebar form {
    position: relative;
    margin: 0 0 30px 0;
}

#sidebar form .search-query {
    display: block;
    width: 100%;
    margin: 0;
    padding-right: 35px;
    font-size: 14px;
    line-height: 18px;
    height: 40px;
    border: 1px solid #D0D0D0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 3px;
    color: #666
}

#sidebar form .search-query:-moz-placeholder,#sidebar form .search-query:-ms-input-placeholder,#sidebar form .search-query::-moz-placeholder,#sidebar form .search-query::-webkit-input-placeholder {
    color: #b1b0b0
}

#sidebar form .search-query:focus,#sidebar form .search-query:focus:invalid {
    border-color: rgba(106,155,208,.7);
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 4px rgba(106,155,208,.4);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 4px rgba(106,155,208,.4);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 4px rgba(106,155,208,.4);
    outline: 0!important
}

#sidebar form button {
    position: absolute;
    top: 10px;
    right: 12px;
    margin: 0;
    padding: 0;
    line-height: 16px;
    border: 0;
    background: 0 0
}

#sidebar h3 {
    text-transform: uppercase;
    font-size: 12px;
    color: #222;
    margin-bottom: 4px
}

#sidebar .nav-list {
    padding: 0;
    margin-bottom: 34px;
}

#sidebar .nav-list li {
    margin: 2px 0 3px 0;
}

#sidebar .nav-list a {
    display: inline-block;
    color: #858585;
    font-size: 1.1em;
    padding: 6px 15px 6px 0;
    line-height: 20px;
    margin-left: 0
}

#sidebar .nav-list a:focus,#sidebar .nav-list a:hover {
    text-decoration: none;
    color: #222;
    background: 0 0
}

#sidebar .nav-list a .icon-arrow {
    display: none
}

#sidebar .nav-list .active a,#sidebar .nav-list .active a:focus,#sidebar .nav-list .active a:hover {
    font-weight: 700;
    color: #222;
    background: 0 0;
    text-shadow: none
}

#sidebar .nav-list .active a .icon-arrow,#sidebar .nav-list .active a:focus .icon-arrow,#sidebar .nav-list .active a:hover .icon-arrow {
    display: inline-block
}

#sidebar .contactUs {
    color: #b3b3b3
}

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

#sidebar #searchBar button {
    cursor: pointer;
}

#sidebar #searchBar button .icon-search {
    display: none;
}
  
#sidebar #searchBar button:before {
    content: '';
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

#fullArticle {
    font-size: 14px;
    color: #585858;
    line-height: 1.55em
}

#fullArticle.withPreview {
    padding-top: 20px
}

#fullArticle.withPreview .printArticle {
    top: 73px
}

#fullArticle .title {
    margin: 0 30px .5em 0
}

#fullArticle .printArticle {
    position: absolute;
    right: 46px;
    top: 53px
}

#fullArticle .printArticle:hover {
    text-decoration: none
}

#fullArticle .printArticle:hover .icon-print {
    color: #A8A8A8
}

#fullArticle h1,#fullArticle h2,#fullArticle h3,#fullArticle h4,#fullArticle h5 {
    margin-bottom: .65em;
    color: #222
}

#fullArticle h2 {
    font-size: 24px;
    line-height: 32px
}

#fullArticle h3 {
    font-size: 21px;
    line-height: 28px
}

#fullArticle h4 {
    font-size: 18px;
    line-height: 25px
}

#fullArticle h5 {
    font-size: 1em
}

#fullArticle blockquote,#fullArticle dd,#fullArticle div,#fullArticle li,#fullArticle ol,#fullArticle p,#fullArticle table,#fullArticle ul {
    font-size: 14px;
    color: #585858;
    line-height: 1.55em;
    margin-bottom: 1.5em;
}

#fullArticle ol ol {
    list-style-type: lower-alpha
}

#fullArticle li {
    margin-bottom: 10px
}

#fullArticle li>figure {
    display: inline-block;
    vertical-align: top
}

#fullArticle li>p {
    margin: 0
}

#fullArticle li>figure img,#fullArticle li>p img {
    margin-top: 0
}

#fullArticle blockquote {
    font-style: italic;
    border-left-color: #D3D3D3;
    border-width: 5px;
    padding: 3px 30px 7px 20px
}

#fullArticle blockquote p {
    font-weight: inherit;
    margin-top: 0
}

#fullArticle blockquote p:last-child {
    margin-bottom: 0
}

#fullArticle strong {
    color: #494949
}

#fullArticle strong a {
    color: #4381b5
}

#fullArticle pre {
    margin: 0 0 2em 0
}

#fullArticle pre>p {
    color: unset;
    font-size: unset;
    line-height: unset;
    margin-bottom: 0;
    min-height: 22px
}

#fullArticle code,#fullArticle pre {
    font-size: 12px;
    line-height: 22px;
    padding: 10px 20px 12px 15px
}

#fullArticle code {
    line-height: 1;
    padding: 0 5px;
    white-space: normal
}

#fullArticle hr {
    border-top: 2px solid #e2e2e2;
    border-bottom: 1px solid #fff;
    margin: 40px auto 30px auto
}

#fullArticle table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0
}

#fullArticle table td,#fullArticle table th {
    padding: 8px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #e2e2e2
}

#fullArticle table td>p:last-child,#fullArticle table th>p:last-child {
    margin-bottom: 0
}

#fullArticle table thead {
    font-weight: 700;
    color: #222
}

#fullArticle table thead th {
    vertical-align: bottom
}

#fullArticle table caption+thead tr:first-child td,#fullArticle table caption+thead tr:first-child th,#fullArticle table colgroup+thead tr:first-child td,#fullArticle table colgroup+thead tr:first-child th,#fullArticle table thead:first-child tr:first-child td,#fullArticle table thead:first-child tr:first-child th {
    border-top: 0
}

#fullArticle table tbody+tbody {
    border-top: 2px solid #e2e2e2
}

#fullArticle table.table-striped tbody>tr:nth-child(odd)>td,#fullArticle table.table-striped tbody>tr:nth-child(odd)>th {
    background-color: #f5f5f5
}

#fullArticle table.table-bordered {
    border: 1px solid #e2e2e2;
    border-collapse: separate;
    border-left: 0;
    border-radius: 3px
}

#fullArticle table.table-bordered td,#fullArticle table.table-bordered th {
    border-left: 1px solid #e2e2e2
}

#fullArticle table.table-bordered tr:first-child td {
    border-top: 0
}

#fullArticle dl {
    margin-bottom: 1em
}

#fullArticle dt {
    float: left;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    padding: 4px 9px;
    margin-bottom: 1em;
    font-size: 18px;
    line-height: 1.2em;
    border-radius: 50px;
    color: #fff;
    background: #999;
    vertical-align: baseline;
    white-space: nowrap
}

#fullArticle dd {
    padding-top: 3px;
    margin: 0 0 5px 45px;
    *zoom:1}

#fullArticle dd:after,#fullArticle dd:before {
    display: table;
    content: "";
    line-height: 0
}

#fullArticle dd:after {
    clear: both
}

#fullArticle dd h1,#fullArticle dd h2,#fullArticle dd h3,#fullArticle dd h4,#fullArticle dd h5 {
    margin-top: 0
}

#fullArticle .callout,#fullArticle .callout-blue,#fullArticle .callout-green,#fullArticle .callout-red,#fullArticle .callout-yellow,#fullArticle .private-note {
    border-left: 5px solid;
    color: #333;
    font-size: 14px;
    margin-bottom: 2em;
    padding: 16px 25px 16px 20px
}

#fullArticle .callout-blue>:last-child,#fullArticle .callout-green>:last-child,#fullArticle .callout-red>:last-child,#fullArticle .callout-yellow>:last-child,#fullArticle .callout>:last-child,#fullArticle .private-note>:last-child {
    margin-bottom: 0
}

#fullArticle .callout p,#fullArticle .callout-blue p,#fullArticle .callout-green p,#fullArticle .callout-red p,#fullArticle .callout-yellow p,#fullArticle .private-note p {
    font-size: 14px
}

#fullArticle .callout h3,#fullArticle .callout-blue h3,#fullArticle .callout-green h3,#fullArticle .callout-red h3,#fullArticle .callout-yellow h3,#fullArticle .private-note h3 {
    font-size: 21px;
    font-weight: 400;
    line-height: 18px;
    margin: 0 0 10px 0
}

#fullArticle .dashed {
    border: 1px dashed
}

#fullArticle .callout-yellow {
    background: #fffcd5;
    border-color: #e7dca4
}

#fullArticle .callout-blue {
    background: #e8f4ff;
    border-color: #bed1e6
}

#fullArticle .callout-green {
    background: #e5fadc;
    border-color: #bbdaaf
}

#fullArticle .callout-red {
    background: #fde8e8;
    border-color: #e7aaaa
}

#fullArticle .callout {
    background: #f1f1f1;
    border-color: #cfcfcf
}

#fullArticle .private-note {
    background: #fffcd5 url(../img/lock.png) no-repeat top right;
    border-color: #e7dca4
}

#fullArticle figure {
    margin: 0 0 1.5em;
    width: fit-content
}

#fullArticle img {
    display: block;
    margin: 1em 0 2em 0;
    padding: 4px;
    border-radius: 4px;
    border: 1px solid #d6d6d6;
    box-sizing: border-box
}

#fullArticle img.noBdr {
    border: 0;
    padding: 0;
    border-radius: 0
}

#fullArticle .align-center,#fullArticle .align-left,#fullArticle .align-right {
    width: fit-content
}

#fullArticle .align-center {
    margin-left: auto;
    margin-right: auto
}

#fullArticle .align-center img {
    margin-left: auto;
    margin-right: auto
}

#fullArticle .align-right {
    margin-left: auto
}

#fullArticle .align-right img {
    margin-left: auto
}

#fullArticle .image-caption,#fullArticle figcaption {
    display: block;
    text-align: left;
    margin-top: -26px;
    color: #919191;
    font-size: 13px;
    font-style: italic
}

#fullArticle figcaption {
    text-align: center;
    min-width: 100%;
    max-width: min-content
}

#fullArticle .video {
    position: relative;
    height: 0;
    padding: 0 0 67.5% 0;
    margin-bottom: 1.5em
}

#fullArticle .video.widescreen {
    padding-bottom: 56.25%
}

#fullArticle .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#fullArticle .video.video-responsive {
    padding: 0;
    height: auto
}

#fullArticle .badge {
    background: #aaaeb7;
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 11px;
    padding: 4px 5px;
    text-transform: uppercase;
    vertical-align: text-top
}

#fullArticle .badge.info {
    background: #3f8abf
}

#fullArticle .badge.success {
    background: #43ac6d
}

#fullArticle .badge.warning {
    background: #dfb03a
}

#fullArticle .badge.error {
    background: #d62b29
}

#fullArticle .gist-data {
    font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
    margin-bottom: 0
}

#fullArticle .gist-data .lines {
    margin-bottom: 0
}

#fullArticle .gist-data .line-numbers,#fullArticle .gist-data div {
    font-size: 12px;
    line-height: 18px
}

#fullArticle .gist-data .line-numbers {
    background: #fff;
    text-align: right
}

#fullArticle .gist-data div {
    margin-bottom: 0
}

#fullArticle .gist-data table td {
    border-top: 0
}

#fullArticle .gist-meta {
    background: #fff;
    border-radius: 0 0 3px 3px;
    font-weight: 400;
    margin-bottom: 0
}

/* Search container styles */
.search.search-full {
  display: flex;
  gap: 8px;
  padding: 0;
  width: 528px;
  margin: 0 auto;
}

@media (max-width: 767px) {
  .search.search-full {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
}

/* Search form styles */
.search.search-full form {
  display: flex;
  width: 100%;
  gap: 8px;
}

/* Input field styles */
.search.search-full input[type="search"] {
  flex: 1;
  max-width: 372px;
  padding: 0px 24px;
  outline-style: solid;
  outline-color: rgba(255, 255, 255, 0.2);
  transition: outline-color 0.3s ease;
  background: rgba(255, 255, 255, 0.05);
  color: #ffffff;
  border: none;
  font-family: "Adelle Sans";
  font-size: 24px;
  line-height: 100%;
  height: 64px;
  outline-width: 2px;
  border-radius: 8px;
  width: 100%;
}

.search.search-full input[type="search"]:focus {
  outline-color: #ffffff;
  box-shadow: none;
}

.search.search-full input[type="search"]::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

@media (min-width: 768px) and (max-width: 1199px) {
  .search.search-full input[type="search"] {
    font-size: 20px;
    height: 48px;
    outline-width: 1px;
    border-radius: 4px;
  }
  
  .search.search-full input[type="search"]:focus {
    outline: 1px solid white !important;
  }
}

@media (max-width: 767px) {
  .search.search-full input[type="search"] {
    flex: unset;
    max-width: unset;
    margin: 0;
    width: 100%;
    font-size: 18px;
    height: 40px;
    outline-width: 1px;
    border-radius: 4px;
  }
  
  .search.search-full input[type="search"]:focus {
    outline: 1px solid white !important;
  }
}

/* Search icon styling */
.search-icon {
  display: none;
}

/* Hide clear button by default */
.search.search-full .clear-button {
  display: none;
}

/* Search results dropdown styling */
#serp-dd {
  box-shadow: none;
  border-radius: 4px;
  background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%);
  backdrop-filter: blur(29px);
  -webkit-backdrop-filter: blur(29px);
  border: 2px solid rgba(255, 255, 255, 0.2);
  border-radius: 8px;
  width: 100%;
}

#serp-dd.sb {
  width: 100%;
  border-width: 1px;
  border-radius: 4px;
  box-sizing: border-box;
  top: 42px;
}

#serp-dd .result a {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
  transition: color 0.3s ease;
  padding-left: 24px;
}

#serp-dd .result a:hover {
  background: transparent;
}

#serp-dd .result .active {
  background: transparent;
}

#serp-dd .result .active a {
  color: #ffffff;
}

#serp-dd .result .noResults {
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  padding-left: 24px;
  color: rgba(255, 255, 255, 0.7);
}

@media (min-width: 768px) and (max-width: 1199px) {
  #serp-dd .result a,
  #serp-dd .result .noResults {
    font-size: 15px;
    line-height: 24px;
  }
}

@media (max-width: 767px) {
  #serp-dd .result a,
  #serp-dd .result .noResults {
    font-size: 15px;
    line-height: 24px;
  }
}
/* Zendesk Autocomplete Styling - Custom Overrides */
/* Main autocomplete container */
zd-autocomplete {
    background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%) !important;
    backdrop-filter: blur(29px) !important;
    -webkit-backdrop-filter: blur(29px) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-family: "Adelle Sans" !important;
    margin-top: 0 !important;
    z-index: 1000 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

@media (max-width: 767px) {
    zd-autocomplete {
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: calc(100vw - 30px) !important;
        max-width: 100% !important;
    }
}

/* Hide the header */
zd-autocomplete-header {
    display: none !important;
}

/* Option styling - equivalent to .result a */
zd-autocomplete-option {
    font-family: "Adelle Sans" !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    transition: color 0.3s ease !important;
    padding: 8px 24px !important;
    display: block !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
    zd-autocomplete-option {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

@media (max-width: 767px) {
    zd-autocomplete-option {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

/* Hover state */
zd-autocomplete-option:hover {
    background: transparent !important;
    color: #ffffff !important;
}

/* Selected state */
zd-autocomplete-option[aria-selected=true] {
    background: transparent !important;
    color: #ffffff !important;
}

/* Highlighted text in search results */
zd-autocomplete-option em {
    font-style: normal !important;
    font-weight: bold !important;
}

/* Breadcrumbs in search results */
zd-autocomplete-option zd-autocomplete-breadcrumbs {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 14px !important;
    display: block !important;
    margin-top: -4px !important;
}

/* Multibrand (category) results */
zd-autocomplete-multibrand {
    font-family: "Adelle Sans" !important;
    font-size: 16px !important;
    line-height: 24px !important;
    border-bottom: none !important;
    color: rgba(255, 255, 255, 0.7) !important;
    padding: 16px 24px !important;
}

zd-autocomplete-multibrand:hover {
    background: transparent !important;
    color: #ffffff !important;
}

zd-autocomplete-multibrand[aria-selected=true] {
    background: transparent !important;
    color: #ffffff !important;
}

/* Title in multibrand results */
zd-autocomplete-multibrand zd-autocomplete-title-multibrand {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 16px !important;
    padding-bottom: 4px !important;
    font-family: "Adelle Sans" !important;
    text-wrap: auto !important;
}

zd-autocomplete-multibrand zd-autocomplete-title-multibrand:hover {
    color: #ffffff !important;
}

/* Hide breadcrumbs in multibrand results */
zd-autocomplete-multibrand zd-autocomplete-breadcrumbs-multibrand {
    display: none !important;
}

@media screen and (min-width: 375px) {
    html body zd-autocomplete {
      min-width: initial !important;
    }
  }

/* No results message */
.no-results {
    font-family: "Adelle Sans" !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
    .no-results {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

@media (max-width: 767px) {
    .no-results {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

/* Top header for search results dropdown */
.search-results-header {
    padding: 16px 24px !important;
    font-family: "Adelle Sans" !important;
    font-size: 18px !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
    .search-results-header {
        font-size: 16px !important;
    }
}

@media (max-width: 767px) {
    .search-results-header {
        font-size: 16px !important;
    }
}

/* Remove x (cancel button) from search results textbox */
/* Hide the clear/cancel button in search inputs */
form.search.search-full input[type="search"]::-webkit-search-cancel-button,
form.search.search-full input[type="text"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  display: none;
}

/* For other browsers that might have similar functionality */
form.search.search-full input[type="search"]::-ms-clear,
form.search.search-full input[type="text"]::-ms-clear {
  display: none;
}

/* Base form styling */
form.search.search-full {
    display: flex !important;
    align-items: stretch !important;
  }
  
  /* Search button base styling */
  form.search.search-full input[type="submit"],
  form.search.search-full input[name="commit"] {
    
    color: #ffffff !important;
    font-family: "Adelle Sans", sans-serif !important;
    font-size: 24px !important;
    line-height: 100% !important;
    height: 64px !important;
    padding: 0 32px !important;
    min-width: 150px !important;
    
    /* Make button transparent to show the gradient background from the wrapper */
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    
    position: relative !important;
    z-index: 2 !important;
    cursor: pointer !important;
    
    -webkit-appearance: none !important;
    appearance: none !important;
  }
  
  /* Wrapper styling for pseudo-elements */
  .search-button-wrapper {
    position: relative !important;
    display: inline-block !important;
    border-radius: 6px !important;
    background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), 
                linear-gradient(273.81deg, #FA75F8, #9E6EE5) !important;
  }
  
  /* Border gradient using ::before */
  .search-button-wrapper::before {
    content: "" !important;
    position: absolute !important;
    top: -2px !important;
    left: -2px !important;
    right: -2px !important;
    bottom: -2px !important;
    border-radius: 8px !important;
    background: linear-gradient(180deg, #FA75F8, #9E6EE5) !important;
    z-index: -1 !important;
  }
  
  /* Hover effect using ::after */
  .search-button-wrapper::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    border-radius: 6px !important;
    background: linear-gradient(90.81deg, #914694, #62438B) !important;
    z-index: 1 !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
  }
  
  /* Hover effect */
  .search-button-wrapper:hover::after {
    opacity: 1 !important;
  }
  
  /* Media queries */
  @media (min-width: 768px) and (max-width: 1199px) {
    form.search.search-full input[type="submit"],
    form.search.search-full input[name="commit"] {
      font-size: 20px !important;
      height: 48px !important;
      padding: 0 16px !important;
    }
    
    .search-button-wrapper {
      border-radius: 3px !important;
    }
    
    .search-button-wrapper::before {
      top: -1px !important;
      left: -1px !important;
      right: -1px !important;
      bottom: -1px !important;
      border-radius: 4px !important;
    }
    
    .search-button-wrapper::after {
      border-radius: 3px !important;
    }
  }
  
  @media (max-width: 767px) {
    form.search.search-full input[type="submit"],
    form.search.search-full input[name="commit"] {
      font-size: 18px !important;
      height: 40px !important;
      padding: 12px 16px !important;
      width: 100% !important;
    }
    
    .search-button-wrapper {
      display: block !important;
      width: 100% !important;
      border-radius: 3px !important;
    }
    
    .search-button-wrapper::before {
      top: -1px !important;
      left: -1px !important;
      right: -1px !important;
      bottom: -1px !important;
      border-radius: 4px !important;
    }
    
    .search-button-wrapper::after {
      border-radius: 3px !important;
    }
  }

/* Hide initially */
form.search.search-full input[type="submit"],
form.search.search-full input[name="commit"] {
  visibility: hidden !important;
}

/* Show when wrapped - make sure these selectors match exactly what's in DOM */
div.search-button-wrapper input[type="submit"],
div.search-button-wrapper input[name="commit"],
div.search-button-wrapper-sidebar input[type="submit"],
div.search-button-wrapper-sidebar input[name="commit"] {
  visibility: visible !important;
}

/* Alternative approach using the form class */
form.search.search-full.search-wrapped input[type="submit"],
form.search.search-full.search-wrapped input[name="commit"] {
  visibility: visible !important;
}

/* Sidebar search styling to match the dark theme with spyglass */
#sidebar #searchBar.sm {
    width: 100%;
    padding: 0;
    margin-bottom: 30px;
    position: relative;
    border: none;
    background: transparent;
  }
  
  #sidebar #searchBar.sm .search-query {
    padding: 4px 24px 0px 24px;
    outline-style: solid;
    outline-color: rgba(255, 255, 255, 0.2);
    transition: outline-color 0.3s ease;
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
    border: none;
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 100%;
    height: 40px;
    outline-width: 1px;
    border-radius: 4px;
    padding-left: 24px;
    width: 100%;
    box-sizing: border-box;
  }
  
  #sidebar #searchBar.sm .search-query:focus {
    outline-color: #ffffff;
    box-shadow: none;
  }
  
  #sidebar #searchBar.sm .search-query::placeholder {
    color: rgba(255, 255, 255, 0.7);
  }
  
  #sidebar #searchBar.sm button {
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.7);
    padding: 0 10px;
  }
  
  #sidebar #searchBar.sm button:hover {
    background: transparent;
  }
  
  #sidebar #searchBar.sm button .icon-search {
    display: block;
    text-shadow: none;
  }
  
  /* Hide Zendesk's unneeded search elements */
  #sidebar .search-results,
  #sidebar .search-results-column,
  #sidebar .search-box-separator {
    display: none !important;
  }
  
  /* Style the dropdown */
  #sidebar #serp-dd {
    box-shadow: none;
    border-radius: 4px;
    background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%);
    backdrop-filter: blur(29px);
    -webkit-backdrop-filter: blur(29px);
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    width: 100%;
    border-width: 1px;
    border-radius: 4px;
    box-sizing: border-box;
    top: 42px;
    position: absolute;
    z-index: 1000;
  }
  
  #sidebar #serp-dd .result a {
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 24px;
    color: rgba(255, 255, 255, 0.7);
    transition: color 0.3s ease;
    padding-left: 24px;
    display: block;
    padding: 8px 24px;
  }
  
  #sidebar #serp-dd .result a:hover {
    background: transparent;
    color: #ffffff;
  }
  
  #sidebar #serp-dd .result .active {
    background: transparent;
  }
  
  #sidebar #serp-dd .result .active a {
    color: #ffffff;
  }
  
  #sidebar #serp-dd .result .noResults {
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 24px;
    padding: 8px 24px;
    color: rgba(255, 255, 255, 0.7);
  }

  /* Hide the purple/pink search button completely */
#sidebar .search-full button.search-submit,
#sidebar .search-full input[type="submit"],
#sidebar .search-full .search-button-wrapper,
#sidebar .search-full .search-button,
#sidebar .search-full .btn {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  position: absolute !important;
  left: -9999px !important;
}

/* Search box border styling */
#sidebar form.search-full input[type="search"],
#sidebar #searchBar.sm .search-query {
  border: 1px solid rgba(255, 255, 255, 0.2);
  outline: none;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 4px;
  transition: border-color 0.3s ease;
}

#sidebar form.search-full input[type="search"]:focus,
#sidebar #searchBar.sm .search-query:focus {
  border-color: #ffffff;
  outline: none;
  box-shadow: none;
}

/* Make sure the search box takes full width */
#sidebar form.search-full {
  width: 100% !important;
  display: block !important;
  border-radius: 4px !important;
}

/* Ensure no other buttons are visible */
#sidebar .search-controls,
#sidebar .search-submit-wrapper {
  display: none !important;
}

/* Sidebar Search Button */
.search-button-wrapper-sidebar {
    height: 40px;
    position: absolute;
    top: 0;
    right: 12px;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.7);
  }

  @media (max-width: 767px) {
    /* Mobile view */
    .search-button-wrapper-sidebar {
      top: auto;
      bottom: 0;
    }
    
    form.search.search-full.sidebar-search.sm {
      position: relative;
    }
  }
  
  /* Position the actual submit button to cover the entire wrapper */
  .search-button-wrapper-sidebar input[type="submit"] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0; 
    z-index: 2; 
    cursor: pointer;
  }
  
  .search-button-wrapper-sidebar::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    z-index: 1;
  }

  /* Override the hiding rules for our specific wrapper */
#sidebar .search-full .search-button-wrapper-sidebar,
#sidebar .search-full .search-button-wrapper-sidebar input[type="submit"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  height: auto !important;
  position: relative !important;
  left: auto !important;
}

/* Keep the input invisible but functional */
#sidebar .search-full .search-button-wrapper-sidebar input[type="submit"] {
  opacity: 0 !important;
}

/* Override the hiding rules */
#sidebar .search-full .search-button-wrapper-sidebar {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 16px !important;
    height: 40px !important;
    position: absolute !important;
    right: 12px !important;
    top: 0 !important;
    left: auto !important;
    z-index: 10 !important;
  }
  
  /* Keep the input invisible but functional */
  #sidebar .search-full .search-button-wrapper-sidebar input[type="submit"] {
    display: block !important;
    visibility: visible !important;
    opacity: 0 !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    cursor: pointer !important;
    z-index: 2 !important;
  }
  
  /* Ensure the spyglass icon is visible */
  #sidebar .search-full .search-button-wrapper-sidebar::before {
    content: "";
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    z-index: 1;
  }
  
/* Mimic the #search-query styling */
form.search.search-full.sidebar-search input[type="search"] {
    padding: 4px 24px 0px 24px;
    outline-style: solid;
    outline-color: rgba(255, 255, 255, 0.2);
    transition: outline-color 0.3s ease;
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
    border: none;
    font-family: "Adelle Sans";
    font-size: 16px;
    line-height: 100%;
    height: 40px;
    outline-width: 1px;
    border-radius: 4px;
    padding-left: 24px;
    border-radius: 4px;
    width: 100%;
}

/* Sidebar Zendesk Autocomplete Styling - Custom Overrides */
#sidebar zd-autocomplete,
#sidebar .search-full zd-autocomplete {
    background: linear-gradient(315deg, rgba(53, 36, 77, 0.6) 0%, rgba(6, 6, 8, 0.6) 100%) !important;
    backdrop-filter: blur(29px) !important;
    -webkit-backdrop-filter: blur(29px) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-family: "Adelle Sans" !important;
    margin-top: 0 !important;
    z-index: 1000 !important;
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    transform: none !important;
    position: absolute !important;
    top: 42px !important;
}

/* Hide the header */
#sidebar zd-autocomplete-header {
    display: none !important;
}

/* Option styling */
#sidebar zd-autocomplete-option {
    font-family: "Adelle Sans" !important;
    font-size: 16px !important;
    line-height: 24px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    transition: color 0.3s ease !important;
    padding: 8px 24px !important;
    display: block !important;
}

@media (min-width: 768px) and (max-width: 1199px) {
    #sidebar zd-autocomplete-option {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

@media (max-width: 767px) {
    #sidebar zd-autocomplete-option {
        font-size: 15px !important;
        line-height: 24px !important;
    }
}

/* Hover state */
#sidebar zd-autocomplete-option:hover {
    background: transparent !important;
    color: #ffffff !important;
}

/* Selected state */
#sidebar zd-autocomplete-option[aria-selected=true] {
    background: transparent !important;
    color: #ffffff !important;
}

/* Highlighted text in search results */
#sidebar zd-autocomplete-option em {
    font-style: normal !important;
    font-weight: bold !important;
}

/* Breadcrumbs in search results */
#sidebar zd-autocomplete-option zd-autocomplete-breadcrumbs {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 14px !important;
    display: block !important;
    margin-top: -4px !important;
}

/* Multibrand (category) results */
#sidebar zd-autocomplete-multibrand {
    font-family: "Adelle Sans" !important;
    font-size: 16px !important;
    line-height: 24px !important;
    border-bottom: none !important;
    color: rgba(255, 255, 255, 0.7) !important;
    padding: 16px 24px !important;
}

#sidebar zd-autocomplete-multibrand:hover {
    background: transparent !important;
    color: #ffffff !important;
}

#sidebar zd-autocomplete-multibrand[aria-selected=true] {
    background: transparent !important;
    color: #ffffff !important;
}

/* Title in multibrand results */
#sidebar zd-autocomplete-multibrand zd-autocomplete-title-multibrand {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 16px !important;
    padding-bottom: 4px !important;
    font-family: "Adelle Sans" !important;
    white-space: normal !important;
}

#sidebar zd-autocomplete-multibrand zd-autocomplete-title-multibrand:hover {
    color: #ffffff !important;
}

/* Hide breadcrumbs in multibrand results */
#sidebar zd-autocomplete-multibrand zd-autocomplete-breadcrumbs-multibrand {
    display: none !important;
}

/* Position the autocomplete container correctly relative to the search form */
#sidebar form.search-full {
    position: relative !important;
}

.pagination-container {
    margin-top: 20px;
    text-align: left;
}

.pagination a, .pagination span {
    color: #7f5af0;
    padding: 0 5px;
    text-decoration: none;
}

.pagination .current {
    font-weight: bold;
}

.pagination .next, .pagination .last {
    margin-left: 5px;
}

.custom-pagination {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: left;
    font-family: 'Adelle Sans', sans-serif;
    padding-left: 12px;
  }
  
  .custom-pagination a, 
  .custom-pagination span.current {
    background: linear-gradient(273.81deg, #F991F9, #B38BEB);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration: none;
    padding: 0 12px;
    display: inline-block;
  }
  
  .custom-pagination a:hover {
    background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  
  /* First item should have no left padding */
  .custom-pagination a:first-child,
  .custom-pagination span.current:first-child {
    padding-left: 0;
  }
  
  /* Last item should have no right padding */
  .custom-pagination a:last-child,
  .custom-pagination span.current:last-child {
    padding-right: 0;
  }
  
  .custom-pagination span.current {
    font-weight: 600;
  }
  
  .custom-pagination .separator {
    color: white;
    font-weight: normal;
    padding: 0;
    margin: 0 -2px;
  }

/* Custom styles for keyboard navigation focus */

/* For custom dropdown */
#serp-dd .result a.focused,
#serp-dd.sb .result a.focused {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.1) !important;
  outline: none !important;
}

/* For Zendesk autocomplete */
zd-autocomplete-option.focused,
zd-autocomplete-option[aria-selected="true"] {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.1) !important;
  outline: none !important;
}

/* For multibrand results */
zd-autocomplete-multibrand.focused,
zd-autocomplete-multibrand[aria-selected="true"] {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* For title in multibrand results */
zd-autocomplete-multibrand.focused zd-autocomplete-title-multibrand,
zd-autocomplete-multibrand[aria-selected="true"] zd-autocomplete-title-multibrand {
  color: #ffffff !important;
}

/* Prevent outline on search input when focused */
form.search.search-full input[type="search"]:focus,
form.search.search-full input[type="text"]:focus,
#sidebar #searchBar.sm .search-query:focus {
  outline-color: #ffffff !important;
  box-shadow: none !important;
}

/* Ensure spyglass icon is visible */
@media (max-width: 767px) {
    #sidebar form.search-full {
      display: flex !important;
      flex-wrap: wrap !important;
      position: relative !important;
    }
  }

/* Override any default focus styles that might interfere */
#serp-dd .result .active a:focus,
zd-autocomplete-option:focus {
  outline: none !important;
}

/* Add subtle animation for better user experience */
#serp-dd .result a.focused,
zd-autocomplete-option.focused,
zd-autocomplete-multibrand.focused {
  transition: background-color 0.15s ease, color 0.15s ease !important;
}

/* List Styles for Article Content */
#fullArticle ul,
#fullArticle ol,
.contentWrapper #fullArticle ul,
.contentWrapper #fullArticle ol,
.contentWrapper #categoryHead ul,
.contentWrapper #categoryHead ol,
.contentWrapper .articleList ul,
.contentWrapper .articleList ol,
.contentWrapper #serp ul,
.contentWrapper #serp ol {
  list-style-position: outside;
  padding-left: 2em;
  margin-bottom: 1.5em;
}

#fullArticle ul,
.contentWrapper #fullArticle ul,
.contentWrapper #categoryHead ul,
.contentWrapper .articleList ul,
.contentWrapper #serp ul {
  list-style-type: disc;
}

#fullArticle ol,
.contentWrapper #fullArticle ol,
.contentWrapper #categoryHead ol,
.contentWrapper .articleList ol,
.contentWrapper #serp ol {
  list-style-type: decimal;
}

#fullArticle ul ul,
.contentWrapper #fullArticle ul ul,
.contentWrapper #categoryHead ul ul,
.contentWrapper .articleList ul ul,
.contentWrapper #serp ul ul {
  list-style-type: circle;
  margin-bottom: 0;
}

#fullArticle ul ul ul,
.contentWrapper #fullArticle ul ul ul,
.contentWrapper #categoryHead ul ul ul,
.contentWrapper .articleList ul ul ul,
.contentWrapper #serp ul ul ul {
  list-style-type: square;
}

#fullArticle ol ol,
.contentWrapper #fullArticle ol ol,
.contentWrapper #categoryHead ol ol,
.contentWrapper .articleList ol ol,
.contentWrapper #serp ol ol {
  list-style-type: lower-alpha;
  margin-bottom: 0;
}

#fullArticle ol ol ol,
.contentWrapper #fullArticle ol ol ol,
.contentWrapper #categoryHead ol ol ol,
.contentWrapper .articleList ol ol ol,
.contentWrapper #serp ol ol ol {
  list-style-type: lower-roman;
}

/* Fix for list items spacing */
#fullArticle li,
.contentWrapper #fullArticle li,
.contentWrapper #categoryHead li,
.contentWrapper .articleList li,
.contentWrapper #serp li {
  display: list-item;
  margin-bottom: 8px;
  line-height: 1.5;
}

/* Make sure nested lists have proper spacing */
#fullArticle li > ul,
#fullArticle li > ol,
.contentWrapper #fullArticle li > ul,
.contentWrapper #fullArticle li > ol,
.contentWrapper #categoryHead li > ul,
.contentWrapper #categoryHead li > ol,
.contentWrapper .articleList li > ul,
.contentWrapper .articleList li > ol,
.contentWrapper #serp li > ul,
.contentWrapper #serp li > ol {
  margin-top: 8px;
  margin-bottom: 0;
}

/* Comprehensive Zendesk Guide Image and Text Alignment Fix */

/* Basic image styling */
#fullArticle img,
.contentWrapper #fullArticle img {
  max-width: 100%;
  height: auto;
  box-sizing: border-box;
}

/* ===== WYSIWYG EDITOR ALIGNMENT CLASSES ===== */

/* Center alignment */
.wysiwyg-text-align-center,
#fullArticle .wysiwyg-text-align-center,
.contentWrapper #fullArticle .wysiwyg-text-align-center {
  text-align: center !important;
}

.wysiwyg-text-align-center img,
#fullArticle .wysiwyg-text-align-center img,
.contentWrapper #fullArticle .wysiwyg-text-align-center img {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Left alignment */
.wysiwyg-text-align-left,
#fullArticle .wysiwyg-text-align-left,
.contentWrapper #fullArticle .wysiwyg-text-align-left {
  text-align: left !important;
}

/* Right alignment */
.wysiwyg-text-align-right,
#fullArticle .wysiwyg-text-align-right,
.contentWrapper #fullArticle .wysiwyg-text-align-right {
  text-align: right !important;
}

.wysiwyg-text-align-right img,
#fullArticle .wysiwyg-text-align-right img,
.contentWrapper #fullArticle .wysiwyg-text-align-right img {
  display: block !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* ===== STANDARD ALIGNMENT CLASSES ===== */

/* Reset any conflicting styles */
#fullArticle .align-center,
#fullArticle .align-left,
#fullArticle .align-right,
.contentWrapper #fullArticle .align-center,
.contentWrapper #fullArticle .align-left,
.contentWrapper #fullArticle .align-right {
  width: auto !important;
  max-width: 100%;
}

/* Standard center alignment */
#fullArticle .align-center,
.contentWrapper #fullArticle .align-center {
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}

#fullArticle .align-center img,
.contentWrapper #fullArticle .align-center img {
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Standard left alignment */
#fullArticle .align-left,
.contentWrapper #fullArticle .align-left {
  display: block;
  margin-right: auto !important;
  margin-left: 0 !important;
  text-align: left;
}

/* Standard right alignment */
#fullArticle .align-right,
.contentWrapper #fullArticle .align-right {
  display: block;
  margin-left: auto !important;
  margin-right: 0 !important;
  text-align: right;
}

#fullArticle .align-right img,
.contentWrapper #fullArticle .align-right img {
  display: block;
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* ===== INLINE STYLE ALIGNMENT ===== */

/* Inline center alignment */
#fullArticle [style*="text-align: center"],
.contentWrapper #fullArticle [style*="text-align: center"] {
  text-align: center !important;
}

#fullArticle [style*="text-align: center"] img,
.contentWrapper #fullArticle [style*="text-align: center"] img {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Inline centered images */
#fullArticle img[style*="margin-left: auto"][style*="margin-right: auto"],
.contentWrapper #fullArticle img[style*="margin-left: auto"][style*="margin-right: auto"] {
  display: block !important;
}

/* Inline right alignment for images */
#fullArticle img[style*="float: right"],
.contentWrapper #fullArticle img[style*="float: right"],
#fullArticle img[style*="margin-left: auto"][style*="margin-right: 0"],
.contentWrapper #fullArticle img[style*="margin-left: auto"][style*="margin-right: 0"] {
  display: block !important;
  float: right !important;
  margin-left: 20px !important;
  margin-bottom: 10px !important;
}

/* Inline left alignment for images */
#fullArticle img[style*="float: left"],
.contentWrapper #fullArticle img[style*="float: left"],
#fullArticle img[style*="margin-left: 0"][style*="margin-right: auto"],
.contentWrapper #fullArticle img[style*="margin-left: 0"][style*="margin-right: auto"] {
  display: block !important;
  float: left !important;
  margin-right: 20px !important;
  margin-bottom: 10px !important;
}

/* ===== INDENTATION AND OTHER WYSIWYG CLASSES ===== */

/* Indentation classes */
.wysiwyg-indent1,
#fullArticle .wysiwyg-indent1,
.contentWrapper #fullArticle .wysiwyg-indent1 {
  margin-left: 20px !important;
}

.wysiwyg-indent2,
#fullArticle .wysiwyg-indent2,
.contentWrapper #fullArticle .wysiwyg-indent2 {
  margin-left: 40px !important;
}

.wysiwyg-indent3,
#fullArticle .wysiwyg-indent3,
.contentWrapper #fullArticle .wysiwyg-indent3 {
  margin-left: 60px !important;
}

/* ===== CAPTION ALIGNMENT ===== */
#fullArticle figcaption,
.contentWrapper #fullArticle figcaption,
#fullArticle .image-caption,
.contentWrapper #fullArticle .image-caption {
  margin-top: 8px;
  font-style: italic;
  color: #919191;
}

#fullArticle .align-center figcaption,
.contentWrapper #fullArticle .align-center figcaption,
#fullArticle .wysiwyg-text-align-center figcaption,
.contentWrapper #fullArticle .wysiwyg-text-align-center figcaption {
  text-align: center !important;
}

/* ===== ZENDESK ATTACHMENT HANDLING ===== */
.content .image-attachment,
.content img.attachment-image,
.content .attachment img {
  display: block;
  max-width: 100%;
  margin-bottom: 15px;
}

/* Support for Zendesk's modern image attachments */
.image-attachment-wrapper,
.attachment-wrapper {
  text-align: center;
  margin: 15px 0;
}

/* Fix for mobile hyperlinks not working */

/* Ensure links are clickable by setting proper z-index and pointer-events */
#main-content .contentWrapper a,
.contentWrapper #fullArticle a,
.contentWrapper #categoryHead a,
.contentWrapper .articleList a,
.contentWrapper #serp a {
  position: relative;
  z-index: 1;
  pointer-events: auto;
}

/* Fix for gradient background potentially blocking clicks */
#main-content .contentWrapper a[href],
.contentWrapper #fullArticle a[href],
.contentWrapper #categoryHead a[href],
.contentWrapper .articleList a[href],
.contentWrapper #serp a[href] {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block; /* Ensures the background applies correctly */
  position: relative;
}

/* Make sure the link is actually clickable by adding a pseudo-element */
#main-content .contentWrapper a[href]::after,
.contentWrapper #fullArticle a[href]::after,
.contentWrapper #categoryHead a[href]::after,
.contentWrapper .articleList a[href]::after,
.contentWrapper #serp a[href]::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: auto;
}

/* Specific fix for mobile viewport sizes */
@media (max-width: 767px) {
  #main-content .contentWrapper a,
  .contentWrapper #fullArticle a,
  .contentWrapper #categoryHead a,
  .contentWrapper .articleList a,
  .contentWrapper #serp a {
    pointer-events: auto !important;
    cursor: pointer !important;
  }
  
  /* Remove any potential overlay elements on mobile */
  .contentWrapper::before,
  .contentWrapper::after {
    pointer-events: none !important;
  }
  
  /* Ensure proper touch target size for mobile */
  #main-content .contentWrapper a,
  .contentWrapper #fullArticle a {
    padding: 2px 0;
    display: inline-block;
  }
}

/* Fix specifically for TOC links which might have different styling */
#fullArticle ul li a[href],
.contentWrapper #fullArticle ul li a[href] {
  display: inline-block;
  position: relative;
  z-index: 5;
}

/* Fix for links inside TOC items */
#main-content .contentWrapper #fullArticle ul li a::after {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: 1;
}
/* Home contact CTA — above the footer divider, below the cards */
#contentArea .home-contact-cta {
  width: 100%;
  box-sizing: border-box;

  /* spacing relative to the cards and the footer divider */
  margin: 32px auto 32px;   /* top and bottom space */
  padding: 0;               /* no internal top padding */
  border-top: none;         /* ⬅︎ remove the extra line */
}

#contentArea .home-contact-cta__text {
  margin: 0;
  text-align: center;
  font-family: "Adelle Sans";
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.8);
}

/* keep width + gutters consistent with the page */
#contentArea .home-contact-cta,
#contentArea .home-contact-cta__text {
  max-width: 1312px;
  padding-left: 64px;
  padding-right: 64px;
}

@media (min-width: 768px) and (max-width: 1199px) {
  #contentArea .home-contact-cta,
  #contentArea .home-contact-cta__text {
    padding-left: 32px;
    padding-right: 32px;
  }
}
@media (max-width: 767px) {
  #contentArea .home-contact-cta,
  #contentArea .home-contact-cta__text {
    padding-left: 24px;
    padding-right: 24px;
  }
}

/* gradient link to match the theme */
#contentArea .home-contact-cta__text a {
  background: linear-gradient(273.81deg, #F991F9, #B38BEB);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#contentArea .home-contact-cta__text a:hover,
#contentArea .home-contact-cta__text a:focus {
  background: linear-gradient(273.81deg, #FCBAFC, #CFB7F3);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}