:root {
  --primary-color: #b80da0;
  --text-primary: #b80da0;
  --primary-color-transparent: rgb(136, 49, 101, 0.5);
  --secondary-color: white;
  --third-color: #63394d;
  --grey-color: grey;
  --headerfooter: linear-gradient(#b8099d 0%, #892bbf 100%);
}

.bg-white,
.bg-body  {
    background-color: rgb(184 11 160) !important;
}

.reff_card_main {
  background: var(--primary-color-transparent);
  border: 1px solid var(--grey-color);
  box-shadow: initial;
}

.bg-secondary-grad,
.accordion.accordion-border-start .accordion-item {
  background: url('../images/bg3.png') no-repeat center var(--primary-color-transparent)!important;
  border: 0px;
  background-size: cover!important;
}

.accordion.accordion-border-start .accordion-item {
  border-radius: var(--bs-border-radius-xl) !important;
}

#features {
  border: 0px;
}

.gradient-container {
  padding: 1px;
  background: var(--grey-color);
}

.bg-main-first-banner {
  background: url(../images/bg-subbanner-1.png) no-repeat center;
  background-size: cover;
}

.bg-join {
  background: url(../images/bg-subbanner-3.png) no-repeat center;
  background-size: cover;
}

#features {
  background: url(../images/bg-subbanner-2.png) no-repeat center;
  background-size: cover;
}

.text-white,
.nav_main li a,
h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1, body,
.accordion .accordion-item,
.accordion.accordion-border-start .accordion-button {
  color: var(--secondary-color);
}

.text-primary {
  color: var(--text-primary)!important;
}

header path {
  fill: var(--secondary-color);
}

.navbar-toggler .navbar-toggler-animation span {
  background-color: var(--secondary-color);
}

.navbar-toggler {
  border: 1px solid var(--secondary-color);
}

/* main {
  background-color: #2C2227;
}

.fill-body {
  fill: #2C2227!important;
} */


.spark-1 {
  position: absolute;
  left: 0px;
  top: -30px;
  background: url(../images/spark-1.png) no-repeat center;
  height: 120px;
  width: 120px;
  background-size: contain;
  pointer-events: none;
}

.spark-2 {
  position: absolute;
  right: -15px;
  top: -30px;
  background: url(../images/spark-2.png) no-repeat center;
  height: 120px;
  width: 120px;
  background-size: contain;
  opacity: 0.5;
  pointer-events: none;
}

.spark-3 {
  position: absolute;
  left: -15px;
  top: 3px;
  background: url(../images/spark-1.png) no-repeat center;
  height: 120px;
  width: 120px;
  background-size: contain;
  opacity: 0.5;
  pointer-events: none;
}

.navbar-brand {
  position: relative;
}

.bg-main-first-banner .col-md-5 .ai-bot-container,
#join .col-sm-9 .ai-bot-container2,
.icon-lg {
  position: relative;
}

.bg-main-first-banner .col-md-5 .spark-2,
#join .col-sm-9 .spark-2 {
  height: 60%;
  width: 60%;
  right: 18%;
  top: -10%;
  opacity: 1;
}

.icon-lg .spark-2 {
  height: 79px;
  width: 82px;
  left: 8px;
  opacity: 1;
  top: 7px;
}

.icon-lg .spark-3 {
  height: 79px;
  width: 82px;
  left: -35px;
  top: -38px;
  opacity: 0.9;
}

.bg-main-first-banner .col-md-5 .spark-3 {
  height: 60%;
  width: 60%;
  left: 47%;
  top: 35%;
  opacity: 0.9;
}

#join .col-sm-9 .spark-3 {
  height: 60%;
  width: 60%;
  left: 28%;
  top: 35%;
  opacity: 0.9;
}

header.header-sticky-on {
  border: 0px;
}


@media (max-width: 1199.98px) {

  .navbar-expand-xl .navbar-collapse {
    top: 100%;
    background: black;
  }

  .spark-2 {
    height: 79px;
    width: 82px;
    right: -6px;
    top: -14px;
  }

  .spark-3 {
    height: 79px;
    width: 82px;
    left: -11px;
    top: 7px;
  }

}


.text-primary-grad {
  color: var(--primary-color) !important;
}

main {
  background: rgb(81 57 75);
}

.fill-body {
  fill: rgb(81 57 75)!important;
}