@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700;800&display=swap');
body{
  font-family: 'Nunito Sans', sans-serif;
}
.hidden{
  display: none !important;
}
.tab-content {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  transition: opacity 0.3s;
  height: 0;
  overflow: hidden;
}
.tab-content.current {
  opacity: 1;
  visibility: visible;
  position: static;
  height: auto;
}
.js-collapse-content {
  display: none;
}
.js-collapse-content.current {
  display: block;
}
.js-collapse-heading {
  display: block;
  margin: 0;
  padding: 5px 35px 5px 0;
  position: relative;
  font-size: 18px;
  font-weight: 600;
  background: url(./images/icon-plus-circle.svg) no-repeat right 7px;
  cursor: pointer;
}
.js-collapse-heading.is-active {
  background-image: url(./images/icon-minus-circle.svg);
}

.page-faq {
  padding: 60px 0;
}
.tab-content {
  color: #808080;
  font-size: 18px;
}
.faq-categories {
  list-style: none;
  padding: 0;
  margin: 0;
}
.faq-categories li {
  margin-bottom: 5px;
}
.faq-categories a {
  display: block;
  text-decoration: none;
  padding: 5px 20px;
  font-size: 18px;
  color: #2a2a2a;
  font-weight: 800;
  border-radius: 10px;
}
.faq-categories a:hover,
.faq-categories .is-active {
  background: #8162e3;
  color: #fff;
}

.faq-item {
  margin-bottom: 5px;
}
.faq-item .faq-answer {
  padding: 8px 0 8px 20px;
}
.faq-answer p {
  margin-bottom: 10px;
}
.faq-answer a {
  text-decoration: none;
  color: #4589ff;
}
.faq-item .faq-question {
  color: #2a2a2a;
  padding-left: 1em;
}
.faq-answer a {
  text-decoration: underline;
}
.faq-answer p:last-of-type {
  margin-bottom: 0;
}
.redeem-elsa-steps li {
  position: relative;
  padding-left: 26px;
  padding-bottom: 30px;
}
.redeem-elsa-steps li::before,
.redeem-elsa-steps li::after {
  content: '';
  position: absolute;
}
.redeem-elsa-steps li::before {
  width: 2px;
  height: 100%;
  left: 0;
  top: 0;
  background: linear-gradient(270.9deg, #594ba9 5.12%, #5447a4 102.41%);
  border-radius: 1px;
}
.redeem-elsa-steps li::after {
  width: 22px;
  height: 22px;
  border: 3px solid #fff;
  border-radius: 20px;
  top: -10px;
  left: -10px;
  z-index: 1;
  background: #584aa9;
}
.redeem-elsa-steps .step-detail {
  margin-bottom: 15px;
}
.redeem-elsa-steps .feature-img,
.redeem-elsa-steps .step-detail p {
  margin-bottom: 0;
}
.redeem-elsa-steps .step-detail h2 {
  font-size: 18px;
}
.faq-answer .video-youtube-iframe {
  max-width: 500px;
}

.faq-answer ol {
  margin-top: 0;
}
.faq-answer ol ol {
  margin-top: 10px;
  padding-left: 1em;
}
.faq-answer li {
  margin-bottom: 10px;
}
.faq-answer code {
  background: #e6e2ff;
  display: inline;
  padding: 5px;
  border-radius: 5px;
  font-size: 14px;
}
.faq-answer .table ul {
  padding-left: 20px;
}
.btn-back {
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  display: none;
  margin-bottom: 25px;
}

@media (max-width: 767px) {
  .faq-categories a {
    background: #8162e3;
    color: #fff;
  }
}

@media (min-width: 768px) {
  .page-faq .btn-back {
    display: none !important;
  }
  .redeem-elsa-steps li {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
  }
  .redeem-elsa-steps .step-detail {
    margin-bottom: 0;
    padding-left: 15px;
  }
}
