/*-----------------------------------------------------------------------------------

 

-----------------------------------------------------------------------------------

1. variables 
2. Google Fonts 
3. Typography css
4. Bootstrap customize
5. Common Classes
6. Mfp customize
7. Background color
8. Site Badge
9. colors styles
10. Default Spacing
11. Button styles
12. Custom Check Box
13. Back to top
14. Offcanvas style
15. site pagination
16. Time timepicker customize
17. vuesax icon customize
18. modal customize
19. Image Preview
20. single input

/*---------------------------------
 variables 
---------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800;900&display=swap");
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*---------------------------------
  Typography css start 
---------------------------------*/
body {
  font-family: 'Clash Display', sans-serif !important;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.5;
  color: #5C5958;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #0C0C14;
  margin-top: 0px;
  line-height: 1.125;
  margin-bottom: 0;
  font-weight: 700;
  word-break: break-word;
  font-family: 'Clash Display', sans-serif;
}

h1,
.h1 {
  line-height: 1.125;
  font-weight: 700;
}

.rules-box {
    background-color: #f9f9f9;
    border-left: 4px solid #007bff;
    font-size: 0.95rem;
    color: #333;
}

.rules-box ol > li {
    margin-bottom: 12px;
}
.rules-box ul {
    list-style-type: disc;
    margin-left: 16px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  h1,
  .h1 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  h1,
  .h1 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  h1,
  .h1 {
    font-size: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  h1,
  .h1 {
    font-size: 38px;
  }
}
@media (max-width: 575px) {
  h1,
  .h1 {
    font-size: 40px;
  }
}
@media (max-width: 575px) {
  h1,
  .h1 {
    font-size: 32px;
  }
}

h2,
.h2 {
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1.3;
  font-weight: 700;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  h2,
  .h2 {
    font-size: 42px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  h2,
  .h2 {
    font-size: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  h2,
  .h2 {
    font-size: 36px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  h2,
  .h2 {
    font-size: 36px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  h2,
  .h2 {
    font-size: 32px;
  }
}
@media (max-width: 575px) {
  h2,
  .h2 {
    font-size: 28px;
  }
}
@media (max-width:450px) {
  h2,
  .h2 {
    font-size: 24px;
  }
}

h3,
.h3 {
  line-height: 1.25;
  font-weight: 700;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  h3,
  .h3 {
    font-size: 28px;
  }
}
@media (max-width: 575px) {
  h3,
  .h3 {
    font-size: 24px;
  }
}

h4,
.h4 {
  line-height: 1.33;
  font-weight: 700;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  h4,
  .h4 {
    font-size: 22px;
  }
}

h5,
.h5 {
  line-height: 1.4;
  font-weight: 700;
}
@media (max-width: 575px) {
  h5,
  .h5 {
    font-size: 20px;
  }
}

h6,
.h6 {
  line-height: 1.44;
  font-weight: 700;
}
@media (max-width: 575px) {
  h6,
  .h6 {
    font-size: 18px;
  }
}

ul {
  margin: 0px;
  padding: 0px;
}

p {
  font-size: 14px;
  font-family: 'Clash Display', sans-serif !important;
  font-weight: 500;
  color: #5C5958;
  margin-bottom: 15px;
  line-height: 26px;
}
p.b1 {
  font-size: 16px;
  line-height: 1.714;
  font-weight: 400;
}
p.b2 {
  font-size: 18px;
  line-height: 1.625;
  font-weight: 400;
}
p.b3 {
  font-size: 20px;
  line-height: 1.55;
  font-weight: 400;
}
p.b4 {
  font-size: 22px;
  line-height: 1.454;
  font-weight: 400;
}
p:last-child {
  margin-bottom: 0px;
}

a {
  text-decoration: none;
}

a,
.btn,
button,
p,
select,
textarea,
img,
svg,
.transition-3,
li,
h1,
h2,
h3,
h4,
h5,
h6 {
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  text-decoration: none;
  color: inherit;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

img {
  max-width: 100%;
  object-fit: cover;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

hr:not([size]) {
  margin: 0;
  border-color: #ddd;
  opacity: 1;
  border-width: 1px;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=date],
textarea {
  outline: none;
  background-color: transparent;
  height: 45px;
  width: 100%;
  font-size: 14px;
  border: none;
  border: 1px solid rgba(173, 171, 168, 0.6);
  color: #5C5958;
  border-radius: 6px;
}
[dir=rtl] input[type=text],
[dir=rtl] input[type=email],
[dir=rtl] input[type=tel],
[dir=rtl] input[type=number],
[dir=rtl] input[type=password],
[dir=rtl] input[type=date],
[dir=rtl] textarea {
  text-align: right;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=date]:focus,
textarea:focus {
  border-color: #563AEF;
}

textarea {
  padding: 16px 15px;
}
textarea:focus {
  border-color: #563AEF;
}

.border-radius-6 {
  border-radius: 6px !important;
}

.Checkbox {
  width: 24px;
  height: 24px;
  position: relative;
}
.Checkbox > * {
  position: absolute;
}
.Checkbox-visible {
  border: 1px solid #D9D9D9;
  width: 20px;
  height: 20px;
  margin: 2px;
  background: #ffffff;
  border-radius: 3px;
}
.Checkbox > input {
  z-index: 1;
  opacity: 0;
  inset-inline-start: 50%;
  top: 50%;
  transform: translatex(-50%) translatey(-50%);
  display: block;
  cursor: pointer;
  width: 24px;
  height: 24px;
}
.Checkbox > input:checked + .Checkbox-visible {
  border-color: #563AEF;
  background-image: url(../images/icons/check.svg);
  background-repeat: no-repeat;
  background-position: center;
}
.Checkbox > input:hover + .Checkbox-visible {
  border-color: rgb(204, 204, 204);
}
.Checkbox > input:hover:checked + .Checkbox-visible {
  border-color: #563AEF;
}
.Checkbox > input:focus + .Checkbox-visible {
  border-color: #563AEF;
}

*::-moz-selection {
  background: #563AEF;
  color: #ffffff;
  text-shadow: none;
}

::-moz-selection {
  background: #563AEF;
  color: #ffffff;
  text-shadow: none;
}

::selection {
  background: #563AEF;
  color: #ffffff;
  text-shadow: none;
}

*::-moz-placeholder {
  opacity: 1;
  font-size: 14px;
}

*::placeholder {
  opacity: 1;
  font-size: 14px;
  font-weight: 400;
}

/*----------------------------------------
  Bootstrap customize
-----------------------------------------*/
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  --bs-gutter-x: 30px;
}

@media (min-width: 1601px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1320px;
  }
}
.row {
  --bs-gutter-x: 30px;
}

.g-0,
.gx-0 {
  --bs-gutter-x: ;
}

.g-0,
.gy-0 {
  --bs-gutter-y: 0 ;
}

.g-10,
.gx-10 {
  --bs-gutter-x: 10px;
}

.gy-15 {
  --bs-gutter-y: 15px;
}

.gx-15 {
  --bs-gutter-x: 15px;
}

.gx-20 {
  --bs-gutter-x: 20px;
}

.gy-20 {
  --bs-gutter-y: 20px;
}

.gx-25 {
  --bs-gutter-x: 25px;
}

.gy-25 {
  --bs-gutter-y: 25px;
}

.g-30,
.gx-30 {
  --bs-gutter-x: 30px;
}

.g-30,
.gy-30 {
  --bs-gutter-y: 30px;
}

.g-40,
.gx-40 {
  --bs-gutter-x: 40px;
}

.g-40,
.gy-40 {
  --bs-gutter-y: 40px;
}

.g-50,
.gx-50 {
  --bs-gutter-x: 50px;
}

.g-50,
.gy-50 {
  --bs-gutter-y: 50px;
}

.g-60,
.gy-60 {
  --bs-gutter-y: 60px;
}

/*---------------------------------
  1.2 Common Classes
---------------------------------*/
.w-img img {
  width: 100%;
}

.m-img img {
  max-width: 100%;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.f-left {
  float: left;
}

.f-right {
  float: right;
}

.z-index-1 {
  z-index: 1;
}

.z-index-11 {
  z-index: 11;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.position-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.hr-1 {
  border-top: 1px solid rgb(232, 232, 232);
}

.x-clip {
  overflow-x: clip;
}

.o-visible {
  overflow: visible;
}

.valign {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
}

/*----------------------------------------
  Body Overlay 
-----------------------------------------*/
.body__overlay {
  background-color: #0C0C14;
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 9999;
  inset-inline-start: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

.body__overlay {
  background-color: #0C0C14;
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 9999;
  inset-inline-start: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

.body__overlay.opened {
  opacity: 0.7;
  visibility: visible;
}

/*----------------------------------------
  Mfp customize
-----------------------------------------*/
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 1280px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .mfp-iframe-holder .mfp-content {
    max-width: 1000px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .mfp-iframe-holder .mfp-content {
    max-width: 850px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .mfp-iframe-holder .mfp-content {
    max-width: 820px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .mfp-iframe-holder .mfp-content {
    max-width: 750px;
  }
}

.mfp-close {
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}
.mfp-close:hover {
  color: #ffffff;
}
.mfp-close::after {
  position: absolute;
  content: "\f00d";
  height: 100%;
  width: 100%;
  font-family: "Font Awesome 6 Pro";
  font-size: 31px;
  font-weight: 200;
  inset-inline-end: -20px;
  margin-top: -25px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .mfp-close::after {
    inset-inline-end: 15px;
    margin-top: -30px;
  }
}

/*---------------------------------
/*  Background color
---------------------------------*/
.white-bg {
  background-color: #ffffff;
}

.whiteSmoke-bg {
  background-color: #F5F5F5;
}

/*---------------------------------
/*  Default Spacing
---------------------------------*/
.section-space {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-space {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-space {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-space {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-space {
    padding-top: 45px;
    padding-bottom: 45px;
  }
}

.section-space-top {
  padding-top: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-space-top {
    padding-top: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-space-top {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-space-top {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-space-top {
    padding-top: 45px;
  }
}

.section-space-bottom {
  padding-bottom: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-space-bottom {
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-space-bottom {
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-space-bottom {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-space-bottom {
    padding-bottom: 45px;
  }
}

.section-title-space {
  margin-bottom: 55px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .section-title-space {
    margin-bottom: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title-space {
    margin-bottom: 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-space {
    margin-bottom: 40px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .section-title-space {
    margin-bottom: 35px;
  }
}

/*---------------------------------
/*  Site Badge
---------------------------------*/
.site-badge {
  padding: 6px 16px;
  border-radius: 50px;
  font-size: 14px;
  font-weight: 500;
  text-transform: capitalize;
  display: inline-block;
  line-height: 1;
}
.site-badge.badge-success {
  background: #c0fdbf;
  color: #0C0C14;
}
.site-badge.badge-failed {
  background: rgba(243, 65, 65, 0.2);
  color: #0C0C14;
}
.site-badge.badge-pending {
  background: rgba(255, 172, 62, 0.2);
  color: #0C0C14;
}
.site-badge.badge-primary {
  background: rgba(86, 58, 239, 0.2);
  color: #563AEF;
}

/*---------------------------------
/*  colors styles
---------------------------------*/
.body-text {
  color: #5C5958;
}

.black-color {
  color: #0C0C14;
}

.blue-color {
  color: #296296;
}

.primary-color {
  color: #563AEF;
}

.white-color {
  color: #ffffff;
}

.yellow-color {
  color: #FFAC3E;
}

.green-color {
  color: #29B475;
}

.red-color {
  color: #F34141;
}

.info-color {
  color: #296296;
}

/*---------------------------------
/*  Button styles
---------------------------------*/
.btn-wrap {
  display: flex;
  align-items: center;
  gap: 10px 15px;
  flex-wrap: wrap;
}

.site-btn {
  height: 45px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 27px;
  border-radius: 10px;
  color: #0C0C14;
  background: #ffffff;
  font-weight: 600;
  font-size: 14px;
  box-shadow: 0px 0px 2px rgba(0, 48, 73, 0.4);
}
.site-btn.primary-btn {
  color: #ffffff;
  background: #563AEF;
  gap: 8px;
  border: 0;
}
.site-btn.primary-btn:hover {
  background: #4a1fbb;
}
.site-btn.black-btn {
  color: #ffffff;
  background: #0C0C14;
  gap: 8px;
  border: 0;
  box-shadow: none;
}
.site-btn.black-btn:hover {
  background: #563AEF;
}
.site-btn.danger-btn {
  color: #ffffff;
  background: #F34141;
  gap: 8px;
  border: 0;
  box-shadow: none;
}
.site-btn.danger-btn:hover {
  background: #F34141;
}
.site-btn.danger-btn.disable {
  background: rgba(243, 65, 65, 0.1);
  box-shadow: none;
  color: #F34141;
}
.site-btn.warning-btn {
  background-color: #FF8112;
  color: #ffffff;
  border: 0;
  box-shadow: none;
}
.site-btn.blue-btn {
  background-color: #084F6E;
  color: #ffffff;
  border: 0;
  box-shadow: none;
}
.site-btn.blue-btn.hover-slide-righ {
  position: relative;
  z-index: 5;
}
.site-btn.blue-btn.hover-slide-righ.has-bg-change::before {
  background-color: #ffac3e;
}
.site-btn.blue-btn.hover-slide-righ::before {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  inset-inline-start: 0;
  height: 100%;
  width: 0%;
  background-color: #FC5D19;
  transition: 0.3s ease-out;
  z-index: -1;
}
.site-btn.blue-btn.hover-slide-righ:hover::before {
  width: 100%;
}
.site-btn.blue-btn.hover-slide-righ.left-right-radius {
  overflow: hidden;
}
.site-btn.blue-btn.hover-slide-righ.left-right-radius::before {
  border-radius: 0px 20px 0px 20px;
}
.site-btn.orange-btn {
  background-color: #FC5D19;
  color: #ffffff;
  border: 0;
  box-shadow: none;
}
.site-btn.orange-btn.hover-slide-righ {
  position: relative;
  z-index: 5;
}
.site-btn.orange-btn.hover-slide-righ::before {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  inset-inline-start: 0;
  height: 100%;
  width: 0%;
  background-color: #084F6E;
  transition: 0.3s ease-out;
  z-index: -1;
}
.site-btn.orange-btn.hover-slide-righ:hover::before {
  width: 100%;
}
.site-btn.orange-btn.hover-slide-righ.left-right-radius {
  overflow: hidden;
}
.site-btn.orange-btn.hover-slide-righ.left-right-radius::before {
  border-radius: 0px 20px 0px 20px;
}
.site-btn.left-right-radius {
  border-radius: 0px 20px 0px 20px;
}
.site-btn.btn-xxs {
  height: 36px;
  padding: 0px 18px;
  border-radius: 8px;
  font-weight: 500;
  gap: 5px;
}
.site-btn.btn-xxs i {
  font-size: 16px;
}
.site-btn.btn-xs {
  height: 50px;
  padding: 0 26px;
  font-size: 14px;
  font-weight: 500;
  gap: 6px;
}
.site-btn.btn-xs i {
  font-size: 16px;
}
.site-btn i {
  font-size: 20px;
}

.text-btn {
  font-weight: 500;
  color: #576363;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
.text-btn i {
  font-size: 18px;
}
.text-btn::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  bottom: -2px;
  inset-inline-start: -3px;
  background-color: #FC5D19;
  transform: scaleX(0);
  transform-origin: bottom right;
  transition: transform 0.3s;
}
.text-btn:hover {
  color: #FC5D19;
}
.text-btn:hover::after {
  transform-origin: bottom left;
  transform: scaleX(1);
}

.add-action-close {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgb(242, 52, 80);
  border-radius: 4px;
  font-size: 20px;
  background: rgba(242, 52, 80, 0.1);
}

.action-btn-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.action-btn {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  background: rgba(86, 58, 239, 0.1);
  color: #563aef;
  border-radius: 5px;
  justify-content: center;
}
.action-btn.danger-btn {
  color: #f34141;
  background-color: rgba(243, 65, 65, 0.1);
}

/*---------------------------------
/*  Custom Check Box
---------------------------------*/
.custom-checkbox .cbx {
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}
.custom-checkbox .cbx span {
  display: inline-block;
  vertical-align: middle;
}
.custom-checkbox .cbx span a {
  color: #563AEF;
}
.custom-checkbox .cbx span a:hover {
  color: #0C0C14;
}
.custom-checkbox .cbx span:first-child {
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  transform: scale(1);
  vertical-align: middle;
  border: 1px solid #b9b8c3;
  transition: all 0.2s ease;
}
.custom-checkbox .cbx span:first-child svg {
  position: absolute;
  z-index: 1;
  top: 5px;
  inset-inline-start: 3px;
  fill: none;
  stroke: #ffffff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 16px;
  stroke-dashoffset: 16px;
  transition: all 0.3s ease;
  transition-delay: 0.1s;
  transform: translate3d(0, 0, 0);
}
.custom-checkbox .cbx span:first-child:before {
  content: "";
  width: 100%;
  height: 100%;
  background: #563AEF;
  display: block;
  transform: scale(0);
  opacity: 1;
  border-radius: 50%;
  transition-delay: 0.2s;
}
.custom-checkbox .cbx span:last-child {
  margin-inline-start: 6px;
  color: #5C5958;
  font-weight: 500;
  font-size: 14px;
}
.custom-checkbox .cbx span:last-child:after {
  content: "";
  position: absolute;
  top: 8px;
  inset-inline-start: 0;
  height: 1px;
  width: 100%;
  background: #b9b8c3;
  transform-origin: 0 0;
  transform: scaleX(0);
}
.custom-checkbox .cbx:hover span:first-child {
  border-color: #563AEF;
}
.custom-checkbox .inp-cbx:checked + .cbx span:first-child {
  border-color: #563AEF;
  background: #563AEF;
  animation: check-15 0.6s ease;
}
.custom-checkbox .inp-cbx:checked + .cbx span:first-child svg {
  stroke-dashoffset: 0;
}
.custom-checkbox .inp-cbx:checked + .cbx span:first-child:before {
  transform: scale(2.2);
  opacity: 0;
  transition: all 0.6s ease;
}
.custom-checkbox .inp-cbx:checked + .cbx span:last-child {
  transition: all 0.3s ease;
}

@keyframes check-15 {
  50% {
    transform: scale(1.2);
  }
}
/*----------------------------------------*/
/* Back to top
/*----------------------------------------*/
.backtotop-wrap {
  position: fixed;
  bottom: 30px;
  inset-inline-end: 30px;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
  background: #563AEF;
}
@media (max-width:450px) {
  .backtotop-wrap {
    bottom: 20px;
    inset-inline-end: 20px;
  }
}
.backtotop-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
.backtotop-wrap::after {
  position: absolute;
  font-family: "Font Awesome 6 Pro";
  content: "\f062";
  text-align: center;
  line-height: 46px;
  font-size: 16px;
  font-weight: 400;
  color: #ffffff;
  inset-inline-start: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 1;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}
.backtotop-wrap svg path {
  fill: none;
}
.backtotop-wrap svg.backtotop-circle path {
  stroke: #ccc;
  stroke-width: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  transition: all 400ms linear;
}
.backtotop-wrap.warning-backtotop {
  background-color: #FF8112;
}

.offcanvas-area {
  background: #141A16 none repeat scroll 0 0;
  position: fixed;
  inset-inline-end: 0;
  top: 0;
  width: 340px;
  height: 100%;
  -webkit-transform: translateX(calc(100% + 80px));
  -moz-transform: translateX(calc(100% + 80px));
  -ms-transform: translateX(calc(100% + 80px));
  -o-transform: translateX(calc(100% + 80px));
  transform: translateX(calc(100% + 80px));
  -webkit-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -moz-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  z-index: 999;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}
.offcanvas-area ::-webkit-scrollbar {
  display: none;
}
@media (max-width:450px) {
  .offcanvas-area {
    width: 100%;
  }
}
.offcanvas-area.info-open {
  opacity: 1;
  transform: translateX(0);
}

.offcanvas-logo a img {
  width: 160px;
}
@media (max-width: 575px) {
  .offcanvas-logo a img {
    width: 150px;
  }
}
@media (max-width: 575px) {
  .offcanvas-logo a img {
    width: 140px;
  }
}

.offcanvas-content {
  padding-bottom: 45px;
}

.offcanva-wrapper {
  position: relative;
  height: 100%;
  padding: 30px 30px;
}

.offcanvas-top {
  padding-bottom: 25px;
  margin-bottom: 25px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.079);
}

.offcanvas-title {
  color: #ffffff;
  font-size: 20px;
  margin-bottom: 20px;
}
@media (max-width:450px) {
  .offcanvas-title {
    font-size: 20px;
  }
}

.offcanvas-text p {
  margin-bottom: 25px;
}

.offcanvas-overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: var(--bd-common-black);
  z-index: 900;
  top: 0;
  opacity: 0;
  visibility: hidden;
  inset-inline-end: 0;
  transition: 0.3s;
}
.offcanvas-overlay.overlay-open {
  opacity: 0.6;
  visibility: visible;
}

.sidebar-toggle {
  cursor: pointer;
}

.offcanvas-contact-icon {
  margin-inline-end: 15px;
}

.offcanvas-btn {
  display: flex;
  gap: 15px;
}
.offcanvas-btn .gradient-btn {
  height: 45px;
  padding: 0 25px;
}
.offcanvas-btn .td-primary-btn {
  padding: 0 25px;
}

.offcanvas-close-icon {
  line-height: 1;
  color: #ffffff;
  background: transparent;
}
.offcanvas-close-icon .offcanvas-m-lines {
  position: relative;
  display: block;
  height: 12px;
  width: 33px;
}
.offcanvas-close-icon.animation--flip .offcanvas-m-line.line--1 {
  top: 6px;
  transform: rotate(45deg);
}
.offcanvas-close-icon.animation--flip .offcanvas-m-line.line--3 {
  opacity: 0;
  opacity: 0;
}
.offcanvas-close-icon.animation--flip .offcanvas-m-line.line--2 {
  top: 6px;
  transform: rotate(-45deg);
}
.offcanvas-close-icon .offcanvas-m-line {
  position: absolute;
  inset-inline-start: 0;
  height: 2px;
  width: 100%;
  background-color: currentColor;
  transition: top 0.15s ease, transform 0.3s ease;
}
.offcanvas-close-icon .offcanvas-m-line.line--1 {
  top: 0;
}
.offcanvas-close-icon .offcanvas-m-line.line--2 {
  top: 5px;
}
.offcanvas-close-icon .offcanvas-m-line.line--3 {
  bottom: 0;
  bottom: 0;
}
.offcanvas-close-icon:hover .offcanvas-m-line {
  animation: qode-draw 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
}
.offcanvas-close-icon:hover .offcanvas-m-line:nth-of-type(2) {
  animation-delay: 0.1s;
}

/*----------------------------------------*/
/* site pagination
/*----------------------------------------*/
.table-pagination {
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px 15px;
}
.table-pagination .content p {
  color: rgba(0, 0, 0, 0.6);
}

.basic-pagination ul {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.basic-pagination ul li {
  list-style: none;
}
.basic-pagination ul li a {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  inset-inline-end: 0;
  top: 50%;
  font-weight: 600;
  border-radius: 6px;
  font-size: 16px;
}
.basic-pagination ul li a:hover {
  background-color: #DBDEEC;
}
.basic-pagination ul li .current {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  inset-inline-end: 0;
  top: 50%;
  font-weight: 500;
  font-size: 16px;
  background-color: #DBDEEC;
  color: #5C5958;
  border-radius: 6px;
}

/*----------------------------------------*/
/* Time timepicker customize
/*----------------------------------------*/
.ui-timepicker-container {
  position: absolute;
  overflow: hidden;
  box-sizing: border-box;
}

.ui-timepicker,
.ui-timepicker-viewport {
  box-sizing: content-box;
  height: 205px;
  display: block;
  margin: 0;
}

.ui-timepicker {
  list-style: none;
  padding: 0 1px;
  text-align: center;
}

.ui-timepicker-viewport {
  padding: 0;
  overflow: auto;
  overflow-x: hidden;
}

.ui-timepicker-standard {
  font-size: 12px;
  font-family: sans-serif;
  list-style: none;
  background-color: #ffffff;
  background-clip: padding-box;
  border-radius: 0 0 3px 3px;
  box-shadow: 0 0 0 0.75px #bbb, 2px 1.5px 3px rgba(0, 0, 0, 0.16);
  margin: 0;
  padding: 0;
  border-radius: 6px;
}
.ui-timepicker-standard a {
  display: block;
  background: transparent;
  filter: none;
  border: none;
  width: 100%;
  text-align: left;
  border-radius: 0;
  font-size: 14px;
  padding: 5px 10px;
  line-height: 18px;
  white-space: nowrap;
  text-decoration: none;
  color: inherit;
  transition: none;
}
.ui-timepicker-standard .ui-state-hover {
  box-shadow: none;
  border: none;
  text-decoration: none;
  background-color: #f6f6f6;
  color: #0C0C14;
}
.ui-timepicker-standard .ui-menu-item {
  margin: 0;
  padding: 0;
}

.ui-timepicker-hidden {
  display: none;
}

.ui-timepicker-no-scrollbar .ui-timepicker {
  border: none;
}

/*----------------------------------------
   vuesax icon customize
-----------------------------------------*/
i[class^=icon-] {
  line-height: 1;
  position: relative;
}

/*----------------------------------------
   modal customize
-----------------------------------------*/
.modal {
  background: rgba(0, 0, 0, 0.6) !important;
}

.site-fund-transfer-modal {
  max-width: 606px;
}

.modal-content .popup-body {
  padding: 30px 30px 30px;
}
@media (max-width:450px) {
  .modal-content .popup-body {
    padding: 25px 25px 25px;
  }
}

button.modal-btn-close {
  position: absolute;
  inset-inline-end: 15px;
  top: 15px;
  font-size: 20px;
}
button.modal-btn-close i {
  font-size: 30px;
  color: #F34141;
}
@media (max-width: 575px) {
  button.modal-btn-close i {
    font-size: 24px;
  }
}

.modal-content-wrapper > .title {
  font-size: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 25px;
  padding-inline-end: 30px;
}
@media (max-width: 575px) {
  .modal-content-wrapper > .title {
    font-size: 18px;
  }
}
.modal-content-wrapper .fund-transfer-list {
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
}
.modal-content-wrapper .fund-transfer-list ul li {
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 10px 15px;
}
.modal-content-wrapper .fund-transfer-list ul li:not(:last-child) {
  margin-bottom: 25px;
}
.modal-content-wrapper .fund-transfer-list ul li .title {
  font-size: 16px;
  font-weight: 500;
}
@media (max-width: 575px) {
  .modal-content-wrapper .fund-transfer-list ul li .title {
    font-size: 14px;
  }
}
.modal-content-wrapper .fund-transfer-list ul li .info {
  font-size: 14px;
}
.modal-content-wrapper .alert-text {
  margin-bottom: 30px;
}
.modal-content-wrapper .alert-text .title {
  font-size: 18px;
}
@media (max-width: 575px) {
  .modal-content-wrapper .alert-text .title {
    font-size: 16px;
  }
}

/*----------------------------------------
   Profile delete modal 
-----------------------------------------*/
.profile-delete-modal {
  max-width: 606px;
}
.profile-delete-modal .modal-content .popup-body {
  padding: 50px 30px 50px;
}
.profile-delete-modal .close-content {
  padding: 31px 50px;
  text-align: center;
  border-radius: 8px;
}
.profile-delete-modal .close-content span.close {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 50%;
  margin-bottom: 20px;
}
.profile-delete-modal .close-content h3 {
  color: #ffffff;
  font-size: 22px;
}
.profile-delete-modal .bottom-content .description {
  padding: 25px 0;
  max-width: 436px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 500;
}

/*----------------------------------------
   Withdraw delete modal 
-----------------------------------------*/
.withdraw-modal {
  max-width: 606px;
}
.withdraw-modal .modal-content .popup-body {
  padding: 50px 30px 50px;
}
.withdraw-modal .close-content {
  padding: 45px 50px;
  text-align: center;
  border-radius: 8px;
}
.withdraw-modal .close-content span.close {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 50%;
  margin-bottom: 20px;
}
.withdraw-modal .close-content h3 {
  color: #ffffff;
  font-size: 22px;
}
.withdraw-modal .bottom-content .description {
  padding-top: 25px;
  max-width: 436px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 15px;
}
.withdraw-modal .bottom-content .transaction {
  font-size: 14px;
}
.withdraw-modal .btn-wrap {
  margin-top: 25px;
}

/*----------------------------------------
   Withdraw add modal 
-----------------------------------------*/
.withdraw-add-modal {
  max-width: 606px;
}
.withdraw-add-modal .modal-content .popup-body {
  padding: 45px 30px 50px;
}
.withdraw-add-modal .btn-wrap {
  margin-top: 25px;
}

/*----------------------------------------
   Create ticket modal 
-----------------------------------------*/
.create-ticket-modal {
  max-width: 606px;
}
.create-ticket-modal .modal-content .popup-body {
  padding: 30px 30px 30px;
}
@media (max-width: 575px) {
  .create-ticket-modal .modal-content .popup-body {
    padding: 20px 20px 20px;
  }
}
.create-ticket-modal .btn-wrap {
  margin-top: 25px;
}

/*----------------------------------------
   Image Preview 
-----------------------------------------*/
.file-upload-wrap .top-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}
.file-upload-wrap .input-label {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 5px;
  color: #0C0C14;
}

.upload-custom-file {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 155px;
  text-align: center;
  border: 2px dashed #563AEF;
  border-radius: 8px;
}
.upload-custom-file input[type=file] {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  width: 2px;
  height: 2px;
  overflow: hidden;
  opacity: 0;
}
.upload-custom-file label {
  z-index: 1;
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  bottom: 0;
  inset-inline-end: 0;
  width: 100%;
  overflow: hidden;
  cursor: pointer;
  border-radius: 8px;
  transition: transform 0.4s;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  -webkit-transition: -webkit-transform 0.4s;
  -moz-transition: -moz-transform 0.4s;
  -ms-transition: -ms-transform 0.4s;
  -o-transition: -o-transform 0.4s;
  transition: transform 0.4s;
  background-color: rgba(86, 58, 239, 0.1);
}
.upload-custom-file label span {
  display: block;
  color: #5C5958;
  font-size: 14px;
  -webkit-transition: color 0.4s;
  -moz-transition: color 0.4s;
  -ms-transition: color 0.4s;
  -o-transition: color 0.4s;
  transition: color 0.4s;
}
.upload-custom-file label span b {
  color: #563AEF;
  font-weight: 500;
  text-decoration: underline;
}
.upload-custom-file label .type-file-text {
  margin-top: 5px;
  color: #F34141;
}
.upload-custom-file label .upload-icon {
  width: 40px;
  margin: 0 auto;
  margin-bottom: 15px;
}
.upload-custom-file label.file-ok {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.upload-custom-file label.file-ok span {
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  width: 100%;
  padding: 0.3rem;
  color: #ffffff;
  background-color: rgba(86, 58, 239, 0.5);
  font-weight: 500;
  font-size: 16px;
  margin: auto;
  text-decoration: none;
}
.upload-custom-file label.file-ok .upload-icon {
  display: none;
}
.upload-custom-file.without-image {
  height: 167px;
}
.upload-custom-file.without-image label {
  background-color: #FAFAFA;
}

.upload-thumb-close {
  position: absolute;
  inset-inline-end: 10px;
  top: 35px;
  z-index: 5;
  color: #F34141;
  display: none;
}

/*----------------------------------------
   single input 
-----------------------------------------*/
.single-input {
  position: relative;
}
.single-input:not(:last-child) {
  margin-bottom: 20px;
}
.single-input .input-label {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 5px;
  color: #0C0C14;
  display: block;
}
.single-input .text-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.single-input .text-content .text {
  font-size: 10px;
  color: #563AEF;
  margin-bottom: 0;
  margin-top: 3px;
}
.single-input .text-content .note {
  font-size: 12px;
  color: #F34141;
  margin-top: 3px;
}
.single-input.has-right-icon.has-left-icon input {
  padding-inline-start: 50px;
  padding-inline-end: 40px;
}
.single-input.has-right-icon input {
  padding: 0px 45px 0 16px;
}
.single-input.has-left-icon .input-field {
  position: relative;
  z-index: 1;
}
.single-input.has-left-icon .input-field::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 1px;
  left: 42px;
  top: 0;
  background: rgba(173, 171, 168, 0.3);
}
.single-input.has-left-icon input {
  padding-inline-start: 50px;
  padding-inline-end: 16px;
}
.single-input.has-left-icon .icon {
  position: absolute;
  inset-inline-start: 15px;
  top: 54%;
  transform: translateY(-50%);
  display: inline-block;
  width: 20px;
  line-height: 1;
}
.single-input.has-left-icon .icon i {
  font-weight: 600;
  font-size: 16px;
}
.single-input .warning-text {
  display: none;
}
.single-input .select2-container .select2-selection--single {
  height: 46px;
  align-items: center;
  border-radius: 6px;
  background: #FAFAFA;
  padding-inline-start: 6px;
}
.single-input .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
  position: absolute;
  top: 50%;
  right: 1px;
  width: 20px;
  transform: translateY(-50%);
}
.single-input .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 46px;
}

.input-field {
  position: relative;
}
.input-field.input-group {
  flex-wrap: nowrap;
}
.input-field .icon {
  position: absolute;
  inset-inline-end: 15px;
  top: 45%;
  transform: translateY(-50%);
}
.input-field input {
  width: 100%;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 6px;
  height: 45px;
  padding: 0px 16px 0 16px;
}
.input-field input:focus {
  border-color: rgb(86, 58, 239);
}
.input-field .password {
  position: absolute;
  inset-inline-end: 20px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 16px;
}
.input-field .custom-input {
  background: #FAFAFA;
}
.input-field textarea {
  height: 155px;
  background-color: #FAFAFA;
}
.input-field.disabled {
  opacity: 0.65;
}
.input-field.disabled input {
  cursor: not-allowed;
}

.input-btn-wrap {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.input-btn {
  height: 45px;
  background: #563AEF;
  padding: 0 30px;
  border-color: transparent;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.input-btn i {
  font-size: 20px;
}
.input-btn.btn-danger {
  background-color: #f34141;
  color: #ffffff;
}
.input-btn.btn-danger.disable {
  background-color: rgba(243, 65, 65, 0.1);
  color: #F34141;
}
.input-btn.btn-primary.disabled {
  background-color: rgba(86, 58, 239, 0.5);
}

.input-select select {
  height: 44px;
  width: 100%;
  padding: 0 15px;
  border: 1px solid rgba(12, 12, 20, 0.1);
  border-radius: 6px;
  background-color: #FAFAFA;
  outline: none;
}
.input-select select:focus {
  border: 1px solid #563AEF;
}
.input-select.entries {
  min-width: 185px;
}

.file-upload-close {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
  color: #F34141;
  font-size: 20px;
  z-index: 55;
}

#uploadItems {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.notify-box {
  position: fixed;
  top: 5px;
  z-index: 999;
  background-color: #ffffff;
  inset-inline-end: 5px;
  padding: 20px 30px 20px 16px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  opacity: 1;
  transition: opacity 0.5s ease, transform 0.5s ease;
  max-width: 320px;
}
[dir=rtl] .notify-box {
  padding: 20px 20px 20px 36px;
}
.notify-box.error {
  background-color: #fce8e8;
  border-left: 5px solid #EF476F;
}
.notify-box.success {
  background-color: #e8f9e9;
  border-left: 5px solid #28a745;
}
.notify-box.success .notify-icon span {
  background-color: #28a745;
}
.notify-box.success .notify-title {
  color: #0C0C14;
}
.notify-box.success .notify-description {
  color: rgba(0, 0, 0, 0.6);
}

.notify-contents {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

.notify-icon span {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #EF476F;
  color: #ffffff;
}

.notify-title {
  font-size: 16px;
  margin-bottom: 3px;
  font-weight: 600;
}

.notify-description {
  font-size: 12px;
  line-height: 1.3;
}

.notify-close {
  position: absolute;
  inset-inline-end: -20px;
  top: -11px;
  transition: color 0.3s ease, transform 0.3s ease;
}
.notify-close:hover {
  color: #444;
  transform: rotate(90deg);
}

.select2-container--default .select2-selection--single {
  background-color: transparent;
  border: 2px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  height: 46px;
}
.select2-container--default .select2-selection--single:focus {
  border: 2px solid rgba(0, 0, 0, 0.2);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #5C5958;
  line-height: 46px;
  padding-inline-start: 15px;
  font-weight: 400;
  font-size: 14px;
  outline: none;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 46px;
  position: absolute;
  top: 1px;
  inset-inline-end: 8px;
  width: 20px;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  padding: 0 10px;
  height: 40px;
  font-size: 14px;
  outline: none;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
  border: 1px solid rgba(0, 0, 0, 0.5);
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #563AEF;
}
.select2-container--default .select2-results__option--selected {
  background-color: rgba(94, 63, 201, 0.2);
}

.select2-results__option {
  padding: 6px;
  user-select: none;
  -webkit-user-select: none;
  font-size: 14px;
}

.select2-dropdown {
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.select2-dropdown .img-icon {
  width: auto;
  height: 20px;
  margin-inline-end: 5px;
}

/*----------------------------------------*/
/*  Dark theme   
/*----------------------------------------*/
.dark-icon {
  display: none;
}

.dashboard-bg.dark-theme,
.auth-body.dark-theme {
  background: linear-gradient(108.51deg, #0B0F2C 1.88%, #050611 98.3%);
}

.dark-theme .dark-icon {
  display: block;
}
.dark-theme .black-color {
  color: #ffffff;
}
.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6 {
  color: #ffffff;
}
.dark-theme p {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .site-badge.badge-success {
  background: rgba(0, 190, 86, 0.15);
  color: #00BE56;
}
.dark-theme .site-badge.badge-failed {
  background: rgba(243, 65, 65, 0.15);
  color: #F34141;
}
.dark-theme .site-badge.badge-pending {
  background: rgba(246, 191, 48, 0.15);
  color: #F6BF30;
}
.dark-theme .site-badge.badge-primary {
  background: rgba(86, 58, 239, 0.2);
  color: #563AEF;
}
.dark-theme .black-color {
  color: #ffffff;
}
.dark-theme .primary .dark-icon {
  display: block;
}
.dark-theme .light-icon {
  display: none;
}
.dark-theme .sidebar-wrapper {
  background: #101430;
  box-shadow: 4px 0px 55px rgba(86, 58, 239, 0.04);
}
.dark-theme .user-sidebar .site-logo {
  background: #101430;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dark-theme .toggle-sidebar {
  background: #101430;
}
.dark-theme .toggle-sidebar .bar-icon span {
  background: #ffffff;
}
.dark-theme .page-wrapper.compact-wrapper .page-body-wrapper .back-btn {
  background: #07091C;
  box-shadow: none;
  border-radius: 50%;
  border: 1px solid rgba(173, 171, 168, 0.3);
}
.dark-theme .Checkbox > input:hover + .Checkbox-visible {
  border-color: #563AEF;
}
.dark-theme .Checkbox-visible {
  background: transparent;
  border-color: #563AEF;
}
.dark-theme .Checkbox-visible:hover {
  border-color: #563AEF;
}
.dark-theme .site-fund-transfer-modal .modal-content,
.dark-theme .withdraw-add-modal .modal-content,
.dark-theme .withdraw-modal .modal-content,
.dark-theme .create-ticket-modal .modal-content,
.dark-theme .withdraw-modal .modal-content,
.dark-theme .profile-delete-modal .modal-content {
  background: #101430;
}
.dark-theme .modal-content-wrapper .fund-transfer-list {
  border-color: rgba(255, 255, 255, 0.1);
}
.dark-theme .modal-content-wrapper .fund-transfer-list ul li .info {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .modal-content-wrapper > .title {
  border-color: rgba(255, 255, 255, 0.1);
}
.dark-theme .modal-list-content .modal-list-info .list-item {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .withdraw-modal .bottom-content .description {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .withdraw-modal .bottom-content .transaction {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .page-header {
  background-color: #090c24;
}
.dark-theme .header-primary.header-auth.active-sticky {
  background: #1a1e39 !important;
}
.dark-theme .dashboard-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dark-theme .site-card {
  background: #101430;
  box-shadow: none;
}
.dark-theme .site-card-title {
  color: #ffffff;
}
.dark-theme .user-profile-drop .dropdown-menu {
  background-color: #070A1D;
  filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, 0.08));
}
.dark-theme .user-profile-drop .user-logout {
  border-top: 1px solid rgba(245, 245, 245, 0.08);
}
.dark-theme .user-profile-drop .info-list {
  border-color: rgba(245, 245, 245, 0.08);
}
.dark-theme .user-profile-drop .info-list .content .icon i {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .user-profile-drop .info-list .content .info a {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .notification-popup {
  background-color: #070A1D;
}
.dark-theme .header-notifications > .title {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.1);
}
.dark-theme .notifications-item {
  background: #101430;
  border: 1px solid rgba(173, 171, 168, 0.1);
}
.dark-theme .notification-list .content .title {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .notification-list .content .meta span {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .header-right-content .language-box .header-lang-item > span {
  color: #B4B5BA;
}
.dark-theme .header-right-content .user-action > ul li .notification-box .icon {
  color: #B4B5BA;
}
.dark-theme .dropdown-menu {
  background-color: #07091B;
  box-shadow: none;
}
.dark-theme .filter-dropdown .title {
  border-color: rgba(255, 255, 255, 0.06);
}
.dark-theme .dashboard-card .single-card .number {
  color: #ffffff;
}
.dark-theme .dashboard-card .single-card .info-title {
  color: #ffffff;
}
.dark-theme .dashboard-card .single-card .description {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .user-sidebar .user-nav ul li.active a {
  color: #FFAC3E;
  background-color: rgba(255, 172, 62, 0.1);
}
.dark-theme .user-sidebar .user-nav ul li.active a:before {
  background-color: #FFAC3E;
}
.dark-theme .user-sidebar .user-nav ul li.active a span {
  color: rgb(255, 172, 62);
}
.dark-theme .user-sidebar .user-nav ul li.active a i {
  color: #FFAC3E;
}
.dark-theme .user-sidebar .user-nav ul li a .count-number {
  background-color: rgba(255, 172, 62, 0.2);
  color: rgb(255, 172, 62);
}
.dark-theme .user-sidebar .user-nav ul li a span,
.dark-theme .user-sidebar .user-nav ul li a i {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .site-custom-table .contents .site-table-head .site-table-col {
  color: rgba(255, 255, 255, 0.6);
  border-color: rgba(255, 255, 255, 0.06);
}
.dark-theme .site-custom-table .contents .site-table-list .site-table-col {
  border-color: rgba(255, 255, 255, 0.06);
}
.dark-theme .site-custom-table .contents .site-table-list .site-table-col .found-history-description .content .date {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .site-custom-table .contents .site-table-list .site-table-col .body-text {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .site-custom-table .contents .site-table-list .site-table-col .description .content .title {
  color: #ffffff;
}
.dark-theme .site-custom-table .contents .site-table-list .site-table-col .description .content .date {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .pricing-item {
  background: #080B1F;
  border: 1px solid rgba(173, 171, 168, 0.3);
}
.dark-theme .pricing-item.popular-plan .price-btn .site-btn {
  background-color: #FFAC3E;
  color: #0C0C14;
  opacity: 0.65;
}
.dark-theme .pricing-item .price-value strong {
  color: #ffffff;
}
.dark-theme .pricing-item .price-value sub {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .subscriptions-terms-content .list-content ul li {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .subscriptions-terms-content .list-content ul li::before {
  background-color: rgba(255, 255, 255, 0.7);
}
.dark-theme .add-gateway,
.dark-theme .support-ticket-form-grid {
  background: #07091C;
  border: 1px solid rgba(173, 171, 168, 0.3);
}
.dark-theme .select-gateway .select-gateway-item {
  background: #07091C;
}
.dark-theme .select-gateway .label-radio span {
  color: #563AEF;
}
.dark-theme .add-found-details {
  background: #07091C;
}
.dark-theme .add-found-details .list ul li .info {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .add-found-details .list ul li .info:first-child {
  color: #ffffff;
}
.dark-theme .fund-transfer-history-field {
  background: #080A1E;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .add-gateway-thumb {
  background-color: #101430;
}
.dark-theme .single-input .input-label {
  color: #ffffff;
}
.dark-theme .single-input.has-left-icon .icon {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-field input {
  background: #07091C;
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(173, 171, 168, 0.3);
}
.dark-theme .input-field input:focus {
  border-color: #563aef;
}
.dark-theme .input-field input::placeholder {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-field.input-group .input-group-text {
  background: #07091C;
  border-color: rgba(173, 171, 168, 0.3);
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-field .password {
  filter: invert(1);
}
.dark-theme .input-field textarea {
  background: #07091C;
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(173, 171, 168, 0.3);
}
.dark-theme .input-select .nice-select {
  background-color: #07091C;
  border-color: rgba(173, 171, 168, 0.3);
}
.dark-theme .input-select .nice-select:after {
  border-color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-select .nice-select .current {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-select .nice-select .list {
  background-color: #07091C;
}
.dark-theme .input-select .nice-select .option {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .input-select .nice-select .option:hover {
  background-color: #101430;
}
.dark-theme .input-select .nice-select .option.selected.focus {
  background-color: #101430;
}
.dark-theme .single-input .text-content .text {
  color: #FFAC3E;
}
.dark-theme .upload-custom-file.without-image label {
  background-color: #07091C;
}
.dark-theme .upload-custom-file.without-image label span {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .file-upload-wrap .input-label {
  color: #ffffff;
}
.dark-theme input[type=radio] ~ label {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme input[type=radio] ~ label::before {
  background-color: transparent;
}
.dark-theme .ui-timepicker-standard {
  background-color: #07091C;
  box-shadow: none;
  border: 1px solid rgba(173, 171, 168, 0.3);
}
.dark-theme .ui-timepicker-standard a {
  color: rgba(255, 255, 255, 0.5);
}
.dark-theme .ui-timepicker-standard .ui-state-hover {
  background-color: #101430;
  color: #ffffff;
}
.dark-theme .ads-step .ads-step-inner {
  background: rgba(255, 255, 255, 0.1);
}
.dark-theme .ads-step .ads-step-inner .step-btn {
  color: #ffffff;
}
.dark-theme .add-schedule-inputs {
  background: #07091C;
}
.dark-theme .add-schedule-top .content .description {
  color: #ffffff;
}
.dark-theme .table > :not(caption) > * > * {
  background-color: #101430;
  color: #ffffff;
}
.dark-theme .table-pagination .content p {
  color: #ffffff;
}
.dark-theme .basic-pagination ul li a {
  color: #9B9BA0;
}
.dark-theme .basic-pagination ul li a:hover {
  background-color: #563AEF;
  color: #ffffff;
}
.dark-theme .basic-pagination ul li .current {
  background-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}
.dark-theme .my-ads-fields-wrapper {
  background: #080A1D;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .my-ads-fields-wrapper .site-btn {
  background-color: #563AEF;
  color: #ffffff;
}
.dark-theme .my-ads-fields-wrapper .input-field input {
  background: #101430;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.dark-theme .my-ads-fields-wrapper .input-select .nice-select {
  background: #101430;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.dark-theme .site-table .table > thead > tr > th {
  color: rgba(255, 255, 255, 0.6);
  border-color: rgba(255, 255, 255, 0.06);
}
.dark-theme .transactions-filed-wrapper,
.dark-theme .withdraw-history-form {
  background: #080A1E;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .transactions-filed-wrapper .input-field input,
.dark-theme .withdraw-history-form .input-field input {
  background: #101430;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .transactions-filed-wrapper .input-select .nice-select,
.dark-theme .withdraw-history-form .input-select .nice-select {
  background: #101430;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .transactions-filed-wrapper .site-btn.black-btn,
.dark-theme .withdraw-history-form .site-btn.black-btn {
  background-color: #FFAC3E;
  color: #0C0C14;
}
.dark-theme .referral-share-item {
  background: #101430;
  box-shadow: none;
}
.dark-theme .referral-user .content .description {
  color: #ffffff;
}
.dark-theme .withdraw-item-wrapper {
  background: #07091C;
}
.dark-theme .profile-info-content .content .title {
  color: #ffffff;
}
.dark-theme .two-factor-auth-wrapper {
  background: #101430;
}
.dark-theme .two-factor-auth-wrapper .qr-code .white-qr-img {
  display: block;
}
.dark-theme .two-factor-auth-wrapper .qr-code .dark-qr-img {
  display: none;
}
.dark-theme .otp-form .inputs .verification input {
  color: #ffffff;
}
.dark-theme .action-checkbox-item {
  background: #07091C;
  border: 1px solid rgba(173, 171, 168, 0.1);
}
.dark-theme .support-ticket-form-grid .input-select .nice-select {
  background: #101430;
  border: 0;
}
.dark-theme .support-ticket-form-grid .input-field input {
  background: #101430;
  border: 0;
}
.dark-theme .support-ticket-form-grid .site-btn.black-btn {
  background: #101430;
}
.dark-theme .support-tickets-aviator .contents .info {
  color: rgba(255, 255, 255, 0.5);
}
.dark-theme .support-tickets-card {
  background-color: rgba(31, 31, 31, 0.8);
}
.dark-theme .support-tickets-card .salutation {
  color: white;
}
.dark-theme .support-tickets-card .message-body {
  color: white;
}
.dark-theme .support-tickets-card .message-footer .regards {
  color: white;
}
.dark-theme .support-tickets-card .message-footer .email {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .support-tickets-card .message-attachments .title {
  color: white;
}
.dark-theme .support-tickets-card .single-attachment .attach {
  color: rgba(255, 255, 255, 0.6);
}
.dark-theme .notifications-right-content .notifications-link .site-btn {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}
.dark-theme .auth-wrapper .contents-inner .content {
  background-color: #101430;
  box-shadow: none;
}
.dark-theme .auth-wrapper .contents-inner .content .forgot {
  border-color: rgba(255, 255, 255, 0.1);
}
.dark-theme .auth-wrapper .contents-inner .content .forgot a {
  color: #FFAC3E;
}
.dark-theme .auth-wrapper .contents-inner .content .have-acount p a {
  color: #FFAC3E;
}
.dark-theme .auth-wrapper .contents-inner .content .account-steps .single-step .line {
  background: rgba(255, 172, 62, 0.2);
}
.dark-theme .auth-wrapper .contents-inner .content .account-steps .single-step.active .line {
  background: #FFAC3E;
}
.dark-theme .auth-wrapper .contents-inner .content .account-steps .single-step.active .description {
  color: #FFAC3E;
}
.dark-theme .auth-wrapper .terms-user p a {
  color: #FFAC3E;
}
.dark-theme .custom-checkbox .cbx span:last-child {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .header-lang-item > span {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .dashboard-footer-area .need-content .description a {
  color: #FFAC3E;
}
.dark-theme .ads-single-item {
  background-color: #080B20;
}
.dark-theme .ads-single-item .title {
  color: #ffffff;
}
.dark-theme .ads-single-item .btn-wrap .site-btn {
  background-color: #563AEF;
}
.dark-theme .identity-alert .contents .head {
  color: #ffffff;
}
.dark-theme .identity-alert .contents .content {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .identity-alert .contents .content small,
.dark-theme .identity-alert .contents .content strong {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .advertisement-card {
  background-color: #080A1D;
}
.dark-theme .advertisement-card .count {
  background: #080A1D;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.05);
}
.dark-theme .advertisement-card .advertisement-calc {
  background: #101430;
  border: 1px solid rgba(0, 0, 0, 0.04);
}
.dark-theme .progress-advertisement-item .progress-count {
  color: #ffffff;
}
.dark-theme .social-sign-btn {
  background: #07091C;
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(173, 171, 168, 0.3);
}
.dark-theme .ads-single-item.style-two .title {
  color: #ffffff;
}
.dark-theme .withdraw-area .button-inner {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.dark-theme .withdraw-area .button-inner .input-btn-wrap .site-btn.black-btn {
  background-color: #FFAC3E;
  color: #0C0C14;
}
.dark-theme .select2-container--default .select2-selection--single {
  border: 1px solid rgba(255, 255, 255, 0.3);
  background-color: #07091C;
}
.dark-theme .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: rgba(255, 255, 255, 0.7);
}
.dark-theme .select2-container--default .select2-selection--single:focus {
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.dark-theme .select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: #0C0C14;
  color: #ffffff;
}
.dark-theme .select2-dropdown {
  background: #0C0C14;
  border: 1px solid rgba(255, 255, 255, 0.4);
}
.dark-theme .select2-results__option--selectable {
  color: rgba(255, 255, 255, 0.7);
}

/*----------------------------------------*/
/*  Body bg
/*----------------------------------------*/
.landing-page-bg {
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7));
  background-image: url(../images/bg/body-bg.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
}

/*----------------------------------------*/
/*  Main menu css
  /*----------------------------------------*/
.td-main-menu > ul {
  display: inline-flex;
}
.td-main-menu > ul > li:not(:last-child) {
  margin-inline-end: 30px;
  margin-inline-end: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-main-menu > ul > li:not(:last-child) {
    margin-inline-end: 0px;
  }
}
.td-main-menu > ul > li > a {
  position: relative;
}
.td-main-menu > ul > li > a.active {
  color: #FF8112 !important;
}
.td-main-menu > ul > li:last-child a::before {
  display: none;
}
.td-main-menu > ul > li:hover > a {
  color: #FF8112;
}
.td-main-menu > ul > li:hover > ul {
  opacity: 1;
  pointer-events: all;
  inset-inline-start: 0px;
}
.td-main-menu > ul > li:hover > ul.dp-menu li:hover > ul {
  opacity: 1;
  pointer-events: all;
  inset-inline-start: 100%;
}
.td-main-menu li {
  position: relative;
  list-style: none;
}
.td-main-menu li a {
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  color: #ffffff;
  padding: 12px 0px;
  display: inline-block;
  color: #ffffff;
  padding: 12px 0px;
  display: inline-block;
}
.td-main-menu li:has(ul) > a:after {
  content: "\f107";
  font-family: "Font Awesome 6 Pro";
  margin-inline-start: 3px;
  font-weight: 500;
  font-size: 15px;
}

.main-menu-two > ul > li > a {
  position: relative;
  color: #0C0C14;
  font-weight: 600;
}
.main-menu-two > ul > li > a::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  bottom: 8px;
  bottom: 8px;
  inset-inline-start: 0;
  background-color: #0C0C14;
  background-color: #0C0C14;
  transform: scaleX(0);
  transform-origin: bottom right;
  transition: transform 0.3s;
}
.main-menu-two > ul > li:hover > a {
  color: #0C0C14;
}
.main-menu-two > ul > li:hover > a::after {
  transform-origin: bottom left;
  transform: scaleX(1);
}

.bd-sticky .menu-is-white > ul > li > a {
  color: #0C0C14;
}

.menu-icon {
  width: 30px;
  height: 20px;
  position: relative;
  display: inline-block;
}
.menu-icon::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  top: 0;
  inset-inline-start: 0;
  transition: all 0.3s;
}
.menu-icon::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  bottom: 0;
  inset-inline-start: 0;
  transition: all 0.3s;
}
.menu-icon span {
  position: absolute;
  content: "";
  width: 18px;
  height: 1px;
  top: 50%;
  inset-inline-end: 0;
  transition: all 0.3s;
}
.menu-icon:hover::after, .menu-icon:hover::before,
.menu-icon:hover span {
  background-color: #563AEF;
}

/*----------------------------------------*/
/*  Header css
  /*----------------------------------------*/
.logo-black {
  display: none;
}

.active-sticky {
  position: fixed !important;
  top: 0;
  z-index: 111;
  inset-inline-end: 0;
  inset-inline-start: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.9) !important;
  -webkit-animation: fadeInDown 300ms ease-in-out 0s normal none 1 running;
  animation: fadeInDown 300ms ease-in-out 0s normal none 1 running;
  box-shadow: 0px 20px 40px rgba(37, 9, 62, 0.1);
  backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.active-sticky .logo-black {
  display: block;
}
.active-sticky .logo-white {
  display: none;
}
.active-sticky .toggle-bar-icon span {
  background: #000000;
}

.header-style-one.active-sticky {
  padding: 13px 0;
  padding: 13px 0;
}
.header-style-one.active-sticky .td-main-menu > ul > li > a {
  color: #0C0C14;
}
.header-style-one.active-sticky .td-main-menu > ul > li > a:hover {
  color: #FF8112;
}
.header-style-one.active-sticky .td-main-menu > ul > li > a.active {
  color: #FF8112 !important;
}
.header-style-one.active-sticky .header-menu {
  box-shadow: none;
  background: transparent;
  backdrop-filter: none;
}
.header-style-one.active-sticky .td-main-menu > ul > li > a {
  color: #0C0C14;
}
.header-style-one.active-sticky .td-main-menu > ul > li > a:hover {
  color: #FF8112;
}
.header-style-one.active-sticky .header-menu {
  box-shadow: none;
  background: transparent;
  backdrop-filter: none;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-style-one.active-sticky {
    padding: 15px 0;
  }
}
.header-style-one.active-sticky .header-btn-wrap .header-lang-item > span {
  color: #0C0C14;
}
.header-style-one.active-sticky .header-right.style-one .header-action .bar-icon span {
  background-color: #0C0C14;
}

.header-style-one {
  padding-top: 25px;
}
.header-style-one .header-logo img {
  height: 36px;
}
@media (max-width: 575px) {
  .header-style-one .header-logo img {
    height: 34px;
  }
}
@media (max-width: 575px) {
  .header-style-one {
    padding-top: 20px;
  }
}
.header-style-one .header-menu {
  padding: 8px 20px 8px 20px;
  background: #ffffff;
  border-radius: 10px;
  display: flex;
  gap: 20px 60px;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0px 20px 40px rgba(37, 9, 62, 0.1);
  backdrop-filter: blur(16px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-style-one .header-menu {
    padding: 8px 8px 8px 15px;
    gap: 20px 20px;
  }
}
.header-style-one .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-style-one .header-btn-wrap {
  display: inline-flex !important;
  align-items: center;
  gap: 5px 20px;
}
.header-style-one .header-btn-wrap .header-lang-item > span {
  color: #ffffff;
}
.header-style-one .header-right.style-one .header-action {
  display: flex;
  align-items: center;
}
.header-style-one .header-right.style-one .header-action .bar-icon span {
  background-color: #ffffff;
}

/*----------------------------------------*/
/*  Header style two css
  /*----------------------------------------*/
.header-style-two {
  padding-top: 25px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-style-two {
    padding: 0 15px;
    padding-top: 20px;
  }
}
.header-style-two.active-sticky {
  padding-top: 0;
  padding: 15px 30px;
}
@media (max-width: 575px) {
  .header-style-two.active-sticky {
    padding: 18px 0px;
  }
}
.header-style-two .header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-style-two .header-logo img {
  height: 36px;
}
.header-style-two .header-btn-wrap {
  display: inline-flex;
  align-items: center;
  gap: 20px;
}
.header-style-two .header-right {
  display: flex;
  align-items: center;
  gap: 30px 60px;
}
.header-style-two .header-right .toggle-bar-icon span {
  background: #000000;
}
.header-style-two .header-lang-item > span {
  color: #0C0C14;
}
.header-style-two .header-action {
  display: flex;
  align-items: center;
}

/*----------------------------------------*/
/*  Offcanvas style
  /*----------------------------------------*/
.offcanvas-area {
  background: #ffffff none repeat scroll 0 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 340px;
  height: 100%;
  -webkit-transform: translateX(calc(100% + 80px));
  -moz-transform: translateX(calc(100% + 80px));
  -ms-transform: translateX(calc(100% + 80px));
  -o-transform: translateX(calc(100% + 80px));
  transform: translateX(calc(100% + 80px));
  -webkit-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -moz-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  z-index: 999;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}
.offcanvas-area ::-webkit-scrollbar {
  display: none;
}
@media (max-width:450px) {
  .offcanvas-area {
    width: 100%;
  }
}
.offcanvas-area.info-open {
  opacity: 1;
  transform: translateX(0);
}

.offcanvas-logo a img {
  width: 160px;
}
@media (max-width: 575px) {
  .offcanvas-logo a img {
    width: 150px;
  }
}
@media (max-width: 575px) {
  .offcanvas-logo a img {
    width: 140px;
  }
}

.offcanvas-content {
  padding-bottom: 45px;
}

.offcanva-wrapper {
  position: relative;
  height: 100%;
  padding: 30px 30px;
}

.offcanvas-top {
  padding-bottom: 25px;
  margin-bottom: 25px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.offcanvas-title {
  color: #ffffff;
  font-size: 20px;
  margin-bottom: 20px;
}
@media (max-width:450px) {
  .offcanvas-title {
    font-size: 20px;
  }
}

.offcanvas-text p {
  margin-bottom: 25px;
}

.offcanvas-overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #0C0C14;
  z-index: 900;
  top: 0;
  opacity: 0;
  visibility: hidden;
  inset-inline-end: 0;
  transition: 0.3s;
}
.offcanvas-overlay.overlay-open {
  opacity: 0.6;
  visibility: visible;
}

.sidebar-toggle {
  cursor: pointer;
}

.offcanvas-contact-icon {
  margin-inline-end: 15px;
}

.offcanvas-btn {
  display: flex;
  gap: 15px;
}
.offcanvas-btn .site-btn {
  padding: 0 20px;
}
@media (max-width: 575px) {
  .offcanvas-btn .site-btn {
    font-size: 14px;
  }
}
.offcanvas-btn .gradient-btn {
  height: 45px;
  padding: 0 25px;
}
.offcanvas-btn .td-primary-btn {
  padding: 0 25px;
}

.offcanvas-close-icon {
  background: transparent;
  display: inline-block;
  font-size: 16px;
  height: 44px;
  width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #eaeaef;
  background-color: transparent;
  color: #0C0C14;
  border-radius: 50%;
}
.offcanvas-close-icon:hover {
  color: #ffffff;
  background-color: #563AEF;
  border-color: transparent;
}

/*----------------------------------------*/
/*  Meanmenu css
/*----------------------------------------*/
.mean-container {
  margin-bottom: 30px;
}
.mean-container a.meanmenu-reveal {
  width: 22px;
  height: 22px;
  padding: 13px 13px 11px 13px;
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  cursor: pointer;
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  text-indent: -9999em;
  line-height: 22px;
  font-size: 1px;
  font-weight: 700;
  display: none !important;
}
.mean-container a.meanmenu-reveal span {
  display: block;
  background: #ffffff;
  height: 3px;
  margin-top: 3px;
}
.mean-container .mean-push {
  float: left;
  width: 100%;
  padding: 0;
  margin: 0;
  clear: both;
}
.mean-container .mean-nav {
  background: none;
  margin-top: 0;
  float: left;
  width: 100%;
}
.mean-container .mean-nav .wrapper {
  width: 100%;
  padding: 0;
  margin: 0;
}
.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}
.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}
.mean-container .mean-nav ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
}
.mean-container .mean-nav ul li {
  position: relative;
  float: left;
  width: 100%;
}
.mean-container .mean-nav ul li.dropdown-opened > a, .mean-container .mean-nav ul li.dropdown-opened > span {
  color: #ffffff;
}
.mean-container .mean-nav ul li.dropdown-opened > a.mean-expand.mean-clicked, .mean-container .mean-nav ul li.dropdown-opened > span.mean-expand.mean-clicked {
  background: #ffffff;
  color: #ffffff;
  border-color: transparent;
}
.mean-container .mean-nav ul li.dropdown-opened > a.mean-expand.mean-clicked i, .mean-container .mean-nav ul li.dropdown-opened > span.mean-expand.mean-clicked i {
  color: #ffffff;
  transform: rotate(90deg);
}
.mean-container .mean-nav ul li.mean-last {
  border-bottom: none;
  margin-bottom: 0;
}
.mean-container .mean-nav ul li > a.mean-expand i {
  display: inline-block;
  transition: 0.3s;
}
.mean-container .mean-nav ul li > a > i {
  display: none;
}
.mean-container .mean-nav ul li a, .mean-container .mean-nav ul li span {
  display: block;
  float: left;
  width: 90%;
  padding: 10px 5%;
  margin: 0;
  text-align: left;
  text-decoration: none;
  width: 100%;
  padding: 10px 0;
  color: rgba(0, 0, 0, 0.7);
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  font-size: 16px;
  line-height: 1.5;
  font-weight: 500;
}
[dir=rtl] .mean-container .mean-nav ul li a, [dir=rtl] .mean-container .mean-nav ul li span {
  text-align: right;
}
.mean-container .mean-nav ul li a:hover, .mean-container .mean-nav ul li span:hover {
  color: #0C0C14;
}
.mean-container .mean-nav ul li a:hover i, .mean-container .mean-nav ul li span:hover i {
  color: #0C0C14;
}
.mean-container .mean-nav ul li a.mean-expand, .mean-container .mean-nav ul li span.mean-expand {
  text-align: center;
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  z-index: 2;
  font-weight: 700;
  background: transparent;
  border: none !important;
  font-size: 14px;
  margin-top: 5px;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.079) !important;
  height: 30px;
  width: 30px;
  color: rgba(0, 0, 0, 0.6);
  line-height: 30px;
  top: 0;
  font-weight: 400;
}
.mean-container .mean-nav ul li a.mean-expand:hover, .mean-container .mean-nav ul li span.mean-expand:hover {
  background: #ffffff;
  color: #ffffff;
  border-color: #ffffff;
}
.mean-container .mean-nav ul li a.mean-expand:hover i, .mean-container .mean-nav ul li span.mean-expand:hover i {
  color: #ffffff;
}
.mean-container .mean-nav ul li a.mean-expand.mean-clicked, .mean-container .mean-nav ul li span.mean-expand.mean-clicked {
  color: #ffffff;
}
.mean-container .mean-nav ul li a.mean-expand.mean-clicked:hover, .mean-container .mean-nav ul li span.mean-expand.mean-clicked:hover {
  background: #ffffff;
  color: #ffffff;
  border-color: #ffffff;
}
.mean-container .mean-nav ul li li a {
  width: 90%;
  padding: 10px 7%;
  text-shadow: none !important;
  visibility: visible;
}
.mean-container .mean-nav ul li li li a {
  width: 80%;
  padding: 10px 12%;
}
.mean-container .mean-nav ul li li li li a {
  width: 70%;
  padding: 10px 17%;
}
.mean-container .mean-nav ul li li li li li a {
  width: 60%;
  padding: 10px 20%;
}
.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
  float: left;
  width: 100%;
  position: relative;
  padding: 4px 0;
  min-height: 42px;
  z-index: 999999;
}
.mean-container .mean-bar, .mean-container .mean-bar * {
  /* Fix for box sizing on Foundation Framework etc. */
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/*----------------------------------------*/
/*  section title css
  /*----------------------------------------*/
.section-title-wrapper.is-white .section-title {
  color: #ffffff;
}
.section-title-wrapper.is-white .description {
  color: rgba(255, 255, 255, 0.7);
}

.max-w-640 {
  max-width: 640px;
  margin: 0 auto;
}

/*----------------------------------------*/
/*  banner css
  /*----------------------------------------*/
.banner-style-one {
  background-color: #563AEF;
  padding-top: 250px;
  padding-bottom: 170px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one {
    padding-top: 220px;
    padding-bottom: 150px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-style-one {
    padding-top: 180px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one {
    padding-top: 150px;
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-style-one {
    padding-top: 130px;
    padding-bottom: 0px;
  }
}
@media (max-width: 575px) {
  .banner-style-one {
    padding-top: 100px;
    padding-bottom: 0px;
  }
}
@media (max-width:450px) {
  .banner-style-one {
    padding-top: 110px;
    padding-bottom: 0px;
  }
}
.banner-style-one .banner-content .banner-title {
  font-size: 56px;
  color: #ffffff;
  margin-bottom: 30px;
  line-height: 1.3;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 48px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 46px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 44px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 34px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 32px;
  }
}
@media (max-width: 575px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 32px;
  }
}
@media (max-width:450px) {
  .banner-style-one .banner-content .banner-title {
    font-size: 24px;
  }
}
.banner-style-one .banner-content .text-highlight {
  color: #FF8112;
  position: relative;
  display: inline-block;
}
.banner-style-one .banner-content .text-highlight .text-line {
  position: absolute;
  bottom: -9px;
  left: 45%;
  transform: translateX(-50%);
}
.banner-style-one .banner-content .description {
  color: #ffffff;
  margin-bottom: 30px;
  font-size: 16px;
  line-height: 28px;
  max-width: 620px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-content .description {
    font-size: 16px;
  }
}
.banner-style-one .shape-one {
  position: absolute;
  top: 100px;
  inset-inline-start: 3%;
}
.banner-style-one .shape-two {
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
}
.banner-style-one .shape-three {
  position: absolute;
  bottom: 11%;
  inset-inline-start: 37%;
}
.banner-style-one .shape-four {
  position: absolute;
  top: 18%;
  inset-inline-end: 63px;
}
.banner-style-one .shape-five {
  position: absolute;
  bottom: 137px;
  inset-inline-end: 37px;
}
.banner-style-one .banner-thumb {
  position: absolute;
  bottom: 0;
  max-width: 690px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one .banner-thumb {
    max-width: 560px;
    inset-inline-end: 4%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-thumb {
    max-width: 340px;
    inset-inline-end: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-style-one .banner-thumb {
    position: inherit;
    bottom: auto;
    inset-inline-end: 0;
    max-width: 480px;
    margin: 0 auto;
  }
}
@media (max-width: 575px) {
  .banner-style-one .banner-thumb {
    position: inherit;
    bottom: auto;
    inset-inline-end: 0;
    max-width: 480px;
    margin: 0 auto;
  }
}
@media (max-width: 575px) {
  .banner-style-one .banner-thumb {
    position: inherit;
    bottom: auto;
    inset-inline-end: 0;
  }
}
.banner-style-one .banner-thumb-wrapper .round-one {
  width: 817px;
  height: 817px;
  background: rgba(255, 255, 255, 0.1);
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 75%;
  transform: translate(-50%, -50%);
}
[dir=rtl] .banner-style-one .banner-thumb-wrapper .round-one {
  left: 30%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-style-one .banner-thumb-wrapper .round-one {
    width: 747px;
    height: 747px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one .banner-thumb-wrapper .round-one {
    width: 717px;
    height: 717px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-thumb-wrapper .round-one {
    display: none;
  }
}
.banner-style-one .banner-thumb-wrapper .round-two {
  width: 587px;
  height: 587px;
  background: rgba(255, 255, 255, 0.1);
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 75%;
  transform: translate(-50%, -50%);
}
[dir=rtl] .banner-style-one .banner-thumb-wrapper .round-two {
  left: 30%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-style-one .banner-thumb-wrapper .round-two {
    width: 517px;
    height: 517px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one .banner-thumb-wrapper .round-two {
    width: 487px;
    height: 487px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-thumb-wrapper .round-two {
    display: none;
  }
}
.banner-style-one .banner-thumb-wrapper .round-three {
  width: 387px;
  height: 387px;
  background: rgba(255, 255, 255, 0.4);
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 75%;
  transform: translate(-50%, -50%);
}
[dir=rtl] .banner-style-one .banner-thumb-wrapper .round-three {
  left: 30%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-style-one .banner-thumb-wrapper .round-three {
    width: 317px;
    height: 317px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-one .banner-thumb-wrapper .round-three {
    width: 287px;
    height: 287px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-one .banner-thumb-wrapper .round-three {
    display: none;
  }
}

/*----------------------------------------*/
/*  banner two css
  /*----------------------------------------*/
.banner-style-two {
  padding-top: 150px;
  padding-bottom: 125px;
  background-color: rgb(249, 248, 244);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-style-two {
    padding-top: 140px;
    padding-bottom: 115px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-style-two {
    padding-top: 140px;
    padding-bottom: 110px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-style-two {
    padding-top: 135px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-style-two {
    padding-top: 140px;
    padding-bottom: 75px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-style-two {
    padding-top: 140px;
    padding-bottom: 65px;
  }
}
@media (max-width: 575px) {
  .banner-style-two {
    padding-top: 130px;
    padding-bottom: 65px;
  }
}

.banner-content.style-two .banner-title {
  font-size: 56px;
  margin-bottom: 40px;
  line-height: 1.3;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .banner-content.style-two .banner-title {
    font-size: 48px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .banner-content.style-two .banner-title {
    font-size: 44px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .banner-content.style-two .banner-title {
    font-size: 40px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-content.style-two .banner-title {
    font-size: 38px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-content.style-two .banner-title {
    font-size: 28px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .banner-content.style-two .banner-title {
    font-size: 28px;
    margin-bottom: 30px;
  }
}
@media (max-width: 575px) {
  .banner-content.style-two .banner-title {
    font-size: 26px;
    margin-bottom: 30px;
  }
}
.banner-content.style-two .description {
  font-size: 16px;
  line-height: 30px;
  max-width: 699px;
  margin-bottom: 35px;
}
@media (max-width: 575px) {
  .banner-content.style-two .description {
    font-size: 14px;
    margin-bottom: 30px;
  }
}
.banner-content.style-two .banner-user-wrpper {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 55px;
}
@media (max-width: 575px) {
  .banner-content.style-two .banner-user-wrpper {
    margin-top: 25px;
  }
}
.banner-content.style-two .banner-user-wrpper .clients-content {
  display: flex;
  align-items: center;
  gap: 6px;
}
.banner-content.style-two .banner-user-wrpper .clients-content .description {
  font-size: 16px;
  font-weight: 500;
  color: #576363;
  margin-bottom: 0;
}
.banner-content.style-two .banner-user-wrpper .clients-content .title {
  font-size: 30px;
  font-weight: 800;
}
.banner-content.style-two .user-clients img {
  width: 24px;
  border: 1px solid #FC5D19;
  border-radius: 50%;
}
.banner-content.style-two .user-clients img:not(:first-child) {
  margin-inline-start: -15px;
}

.banner-thumb-wrapper.style-two {
  position: relative;
  margin-bottom: 24px;
  z-index: 1;
}
.banner-thumb-wrapper.style-two .banner-thumb {
  -webkit-mask-image: url(../images/banner/banner-mask.svg);
  mask-image: url(../images/banner/banner-mask.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  width: 711.73px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .banner-thumb-wrapper.style-two .banner-thumb {
    width: 100%;
  }
}
.banner-thumb-wrapper.style-two .triangle-shapes {
  position: absolute;
  top: 25px;
  inset-inline-start: 50px;
  width: 120%;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .banner-thumb-wrapper.style-two .triangle-shapes {
    width: 85%;
  }
}

.banner-shapes .shape-one {
  position: absolute;
  top: 15%;
  z-index: -1;
  inset-inline-start: 2%;
  -moz-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  -webkit-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .banner-shapes .shape-one {
    max-width: 100px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-shapes .shape-one {
    max-width: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-one {
    max-width: 50px;
  }
}
.banner-shapes .shape-two {
  position: absolute;
  inset-inline-start: 0px;
  bottom: 69px;
  z-index: -1;
}
[dir=rtl] .banner-shapes .shape-two {
  transform: rotate(180deg);
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .banner-shapes .shape-two {
    max-width: 100px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-shapes .shape-two {
    max-width: 70px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-two {
    max-width: 50px;
  }
}
.banner-shapes .shape-three {
  position: absolute;
  bottom: 18%;
  inset-inline-start: 40%;
  z-index: -1;
  -webkit-animation: tdZoom 4s infinite linear;
  animation: tdZoom 4s infinite linear;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-three {
    max-width: 40px;
  }
}
.banner-shapes .shape-four {
  position: absolute;
  top: 25%;
  inset-inline-end: 48%;
  z-index: -1;
  -moz-animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
  animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-four {
    max-width: 40px;
  }
}
.banner-shapes .shape-five {
  position: absolute;
  top: 17%;
  inset-inline-end: 18%;
  z-index: -1;
  -moz-animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
  animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .banner-shapes .shape-five {
    max-width: 130px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-five {
    max-width: 70px;
  }
}
.banner-shapes .shape-six {
  position: absolute;
  inset-inline-end: 7%;
  bottom: 15%;
  z-index: -1;
  -webkit-animation: tdSpinner 6s infinite linear;
  animation: tdSpinner 6s infinite linear;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-shapes .shape-six {
    max-width: 40px;
  }
}

/*----------------------------------------*/
/*  About css
  /*----------------------------------------*/
.about-shapes .shape-one {
  position: absolute;
  bottom: 40%;
  transform: translateX(-50%);
  inset-inline-start: 85px;
  -moz-animation: tdrotate 9s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tdrotate 9s ease-in-out 1s forwards infinite alternate;
  animation: tdrotate 9s ease-in-out 1s forwards infinite alternate;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-shapes .shape-one {
    inset-inline-start: 35px;
  }
}
.about-shapes .shape-two {
  position: absolute;
  inset-inline-end: 5%;
  bottom: 20%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-shapes .shape-two {
    inset-inline-end: 1%;
    max-width: 80px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes .shape-two {
    bottom: 6%;
    max-width: 85px;
  }
}
@media (max-width:450px) {
  .about-shapes .shape-two {
    display: none;
  }
}

.about-thumb-wrap.style-one {
  position: relative;
  max-width: 531px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-thumb-wrap.style-one {
    max-width: 100%;
  }
}
.about-thumb-wrap.style-one .about-thumb img {
  width: 100%;
}
.about-thumb-wrap.style-one .card-one {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  background: #ed5ab3;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 30px;
  max-width: 326px;
}
.about-thumb-wrap.style-one .card-one p {
  font-size: 18px;
  color: #ffffff;
}
.about-thumb-wrap.style-one .card-two {
  width: 297.58px;
  height: 58.99px;
  background: #FF8112;
  border-radius: 10px;
  position: absolute;
  bottom: 0;
  inset-inline-end: 0;
}
.about-thumb-wrap.style-one .establish-shape {
  width: 120px;
  height: 120px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #563AEF;
  border-radius: 50%;
  position: absolute;
  bottom: -20px;
  inset-inline-end: -20px;
  text-align: center;
}
@media (max-width: 575px) {
  .about-thumb-wrap.style-one .establish-shape {
    bottom: -10px;
    inset-inline-end: 20px;
  }
}
.about-thumb-wrap.style-one .establish-shape span,
.about-thumb-wrap.style-one .establish-shape h3 {
  color: #ffffff;
  font-size: 22px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-content {
    padding-inline-start: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-content {
    padding-inline-start: 20px;
  }
}
.about-content.style-one .about-info-list ul li {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.about-content.style-one .about-info-list ul li:not(:last-child) {
  margin-bottom: 5px;
}
.about-content.style-one .about-info-list ul li .list-item_icon {
  font-size: 24px;
  position: relative;
  top: 3px;
  color: #563AEF;
}
.about-content.style-one .about-info-list ul li .list-item-text {
  font-size: 14px;
  font-weight: 600;
  color: #563AEF;
}

/*----------------------------------------*/
/*  About three css
  /*----------------------------------------*/
.about-shapes-three .shape-one {
  position: absolute;
  bottom: 81px;
  inset-inline-start: -20px;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-shapes-three .shape-one {
    max-width: 130px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes-three .shape-one {
    max-width: 80px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes-three .shape-one {
    display: none;
  }
}
.about-shapes-three .shape-two {
  position: absolute;
  top: 8%;
  inset-inline-end: 0;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-shapes-three .shape-two {
    max-width: 65px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes-three .shape-two {
    max-width: 60px;
  }
}
.about-shapes-three .shape-three {
  position: absolute;
  top: 10%;
  inset-inline-start: 0;
  z-index: -1;
}
[dir=rtl] .about-shapes-three .shape-three {
  transform: rotate(180deg);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-shapes-three .shape-three {
    max-width: 80px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes-three .shape-three {
    max-width: 60px;
  }
}

.about-content.style-three {
  padding-inline-start: 45px;
  padding-inline-end: 95px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .about-content.style-three {
    padding-inline-end: 0;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-content.style-three {
    padding: 0;
  }
}
.about-content.style-three .site-info-list {
  margin-bottom: 30px;
}
.about-content.style-three .site-info-list ul li:not(:last-child) {
  margin-bottom: 10px;
}
.about-content.style-three .list-item-text {
  font-size: 16px;
}

.about-thumb-wrap.style-three {
  padding-inline-end: 90px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about-thumb-wrap.style-three {
    padding-inline-end: 0;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .about-thumb-wrap.style-three {
    padding-inline-end: 30px;
  }
}
.about-thumb-wrap.style-three .column {
  display: flex;
  flex-direction: column;
  gap: 35px;
}
.about-thumb-wrap.style-three .column:nth-child(2) {
  margin-top: 50px;
}
.about-thumb-wrap.style-three .thumb-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 35px 35px;
}
.about-thumb-wrap.style-three .thumb-grid .thumb img {
  border-radius: 10px;
}

/*----------------------------------------*/
/*  About two css
  /*----------------------------------------*/
.about-shapes-two .shape-one {
  position: absolute;
  top: 10%;
  inset-inline-start: 60px;
  -moz-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  -webkit-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  max-width: 45px;
}
.about-shapes-two .shape-two {
  position: absolute;
  inset-inline-end: -110px;
  bottom: 47px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .about-shapes-two .shape-two {
    max-width: 200px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .about-shapes-two .shape-two {
    max-width: 180px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .about-shapes-two .shape-two {
    max-width: 150px;
  }
}

.about-thumb-wrap.style-two {
  position: relative;
  margin-inline-end: 90px;
  margin-bottom: 70px;
  z-index: 5;
}
.about-thumb-wrap.style-two .shape-one {
  position: absolute;
  width: 466.05px;
  height: 377.43px;
  background: #FC5D19;
  box-shadow: 0px 0px 72px rgba(243, 65, 65, 0.1);
  border-radius: 96px;
  transform: rotate(-10.19deg);
  bottom: -10%;
  inset-inline-start: 0;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-thumb-wrap.style-two .shape-one {
    width: 416.05px;
    height: 327.43px;
  }
}
@media (max-width: 575px) {
  .about-thumb-wrap.style-two .shape-one {
    display: none;
  }
}
.about-thumb-wrap.style-two .about-thumb-two {
  max-width: 464px;
  position: absolute;
  bottom: -104px;
  inset-inline-end: 0;
}
.about-thumb-wrap.style-two .about-thumb-two .pay-video {
  position: absolute;
  top: 50%;
  inset-inline-start: 50%;
  transform: translate(-50%, -50%);
}
.about-thumb-wrap.style-two .about-thumb-two::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  inset-inline-start: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
  border-radius: 45px;
}
.about-thumb-wrap.style-two .about-thumb-two > img {
  border-radius: 45px;
}
.about-thumb-wrap.style-two .about-thumb-one {
  max-width: 596px;
  transform: translateX(95px);
}
.about-thumb-wrap.style-two .about-thumb-one img {
  border-radius: 45px;
}

/*----------------------------------------*/
/*  how it works css
  /*----------------------------------------*/
.how-it-works-area {
  background: linear-gradient(292.15deg, #cbcbfc 42.04%, #cdf3ff 94.71%);
}

.how-it-shapes .shape-one {
  position: absolute;
  bottom: 6%;
  inset-inline-end: 34%;
  -webkit-animation: tdSpinner 6s infinite linear;
  animation: tdSpinner 6s infinite linear;
}
.how-it-shapes .shape-two {
  position: absolute;
  inset-inline-start: 77px;
  top: 80px;
  -moz-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  -webkit-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
}
@media (max-width: 575px) {
  .how-it-shapes .shape-two {
    display: none;
  }
}
.how-it-shapes .shape-three {
  position: absolute;
  inset-inline-end: 4%;
  top: 20%;
  animation: upslide 4s linear forwards infinite alternate;
}

.how-it-works-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  justify-content: space-between;
  gap: 30px;
  position: relative;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .how-it-works-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width:450px) {
  .how-it-works-grid {
    grid-template-columns: 1fr;
  }
}
.how-it-works-grid .line-shapes {
  position: absolute;
  width: 100%;
  top: 10%;
  inset-inline-start: 0;
}

.how-it-works-item {
  text-align: center;
  position: relative;
  max-width: 377px;
  margin: 0 auto;
}
@media (max-width:450px) {
  .how-it-works-item {
    max-width: 320px;
  }
}
.how-it-works-item:nth-child(2n-1) .thumb .number {
  top: 13px;
  inset-inline-end: 9px;
}
.how-it-works-item .thumb {
  margin-bottom: 30px;
  position: relative;
}
.how-it-works-item .thumb img {
  border: 3px solid #F34141;
  border-radius: 50%;
}
.how-it-works-item .content .title {
  margin-bottom: 20px;
  font-size: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .how-it-works-item .content .title {
    font-size: 18px;
  }
}
.how-it-works-item .content .description {
  color: rgba(92, 89, 88, 0.9);
}
.how-it-works-item .number {
  position: absolute;
  top: 50%;
  inset-inline-end: 0;
  width: 66px;
  height: 66px;
  background-color: #FF8112;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #ffffff;
  font-size: 26px;
  font-weight: 600;
}

/*----------------------------------------*/
/*  Benefits css
  /*----------------------------------------*/
.benefits-overlay {
  position: relative;
  z-index: 11;
}
.benefits-overlay.include-bg:before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background: linear-gradient(0deg, rgba(86, 58, 239, 0.7), rgba(86, 58, 239, 0.7));
  top: 0;
  inset-inline-start: 0;
  z-index: -1;
}

.benefits-shapes .shape-one {
  position: absolute;
  bottom: -60px;
  inset-inline-end: 0;
}
@media (max-width: 575px) {
  .benefits-shapes .shape-one {
    display: none;
  }
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1428px;
  margin: 0 auto;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-grid {
    grid-template-columns: 1fr;
  }
}
.benefits-grid .column {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-grid .column {
    display: grid;
    grid-template-columns: auto auto;
  }
}
@media (max-width: 575px) {
  .benefits-grid .column {
    display: grid;
    grid-template-columns: 1fr;
  }
}
.benefits-grid .column:nth-child(1) {
  margin-top: 270px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-grid .column:nth-child(1) {
    margin-top: 150px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-grid .column:nth-child(1) {
    margin-top: 0px;
  }
}
.benefits-grid .column:nth-child(1) .benefits-item:nth-child(2) .icon span {
  background: linear-gradient(180deg, rgba(16, 226, 100, 0.1) 0%, rgba(0, 190, 86, 0.1) 100%);
}
.benefits-grid .column:nth-child(2) {
  margin-top: 115px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-grid .column:nth-child(2) {
    margin-top: 65px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-grid .column:nth-child(2) {
    margin-top: 0px;
  }
}
.benefits-grid .column:nth-child(2) .benefits-item:nth-child(1) .icon span {
  background: linear-gradient(180deg, rgba(250, 148, 58, 0.1) 0%, rgba(255, 129, 18, 0.1) 98%);
}
.benefits-grid .column:nth-child(2) .benefits-item:nth-child(2) .icon span {
  background: linear-gradient(180deg, rgba(5, 205, 238, 0.1) 0%, rgba(2, 186, 216, 0.1) 100%);
}
.benefits-grid .column:nth-child(3) .benefits-item:nth-child(1) .icon span {
  background: linear-gradient(180deg, rgba(242, 127, 237, 0.1) 0%, rgba(249, 102, 242, 0.1) 100%);
}
.benefits-grid .column:nth-child(3) .benefits-item:nth-child(2) .icon span {
  background: linear-gradient(180deg, rgba(255, 221, 88, 0.1) 0%, rgba(224, 190, 56, 0.1) 100%);
}

.benefits-item {
  background: #ffffff;
  border: 1px solid rgba(110, 110, 115, 0.2);
  border-radius: 10px;
  padding: 40px 40px 40px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefits-item {
    padding: 30px 30px 30px;
  }
}
.benefits-item .icon {
  margin-bottom: 35px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-item .icon {
    margin-bottom: 25px;
  }
}
.benefits-item .icon span {
  width: 75px;
  height: 75px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(164, 53, 240, 0.1) 0%, rgba(86, 58, 239, 0.1) 100%);
  border: 2px solid #ffffff;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
  border-radius: 50%;
}
.benefits-item .content .title {
  margin-bottom: 25px;
  font-size: 28px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .benefits-item .content .title {
    font-size: 24px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefits-item .content .title {
    font-size: 24px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-item .content .title {
    font-size: 20px;
  }
}

/*----------------------------------------*/
/*  Benefits two css
  /*----------------------------------------*/
.benefits-section-two {
  background-color: #143134;
}

.benefits-thumb-wrap.style-two .benefits-thumb {
  position: absolute;
  top: 50%;
  inset-inline-start: 0;
  transform: translateY(-50%);
}
.benefits-thumb-wrap.style-two .benefits-thumb img {
  border-radius: 0 20px 20px 0;
}
[dir=rtl] .benefits-thumb-wrap.style-two .benefits-thumb img {
  border-radius: 20px 0px 0px 20px;
}
[dir=rtl] .benefits-thumb-wrap.style-two .benefits-thumb {
  width: 40%;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .benefits-thumb-wrap.style-two .benefits-thumb {
    max-width: 600px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .benefits-thumb-wrap.style-two .benefits-thumb {
    max-width: 38%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefits-thumb-wrap.style-two .benefits-thumb {
    max-width: 35%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-thumb-wrap.style-two .benefits-thumb {
    position: inherit;
    max-width: inherit;
  }
}
.benefits-thumb-wrap.style-two .benefits-thumb img {
  width: 100%;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .benefits-thumb-wrap.style-two .benefits-thumb img {
    border-radius: 10px;
  }
}

.benefits-shapes-two .shape-one {
  position: absolute;
  top: 6%;
  inset-inline-start: 35px;
  z-index: -1;
  -moz-animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
  animation: tdtranslateY2 3s ease-in-out 1s forwards infinite alternate;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .benefits-shapes-two .shape-one {
    max-width: 100px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-shapes-two .shape-one {
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .benefits-shapes-two .shape-one {
    display: none;
  }
}
.benefits-shapes-two .shape-two {
  position: absolute;
  top: 54px;
  inset-inline-end: 76px;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .benefits-shapes-two .shape-two {
    max-width: 100px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-shapes-two .shape-two {
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .benefits-shapes-two .shape-two {
    display: none;
  }
}
.benefits-shapes-two .shape-three {
  position: absolute;
  inset-inline-end: -88px;
  bottom: 67px;
  z-index: -1;
}

.benefits-item-wrapper-two {
  margin-inline-start: 30px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefits-item-wrapper-two {
    margin-inline-start: 0;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .benefits-item-wrapper-two {
    grid-template-columns: 1fr;
  }
}
.benefits-item-wrapper-two .column {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.benefits-item-wrapper-two .column:nth-child(2) {
  margin-top: 30px;
}

.benefits-item-two {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(23px);
  border-radius: 30px;
  padding: 25px 25px 25px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px) {
  .benefits-item-two {
    padding: 25px 20px;
  }
}
.benefits-item-two .icon {
  margin-bottom: 25px;
}
.benefits-item-two .content .title {
  color: #ffffff;
  margin-bottom: 20px;
  font-size: 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefits-item-two .content .title {
    font-size: 18px;
  }
}
.benefits-item-two .content .description {
  font-weight: 400;
  color: rgba(255, 255, 255, 0.7);
}

/*----------------------------------------*/
/*  fun fact css
  /*----------------------------------------*/
.fun-fact-content .description {
  max-width: 631px;
  font-size: 18px;
  font-weight: 400;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .fun-fact-content .description {
    font-size: 18px;
  }
}

.fun-fact-counter-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}
@media (max-width:450px) {
  .fun-fact-counter-grid {
    grid-template-columns: 1fr;
  }
}

.single-counter-item {
  background: linear-gradient(289.81deg, #ededff -1.51%, #f0fafd 94.29%);
  border: 1px solid rgba(5, 205, 238, 0.3);
  border-radius: 10px;
  padding: 45px 40px;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-counter-item {
    padding: 30px 25px;
  }
}
.single-counter-item:nth-child(2n) {
  position: relative;
  top: 45px;
}
@media (max-width:450px) {
  .single-counter-item:nth-child(2n) {
    top: 0px;
  }
}
.single-counter-item::before {
  position: absolute;
  content: "";
  width: 196px;
  height: 196px;
  background: linear-gradient(136.24deg, rgba(86, 58, 239, 0.15) 13.6%, rgba(67, 218, 242, 0.15) 69.65%);
  border-radius: 50%;
  inset-inline-end: -70px;
  top: -70px;
}
.single-counter-item.is-active {
  background: linear-gradient(289.81deg, #563aef -1.51%, #05cdee 86.53%);
  border: 0;
}
.single-counter-item.is-active::before {
  display: none;
}
.single-counter-item.is-active .content .title {
  color: #ffffff;
}
.single-counter-item.is-active .content .description {
  color: #ffffff;
}
.single-counter-item .icon {
  margin-bottom: 30px;
}
.single-counter-item .content .title {
  font-size: 46px;
  margin-bottom: 15px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .single-counter-item .content .title {
    font-size: 36px;
  }
}
@media (max-width:450px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-counter-item .content .title {
    font-size: 30px;
  }
}
.single-counter-item .content .description {
  font-size: 18px;
  font-weight: 500;
}

/*----------------------------------------*/
/*  invite css
  /*----------------------------------------*/
.invite-thumb-wrap {
  position: relative;
  margin-inline-end: 50px;
  margin-bottom: 138px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .invite-thumb-wrap {
    margin-inline-end: 0;
  }
}
@media (max-width:450px) {
  .invite-thumb-wrap {
    margin-bottom: 87px;
  }
}
.invite-thumb-wrap .thumb-inner {
  display: flex;
  gap: 25px;
}
.invite-thumb-wrap .thumb-inner .thumb img {
  border-radius: 10px;
}
.invite-thumb-wrap .thumb-inner .thumb:nth-child(2) {
  position: relative;
  top: 88px;
}
.invite-thumb-wrap .earn-card {
  background: #FF8112;
  border-radius: 24px;
  display: inline-flex;
  padding: 17px 80px;
  font-size: 40px;
  position: absolute;
  bottom: 105;
  inset-inline-end: 0;
}
@media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .invite-thumb-wrap .earn-card {
    padding: 17px 40px;
  }
}
.invite-thumb-wrap .earn-card p {
  font-size: 32px;
  line-height: 1.3;
  color: #ffffff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .invite-thumb-wrap .earn-card p {
    font-size: 28px;
  }
}
@media (max-width: 575px) {
  .invite-thumb-wrap .earn-card p {
    font-size: 20px;
  }
}

.invite-content {
  padding: 45px 60px 50px;
  background: linear-gradient(292.15deg, #cbcbfc 42.04%, #cdf3ff 94.71%);
  border-radius: 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .invite-content {
    padding: 40px 40px;
  }
}
@media (max-width: 575px) {
  .invite-content {
    padding: 35px 30px 40px;
  }
}
@media (max-width:450px) {
  .invite-content {
    padding: 25px 20px 30px;
  }
}
.invite-content .title {
  font-size: 50px;
  margin-bottom: 30px;
}
.invite-content .btn-inner {
  margin-top: 30px;
}

/*----------------------------------------*/
/*  customer review css
  /*----------------------------------------*/
.customer-review-item {
  max-width: 444px;
}
.customer-review-item .quote {
  margin-bottom: 30px;
}
.customer-review-item .content {
  margin-bottom: 25px;
  padding-bottom: 45px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.customer-review-item .content .description {
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .customer-review-item .content .description {
    font-size: 16px;
  }
}

.admin-item {
  display: flex;
  align-items: center;
  gap: 20px;
}

.admin-thumb {
  width: 52px;
}
.admin-thumb img {
  border-radius: 50%;
}

.admin-info {
  font-size: 19px;
  margin-bottom: 4px;
}
.admin-info .admin-title {
  font-size: 18px;
}
.admin-info .admin-des {
  font-size: 14px;
  font-weight: 500;
}

/*----------------------------------------*/
/*  social marketing css
  /*----------------------------------------*/
.social-marketing-content {
  padding-inline-end: 50px;
  padding-inline-start: 30px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .social-marketing-content {
    padding-inline-end: 0;
  }
}
.social-marketing-content .description {
  font-size: 18px;
  font-weight: 300;
  line-height: 1.5;
  max-width: 630px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .social-marketing-content .description {
    font-size: 20px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .social-marketing-content .description {
    font-size: 18px;
  }
}
.social-marketing-content .btn-inner {
  margin-top: 35px;
}

/*----------------------------------------*/
/*  social marketing two css
  /*----------------------------------------*/
.social-overlay {
  position: relative;
}
.social-overlay::before {
  position: absolute;
  content: "";
  background: #143134;
  top: 0;
  inset-inline-start: 0;
  width: 50%;
  height: 100%;
  z-index: -1;
  clip-path: polygon(55.781% 0%, 0% 0%, 0% 100%, 100% 100%);
}
[dir=rtl] .social-overlay::before {
  transform: rotate(180deg);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .social-overlay::before {
    width: 100%;
    height: 55%;
  }
}

.social-marketing-shapes .shape-one {
  position: absolute;
  top: 49px;
  inset-inline-start: 66px;
}
.social-marketing-shapes .shape-two {
  position: absolute;
  bottom: 50px;
  inset-inline-start: 14px;
  -webkit-animation: tdSpinner 5s infinite linear;
  animation: tdSpinner 5s infinite linear;
  max-width: 150px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .social-marketing-shapes .shape-two {
    max-width: 120px;
  }
}

.social-marketing-wrap.style-two {
  margin-inline-start: 115px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .social-marketing-wrap.style-two {
    margin-inline-start: 0px;
  }
}
.social-marketing-wrap.style-two .social-marketing-thumb {
  max-width: 413px;
}

.social-marketing-content-two {
  margin-inline-start: -27px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .social-marketing-content-two {
    margin-inline-start: 0px;
  }
}
.social-marketing-content-two .description {
  max-width: 665px;
}

/*----------------------------------------*/
/*  Newsletter two css
  /*----------------------------------------*/
.newsletter-section-two {
  background-color: #f9f8f4;
}

.newsletter-wrapper.style-two {
  text-align: center;
}

.wrapper {
  background-color: #ffffff;
  padding: 50px 50px;
  border-radius: 10px;
  position: relative;
}
@media (max-width:450px) {
  .wrapper {
    padding: 30px 20px;
  }
}
.wrapper .shape-one {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .wrapper .shape-one {
    max-width: 100px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .wrapper .shape-one {
    max-width: 50px;
  }
}
.wrapper .shape-two {
  position: absolute;
  bottom: 60px;
  inset-inline-start: 0;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .wrapper .shape-two {
    max-width: 100px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .wrapper .shape-two {
    max-width: 45px;
    inset-inline-start: 7px;
    bottom: 10px;
  }
}

.newsletter-input-form-two form {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.newsletter-input-form-two input {
  background: rgba(8, 79, 110, 0.1);
  padding: 0 20px;
  color: #084f6e;
  height: 50px;
  width: 400px;
  margin: 0 auto;
  border: 0;
  border-radius: 0;
  font-size: 16px;
}
.newsletter-input-form-two input::placeholder {
  font-size: 16px;
}
@media (max-width: 575px) {
  .newsletter-input-form-two input {
    width: 100%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .newsletter-input-form-two .site-btn {
    width: 100%;
  }
}

/*----------------------------------------*/
/*  Newsletter css
  /*----------------------------------------*/
.newsletter-main {
  padding: 60px 65px;
  border-radius: 10px;
  position: relative;
  z-index: 11;
  overflow: hidden;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .newsletter-main {
    padding: 30px 30px;
  }
}
.newsletter-main::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background-color: rgba(86, 58, 239, 0.8);
  top: 0;
  inset-inline-start: 0;
  z-index: -1;
}
.newsletter-main .newsletter-grid {
  display: grid;
  grid-template-columns: 45% 45%;
  gap: 30px;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .newsletter-main .newsletter-grid {
    grid-template-columns: 1fr;
  }
}
.newsletter-main .newsletter-grid .content .description {
  color: #ffffff;
  font-size: 18px;
  max-width: 455px;
  line-height: 32px;
  font-weight: 400;
}
.newsletter-main .newsletter-grid .content .title {
  font-size: 40px;
  color: #ffffff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .newsletter-main .newsletter-grid .content .title {
    font-size: 30px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .newsletter-main .newsletter-grid .content .title {
    font-size: 26px;
  }
}

.newsletter-input-form {
  position: relative;
}
.newsletter-input-form input {
  height: 60px;
  background: #ffffff;
  backdrop-filter: blur(15px);
  border-radius: 10px;
  padding-inline-start: 30px;
  padding-inline-end: 135px;
  border: 0px;
}
.newsletter-input-form .site-btn {
  position: absolute;
  top: 50%;
  inset-inline-end: 5px;
  transform: translateY(-50%);
}

/*----------------------------------------*/
/*  Footer Style
  /*----------------------------------------*/
.footer-primary {
  background-color: #0b0c31;
  position: relative;
  z-index: 5;
}

.footer-shapes .shape-one {
  position: absolute;
  bottom: 0;
  inset-inline-start: -20px;
}
[dir=rtl] .footer-shapes .shape-one {
  transform: rotate(220deg);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-shapes .shape-one {
    max-width: 100px;
  }
}
@media (max-width: 575px) {
  .footer-shapes .shape-one {
    display: none;
  }
}
.footer-shapes .shape-two {
  position: absolute;
  inset-inline-start: 25%;
  bottom: 40%;
  z-index: -1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-shapes .shape-two {
    display: none;
  }
}
.footer-shapes .shape-three {
  position: absolute;
  top: 12%;
  inset-inline-end: 43%;
  -webkit-animation: tdSpinner 6s infinite linear;
  animation: tdSpinner 6s infinite linear;
}
.footer-shapes .shape-four {
  position: absolute;
  top: 5%;
  inset-inline-end: 4%;
  -webkit-animation: tdZoom 4s infinite linear;
  animation: tdZoom 4s infinite linear;
}

.footer-logo {
  margin-bottom: 30px;
}

.footer-main {
  padding-top: 100px;
  margin-bottom: 100px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-main {
    padding-top: 80px;
    margin-bottom: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-main {
    padding-top: 60px;
    margin-bottom: 60px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-main {
    padding-top: 65px;
    margin-bottom: 65px;
  }
}

.footer-content {
  max-width: 267px;
}
.footer-content .description {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
}

.footer-logo img {
  max-width: 191px;
}

.footer-widget-title h5 {
  margin-bottom: 30px;
  font-size: 20px;
  position: relative;
  z-index: 10;
  color: #ffffff;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget-title h5 {
    font-size: 18px;
  }
}

.footer-title h4 {
  font-size: 20px;
}

.footer-link ul {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 12px;
}
.footer-link ul li {
  list-style: none;
}
.footer-link ul li a {
  font-size: 14px;
  position: relative;
  color: #ffffff;
}
.footer-link ul li a:hover {
  color: #563AEF;
}

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding: 22px 0;
}

.footer-info .footer-info-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.footer-info .footer-info-item:not(:last-child) {
  margin-bottom: 20px;
}
.footer-info .footer-info-item:last-child {
  align-items: start;
}
.footer-info .footer-info-icon span {
  color: #563AEF;
}
.footer-info .footer-info-text span {
  font-weight: 500;
  color: #ffffff;
  font-size: 14px;
}
.footer-info .footer-info-text span a:hover {
  color: #563AEF;
}
.footer-info .footer-info-text p {
  color: #737374;
}
.footer-info .footer-info-text p a:hover {
  color: #563AEF;
}
.footer-info .footer-social {
  display: flex;
  gap: 13px;
  margin-top: 30px;
}
.footer-info .footer-social a {
  color: #07041b;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background: rgba(255, 255, 255, 0.8);
  font-size: 16px;
  border-radius: 50%;
}
.footer-info .footer-social a:hover {
  background-color: #563AEF;
  color: #ffffff;
  transform: translateY(-3px);
}

.footer-copyright p {
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  font-weight: 400;
}
.footer-copyright p a {
  color: #563AEF;
}
.footer-copyright p a:hover {
  color: #563AEF;
}

/*----------------------------------------*/
/*  Footer two Style
  /*----------------------------------------*/
.footer-secondary .footer-widget-1-2 {
  margin-inline-start: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-secondary .footer-widget-1-2 {
    margin-inline-start: 30px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-secondary .footer-widget-1-2 {
    margin-inline-start: 0px;
  }
}
.footer-secondary .footer-widget-1-3 {
  margin-inline-start: 75px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-secondary .footer-widget-1-3 {
    margin-inline-start: 35px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-secondary .footer-widget-1-3 {
    margin-inline-start: 0px;
  }
}
.footer-secondary .footer-link ul li a {
  font-size: 14px;
  position: relative;
  color: #576363;
}
.footer-secondary .footer-link ul li a:hover {
  color: #FC5D19;
}
.footer-secondary .footer-newslatter {
  background: rgba(252, 93, 25, 0.1);
  border: 1px solid rgba(252, 93, 25, 0.6);
  border-radius: 30px;
  padding: 50px;
  text-align: center;
  max-width: 453px;
  margin: 0 0 0 auto;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-secondary .footer-newslatter {
    max-width: 100%;
    margin: 0;
  }
}
@media (max-width:450px) {
  .footer-secondary .footer-newslatter {
    padding: 30px;
  }
}
.footer-secondary .footer-newslatter .content .title {
  font-size: 20px;
  margin-bottom: 24px;
}
.footer-secondary .footer-newslatter .content .description {
  margin-bottom: 30px;
}
.footer-secondary .footer-newslatter .content .site-btn {
  border-radius: 20px;
}
@media (max-width:450px) {
  .footer-secondary .footer-newslatter .content .site-btn {
    padding: 0 20px;
  }
}
.footer-secondary .footer-widget-title h5 {
  color: #0C0C14;
}
.footer-secondary .footer-info-two ul li {
  list-style: none;
}
.footer-secondary .footer-info-two ul li .footer-info-item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.footer-secondary .footer-info-two ul li .footer-info-item .footer-info-icon span {
  color: #FC5D19;
}
.footer-secondary .footer-info-two ul li .footer-info-item .footer-info-text span a:hover {
  color: #FC5D19;
}
.footer-secondary .footer-info-two ul li:not(:last-child) {
  margin-bottom: 16px;
}

@media (max-width: 575px) {
  .footer-two-shapes {
    display: none;
  }
}
.footer-two-shapes .shape-one {
  position: absolute;
  top: 62px;
  inset-inline-start: -20px;
  z-index: -1;
}
.footer-two-shapes .shape-two {
  position: absolute;
  inset-inline-start: -56px;
  bottom: 15%;
  z-index: -1;
  -moz-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  -webkit-animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
  animation: tdupdown 2.3s ease-in-out 2.3s forwards infinite alternate;
}
.footer-two-shapes .shape-three {
  position: absolute;
  inset-inline-start: 33%;
  top: 90px;
  z-index: -1;
  animation: 4s linear 0s infinite normal none running tdZoom;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-two-shapes .shape-three {
    display: none;
  }
}
.footer-two-shapes .shape-four {
  position: absolute;
  inset-inline-end: 44%;
  bottom: 32%;
  z-index: -1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-two-shapes .shape-four {
    display: none;
  }
}
.footer-two-shapes .shape-five {
  position: absolute;
  inset-inline-end: 32px;
  top: 62px;
  z-index: -1;
  animation: 3s ease-in-out 1s infinite alternate forwards running tdtranslateY2;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-two-shapes .shape-five {
    max-width: 60px;
  }
}
.footer-two-shapes .shape-six {
  position: absolute;
  inset-inline-end: 0;
  bottom: 0;
  z-index: -1;
}
[dir=rtl] .footer-two-shapes .shape-six {
  transform: rotate(180deg);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-two-shapes .shape-six {
    max-width: 150px;
  }
}

.footer-copyright-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
@media (max-width: 575px) {
  .footer-copyright-left {
    flex-direction: column;
  }
}
.footer-copyright-left .logo {
  max-width: 88px;
}
.footer-copyright-left .description {
  color: #143134;
}

.footer-social {
  display: flex;
  align-items: center;
  gap: 10px 20px;
}
.footer-social a {
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background: #FC5D19;
  font-size: 16px;
  border-radius: 50%;
}
.footer-social a:hover {
  transform: translateY(-3px);
}

.footer-copyright-two {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 22px;
  border-top: 1px solid rgba(20, 49, 52, 0.15);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-copyright-two {
    flex-wrap: wrap;
    justify-content: center;
  }
}

/*----------------------------------------*/
/*  FAQ Style
  /*----------------------------------------*/
.faq-area.style-one {
  background: linear-gradient(292.15deg, #cbcbfc 42.04%, #cdf3ff 94.71%);
}

.faq-shapes .shape-one {
  position: absolute;
  inset-inline-end: 0;
  top: 0;
}
[dir=rtl] .faq-shapes .shape-one {
  position: absolute;
  transform: rotate(175deg);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-shapes .shape-one {
    max-width: 70px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .faq-shapes .shape-one {
    display: none;
  }
}
.faq-shapes .shape-two {
  position: absolute;
  top: 46px;
  inset-inline-start: 49px;
  -webkit-animation: tdZoom 4s infinite linear;
  animation: tdZoom 6s infinite linear;
  z-index: -1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .faq-shapes .shape-two {
    display: none;
  }
}

.faq-content {
  padding-inline-start: 140px;
  padding-inline-end: 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .faq-content {
    padding-inline-start: 80px;
    padding-inline-end: 0;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .faq-content {
    padding-inline-start: 0;
    padding-inline-end: 0;
  }
}
.faq-content .thumb {
  max-width: 221px;
  position: relative;
  z-index: 5;
  margin-bottom: 60px;
  margin-inline-start: 42px;
}
@media (max-width: 575px) {
  .faq-content .thumb {
    margin: 0 auto;
    margin-bottom: 60px;
  }
}
.faq-content .thumb::before {
  position: absolute;
  content: "";
  height: 240px;
  width: 240px;
  background: #563aef;
  bottom: -9px;
  left: 50%;
  border-radius: 50%;
  z-index: -1;
  transform: translateX(-50%);
}
.faq-content .thumb::after {
  position: absolute;
  content: "";
  height: 304px;
  width: 304px;
  background: rgba(134, 131, 213, 0.1);
  top: 65%;
  left: 50%;
  border-radius: 50%;
  z-index: -1;
  transform: translate(-50%, -50%);
}
.faq-content .btn-inner {
  margin-top: 30px;
}

.accordion-wrapper.site-faq .accordion .accordion-button {
  padding: 40.5px 70px 40.5px 25px;
  font-size: 20px;
  font-weight: 600;
  background: transparent;
  box-shadow: none;
  font-size: 20px;
  font-weight: 600;
  background: transparent;
  box-shadow: none;
}
[dir=rtl] .accordion-wrapper.site-faq .accordion .accordion-button {
  padding: 21px 20px 20px 35px;
}
@media (max-width: 575px) {
  .accordion-wrapper.site-faq .accordion .accordion-button {
    font-size: 18px;
  }
}
@media (max-width:450px) {
  .accordion-wrapper.site-faq .accordion .accordion-button {
    font-size: 16px;
    padding: 21px 30px 20px 20px;
  }
}
.accordion-wrapper.site-faq .accordion .accordion-button:not(.collapsed) {
  background: #ffffff;
  border: 0;
  border-radius: 0;
  color: var(--td-white);
}
.accordion-wrapper.site-faq .accordion .accordion-button:not(.collapsed) span {
  color: #563AEF;
}
.accordion-wrapper.site-faq .accordion .accordion-button:not(.collapsed):after {
  color: var(--td-white);
  content: "\f00d" !important;
  background-color: #563AEF;
  color: #ffffff;
}
.accordion-wrapper.site-faq .accordion .accordion-button:not(.collapsed) .accordion-body {
  background: #ffffff;
}
.accordion-wrapper.site-faq .accordion .accordion-button::after {
  position: absolute;
  inset-inline-end: 20px;
  content: "+";
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-weight: 400;
  height: 30px;
  width: 30px;
  background: rgb(232, 232, 232);
  line-height: 40px;
  text-align: center;
  color: #0C0C14;
  top: 50%;
  border-radius: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 575px) {
  .accordion-wrapper.site-faq .accordion .accordion-button::after {
    inset-inline-end: 0;
  }
}
.accordion-wrapper.site-faq .accordion .accordion-button span {
  padding-inline-end: 7px;
  display: inline-block;
  transition: none;
}
.accordion-wrapper.site-faq .accordion .accordion-body {
  padding-inline-start: 25px;
  padding-inline-end: 25px;
  background: transparent;
  padding-bottom: 25px;
  border-radius: 0px;
  padding-top: 0px;
}
@media (max-width:450px) {
  .accordion-wrapper.site-faq .accordion .accordion-body {
    padding-inline-start: 20px;
    padding-inline-end: 20px;
  }
}
.accordion-wrapper.site-faq .accordion .accordion-body .accordion-body-list {
  margin-top: 14px;
}
.accordion-wrapper.site-faq .accordion .accordion-body .accordion-body-list ul li:not(:last-child) {
  margin-bottom: 7px;
}
.accordion-wrapper.site-faq .accordion .accordion-item {
  background: transparent;
  border-radius: 0px;
  box-shadow: none;
  border: 0;
}
.accordion-wrapper.site-faq .accordion .accordion-item:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.accordion-wrapper.site-faq .accordion .accordion-item:last-of-type > .accordion-collapse {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.accordion-wrapper.site-faq .accordion .accordion-item:first-of-type .accordion-button {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.accordion-wrapper.site-faq .accordion .accordion-item.active {
  border-radius: 10px;
  overflow: hidden;
  border-bottom: 0 !important;
}
.accordion-wrapper.site-faq .accordion .accordion-collapse {
  background-color: #ffffff;
}
.accordion-wrapper.site-faq.faq-style-one .accordion .accordion-button:not(.collapsed) {
  background: rgba(86, 58, 239, 0.05);
}
.accordion-wrapper.site-faq.faq-style-one .accordion .accordion-body {
  background: rgba(86, 58, 239, 0.05);
}

/*----------------------------------------*/
/*  Footer Style two
  /*----------------------------------------*/
.faq-section-two {
  background-color: #f9f8f4;
}

.faq-thumb-wrap .faq-thumb {
  max-width: 610px;
  margin: 0 0 0 auto;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .faq-thumb-wrap .faq-thumb {
    max-width: 560px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .faq-thumb-wrap .faq-thumb {
    max-width: 500px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .faq-thumb-wrap .faq-thumb {
    max-width: 100%;
    margin: auto;
  }
}
.faq-thumb-wrap .faq-thumb img {
  border-radius: 30px;
}

.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-button {
  padding: 30px 70px 30px 25px;
  background: #ffffff;
  border-radius: 10px;
  border-radius: 0;
}
[dir=rtl] .faq-content-two .accordion-wrapper.site-faq .accordion .accordion-button {
  padding: 30px 25px 30px 70px;
}
.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-button::after {
  content: "\e92c";
  font-family: "vuesax";
  background-color: transparent;
  font-size: 20px;
}
.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-button:not(.collapsed)::after {
  content: "\e93f" !important;
  font-family: "vuesax";
  color: #0C0C14;
}
.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-item {
  border-radius: 10px;
  overflow: hidden;
}
.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-item .accordion-body p {
  font-weight: 400;
}
.faq-content-two .accordion-wrapper.site-faq .accordion .accordion-item:not(:last-child) {
  margin-bottom: 30px;
  border-bottom: 0;
}

/*----------------------------------------*/
/*  Breadcrumb two css
  /*----------------------------------------*/
.breadcrumb-overlay-two {
  background-color: #f9f8f4;
}

.breadcrumb-area.style-two {
  display: flex;
  align-items: center;
  padding: 160px 0 120px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-two {
    min-height: 350px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-area.style-two {
    min-height: 320px;
  }
}
@media (max-width:450px) {
  .breadcrumb-area.style-two {
    min-height: 300px;
  }
}
.breadcrumb-area.style-two .breadcrumb-round-two .round-one {
  width: 38.6%;
  height: 100%;
  background-color: #FC5D19;
  display: inline-flex;
  position: absolute;
  inset-inline-end: -1px;
  top: 0;
  clip-path: polygon(23.168% 0.1%, 99.87% 0.1%, 99.87% 99.9%, 23.168% 99.9%, 9.68% 80.78%, 9.68% 80.78%, 6.223% 75.136%, 3.534% 69.151%, 1.614% 62.91%, 0.462% 56.498%, 0.077% 50%, 0.462% 43.502%, 1.614% 37.09%, 3.534% 30.849%, 6.223% 24.864%, 9.68% 19.22%, 23.168% 0.1%);
}
[dir=rtl] .breadcrumb-area.style-two .breadcrumb-round-two .round-one {
  transform: rotate(180deg);
}
.breadcrumb-area.style-two .breadcrumb-round-two .round-two {
  width: 44.25%;
  height: 100%;
  background: rgba(252, 93, 25, 0.3);
  display: inline-flex;
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  clip-path: polygon(22.112% 0%, 100% 0%, 100% 100%, 22.112% 100%, 10.276% 83.446%, 10.276% 83.446%, 6.586% 77.443%, 3.715% 70.983%, 1.665% 64.179%, 0.435% 57.147%, 0.025% 50%, 0.435% 42.853%, 1.665% 35.821%, 3.715% 29.017%, 6.586% 22.557%, 10.276% 16.554%, 22.112% 0%);
}
[dir=rtl] .breadcrumb-area.style-two .breadcrumb-round-two .round-two {
  transform: rotate(180deg);
}
.breadcrumb-area.style-two .breadcrumb-round-two .round-three {
  width: 48.75%;
  height: 100%;
  background: rgba(252, 93, 25, 0.3);
  display: inline-flex;
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  clip-path: polygon(23.168% 0.1%, 99.87% 0.1%, 99.87% 99.9%, 23.168% 99.9%, 9.68% 80.78%, 9.68% 80.78%, 6.223% 75.136%, 3.534% 69.151%, 1.614% 62.91%, 0.462% 56.498%, 0.077% 50%, 0.462% 43.502%, 1.614% 37.09%, 3.534% 30.849%, 6.223% 24.864%, 9.68% 19.22%, 23.168% 0.1%);
}
[dir=rtl] .breadcrumb-area.style-two .breadcrumb-round-two .round-three {
  transform: rotate(180deg);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-two .breadcrumb-round-two {
    display: none;
  }
}

.breadcrumb-content-two .title {
  font-size: 42px;
  margin-bottom: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-content-two .title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .breadcrumb-content-two .title {
    font-size: 38px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-content-two .title {
    font-size: 36px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-content-two .title {
    font-size: 34px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-content-two .title {
    font-size: 26px;
  }
}
.breadcrumb-content-two .description {
  font-size: 16px;
  max-width: 564px;
  font-weight: 400;
  margin-top: 25px;
  line-height: 1.8;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-content-two .description {
    font-size: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-content-two .description {
    font-size: 18px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-content-two .description {
    font-size: 16px;
  }
}

.breadcrumb-shapes-two .shape-one {
  position: absolute;
  top: 20%;
  inset-inline-start: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-shapes-two .shape-one {
    max-width: 80px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-shapes-two .shape-one {
    display: none;
  }
}
.breadcrumb-shapes-two .shape-two {
  position: absolute;
  inset-inline-start: 2%;
  bottom: 13%;
  animation: 4s linear 0s infinite normal none running tdZoom;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-shapes-two .shape-two {
    max-width: 36px;
  }
}
.breadcrumb-shapes-two .shape-three {
  position: absolute;
  inset-inline-start: 26%;
  top: 25%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1600px) and (max-width: 1799px) {
  .breadcrumb-shapes-two .shape-three {
    max-width: 86px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .breadcrumb-shapes-two .shape-three {
    max-width: 56px;
  }
}
.breadcrumb-shapes-two .shape-four {
  position: absolute;
  bottom: -130px;
  inset-inline-start: 35%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1600px) and (max-width: 1799px) {
  .breadcrumb-shapes-two .shape-four {
    max-width: 270px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-shapes-two .shape-four {
    display: none;
  }
}
.breadcrumb-shapes-two .shape-five {
  position: absolute;
  bottom: 20%;
  inset-inline-end: 50%;
  z-index: 5;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-shapes-two .shape-five {
    inset-inline-end: -10%;
  }
}
.breadcrumb-shapes-two .shape-six {
  position: absolute;
  inset-inline-end: 10%;
  z-index: 5;
  top: 35%;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-shapes-two .shape-six {
    display: none;
  }
}
.breadcrumb-shapes-two .shape-seven {
  position: absolute;
  inset-inline-end: 70px;
  z-index: 5;
  bottom: 70px;
  -webkit-animation: tdSpinner 6s infinite linear;
  animation: tdSpinner 6s infinite linear;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-shapes-two .shape-seven {
    display: none;
  }
}

/*----------------------------------------*/
/*  Breadcrumb css
/*----------------------------------------*/
.breadcrumb-area.style-one {
  padding-top: 200px;
  padding-bottom: 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-one {
    padding-top: 150px;
    padding-bottom: 150px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-area.style-one {
    padding-top: 140px;
    padding-bottom: 125px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-area.style-one {
    padding-top: 120px;
    padding-bottom: 70px;
  }
}
.breadcrumb-area.style-one .breadcrumb-shapes .shape-one {
  position: absolute;
  bottom: 12%;
  inset-inline-start: -35px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-one {
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-one {
    display: none;
  }
}
.breadcrumb-area.style-one .breadcrumb-shapes .shape-two {
  position: absolute;
  inset-inline-start: 47%;
  bottom: 10%;
  animation: upslide 4s linear forwards infinite alternate;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-two {
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-two {
    display: none;
  }
}
.breadcrumb-area.style-one .breadcrumb-shapes .shape-three {
  position: absolute;
  top: 40%;
  inset-inline-end: 40%;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-three {
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-area.style-one .breadcrumb-shapes .shape-three {
    display: none;
  }
}
.breadcrumb-area.style-one .breadcrumb-shapes .shape-four {
  position: absolute;
  inset-inline-end: 50px;
  top: 33%;
  -webkit-animation: tdSpinner 6s infinite linear;
  animation: tdSpinner 6s infinite linear;
}

.breadcrumb-overlay {
  position: relative;
  z-index: 11;
}
.breadcrumb-overlay::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background: linear-gradient(0deg, rgba(86, 58, 239, 0.9), rgba(86, 58, 239, 0.9));
  top: 0;
  inset-inline-start: 0;
  z-index: -1;
}

.breadcrumb-container {
  max-width: 1695px;
  margin: 0 auto;
  padding: 0 15px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-container {
    padding: 0px 30px;
  }
}

.breadcrumb-content .title {
  font-size: 42px;
  margin-bottom: 0;
  color: #ffffff;
  position: relative;
  z-index: 1;
  line-height: 55px;
  text-align: center;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .breadcrumb-content .title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-content .title {
    font-size: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .breadcrumb-content .title {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-content .title {
    font-size: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-content .title {
    font-size: 36px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-content .title {
    font-size: 26px;
  }
}
.breadcrumb-content .description {
  font-size: 18px;
  max-width: 564px;
  font-weight: 400;
  margin-top: 25px;
  line-height: 1.5;
  color: #ffffff;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb-content .description {
    font-size: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-content .description {
    font-size: 18px;
  }
}
@media (max-width: 575px) {
  .breadcrumb-content .description {
    font-size: 16px;
  }
}

.breadcrumb-menu {
  margin-bottom: 25px;
}
.breadcrumb-menu ul {
  display: flex;
  gap: 34px;
  justify-content: center;
}
.breadcrumb-menu ul li {
  list-style: none;
  position: relative;
  line-height: 1;
}
.breadcrumb-menu ul li:last-child span {
  color: #563AEF;
}
.breadcrumb-menu ul li:not(:last-child)::before {
  display: inline-block;
  content: "\f101";
  position: absolute;
  top: 50%;
  font-family: "Font Awesome 6 Pro";
  transform: translateY(-50%);
  inset-inline-end: -24px;
  font-size: 16px;
}
.breadcrumb-menu ul li.active span {
  color: #563AEF;
}
.breadcrumb-menu ul li span {
  font-size: 16px;
  font-weight: 500;
}
.breadcrumb-menu ul li span a {
  font-weight: 500;
}
.breadcrumb-menu ul li span a:hover {
  color: #563AEF;
}

.breadcrumb-round {
  position: absolute;
  top: 11%;
  inset-inline-end: 11%;
}
.breadcrumb-round .round-one {
  width: 919px;
  height: 919px;
  background: #674ef1;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  inset-inline-start: 75%;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .breadcrumb-round .round-one {
    width: 747px;
    height: 747px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-round .round-one {
    width: 717px;
    height: 717px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-round .round-one {
    display: none;
  }
}
.breadcrumb-round .round-two {
  width: 639.66px;
  height: 639.66px;
  background: #735cf2;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  inset-inline-start: 75%;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .breadcrumb-round .round-two {
    width: 517px;
    height: 517px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-round .round-two {
    width: 487px;
    height: 487px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-round .round-two {
    display: none;
  }
}
.breadcrumb-round .round-three {
  width: 352.06px;
  height: 352.06px;
  background: #7e69f3;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  inset-inline-start: 75%;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .breadcrumb-round .round-three {
    width: 317px;
    height: 317px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .breadcrumb-round .round-three {
    width: 287px;
    height: 287px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-round .round-three {
    display: none;
  }
}

/*----------------------------------------*/
/*  Experience css
  /*----------------------------------------*/
.experience-main-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 50px 30px;
  place-items: center;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .experience-main-grid {
    grid-template-columns: 1fr 0.8fr 0.8fr;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .experience-main-grid {
    grid-template-columns: 1fr 0.7fr;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .experience-main-grid {
    grid-template-columns: 1fr;
    place-items: self-start;
  }
}

.experience-counter-item {
  display: flex;
  align-items: center;
  gap: 20px;
}
.experience-counter-item .content .title {
  font-size: 26px;
}

.site-info-list ul li {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 12px;
}
.site-info-list ul li:not(:last-child) {
  margin-bottom: 5px;
}
.site-info-list ul li .list-item_icon {
  font-size: 24px;
  position: relative;
  color: #563AEF;
}
.site-info-list ul li .list-item-text {
  font-size: 14px;
  font-weight: 600;
  color: #5C5958;
}

.experience-content {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 50px;
}
@media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .experience-content {
    flex-wrap: wrap;
  }
}
.experience-content .icon span {
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(289.81deg, #ededff -1.51%, #f0fafd 94.29%);
  border: 1px solid rgba(5, 205, 238, 0.3);
  border-radius: 50%;
}

.experience-middle-thumb {
  padding-inline-start: 45px;
  padding-inline-end: 30px;
  width: 100%;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .experience-middle-thumb {
    padding-inline-start: 0;
    padding-inline-end: 0;
  }
}
.experience-middle-thumb img {
  border-radius: 8px;
  width: 100%;
}

.experience-content-right .title {
  margin-bottom: 30px;
  font-size: 30px;
}
.experience-content-right .title span {
  color: #6c3beb;
}

/*----------------------------------------*/
/*  Choose us css
  /*----------------------------------------*/
.choose-us-area {
  background: linear-gradient(292.15deg, #cbcbfc 42.04%, #cdf3ff 94.71%);
}

.choose-us-content {
  margin-inline-start: 85px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .choose-us-content {
    margin-inline-start: 30px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .choose-us-content {
    margin-inline-start: 0px;
  }
}

.choose-us-list ul li {
  margin-bottom: 20px;
  list-style: none;
}
.choose-us-list ul li .list-content {
  background: #ffffff;
  border-radius: 8px;
  padding: 13px 110px 13px 20px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
@media (max-width: 575px) {
  .choose-us-list ul li .list-content {
    padding: 13px 15px 13px 20px;
  }
}
.choose-us-list ul li .list-content span {
  font-size: 16px;
}
.choose-us-list ul li .list-content p {
  font-weight: 500;
}

.choose-us-thumb-wrap .shapes-one {
  position: absolute;
  top: 0;
  inset-inline-start: -30%;
  z-index: -1;
}
@media (max-width: 575px) {
  .choose-us-thumb-wrap .shapes-one {
    display: none;
  }
}

.choose-us-shapes .shape-one {
  position: absolute;
  bottom: 5%;
  inset-inline-end: 2%;
}

/*----------------------------------------*/
/*  why choose us css
/*----------------------------------------*/
.why-choose-section {
  background-color: #143134;
}

.why-choose-shapes .shape-one {
  position: absolute;
  top: 80px;
  inset-inline-start: -60px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .why-choose-shapes .shape-one {
    inset-inline-start: -15px;
    max-width: 60px;
  }
}
.why-choose-shapes .shape-two {
  position: absolute;
  top: 10%;
  inset-inline-end: 19%;
  z-index: -1;
}
.why-choose-shapes .shape-three {
  position: absolute;
  top: 140px;
  inset-inline-end: 140px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .why-choose-shapes .shape-three {
    max-width: 60px;
  }
}

.why-choose-thumb-wrap.style-one .why-choose-thumb {
  margin-bottom: 50px;
}
[dir=rtl] .why-choose-thumb-wrap.style-one .why-choose-thumb {
  margin-right: -100px;
}
.why-choose-thumb-wrap.style-one .why-choose-thumb img {
  width: 100%;
}

.why-choose-content.style-one {
  padding-inline-end: 120px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .why-choose-content.style-one {
    padding-inline-end: 30px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .why-choose-content.style-one {
    padding-inline-end: 0;
  }
}

.why-choose-card-list {
  padding: 50px 50px 150px;
  background-color: #ffffff;
  border-radius: 30px;
  position: relative;
  z-index: 5;
  overflow: hidden;
  max-width: 538px;
  margin: 0 0 0 auto;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .why-choose-card-list {
    max-width: 100%;
    margin: 0;
  }
}
@media (max-width:450px) {
  .why-choose-card-list {
    padding: 30px 25px 100px;
  }
}
.why-choose-card-list .title {
  margin-bottom: 50px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .why-choose-card-list .title {
    margin-bottom: 30px;
  }
}
.why-choose-card-list .info-list ul li {
  list-style: none;
  position: relative;
  padding-inline-start: 30px;
}
.why-choose-card-list .info-list ul li:not(:last-child) {
  margin-bottom: 25px;
}
.why-choose-card-list .info-list ul li:before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border: 2px solid rgba(20, 49, 52, 0.4);
  border-radius: 50%;
  inset-inline-start: 0;
}
.why-choose-card-list .card-shape {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  inset-inline-start: 0;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
  background-position: center bottom;
}

/*----------------------------------------*/
/*  Blog two css
/*----------------------------------------*/
.blog-grid-item.style-two .blog-thumb {
  margin-bottom: 30px;
}
.blog-grid-item.style-two .blog-thumb img {
  border-radius: 30px;
}
.blog-grid-item.style-two .blog-meta {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.blog-grid-item.style-two .blog-meta span {
  font-weight: 500;
  color: #FC5D19;
}
.blog-grid-item.style-two .blog-meta span:not(:first-child) {
  position: relative;
}
.blog-grid-item.style-two .blog-meta span::before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  background-color: #FC5D19;
  top: 50%;
  inset-inline-start: -12px;
  border-radius: 50%;
  transform: translateY(-50%);
}
.blog-grid-item.style-two .blog-meta span span {
  font-weight: 400;
  color: #576363;
}
.blog-grid-item.style-two .blog-title {
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
  margin-bottom: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .blog-grid-item.style-two .blog-title {
    font-size: 20px;
  }
}
@media (max-width:450px) {
  .blog-grid-item.style-two .blog-title {
    font-size: 18px;
  }
}
.blog-grid-item.style-two .blog-title a:hover {
  color: #FC5D19;
}

/*----------------------------------------*/
/*  Blog css
/*----------------------------------------*/
.blog-grid-item.style-one {
  position: relative;
}
.blog-grid-item.style-one .blog-item:hover .blog-thumb img {
  transform: translate(scale(1.1));
}
.blog-grid-item.style-one .blog-thumb {
  overflow: hidden;
}
.blog-grid-item.style-one .blog-thumb img {
  width: 100%;
  transform: translate(scale(1));
  border-radius: 10px;
}
.blog-grid-item.style-one .blog-content {
  background: #ffffff;
  box-shadow: 0px 0px 32px rgba(108, 59, 235, 0.1);
  border-radius: 15px;
  padding: 40px 40px;
  position: relative;
  z-index: 5;
  margin: 0 30px;
  margin-top: -170px;
}
@media (max-width: 575px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .blog-grid-item.style-one .blog-content {
    margin: 0 20px;
    margin-top: -60px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), md, only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-grid-item.style-one .blog-content {
    padding: 30px 30px;
  }
}
.blog-grid-item.style-one .blog-content .description {
  margin-bottom: 25px;
}
.blog-grid-item.style-one .blog-content .postbox-meta {
  margin-bottom: 25px;
}
.blog-grid-item.style-one .blog-content .site-btn {
  background-color: rgba(86, 58, 239, 0.1);
  color: #563AEF;
  border: 0;
  box-shadow: none;
}
.blog-grid-item.style-one .blog-content .site-btn:hover {
  color: #ffffff;
  background-color: #563AEF;
}
.blog-grid-item.style-one .blog-title {
  font-size: 20px;
  margin-bottom: 15px;
  padding-inline-end: 12%;
}
.blog-grid-item.style-one .blog-title a:hover {
  color: #563AEF;
}
.blog-grid-item.style-one .blog-date {
  position: absolute;
  top: -30px;
  inset-inline-end: 0px;
  width: 100px;
  height: 100px;
  background-color: rgb(255, 129, 18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .blog-grid-item.style-one .blog-date {
    width: 80px;
    height: 80px;
  }
}
.blog-grid-item.style-one .blog-date h3 {
  font-size: 35px;
  color: #ffffff;
}
.blog-grid-item.style-one .blog-date span {
  color: #ffffff;
}

.postbox-meta {
  display: flex;
  align-items: center;
  gap: 25px;
}
.postbox-meta span {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
}
.postbox-meta span a {
  font-size: 16px;
}
.postbox-meta span a:hover {
  color: var(--bd-theme-primary);
}

/*----------------------------------------*/
/*  site pagination css
/*----------------------------------------*/
.site-pagination {
  margin-top: 50px;
}
.site-pagination ul {
  display: inline-flex;
  gap: 8px;
}
.site-pagination ul li {
  display: inline-block;
}
.site-pagination ul li a, .site-pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 16px;
  min-height: 52px;
  min-width: 52px;
  text-align: center;
  background-color: #ffffff;
  border: 1px solid #ddd;
  border-radius: 8px;
}
.site-pagination ul li a:hover, .site-pagination ul li a.current, .site-pagination ul li span:hover, .site-pagination ul li span.current {
  background: #563AEF;
  border-color: #563AEF;
  color: #ffffff;
}
.site-pagination ul li a:hover svg *, .site-pagination ul li a.current svg *, .site-pagination ul li span:hover svg *, .site-pagination ul li span.current svg * {
  fill: #ffffff;
}
.site-pagination ul li a.page-numbers {
  padding: 12px 19px;
  line-height: 1.2;
}
.site-pagination.pagination-secondary ul li a:hover, .site-pagination.pagination-secondary ul li a.current, .site-pagination.pagination-secondary ul li span:hover, .site-pagination.pagination-secondary ul li span.current {
  background: #FC5D19;
  border-color: #FC5D19;
  color: #ffffff;
}
.site-pagination.pagination-secondary ul li a:hover svg *, .site-pagination.pagination-secondary ul li a.current svg *, .site-pagination.pagination-secondary ul li span:hover svg *, .site-pagination.pagination-secondary ul li span.current svg * {
  fill: #ffffff;
}

/*----------------------------------------*/
/*  sidebar css css
/*----------------------------------------*/
.sidebar-active-sticky {
  position: sticky;
  top: 0;
}

.postbox-sidebar-wrapper {
  background: #F5F5F5;
  border: 1px solid rgba(41, 45, 50, 0.1);
  border-radius: 10px;
  padding: 30px 30px;
}

.sidebar-widget-title {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.postbox-wrapper h4 {
  margin-bottom: 30px;
}
.postbox-wrapper h4 img {
  border-radius: 8px;
  width: 100%;
}
.postbox-wrapper p {
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
}
.postbox-wrapper p b {
  color: #0C0C14;
}
.postbox-wrapper p:not(:last-child) {
  margin-bottom: 30px;
}
.postbox-wrapper ul li {
  margin-inline-start: 15px;
  margin-bottom: 5PX;
}

/*----------------------------------------*/
/*  sidebar Two css css
/*----------------------------------------*/
.sidebar-share-btn {
  background: rgba(252, 93, 25, 0.1);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 20px;
  height: 50px;
  margin-bottom: 30px;
  color: #FC5D19;
  font-size: 20px;
  font-weight: 500;
}

.sidebar-social {
  display: flex;
  align-items: center;
  gap: 10px 20px;
}
.sidebar-social.style-two a {
  height: 40px;
  width: 40px;
  background-color: transparent;
  color: #FC5D19;
  border: 1px solid #FC5D19;
}
.sidebar-social.style-two a:hover {
  color: #ffffff;
  background-color: #FC5D19;
}
.sidebar-social a {
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  background-color: rgba(86, 58, 239, 0.2);
  color: #FC5D19;
  font-size: 18px;
  border-radius: 50%;
  color: #563AEF;
}
.sidebar-social a:hover {
  color: #ffffff;
  background-color: #563AEF;
  transform: translateY(-3px);
}

/*----------------------------------------*/
/*  postbox css
/*----------------------------------------*/
.postbox-share {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 25px;
  gap: 10px 20px;
}
.postbox-share h4 {
  margin: 0;
}
.postbox-share .share-content {
  display: flex;
  align-items: center;
  gap: 20px;
}
.postbox-share .share-icon {
  width: 45px;
  height: 45px;
  background: rgba(252, 93, 25, 0.1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

/*----------------------------------------*/
/*  Recent Post css
/*----------------------------------------*/
.rc-post-item {
  display: flex;
  align-items: start;
  flex-direction: column;
  gap: 20px;
}
.rc-post-item:not(:last-child) {
  margin-bottom: 30px;
}
.rc-post-item .rc-meta {
  margin-bottom: 15px;
}
.rc-post-item .rc-post-title {
  font-size: 14px;
  font-weight: 500;
}
@media (max-width:450px) {
  .rc-post-item .rc-post-title {
    font-size: 16px;
  }
}
.rc-post-item .rc-post-title a:hover {
  color: #563AEF;
}
.rc-post-item .rc-meta p {
  font-size: 13px;
  margin-bottom: 0;
}
.rc-post-item .rc-post-thumb {
  width: 100%;
}
.rc-post-item .rc-post-thumb img {
  border-radius: 10px;
  width: 100%;
}
.rc-post-item .rc-title {
  font-size: 18px;
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: -0.2px;
  margin-bottom: 2px;
}
.rc-post-item .rc-title a:hover {
  color: #ffffff;
}
.rc-post-item .rc-meta span {
  font-size: 14px;
  position: relative;
  padding-inline-start: 15px;
}
.rc-post-item .rc-meta span::before {
  position: absolute;
  content: "";
  height: 5px;
  width: 5px;
  background: rgba(124, 126, 130, 0.5);
  top: 50%;
  inset-inline-start: 0;
}

.rc-post-item-two {
  display: flex;
  align-items: center;
  gap: 30px 20px;
}
.rc-post-item-two:not(:last-child) {
  margin-bottom: 25px;
}
.rc-post-item-two .rc-post-title {
  font-size: 18px;
  font-weight: 600;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .rc-post-item-two .rc-post-title {
    font-size: 16px;
  }
}
.rc-post-item-two .rc-post-title a:hover {
  color: #FC5D19;
}
.rc-post-item-two .rc-post-thumb {
  width: 100px;
  height: 100px;
  flex: 0 0 auto;
}
.rc-post-item-two .rc-post-thumb img {
  border-radius: 50%;
}
.rc-post-item-two .rc-meta p {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 5px;
}

/*----------------------------------------*/
/*  privacy policy css
/*----------------------------------------*/
.privacy-item ul li {
  list-style: none;
  margin-bottom: 5px;
}
.privacy-item h1,
.privacy-item h2,
.privacy-item h3,
.privacy-item h4,
.privacy-item h5,
.privacy-item h6 {
  margin: 12px 0;
}

.privacy-policy-title {
  font-size: 26px;
  margin-bottom: 24px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .privacy-policy-title {
    font-size: 22px;
  }
}
@media (max-width:450px) {
  .privacy-policy-title {
    font-size: 20px;
  }
}

.privacy-item:not(:last-child) {
  margin-bottom: 45px;
}
.privacy-item p {
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
}
.privacy-item p:not(:last-child) {
  margin-bottom: 24px;
}

.privacy-policy-contents h1,
.privacy-policy-contents h2,
.privacy-policy-contents h3,
.privacy-policy-contents h4,
.privacy-policy-contents h5,
.privacy-policy-contents h6 {
  margin-bottom: 12px;
}
.privacy-policy-contents h2 {
  font-size: 32px;
}

/*----------------------------------------*/
/*  contact Two css
/*----------------------------------------*/
.contact-shapes .shape-one {
  position: absolute;
  top: 23%;
  inset-inline-end: -86px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .contact-shapes .shape-one {
    max-width: 150px;
  }
}
@media (max-width: 575px) {
  .contact-shapes .shape-one {
    display: none;
  }
}

.contact-form-two {
  background: #ffffff;
  box-shadow: 0px 8px 28px -6px rgba(8, 79, 110, 0.12), 0px 18px 88px -4px rgba(8, 79, 110, 0.14);
  border-radius: 30px;
  padding: 45px 50px 50px;
}
@media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-two {
    padding: 30px 30px 30px;
  }
}
.contact-form-two .contact-form-title {
  font-size: 30px;
  margin-bottom: 20px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-form-two .contact-form-title {
    font-size: 24px;
  }
}
.contact-form-two .contact-input input,
.contact-form-two .contact-input textarea {
  background: #f9f8f4;
  border: 1px solid rgba(252, 93, 25, 0.15);
  border-radius: 13px;
  font-size: 14px;
}
.contact-form-two .contact-input input::placeholder,
.contact-form-two .contact-input textarea::placeholder {
  color: rgba(92, 89, 88, 0.8);
  font-size: 14px;
}
.contact-form-two .contact-input input:focus,
.contact-form-two .contact-input textarea:focus {
  border-color: rgba(252, 93, 25, 0.15);
}
.contact-form-two .description {
  margin-bottom: 20px;
  margin-bottom: 45px;
}

.contact-form-two-content {
  margin-inline-start: 50px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-two-content {
    margin-inline-start: 0;
  }
}
.contact-form-two-content .contact-info {
  margin-top: 30px;
  margin-bottom: 30px;
}
.contact-form-two-content .contact-info .item {
  display: flex;
  align-items: center;
  gap: 20px;
}
.contact-form-two-content .contact-info .item:not(:last-child) {
  margin-bottom: 25px;
}
.contact-form-two-content .contact-info .item .icon span {
  width: 80px;
  height: 80px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #FC5D19;
  font-size: 34px;
  position: relative;
  z-index: 5;
  background: rgba(252, 93, 25, 0.1);
  border-radius: 10px;
}
@media (max-width: 575px) {
  .contact-form-two-content .contact-info .item .icon span {
    width: 60px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FC5D19;
    font-size: 24px;
  }
}
.contact-form-two-content .contact-info .item .content .title {
  font-size: 20px;
  margin-bottom: 12px;
}
@media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-two-content .contact-info .item .content .title {
    font-size: 18px;
  }
}
@media (max-width:450px) {
  .contact-form-two-content .contact-info .item .content .title {
    font-size: 16px;
  }
}
.contact-form-two-content .contact-info .item .content .info {
  color: rgba(92, 89, 88, 0.8);
}

/*----------------------------------------*/
/*  contact css
/*----------------------------------------*/
.contact-form-content .contact-info {
  margin-top: 40px;
  margin-bottom: 30px;
}
.contact-form-content .contact-info.style-two .item .icon span {
  background-color: #FF8112;
}
.contact-form-content .contact-info .item {
  display: flex;
  gap: 20px;
}
.contact-form-content .contact-info .item:not(:last-child) {
  margin-bottom: 25px;
}
.contact-form-content .contact-info .item .icon span {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  border-radius: 50%;
  font-size: 18px;
  position: relative;
  z-index: 5;
  background-color: #563AEF;
}
.contact-form-content .contact-info .item .content .title {
  font-size: 16px;
  margin-bottom: 10px;
}
.contact-form-content .contact-info .item .content .info {
  color: rgba(92, 89, 88, 0.8);
}
.contact-form-content .contact-info .item .content .info a:hover {
  color: #563AEF;
}

.contact-form {
  padding: 60px 60px 60px;
  border-radius: 10px;
  margin-inline-start: 30px;
  position: relative;
  z-index: 5;
}
.contact-form::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  inset-inline-start: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
  z-index: -1;
  border-radius: 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form {
    padding: 30px 30px 30px;
    margin-inline-start: 0;
  }
}
@media (max-width: 575px) {
  .contact-form {
    padding: 25px 25px 25px;
  }
}

.contact-input-box {
  margin-bottom: 24px;
}

.contact-input:not(:last-child) {
  margin-bottom: 20px;
}
.contact-input input,
.contact-input select {
  height: 50px;
  border-radius: 6px;
  color: #0C0C14;
  width: 100%;
  padding: 0 20px;
  font-size: 14px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(15px);
}
.contact-input input::placeholder,
.contact-input select::placeholder {
  color: #0C0C14;
}
.contact-input input:focus,
.contact-input select:focus {
  border: 1px solid rgba(255, 255, 255, 0.6);
}
.contact-input textarea {
  height: 165px;
  color: #0C0C14;
  border-radius: 6px;
  padding: 15px 20px;
  resize: none;
  width: 100%;
  font-size: 14px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(15px);
}
.contact-input textarea::placeholder {
  color: #0C0C14;
}

/*----------------------------------------*/
/*  Subscriptions  css
/*----------------------------------------*/
.subscriptions-section.style-two {
  background-color: #143134;
}

.pricing-item-two {
  background-color: #ffffff;
  padding: 35px 40px 40px;
  border-radius: 65px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .pricing-item-two {
    padding: 35px 30px 35px;
  }
}
@media (max-width:450px), only screen and (min-width: 576px) and (max-width: 767px) {
  .pricing-item-two {
    padding: 30px 25px 35px;
  }
}
.pricing-item-two .price-badge {
  text-align: center;
  margin-bottom: 30px;
}
.pricing-item-two .price-badge .site-badge {
  background-color: #143134;
  color: #ffffff;
  padding: 8px 20px;
}
.pricing-item-two .price-value {
  margin-bottom: 24px;
  text-align: center;
}
.pricing-item-two .price-value strong {
  font-size: 50px;
  line-height: 1;
  color: #0C0C14;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .pricing-item-two .price-value strong {
    font-size: 50px;
  }
}
@media (max-width:450px), only screen and (min-width: 576px) and (max-width: 767px) {
  .pricing-item-two .price-value strong {
    font-size: 44px;
  }
}
.pricing-item-two .plan-content {
  text-align: center;
}
.pricing-item-two .plan-content .item-title {
  font-size: 20px;
  margin-bottom: 20px;
}
.pricing-item-two .icon-list li {
  list-style: none;
  display: flex;
  align-items: start;
  gap: 10px;
}
.pricing-item-two .icon-list li:not(:last-child) {
  margin-bottom: 20px;
}
.pricing-item-two .list-item-icon svg * {
  stroke: #FC5D19;
}
.pricing-item-two .list-item-text {
  font-weight: 500;
}
.pricing-item-two .price-list {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #e2e3df;
  margin-bottom: 45px;
}
@media (max-width:450px), only screen and (min-width: 576px) and (max-width: 767px) {
  .pricing-item-two .price-list {
    margin-top: 25px;
    padding-top: 25px;
  }
}
.pricing-item-two.popular-paln {
  background-color: #FC5D19;
}
.pricing-item-two.popular-paln .price-value strong,
.pricing-item-two.popular-paln .price-value sub {
  color: #ffffff;
}
.pricing-item-two.popular-paln .plan-content .item-title,
.pricing-item-two.popular-paln .plan-content .description {
  color: #ffffff;
}
.pricing-item-two.popular-paln .list-item-icon svg * {
  stroke: #ffffff;
}
.pricing-item-two.popular-paln .list-item-text {
  color: #ffffff;
}
.pricing-item-two.popular-paln .price-btn .site-btn {
  background-color: #ffffff;
  color: #FC5D19;
}
.pricing-item-two.popular-paln .price-list {
  border-color: rgba(226, 227, 223, 0.3);
}

.subscriptions-plan-wrap .row [class*=col-]:nth-child(2n) .pricing-item-two {
  margin-top: 85px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .subscriptions-plan-wrap .row [class*=col-]:nth-child(2n) .pricing-item-two {
    margin-top: 0;
  }
}

.subscriptions-shapes .shape-one {
  position: absolute;
  bottom: 10%;
  inset-inline-start: 18px;
  z-index: -1;
  animation: 2.3s ease-in-out 2.3s infinite alternate forwards running tdupdown;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .subscriptions-shapes .shape-one {
    max-width: 170px;
  }
}
.subscriptions-shapes .shape-two {
  position: absolute;
  inset-inline-end: 98px;
  top: 114px;
  -moz-animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
  animation: tdtptranslateX2 3s ease-in-out 1s forwards infinite alternate;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .subscriptions-shapes .shape-two {
    max-width: 40px;
  }
}
@media (max-width: 575px) {
  .subscriptions-shapes .shape-two {
    display: none;
  }
}
.subscriptions-shapes .shape-three {
  position: absolute;
  bottom: 14%;
  inset-inline-start: 55%;
  z-index: -1;
}

/*----------------------------------------*/
/*  Common swiper dot
/*----------------------------------------*/
.pagination-wrappper {
  margin-top: 45px;
}

.bd-swiper-dot .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 1;
  border-radius: 30px;
  position: relative;
  margin: 0 8px !important;
}
.bd-swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #563AEF;
}

/*----------------------------------------*/
/*  Brand section
/*----------------------------------------*/
.brand-section {
  background-color: #FC5D19;
  padding: 50px 0;
}
@media (max-width: 575px) {
  .brand-section {
    padding: 30px 0;
  }
}

.swiper-width-auto .swiper-slide {
  width: auto;
}

.marquee-slide {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
  position: relative;
}

.swiper-width-auto .swiper-slide {
  width: auto !important;
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}

@media (max-width: 575px) {
  .brand-thumb {
    max-width: 120px;
  }
}

/*----------------------------------------*/
/*  Earning Money section
/*----------------------------------------*/
.earning-money-section {
  background-color: #f9f8f4;
}

.earning-counter-item {
  padding: 50px 40px;
  background: #ffffff;
  box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.05);
  border-radius: 18px;
  position: relative;
  z-index: 5;
  overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .earning-counter-item {
    padding: 40px 30px;
  }
}
@media (max-width:450px), only screen and (min-width: 576px) and (max-width: 767px) {
  .earning-counter-item {
    padding: 30px 30px;
  }
}
.earning-counter-item:before {
  position: absolute;
  content: "";
  height: 12px;
  width: 100%;
  background: #19c1dd;
  inset-inline-start: 0;
  bottom: 0;
  z-index: -1;
  border-radius: 18px;
}
.earning-counter-item .icon {
  margin-bottom: 35px;
}
.earning-counter-item .icon span {
  font-size: 24px;
  width: 76px;
  height: 75px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #19c2dd;
  clip-path: polygon(73.934% 84.095%, 73.934% 84.095%, 85.937% 79.573%, 93.95% 74.067%, 98.47% 67.811%, 99.993% 61.036%, 99.013% 53.972%, 96.027% 46.852%, 91.531% 39.907%, 86.019% 33.369%, 79.988% 27.468%, 73.934% 22.438%, 73.934% 22.438%, 73.006% 21.668%, 72.068% 20.909%, 71.121% 20.16%, 70.167% 19.423%, 69.206% 18.697%, 68.242% 17.982%, 67.275% 17.28%, 66.306% 16.589%, 65.338% 15.912%, 64.371% 15.247%, 64.371% 15.247%, 60.24% 12.465%, 55.908% 9.679%, 51.42% 7.023%, 46.826% 4.629%, 42.172% 2.631%, 37.507% 1.163%, 32.877% 0.358%, 28.331% 0.349%, 23.916% 1.27%, 19.68% 3.253%, 19.68% 3.253%, 17.285% 4.959%, 15.14% 6.919%, 13.242% 9.08%, 11.588% 11.391%, 10.173% 13.8%, 8.997% 16.255%, 8.054% 18.704%, 7.343% 21.095%, 6.86% 23.377%, 6.602% 25.497%, 6.602% 25.497%, 6.252% 29.977%, 5.856% 34.444%, 5.423% 38.86%, 4.96% 43.188%, 4.478% 47.392%, 3.983% 51.434%, 3.486% 55.279%, 2.995% 58.889%, 2.517% 62.227%, 2.063% 65.257%, 2.063% 65.257%, 0.388% 74.249%, 0.022% 81.631%, 0.768% 87.542%, 2.43% 92.123%, 4.814% 95.512%, 7.723% 97.849%, 10.962% 99.272%, 14.335% 99.922%, 17.646% 99.937%, 20.701% 99.457%, 20.701% 99.457%, 28.325% 97.743%, 35.864% 95.831%, 43.157% 93.809%, 50.046% 91.767%, 56.37% 89.795%, 61.97% 87.981%, 66.686% 86.415%, 70.359% 85.185%, 72.828% 84.382%, 73.934% 84.095%);
  position: relative;
  color: #ffffff;
}
.earning-counter-item .icon span i {
  position: relative;
  top: 2px;
  inset-inline-start: -2px;
}
.earning-counter-item .icon span:before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background: #19c2dd;
  filter: blur(34px);
  inset-inline-start: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.5;
}
.earning-counter-item .content .title {
  font-size: 46px;
  margin-bottom: 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .earning-counter-item .content .title {
    font-size: 36px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .earning-counter-item .content .title {
    font-size: 32px;
  }
}
.earning-counter-item .content .description {
  color: #576363;
  font-size: 18px;
}
.earning-counter-item .shape {
  position: absolute;
  bottom: 12%;
  inset-inline-start: 50%;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .earning-counter-item .shape {
    inset-inline-start: 60%;
    max-width: 60px;
  }
}

.earning-counter-wrap .row [class*=col-]:nth-child(2n) {
  margin-top: 50px;
}
.earning-counter-wrap .row [class*=col-]:nth-child(2) .earning-counter-item:before {
  background: #FC5D19;
}
.earning-counter-wrap .row [class*=col-]:nth-child(2) .earning-counter-item .icon span {
  background-color: #FC5D19;
}
.earning-counter-wrap .row [class*=col-]:nth-child(2) .earning-counter-item .icon span:before {
  background: #FC5D19;
}
.earning-counter-wrap .row [class*=col-]:nth-child(3) .earning-counter-item:before {
  background: #f2c94c;
}
.earning-counter-wrap .row [class*=col-]:nth-child(3) .earning-counter-item .icon span {
  background-color: #f2c94c;
}
.earning-counter-wrap .row [class*=col-]:nth-child(3) .earning-counter-item .icon span:before {
  background: #f2c94c;
}
.earning-counter-wrap .row [class*=col-]:nth-child(4) .earning-counter-item:before {
  background: #ef5da8;
}
.earning-counter-wrap .row [class*=col-]:nth-child(4) .earning-counter-item .icon span {
  background-color: #ef5da8;
}
.earning-counter-wrap .row [class*=col-]:nth-child(4) .earning-counter-item .icon span:before {
  background: #ef5da8;
}

/*----------------------------------------*/
/*  Refer friends css
/*----------------------------------------*/
.refer-friends-section {
  background-color: #143134;
  margin-top: 240px;
  padding-bottom: 225px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .refer-friends-section {
    margin-top: 170px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .refer-friends-section {
    margin-top: 155px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .refer-friends-section {
    margin-top: 165px;
    padding-bottom: 125px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .refer-friends-section {
    margin-top: 0;
    padding-bottom: 125px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .refer-friends-section {
    margin-top: 80px;
    padding-bottom: 145px;
  }
}
@media (max-width: 575px) {
  .refer-friends-section {
    margin-top: 80px;
    padding-bottom: 145px;
  }
}

.refer-friends-thumb {
  position: absolute;
  inset-inline-end: 0;
  bottom: 100px;
  max-width: 1003px;
}
.refer-friends-thumb img {
  border-radius: 20px 0px 0 20px;
}
[dir=rtl] .refer-friends-thumb img {
  border-radius: 0px 20px 20px 0px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .refer-friends-thumb {
    max-width: 50%;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .refer-friends-thumb {
    max-width: 55%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .refer-friends-thumb {
    position: relative;
    inset-inline-end: inherit;
    bottom: inherit;
  }
}
.refer-friends-thumb .earn-badge {
  position: absolute;
  inset-inline-start: -63px;
  bottom: -48px;
  animation: 8s linear 0s infinite normal none running tdSpinner;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .refer-friends-thumb .earn-badge {
    inset-inline-start: -38px;
    max-width: 120px;
    bottom: -30px;
  }
}

.refer-friends-shapes .shape-one {
  position: absolute;
  top: 25px;
  inset-inline-start: -59px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .refer-friends-shapes .shape-one {
    max-width: 110px;
  }
}
@media (max-width: 575px) {
  .refer-friends-shapes .shape-one {
    display: none;
  }
}
.refer-friends-shapes .shape-two {
  position: absolute;
  bottom: 0;
  inset-inline-start: 35%;
  transform: translateX(-50%);
  z-index: -1;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .refer-friends-shapes .shape-two {
    max-width: 160px;
  }
}

/*----------------------------------------*/
/*  system work css
/*----------------------------------------*/
.system-work-section {
  background-color: #f9f8f4;
}

.system-work-shapes .shape-one {
  position: absolute;
  top: 144px;
  inset-inline-end: 140px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .system-work-shapes .shape-one {
    top: 54px;
    inset-inline-end: 130px;
    max-width: 50px;
  }
}
@media (max-width: 575px) {
  .system-work-shapes .shape-one {
    top: 1%;
    inset-inline-end: 5%;
    max-width: 60px;
  }
}
.system-work-shapes .shape-two {
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  z-index: -1;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .system-work-shapes .shape-two {
    display: none;
  }
}
.system-work-shapes .shape-three {
  position: absolute;
  inset-inline-start: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .system-work-shapes .shape-three {
    display: none;
  }
}

.system-work-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1300px;
  position: relative;
  z-index: 11;
  gap: 30px 30px;
}
@media (max-width: 575px) {
  .system-work-item {
    flex-direction: column;
  }
}
.system-work-item:not(:last-child) {
  margin-bottom: 80px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .system-work-item:not(:last-child) {
    margin-bottom: 60px;
  }
}
@media (max-width:450px) {
  .system-work-item:not(:last-child) {
    margin-bottom: 50px;
  }
}
.system-work-item:nth-child(even) {
  flex-direction: row-reverse;
}
@media (max-width:450px) {
  .system-work-item:nth-child(even) {
    flex-direction: column;
  }
}
.system-work-item:nth-child(even) .system-work-content-wrap {
  flex-direction: row-reverse;
}
.system-work-item:nth-child(even) .system-work-content-wrap .content {
  margin-inline-end: 10%;
  margin-inline-start: 0;
}
.system-work-item:last-child .shape-arrow {
  display: none;
}
.system-work-item .shape-arrow {
  position: absolute;
  top: 57%;
  inset-inline-start: 45px;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .system-work-item .shape-arrow {
    top: 30%;
  }
  .system-work-item .shape-arrow svg {
    width: 55%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .system-work-item .shape-arrow {
    top: 7%;
  }
  .system-work-item .shape-arrow svg {
    width: 55%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .system-work-item .shape-arrow {
    top: 7%;
  }
  .system-work-item .shape-arrow svg {
    width: 55%;
  }
}
@media (max-width: 575px) {
  .system-work-item .shape-arrow {
    top: 7%;
  }
  .system-work-item .shape-arrow svg {
    width: 55%;
  }
}
@media (max-width:450px) {
  .system-work-item .shape-arrow {
    display: none;
  }
}
.system-work-item .system-work-content-wrap {
  max-width: 673px;
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .system-work-item .system-work-content-wrap {
    max-width: 600px;
  }
}
.system-work-item .system-work-content-wrap .number span {
  font-size: 100px;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 2px rgba(243, 65, 65, 0.3);
  font-weight: 700;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .system-work-item .system-work-content-wrap .number span {
    font-size: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .system-work-item .system-work-content-wrap .number span {
    font-size: 66px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .system-work-item .system-work-content-wrap .number span {
    font-size: 48px;
  }
}
.system-work-item .system-work-content-wrap .content {
  margin-inline-start: 20%;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .system-work-item .system-work-content-wrap .content {
    margin-inline-start: 8%;
  }
}
.system-work-item .system-work-content-wrap .content .title {
  font-size: 26px;
  margin-bottom: 30px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .system-work-item .system-work-content-wrap .content .title {
    font-size: 22px;
    margin-bottom: 20px;
  }
}
.system-work-item .system-work-content-wrap .content .description {
  font-size: 16px;
  color: #6e6e73;
  line-height: 26px;
}
.system-work-item .system-work-tumb {
  max-width: 500px;
}

/*----------------------------------------*/
/*  Trusted user css
/*----------------------------------------*/
.trusted-user-section {
  background-color: #f9f8f4;
}

.trusted-slider-content-wrap {
  position: relative;
  background: #ffffff;
  box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.05);
  border-radius: 30px;
  padding: 50px;
  margin: 0 25px;
}
@media (max-width: 575px) {
  .trusted-slider-content-wrap {
    padding: 30px 35px;
  }
}
.trusted-slider-content-wrap .description {
  margin-bottom: 25px;
  padding-bottom: 35px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  font-size: 20px;
  font-weight: 300;
  line-height: 1.7;
}
@media (max-width:450px) {
  .trusted-slider-content-wrap .description {
    font-size: 18px;
  }
}
.trusted-slider-content-wrap .quote-shape {
  position: absolute;
  top: 40px;
  inset-inline-start: 50%;
  transform: translateX(-50%);
}

.trusted-user-content {
  margin-inline-end: 120px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .trusted-user-content {
    margin-inline-end: 0;
  }
}

.trusted-slider-btn {
  width: 50px;
  height: 50px;
  background-color: #fef1ec;
  border-radius: 50%;
  color: #FC5D19;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline-start: -25px;
}
.trusted-slider-btn.trusted-slider-next {
  inset-inline-start: auto;
  inset-inline-end: -25px;
}

/*----------------------------------------*/
/*  Trusted user css
/*----------------------------------------*/
@keyframes tdrotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes tdupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-30px);
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -o-transform: translateY(-30px);
    transform: translateY(-30px);
  }
}
@keyframes tdtptranslateX2 {
  0% {
    -webkit-transform: translateX(-40px);
    -moz-transform: translateX(-40px);
    -ms-transform: translateX(-40px);
    -o-transform: translateX(-40px);
    transform: translateX(-40px);
  }
  100% {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
}
@keyframes tdSpinner {
  from {
    -webkit-transform: rotate(0turn);
    transform: rotate(0turn);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}
@keyframes tdZoom {
  0% {
    scale: 1;
  }
  50% {
    scale: 0.5;
  }
  100% {
    scale: 1;
  }
}
@keyframes tdtranslateY2 {
  0% {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px);
  }
  100% {
    -webkit-transform: translateY(20px);
    -moz-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
  }
}
@keyframes round-shape {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  to {
    stroke-dashoffset: 0px;
    stroke-dasharray: 3000;
  }
}
@-webkit-keyframes tdrotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes tdrotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-ms-keyframes tdrotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes tdrotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes upslide {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

/*---------------------------------
/*  Header css  
---------------------------------*/
.header-transparent {
  position: absolute;
  inset-inline-start: 0;
  margin: auto;
  width: 100%;
  z-index: 99;
  background-color: transparent;
}

.header-primary {
  padding: 25px 30px;
}
.header-primary .header-logo img {
  height: 36px;
}
.header-primary .header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 575px) {
  .header-primary {
    padding: 20px 15px;
  }
}

.auth-header-action {
  display: flex;
  align-items: center;
  gap: 10px;
}

.light-icon,
.dark-icon {
  cursor: pointer;
}

.header-lang-item {
  position: relative;
}
.header-lang-item > span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  padding-inline-end: 20px;
  transition: all 0.1s linear;
  z-index: 1;
  font-weight: 500;
  color: #563AEF;
}
.header-lang-item > span:hover {
  cursor: pointer;
}
.header-lang-item > span::after {
  position: absolute;
  content: "\f107";
  font-family: "Font Awesome 6 Pro";
  margin-inline-start: 7px;
  inset-inline-end: 0;
}
.header-lang-item ul {
  position: absolute;
  top: 130%;
  inset-inline-start: 0;
  z-index: 111;
  background-color: #ffffff;
  border-radius: 6px;
  padding: 5px 0px;
  box-shadow: 0px 1px 3px rgba(3, 4, 28, 0.12);
  visibility: hidden;
  opacity: 0;
  min-width: max-content;
  -webkit-transition: all 0.2s 0s ease-out;
  -moz-transition: all 0.2s 0s ease-out;
  -ms-transition: all 0.2s 0s ease-out;
  -o-transition: all 0.2s 0s ease-out;
  transition: all 0.2s 0s ease-out;
}
.header-lang-item ul.lang-list-open {
  visibility: visible;
  opacity: 1;
}
.header-lang-item ul li {
  list-style: none;
  padding: 5px 35px;
  cursor: pointer;
  border-radius: 3px;
}
.header-lang-item ul li:hover {
  background-color: rgba(0, 0, 0, 0.08);
}
.header-lang-item ul li a {
  font-size: 13px;
}
.header-lang-item ul li a:hover {
  color: #563AEF;
}

.toggle-bar-icon {
  width: 26px;
  height: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.toggle-bar-icon span {
  width: 100%;
  height: 2px;
  background: #ffffff;
  display: inline-block;
}
.toggle-bar-icon span:nth-child(2) {
  margin-left: 6px;
  transition: 0.3s;
}
.toggle-bar-icon:hover span:nth-child(2) {
  margin-left: 0;
}

/*---------------------------------
/*  Auth css  
---------------------------------*/
.auth-body {
  background: linear-gradient(111.52deg, rgb(255, 255, 255) 11.34%, rgb(242, 240, 255) 78.85%);
}

.sign-area {
  padding: 80px 0;
  width: 100%;
  min-height: 100vh;
  background-size: cover;
}

.auth-wrapper {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding-top: 50px;
  padding-bottom: 50px;
}
.auth-wrapper .contents-inner {
  width: 480px;
}
@media (max-width: 575px) {
  .auth-wrapper .contents-inner {
    width: calc(100% - 30px);
  }
}
.auth-wrapper .contents-inner .content {
  background-color: #ffffff;
  padding: 40px 45px 40px;
  box-shadow: 0px 8px 50px rgba(0, 141, 218, 0.1);
  border-radius: 15px;
}
@media (max-width: 575px) {
  .auth-wrapper .contents-inner .content {
    padding: 25px 25px 25px;
  }
}
.auth-wrapper .contents-inner .content .account-steps {
  display: flex;
  gap: 10px 15px;
  margin-bottom: 35px;
}
.auth-wrapper .contents-inner .content .account-steps .single-step.active .line {
  background: #563AEF;
}
.auth-wrapper .contents-inner .content .account-steps .single-step.active .description {
  color: #563AEF;
}
.auth-wrapper .contents-inner .content .account-steps .single-step .line {
  background: rgba(134, 131, 213, 0.1);
  border-radius: 19px;
  width: 191px;
  height: 10px;
  display: inline-block;
  margin-bottom: 5px;
}
@media (max-width:450px) {
  .auth-wrapper .contents-inner .content .account-steps .single-step .line {
    width: 125px;
  }
}
.auth-wrapper .contents-inner .content .account-steps .single-step .description {
  text-align: center;
}
.auth-wrapper .contents-inner .content .top-content {
  margin-bottom: 20px;
}
.auth-wrapper .contents-inner .content .top-content .title {
  font-size: 24px;
  margin-bottom: 15px;
}
@media (max-width: 575px) {
  .auth-wrapper .contents-inner .content .top-content .title {
    font-size: 20px;
  }
}
.auth-wrapper .contents-inner .content .top-content .description {
  font-size: 14px;
}
.auth-wrapper .contents-inner .content .top-content .description a {
  color: #563AEF;
  font-weight: 600;
}
.auth-wrapper .contents-inner .content .top-content .description a:hover {
  color: #0C0C14;
}
.auth-wrapper .contents-inner .content .remember-content {
  margin-bottom: 20px;
}
.auth-wrapper .contents-inner .content form .inputs {
  margin-bottom: 20px;
}
.auth-wrapper .contents-inner .content form .inputs .site-btn {
  margin-top: 10px;
}
.auth-wrapper .contents-inner .content form .inputs.number-control .box-input {
  padding: 0 47px 0px 35px;
}
.auth-wrapper .contents-inner .content form .inputs .warning-text {
  display: none;
  font-size: 14px;
  color: rgba(231, 75, 84, 0.8);
}
.auth-wrapper .contents-inner .content form .inputs .verification {
  display: flex;
  gap: 10px;
  justify-content: space-between;
}
.auth-wrapper .contents-inner .content form .inputs .verification .control-form {
  height: 54px;
  width: 49px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}
.auth-wrapper .contents-inner .content form .inputs .verification .control-form:focus {
  border-color: #563aef;
  box-shadow: 0 0 0 0.15rem rgba(86, 58, 239, 0.4);
}
.auth-wrapper .contents-inner .content .have-acount p {
  font-size: 14px;
  font-weight: 500;
}
.auth-wrapper .contents-inner .content .have-acount p a {
  color: #563AEF;
  font-weight: 500;
}
.auth-wrapper .contents-inner .content .have-acount p a:hover {
  text-decoration: underline;
}
.auth-wrapper .contents-inner .content .forgot {
  border-top: 1px solid rgba(209, 207, 205, 0.5);
  margin-top: 15px;
  padding-top: 15px;
}
.auth-wrapper .contents-inner .content .forgot a {
  font-size: 14px;
  font-weight: 600;
  color: #563AEF;
  text-decoration: underline;
  text-transform: capitalize;
}
.auth-wrapper .contents-inner .content .forgot a:hover {
  text-decoration: none;
}
.auth-wrapper .bottom-content {
  text-align: center;
}
.auth-wrapper .bottom-content .description {
  margin-bottom: 10px;
}
.auth-wrapper .bottom-content .link {
  font-weight: 500;
  text-decoration: underline;
  color: #563AEF;
}
.auth-wrapper .bottom-content .link:hover {
  text-decoration: none;
}
.auth-wrapper .terms-user p {
  text-align: center;
  max-width: 320px;
  margin: 0 auto;
  margin-top: 20px;
  font-size: 14px;
}
.auth-wrapper .terms-user p a {
  color: #563AEF;
  font-weight: 700;
}
.auth-wrapper .terms-user p a:hover {
  text-decoration: underline;
}

/*---------------------------------
/*  Footer css  
---------------------------------*/
.dashboard-footer-area .need-content {
  color: #563AEF;
  text-decoration: underline;
  font-weight: 500;
  padding: 20px 40px;
  text-align: end;
  width: 100%;
}
.dashboard-footer-area .need-content .description a {
  color: #563AEF;
  text-decoration: underline;
  font-weight: 500;
}
.dashboard-footer-area .need-content .description a:hover {
  text-decoration: none;
}

/*---------------------------------
/*  Dashboard css
---------------------------------*/
.dashboard-bg {
  background: linear-gradient(95.11deg, #ffffff 6.03%, #F2F0FF 98.87%);
}

.page-header {
  max-width: 100vw;
  position: fixed;
  top: 0;
  z-index: 9;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  background-color: #ffffff;
  margin-inline-start: 300px;
  width: calc(100% - 300px);
}

.dashboard-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 30px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  min-height: 80px;
}
@media (max-width: 575px) {
  .dashboard-header {
    padding: 14px 15px;
  }
}

.header-right-content {
  display: flex;
  align-items: center;
}

.header-right-content .btn-wrap {
  margin-inline-end: 25px;
}
@media (max-width: 575px) {
  .header-right-content .btn-wrap {
    margin-inline-end: 10px;
  }
}
.header-right-content .btn-wrap .site-btn {
  padding: 0 20px;
  border-radius: 30px;
  font-size: 12px;
}
@media (max-width:450px) {
  .header-right-content .btn-wrap .site-btn {
    padding: 0 10px;
  }
}
.header-right-content .btn-wrap .site-btn i {
  font-size: 14px;
}
.header-right-content .user-action > ul {
  display: flex;
  align-items: center;
  gap: 20px;
}
@media (max-width:450px) {
  .header-right-content .user-action > ul {
    gap: 10px;
  }
}
.header-right-content .user-action > ul li {
  list-style: none;
}
.header-right-content .user-action > ul li .notification-box {
  position: relative;
}
.header-right-content .user-action > ul li .notification-box .icon {
  position: relative;
  font-size: 20px;
  top: 2px;
}
.header-right-content .user-action > ul li .notification-box .number-badge {
  height: 14px;
  width: 14px;
  border-radius: 50%;
  background: #F34141;
  position: absolute;
  color: #ffffff;
  top: 2px;
  inset-inline-end: -2px;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
}
.header-right-content .user-head-drop-btn {
  margin-inline-start: 20px;
  width: 40px;
  height: 40px;
}
@media (max-width: 575px) {
  .header-right-content .user-head-drop-btn {
    margin-inline-start: 10px;
  }
}
.header-right-content .user-head-drop-btn::after {
  display: none;
}
.header-right-content .user-head-drop-btn img {
  border-radius: 50%;
  height: 100%;
  border: 2px solid #563AEF;
}
.header-right-content .language-box .header-lang-item ul {
  top: 220%;
}
.header-right-content .language-box .header-lang-item > span {
  color: #5C5958;
}
.header-right-content .light-icon,
.header-right-content .dark-icon {
  cursor: pointer;
}

.user-profile-info {
  display: flex;
  align-items: center;
  gap: 10px;
}
.user-profile-info .thumb {
  width: 36px;
  height: 36px;
}
.user-profile-info .thumb img {
  border-radius: 50%;
  height: 100%;
  border: 2px solid #563AEF;
}
.user-profile-info .content .title {
  font-size: 16px;
}
.user-profile-info .content .user-status {
  color: #563AEF;
}

.user-profile-drop .dropdown-menu {
  width: 215px;
  padding: 20px 20px;
  background: #ffffff;
  border: 1px solid rgba(255, 255, 240, 0.06);
  border-radius: 5px;
  margin-top: 20px !important;
  -webkit-box-shadow: 0px 25px 70px rgba(8, 10, 55, 0.1);
  box-shadow: 0px 25px 70px rgba(8, 10, 55, 0.1);
}
.user-profile-drop .info-list {
  border-top: 1px solid rgba(3, 3, 6, 0.08);
  margin-top: 18px;
  padding-top: 18px;
}
.user-profile-drop .info-list ul li {
  list-style: none;
}
.user-profile-drop .info-list ul li:not(:last-child) {
  margin-bottom: 20px;
}
.user-profile-drop .info-list ul li .content {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
}
.user-profile-drop .info-list ul li .content .icon i {
  font-size: 20px;
  position: relative;
  top: 2px;
}
.user-profile-drop .info-list ul li .content .info a {
  padding: 0px;
  font-size: 14px;
}
.user-profile-drop .info-list ul li .content .info a:hover {
  color: #563AEF;
}
.user-profile-drop .info-list ul li .content .verification-status {
  color: #563AEF;
  line-height: 1;
  font-size: 10px;
  position: absolute;
  inset-inline-start: 28px;
  bottom: -15px;
}
.user-profile-drop .user-logout {
  border-top: 1px solid rgba(3, 3, 6, 0.08);
  margin-top: 30px;
  padding-top: 15px;
}
.user-profile-drop .user-logout .dropdown-item {
  background-color: transparent;
  padding: 0px;
  font-size: 14px;
  display: flex;
  align-items: start;
  gap: 8px;
  font-weight: 500;
  color: #F34141;
}

.toggle-sidebar {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  box-shadow: 0px 2px 12px rgba(86, 58, 239, 0.08);
  border-radius: 50%;
}
.toggle-sidebar .bar-icon {
  width: 20px;
  height: 17px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.toggle-sidebar .bar-icon span {
  width: 100%;
  height: 2px;
  background: #0C0C14;
  display: inline-block;
}
.toggle-sidebar .bar-icon span:nth-child(2) {
  margin-inline-end: 6px;
  width: 65%;
}
.toggle-sidebar .bar-icon:hover span:nth-child(2) {
  margin-inline-start: 0;
}

.sidebar-wrapper {
  background: #ffffff;
  box-shadow: 4px 0px 55px 0px rgba(86, 58, 239, 0.04);
  position: fixed;
  top: 0;
  z-index: 9;
  width: 300px;
  text-align: left;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  height: 100vh;
}

.page-header.close_icon {
  margin-inline-start: 0;
  width: 100%;
}

.sidebar-wrapper.close_icon {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  margin-inline-start: -300px;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ .page-body {
  margin-inline-start: 0;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .page-body-wrapper .page-body {
    margin-inline-start: 0 !important;
  }
}

.sidebar-wrapper .back-btn {
  display: none;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .page-wrapper.compact-wrapper .page-body-wrapper .back-btn {
    display: inline-block;
    top: 50%;
    inset-inline-end: 0;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 16px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    box-shadow: 0px 2px 12px rgba(86, 58, 239, 0.08);
    border-radius: 50%;
  }
}
.bg-overlay.active {
  height: 100vh;
  width: 100vw;
  background-color: rgba(0, 0, 0, 0.2);
  position: fixed;
  z-index: 8;
  top: 0;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .page-wrapper.compact-wrapper .page-header {
    margin-inline-start: 0;
    width: 100%;
  }
}

.user-sidebar {
  overflow-y: scroll;
  transition: 0.1s;
  height: calc(100% - 70px);
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}
.user-sidebar.nav-unfolded {
  inset-inline-start: 0;
  z-index: 2;
}
.user-sidebar::-webkit-scrollbar {
  width: 0px;
}
.user-sidebar::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(0, 48, 73, 0.3);
}
.user-sidebar::-webkit-scrollbar-track {
  border-radius: 10px;
  background: rgba(0, 18, 25, 0.3);
}
.user-sidebar .site-logo {
  padding-inline-start: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  height: 80px;
  display: flex;
  align-items: center;
  position: fixed;
  width: 300px;
  z-index: 10;
  background: #ffffff;
}
.user-sidebar .site-logo .logo {
  color: #0C0C14;
}
.user-sidebar .site-logo .logo img {
  height: 30px;
}
.user-sidebar .user-nav {
  padding: 20px;
  position: relative;
  top: 80px;
}
.user-sidebar .user-nav ul li {
  margin-bottom: 10px;
  display: block;
}
.user-sidebar .user-nav ul li:last-child {
  margin-bottom: 0;
}
.user-sidebar .user-nav ul li a {
  padding: 0px 25px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  height: 50px;
  position: relative;
}
.user-sidebar .user-nav ul li a i {
  font-size: 24px;
  margin-inline-end: 9px;
  position: relative;
}
.user-sidebar .user-nav ul li a span {
  color: #6e6e73;
}
.user-sidebar .user-nav ul li a .count-number {
  background: rgba(134, 131, 213, 0.1);
  border-radius: 6px;
  border-style: solid;
  border-color: rgba(134, 131, 213, 0.1);
  border-width: 1px;
  width: 30px;
  height: 30px;
  font-size: 14px;
  text-align: center;
  line-height: 30px;
  font-weight: 600;
  color: #563AEF;
  inset-inline-end: 15px;
  position: absolute;
}
.user-sidebar .user-nav ul li a:hover {
  background: rgba(0, 0, 0, 0.08);
}
.user-sidebar .user-nav ul li.active a {
  background: rgba(86, 58, 239, 0.1);
  color: #563AEF;
  position: relative;
  z-index: 5;
  overflow: hidden;
}
.user-sidebar .user-nav ul li.active a:before {
  position: absolute;
  content: "";
  height: 100%;
  width: 6px;
  background-color: #563AEF;
  inset-inline-start: 0;
  top: 0;
  z-index: -1;
  border-radius: 10px;
}
.user-sidebar .user-nav ul li.active a span {
  color: #563AEF;
}
.user-sidebar .user-nav ul li.logout a {
  color: #F34141;
  background: rgba(243, 65, 65, 0.1);
}
.user-sidebar .user-nav ul li.logout a:hover {
  background: #F34141;
  color: #ffffff;
}
.user-sidebar .user-nav ul li.logout a:hover span {
  color: #ffffff;
}

.sidebar-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.sidebar-logout {
  padding: 45px 20px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1600px) and (max-width: 1799px) {
  .sidebar-logout {
    padding: 35px 20px;
  }
}
.sidebar-logout .submit {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #F34141;
  font-weight: 600;
  font-size: 14px;
  width: 100%;
  height: 46px;
  padding: 20px 20px;
  background: rgba(243, 65, 65, 0.2);
  border-radius: 8px;
}

.page-body {
  min-height: calc(100vh - 80px);
  margin-top: 81px;
  margin-inline-start: 300px;
  padding: 30px 15px 30px 15px;
  position: relative;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media (max-width: 575px) {
  .page-body {
    padding: 15px 0px 15px 0px;
  }
}

.dashboard-card {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dashboard-card {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .dashboard-card {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .dashboard-card {
    grid-template-columns: 1fr;
  }
}
.dashboard-card .user-profile {
  background: linear-gradient(260deg, #7A62FF 1.13%, #361DC5 101.77%);
  border-radius: 10px;
  padding: 25px 25px 20px;
  position: relative;
  overflow: hidden;
}
.dashboard-card .user-profile .info-title {
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 15px;
  display: block;
}
.dashboard-card .user-profile .number {
  color: #ffffff;
  margin-bottom: 10px;
  font-size: 26px;
}
.dashboard-card .user-profile .plan-badge {
  display: inline-flex;
  gap: 4px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 600;
  background: rgba(246, 191, 48, 0.2);
  padding: 7px 40px 6px 10px;
  clip-path: polygon(0% 51.515%, 0% 0%, 100% 0%, 87.87% 47.656%, 100% 100%, 0% 100%);
  border-radius: 4px 2px 2px 4px;
  margin-bottom: 5px;
  color: #F6BF30;
}
.dashboard-card .user-profile .plan-change {
  display: inline-block;
  font-size: 12px;
  text-decoration: underline;
  color: #5AA9EB;
}
.dashboard-card .user-profile .plan-change:hover {
  text-decoration: none;
}
.dashboard-card .user-profile .time {
  color: #F6BF30;
  margin-top: 5px;
  margin-bottom: 0;
  font-size: 12px;
}
.dashboard-card .user-profile .icon {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
}
.dashboard-card .user-profile .icon span {
  width: 74px;
  height: 74px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  position: relative;
}
.dashboard-card .user-profile .icon span::before {
  position: absolute;
  content: "";
  height: calc(100% + 60px);
  width: calc(100% + 60px);
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  top: -30px;
  inset-inline-start: -30px;
}
.dashboard-card .user-profile .icon span::after {
  position: absolute;
  content: "";
  height: calc(100% + 100px);
  width: calc(100% + 100px);
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  top: -50px;
  inset-inline-start: -50px;
}
.dashboard-card .single-card {
  background: linear-gradient(103.52deg, rgba(2, 186, 216, 0.1) 1.23%, rgba(128, 10, 246, 0.1) 100.8%);
  border-radius: 10px;
  padding: 25px 25px 20px;
  position: relative;
  overflow: hidden;
}
.dashboard-card .single-card:nth-child(3) {
  background: linear-gradient(102.71deg, rgba(41, 180, 17, 0.1) 0.86%, rgba(224, 190, 56, 0.1) 106.45%);
}
.dashboard-card .single-card:nth-child(3) .icon span {
  background: rgba(41, 180, 117, 0.1);
}
.dashboard-card .single-card:nth-child(3) .icon span::before {
  background-color: rgba(41, 180, 117, 0.1);
}
.dashboard-card .single-card:nth-child(3) .icon span::after {
  background-color: rgba(41, 180, 117, 0.06);
}
.dashboard-card .single-card:nth-child(3) .round-btn {
  background: rgb(41, 180, 117);
}
.dashboard-card .single-card:nth-child(4) {
  background: linear-gradient(103.52deg, rgba(242, 52, 80, 0.1) 1.23%, rgba(128, 10, 246, 0.1) 100.8%);
}
.dashboard-card .single-card:nth-child(4) .icon span {
  background-color: rgba(242, 52, 80, 0.1);
}
.dashboard-card .single-card:nth-child(4) .icon span::before {
  background-color: rgba(242, 52, 80, 0.1);
}
.dashboard-card .single-card:nth-child(4) .icon span::after {
  background-color: rgba(242, 80, 80, 0.06);
}
.dashboard-card .single-card:nth-child(4) .round-btn {
  background-color: rgb(242, 52, 80);
}
.dashboard-card .single-card:nth-child(5) {
  background: linear-gradient(105.43deg, rgba(255, 172, 62, 0.06) -10.83%, rgba(101, 150, 244, 0.06) 89.63%);
}
.dashboard-card .single-card:nth-child(5) .icon span {
  background-color: rgba(101, 150, 244, 0.1);
}
.dashboard-card .single-card:nth-child(5) .icon span::before {
  background-color: rgba(101, 150, 244, 0.1);
}
.dashboard-card .single-card:nth-child(5) .icon span::after {
  background-color: rgba(101, 150, 244, 0.06);
}
.dashboard-card .single-card:nth-child(5) .round-btn {
  background-color: rgb(101, 150, 244);
}
.dashboard-card .single-card:nth-child(6) {
  background: linear-gradient(103.33deg, rgba(128, 10, 244, 0.1) 1.03%, rgba(44, 175, 123, 0.1) 102.09%);
}
.dashboard-card .single-card:nth-child(6) .icon span {
  background-color: rgba(128, 10, 244, 0.1);
}
.dashboard-card .single-card:nth-child(6) .icon span::before {
  background-color: rgba(128, 10, 244, 0.1);
}
.dashboard-card .single-card:nth-child(6) .icon span::after {
  background-color: rgba(128, 10, 244, 0.06);
}
.dashboard-card .single-card:nth-child(6) .round-btn {
  background-color: rgb(128, 10, 244);
}
.dashboard-card .single-card:nth-child(7) {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
}
.dashboard-card .single-card:nth-child(7) .icon span {
  background-color: rgba(255, 172, 62, 0.1);
}
.dashboard-card .single-card:nth-child(7) .icon span::before {
  background-color: rgba(255, 172, 62, 0.1);
}
.dashboard-card .single-card:nth-child(7) .icon span::after {
  background-color: rgba(255, 172, 62, 0.06);
}
.dashboard-card .single-card:nth-child(7) .round-btn {
  background-color: rgb(255, 172, 62);
}
.dashboard-card .single-card:nth-child(8) {
  background: linear-gradient(103.52deg, rgba(154, 184, 201, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
}
.dashboard-card .single-card:nth-child(8) .icon span {
  background-color: rgba(33, 240, 116, 0.1);
}
.dashboard-card .single-card:nth-child(8) .icon span::before {
  background-color: rgba(33, 240, 116, 0.1);
}
.dashboard-card .single-card:nth-child(8) .icon span::after {
  background-color: rgba(33, 240, 116, 0.06);
}
.dashboard-card .single-card:nth-child(8) .round-btn {
  background-color: rgb(33, 240, 116);
}
.dashboard-card .single-card .info-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  display: block;
}
.dashboard-card .single-card .number {
  font-size: 26px;
  margin-bottom: 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .dashboard-card .single-card .number {
    font-size: 22px;
  }
}
.dashboard-card .single-card .description {
  margin-bottom: 18px;
}
.dashboard-card .single-card .icon {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
}
.dashboard-card .single-card .icon span {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(2, 186, 216, 0.1);
  border-radius: 10px;
  position: relative;
}
.dashboard-card .single-card .round-btn {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #02BAD8;
  border-radius: 50%;
  transform: rotate(45deg);
  color: #ffffff;
}

.site-card {
  background-color: #ffffff;
  padding: 25px 30px 30px;
  border-radius: 10px;
  box-shadow: 0px 4px 16px rgba(134, 131, 213, 0.1);
}
@media (max-width:450px) {
  .site-card {
    padding: 15px 20px 20px;
  }
}

.site-card-title {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 25px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .site-card-title {
    font-size: 20px;
  }
}

.site-title-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 10px;
  margin-bottom: 20px;
}

.transactions-filed-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto auto auto;
  width: 100%;
  gap: 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
  padding: 20px 20px;
  margin-bottom: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .transactions-filed-wrapper {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .transactions-filed-wrapper {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .transactions-filed-wrapper {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .transactions-filed-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .transactions-filed-wrapper {
    grid-template-columns: 1fr;
  }
}
.transactions-filed-wrapper .input-select .nice-select {
  background-color: #ffffff;
}
.transactions-filed-wrapper .dropdown-toggle::after {
  display: none;
}
.transactions-filed-wrapper .input-field input {
  height: 44px;
  background: #ffffff;
}

.site-custom-table {
  min-width: 1100px;
}
.site-custom-table .contents {
  display: table;
  width: 100%;
}
.site-custom-table .contents .site-table-list {
  display: table-row;
}
.site-custom-table .contents .site-table-list:nth-child(2) .site-table-col {
  padding-top: 28px;
}
.site-custom-table .contents .site-table-list:nth-child(3) .site-table-col .description .event-icon {
  background: linear-gradient(103.88deg, rgba(253, 127, 255, 0.2) 0.6%, rgba(172, 61, 255, 0.2) 137.96%);
}
.site-custom-table .contents .site-table-list:nth-child(3) .site-table-col .description .event-icon i {
  color: #F87BFF;
}
.site-custom-table .contents .site-table-list:nth-child(4) .site-table-col .description .event-icon {
  background: linear-gradient(102.71deg, rgba(41, 180, 117, 0.1) 0.86%, rgba(224, 190, 56, 0.1) 106.45%);
}
.site-custom-table .contents .site-table-list:nth-child(4) .site-table-col .description .event-icon i {
  color: #29B475;
}
.site-custom-table .contents .site-table-list:nth-child(5) .site-table-col .description .event-icon {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
}
.site-custom-table .contents .site-table-list:nth-child(5) .site-table-col .description .event-icon i {
  color: #E74B54;
}
.site-custom-table .contents .site-table-list:nth-child(6) .site-table-col .description .event-icon {
  background: linear-gradient(103.52deg, rgba(154, 184, 201, 0.1) 5.94%, rgba(33, 240, 116, 0.1) 100.8%);
}
.site-custom-table .contents .site-table-list:nth-child(6) .site-table-col .description .event-icon i {
  color: #21F074;
}
.site-custom-table .contents .site-table-list:nth-child(7) .site-table-col .description .event-icon {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
}
.site-custom-table .contents .site-table-list:nth-child(7) .site-table-col .description .event-icon i {
  color: #FFAC3E;
}
.site-custom-table .contents .site-table-list:nth-child(8) .site-table-col .description .event-icon {
  background: linear-gradient(103.52deg, rgba(154, 184, 201, 0.1) 5.94%, rgba(33, 240, 116, 0.1) 100.8%);
}
.site-custom-table .contents .site-table-list:nth-child(8) .site-table-col .description .event-icon i {
  color: #10E264;
}
.site-custom-table .contents .site-table-list .site-table-col {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  padding: 25px 0.5rem 25px 0px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.site-custom-table .contents .site-table-list .site-table-col .description {
  display: flex;
  align-items: center;
  max-width: 380px;
}
.site-custom-table .contents .site-table-list .site-table-col .description .event-icon {
  height: 45px;
  min-width: 45px;
  border-radius: 10px;
  background: linear-gradient(103.88deg, rgba(215, 241, 255, 0.485) 0.6%, rgba(147, 208, 241, 0.5) 137.96%);
  color: #563AEF;
  text-align: center;
  margin-inline-end: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.site-custom-table .contents .site-table-list .site-table-col .description .event-icon i {
  font-size: 22px;
  color: #02BAD8;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content {
  font-size: 16px;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .title {
  font-weight: 700;
  margin-bottom: 2px;
  font-size: 14px;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .title .message-icon {
  height: 25px;
  width: 25px;
  line-height: 5px;
  background: #563AEF;
  color: #ffffff;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  margin-inline-start: 3px;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .title .message-icon i {
  width: 13px;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .title a {
  color: #0C0C14;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .title a:hover {
  color: #563AEF;
}
.site-custom-table .contents .site-table-list .site-table-col .description .content .date {
  font-size: 12px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.4);
}
.site-custom-table .contents .site-table-list .site-table-col .text {
  font-size: 14px;
}
.site-custom-table .contents .site-table-list .site-table-col .table-icon {
  height: 25px;
  width: auto;
}
.site-custom-table .contents .site-table-list .site-table-col .action {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.site-custom-table .contents .site-table-list .site-table-col .action span {
  margin-inline-start: 5px;
}
.site-custom-table .contents .site-table-list .site-table-col .action .icon-btn {
  padding: 6px 14px;
  background: #563AEF;
  color: #ffffff;
  border-radius: 50px;
  display: flex;
  align-items: center;
  font-weight: 700;
}
.site-custom-table .contents .site-table-list .site-table-col .action .icon-btn svg {
  height: 15px;
}
.site-custom-table .contents .site-table-list .site-table-col .action .icon-btn:hover {
  background: #F34141;
}
.site-custom-table .contents .site-table-list .site-table-col .action .circle-btn {
  height: 35px;
  width: 35px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #ffffff;
}
.site-custom-table .contents .site-table-list .site-table-col .action .circle-btn svg {
  height: 15px;
}
.site-custom-table .contents .site-table-list:last-child .site-table-col {
  border-bottom: 0;
}
.site-custom-table .contents .site-table-head {
  border: 1px solid rgba(0, 0, 0, 0.6);
}
.site-custom-table .contents .site-table-head .site-table-col {
  padding-top: 0;
  padding-bottom: 25px;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}
.site-custom-table .no-data-found {
  text-align: center;
  padding: 15px 0;
  font-size: 14px;
  font-weight: 500;
}
.site-custom-table.site-custom-table-sm {
  min-width: 100%;
}

.subscriptions-wrapper {
  margin-top: 30px;
}

.pricing-item {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 10px;
  padding: 35px 30px 40px;
  height: 100%;
}
@media (max-width: 575px) {
  .pricing-item {
    padding: 25px 20px 30px;
  }
}
.pricing-item.subscribed {
  cursor: default;
  opacity: 0.4;
}
.pricing-item .item-title {
  font-size: 18px;
  margin-bottom: 10px;
}
.pricing-item .price-btn {
  margin-top: 23px;
  margin-bottom: 35px;
}
.pricing-item .price-btn .site-btn {
  background-color: #563AEF;
  color: #ffffff;
}
.pricing-item .price-value .strong {
  font-size: 24px;
}
.pricing-item .price-value strong {
  font-size: 24px;
}
.pricing-item .price-value sub {
  color: #5C5958;
  position: relative;
  top: -3px;
  font-size: 15px;
}
.pricing-item .icon-list li {
  list-style: none;
  display: flex;
  align-items: start;
  gap: 10px;
}
.pricing-item .icon-list li:not(:last-child) {
  margin-bottom: 20px;
}
.pricing-item .list-item-text {
  font-weight: 500;
}
.pricing-item.popular-plan {
  position: relative;
  background-color: #563AEF;
}
.pricing-item.popular-plan .plan-badge {
  position: absolute;
  top: 25px;
  inset-inline-end: 0;
  background-color: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  padding: 5px 15px 5px 20px;
  border-radius: 10px 0px 0px 10px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .pricing-item.popular-plan .plan-badge {
    position: absolute;
    top: 15px;
    padding: 5px 10px 5px 15px;
    font-size: 14px;
  }
}
[dir=rtl] .pricing-item.popular-plan .plan-badge {
  border-radius: 0px 10px 10px 0px;
}
.pricing-item.popular-plan .item-title {
  color: #ffffff;
}
.pricing-item.popular-plan .list-item-icon svg * {
  stroke: #ffffff;
}
.pricing-item.popular-plan .price-value strong {
  color: #ffffff;
}
.pricing-item.popular-plan .price-value sub {
  color: rgba(255, 255, 255, 0.8);
}
.pricing-item.popular-plan .description {
  color: #ffffff;
}
.pricing-item.popular-plan .list-item-text {
  color: rgba(255, 255, 255, 0.8);
}
.pricing-item.popular-plan .price-btn.disable .site-btn {
  pointer-events: none;
  opacity: 0.75;
}
.pricing-item.popular-plan .price-btn .site-btn {
  color: #563AEF;
  background-color: #ffffff;
}

.subscriptions-terms-content .title {
  font-size: 24px;
  margin-bottom: 20px;
}
.subscriptions-terms-content .list-content ul li {
  list-style: none;
  color: #5C5958;
  font-weight: 500;
  position: relative;
  padding-inline-start: 15px;
  font-size: 14px;
}
.subscriptions-terms-content .list-content ul li:not(:last-child) {
  margin-bottom: 10px;
}
.subscriptions-terms-content .list-content ul li:before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  background-color: #5C5958;
  top: 50%;
  inset-inline-start: 0;
  transform: translateY(-50%);
  border-radius: 50%;
}

.add-fund-box {
  height: 100%;
}
.add-fund-box .site-card {
  height: 100%;
}

.add-gateway-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .add-gateway-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 575px) {
  .add-gateway-grid {
    grid-template-columns: 1fr;
  }
}

.add-gateway-item input[type=radio] {
  display: none;
}
.add-gateway-item.active .add-gateway-thumb {
  border: 2px solid #563AEF;
  position: relative;
}
.add-gateway-item.active .add-gateway-thumb::before {
  position: absolute;
  content: "\f00c";
  font-family: "Font Awesome 6 Pro";
  width: 24px;
  height: 24px;
  background-color: #563aef;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  left: 5px;
  top: 5px;
  color: #ffffff;
  font-size: 14px;
}

.add-gateway-thumb {
  min-height: 70px;
  display: flex;
  align-items: center;
  background-color: #ffffff;
  justify-content: center;
  padding: 0 20px;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 6px;
  cursor: pointer;
}
.add-gateway-thumb img {
  height: 50px;
  object-fit: cover;
  -o-object-fit: cover;
}

.add-gateway {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 6px;
  padding: 20px 20px;
  margin-bottom: 20px;
}
.add-gateway .title {
  font-size: 16px;
  margin-bottom: 15px;
  font-weight: 500;
}

.select-gateway .label-radio {
  display: inline-block;
  margin: 10px;
}
.select-gateway .label-radio.active span {
  background: #563AEF;
  color: #ffffff;
}
.select-gateway .label-radio input[type=radio] {
  display: none;
}
.select-gateway .label-radio span {
  display: inline-block;
  padding: 10px 20px;
  background: rgba(86, 58, 239, 0.1);
  color: #563AEF;
  cursor: pointer;
  border-radius: 5px;
  transition: background-color 0.3s ease;
  font-size: 14px;
}
.select-gateway .label-radio input[type=radio]:checked + span {
  background-color: #563AEF;
  color: #ffffff;
}
.select-gateway .select-gateway-item {
  margin-top: 20px;
  padding: 20px;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 5px;
  background-color: #ffffff;
}
.select-gateway .select-gateway-item .description {
  font-size: 18px;
}
.select-gateway .select-gateway-item .description span {
  font-weight: 600;
  color: #563AEF;
}

.gateway-navigation {
  gap: 15px;
}
.gateway-navigation button {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  background: #F0EBFD;
  justify-content: center;
  border-radius: 50%;
  font-size: 16px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  inset-inline-start: -10px;
}
.gateway-navigation button:hover {
  background-color: #563AEF;
  color: #ffffff;
  border-color: transparent;
}
.gateway-navigation button:hover svg * {
  stroke: #ffffff;
}
.gateway-navigation .gateway-button-next {
  inset-inline-start: auto;
  inset-inline-end: -10px;
}

.add-found-details {
  background: #FAFAFA;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  padding: 25px 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 575px) {
  .add-found-details {
    padding: 20px 20px;
  }
}
.add-found-details .list ul li {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 5px;
}
.add-found-details .list ul li:not(:last-child) {
  margin-bottom: 25px;
}
.add-found-details .list ul li .info {
  font-size: 14px;
  font-weight: 500;
}
.add-found-details .list ul li .info:first-child {
  color: #0C0C14;
}
.add-found-details .balance-thumb {
  border-radius: 6px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: top center;
}
.add-found-details .balance-thumb img {
  border-radius: 4px;
  height: 45px;
}

.ads-step {
  margin-bottom: 30px;
}
.ads-step .ads-step-inner {
  display: inline-flex;
  background: rgba(86, 58, 239, 0.1);
  border-radius: 5px;
  gap: 30px 20px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .ads-step .ads-step-inner {
    gap: 30px 30px;
  }
}
@media (max-width:450px) {
  .ads-step .ads-step-inner {
    gap: 20px 30px;
    flex-direction: column;
    padding: 20px 20px;
    width: 100%;
  }
}
.ads-step .ads-step-inner .step-btn {
  color: #563AEF;
  height: 50px;
  padding: 0 25px;
  font-weight: 500;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .ads-step .ads-step-inner .step-btn {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .ads-step .ads-step-inner .step-btn {
    padding: 0 35px;
  }
}
.ads-step .ads-step-inner .step-btn.is-active {
  background-color: #563AEF;
  color: #ffffff;
  border-radius: 6px;
}

.ads-item-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 30px 30px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px) {
  .ads-item-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ads-item-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .ads-item-grid {
    grid-template-columns: 1fr;
  }
}

.ads-item-inner {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  padding-top: 25px;
}

.ads-single-item {
  background-color: #EFEFFF;
  padding: 30px 30px;
  border-radius: 6px;
  position: relative;
  overflow: hidden;
  z-index: 5;
}
@media (max-width:450px) {
  .ads-single-item {
    padding: 25px 25px;
  }
}
.ads-single-item .content-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.ads-single-item .badge {
  background-color: #FC5D19;
  position: absolute;
  top: 12px;
  right: 12px;
  font-weight: 500;
}
.ads-single-item.disabled {
  opacity: 0.4;
}
.ads-single-item .ads-countdown {
  color: #FC5D19;
}
.ads-single-item .title {
  font-size: 20px;
  color: #563AEF;
  margin-bottom: 15px;
}
.ads-single-item .description {
  margin-bottom: 10px;
}
.ads-single-item .currency {
  font-size: 16px;
}
.ads-single-item .bg-pattern {
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  z-index: -1;
  width: 100%;
}
.ads-single-item .bg-pattern img {
  width: 100%;
}
.ads-single-item .btn-wrap {
  margin-top: 25px;
}
.ads-single-item .btn-wrap .site-btn {
  background-color: #0C0C14;
  padding: 20px 20px;
  height: 40px;
  color: #ffffff;
  gap: 8px;
  border-radius: 6px;
  font-weight: 500;
}
.ads-single-item .btn-wrap .site-btn.disabled {
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
}
.ads-single-item.style-two {
  background: linear-gradient(105.37deg, rgba(242, 52, 80, 0.1) 0.65%, rgba(128, 10, 246, 0.1) 127.68%, rgba(128, 10, 246, 0.1) 127.68%);
}
.ads-single-item.style-two .title {
  color: #0C0C14;
}
.ads-single-item.style-two .btn-wrap .site-btn {
  background-color: #563AEF;
}

.my-ads-fields-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  width: 100%;
  gap: 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
  padding: 20px 20px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .my-ads-fields-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width:450px) {
  .my-ads-fields-wrapper {
    grid-template-columns: 1fr;
  }
}
.my-ads-fields-wrapper .input-field input {
  height: 44px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-color: #ffffff;
}
.my-ads-fields-wrapper .input-select .nice-select {
  background-color: #ffffff;
}
.my-ads-fields-wrapper .site-btn {
  background-color: #0C0C14;
  color: #ffffff;
  gap: 5px;
  border-radius: 6px;
  border: 0;
}

.input-select.entries {
  width: 66px;
}
.input-select .nice-select {
  height: 44px;
  width: 100%;
  padding: 0 15px;
  display: flex;
  align-items: center;
  float: none;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  background-color: #FAFAFA;
}
.input-select .nice-select .current {
  text-align: left;
  font-size: 14px;
  position: relative;
}
.input-select .nice-select .list {
  transform-origin: center center;
  -webkit-transform: scale(1) translateY(0px);
  -moz-transform: scale(1) translateY(0px);
  -ms-transform: scale(1) translateY(0px);
  -o-transform: scale(1) translateY(0px);
  transform: scale(1) translateY(0px);
  width: 100%;
  padding: 10px 0;
  border-radius: 6px !important;
}
.input-select .nice-select::after {
  font-size: 16px;
  inset-inline-end: 16px;
  width: 8px;
  height: 8px;
  border-color: #5C5958;
  border-width: 1px;
}
[dir=rtl] .input-select .nice-select::after {
  left: 16px;
  right: auto;
}
.input-select .nice-select .option {
  font-size: 14px;
  line-height: 35px;
  min-height: 35px;
}
.input-select .nice-select .option.selected {
  font-weight: 500;
}
.input-select .nice-select.open, .input-select .nice-select:focus {
  border-color: #563AEF;
}

@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .site-table.clicks-table .table {
    width: 550px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .site-table.ads-table .table {
    width: 1000px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .site-table.referral-table .table {
    width: 650px;
  }
}
.site-table .table {
  margin-bottom: 10px;
}
.site-table .table > thead > tr:first-child td {
  padding-top: 50px;
}
.site-table .table > thead > tr > th {
  color: #6E6E73;
  font-size: 14px;
  font-weight: 500;
  color: rgb(110, 110, 115);
  font-size: 14px;
  font-weight: 500;
  padding: 28px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.site-table .table > tbody {
  vertical-align: middle;
}
.site-table .table > tbody tr:first-child td {
  padding-top: 30px;
}
.site-table .table > tbody tr:last-child td {
  padding-bottom: 0px;
}
.site-table .table > :not(caption) > * > * {
  padding: 14px 0;
  border: 0;
  font-size: 14px;
}
.site-table .table .edit-btn {
  font-size: 20px;
}

.add-schedule-top .content {
  display: flex;
  align-items: center;
  gap: 15px 20px;
  flex-wrap: wrap;
}
.add-schedule-top .content .description {
  margin-bottom: 0;
  color: #0C0C14;
}

.radio-form-field {
  max-width: 220px;
  padding: 18px 25px;
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 5px;
  filter: drop-shadow(0px 0px 12px rgba(0, 0, 0, 0.08));
}

.add-schedule-inputs {
  margin-top: 20px;
  padding: 20px 20px;
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  align-items: center;
  gap: 16px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .add-schedule-inputs {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .add-schedule-inputs {
    grid-template-columns: 1fr;
  }
}
.add-schedule-inputs .single-form-check {
  margin-bottom: 3px;
}
.add-schedule-inputs .single-input {
  margin-bottom: 0;
}

.progress-advertisement-item {
  position: relative;
  width: 400px;
}
.progress-advertisement-item .progress-count-inner {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.progress-advertisement-item .progress-count-inner .progress-count {
  font-size: 14px;
  font-weight: 600;
  color: #563AEF;
}
.progress-advertisement-item .progress-count-inner h4 {
  font-size: 14px;
}
.progress-advertisement-item .progress {
  height: 10px;
  background-color: transparent;
  border-radius: 0;
  overflow: visible;
  position: relative;
  z-index: 1;
}
.progress-advertisement-item .progress::after {
  position: absolute;
  content: "";
  inset-inline-start: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 10px;
  width: 100%;
  background-color: rgba(11, 231, 131, 0.15);
  z-index: -1;
  border-radius: 17px;
}
.progress-advertisement-item .progress-bar {
  width: 0;
  background: rgb(11, 231, 131);
  transition: width 0.05s linear;
  overflow: visible;
  border-radius: 10px;
}

.advertisement-active {
  position: fixed !important;
  top: 0;
  z-index: 111;
  inset-inline-end: 0;
  inset-inline-start: 0;
  width: 100%;
  background-color: #ffffff !important;
  box-shadow: 0px 20px 40px rgba(37, 9, 62, 0.1);
}

.advertisement-card-item {
  background-color: #ffffff;
  padding: 15px 35px;
  -webkit-box-shadow: 0 0 20px rgba(89, 102, 122, 0.1);
  box-shadow: 0 0 20px rgba(89, 102, 122, 0.1);
}
.advertisement-card-item .advertisement-card-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px 20px;
}
.advertisement-card-item .advertisement-calc {
  display: flex;
  align-content: center;
  background: #FAFAFA;
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 6px;
  padding: 10px 10px;
}
.advertisement-card-item .advertisement-calc button {
  width: 35px;
  height: 35px;
  display: inline-flex;
  align-items: center;
  min-width: 35px;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 5px;
}
.advertisement-card-item .icon {
  width: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  font-size: 24px;
  margin: 0 6px;
}
.advertisement-card-item .quantity {
  width: 55px;
  height: 35px;
  text-align: center;
  border: 0;
  background-color: #563AEF;
  color: #ffffff;
}
.advertisement-card-item .quantity::placeholder {
  color: #ffffff;
}
.advertisement-card-item .count {
  width: 55px;
  height: 35px;
  text-align: center;
  border: 0;
  background-color: #ffffff;
  font-weight: 500;
  box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.05);
  border-radius: 5px;
  /* Chrome, Safari, Edge, Opera */
  /* Firefox */
}
.advertisement-card-item .count::-webkit-outer-spin-button, .advertisement-card-item .count::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.advertisement-card-item .count [type=number] {
  -moz-appearance: textfield;
}

.advertisement-field iframe {
  width: 100% !important;
}

.filter-dropdown {
  width: 215px;
  padding: 12px 20px;
}
.filter-dropdown::after {
  display: none;
}
.filter-dropdown .title {
  font-size: 16px;
  border-bottom: 1px solid #F0F0F0;
  padding-bottom: 10px;
  margin-bottom: 15px;
}
.filter-dropdown .single-form-check:not(:last-child) {
  margin-bottom: 5px;
}

.referral-banner {
  padding: 55px 55px 30px;
  border-radius: 6px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .referral-banner {
    padding: 35px 35px 30px;
  }
}
@media (max-width: 575px) {
  .referral-banner {
    padding: 30px 30px 30px;
  }
}
.referral-banner .banner-content {
  max-width: 772px;
  margin-bottom: 55px;
}
.referral-banner .banner-content .title {
  color: #ffffff;
  margin-bottom: 20px;
  line-height: 1.3;
  font-size: 45px;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .referral-banner .banner-content .title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .referral-banner .banner-content .title {
    font-size: 34px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .referral-banner .banner-content .title {
    font-size: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .referral-banner .banner-content .title {
    font-size: 32px;
  }
}
@media (max-width: 575px) {
  .referral-banner .banner-content .title {
    font-size: 26px;
  }
}
.referral-banner .banner-content .description {
  color: #ffffff;
}

.referral-step-wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px 30px;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .referral-step-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .referral-step-wrapper {
    grid-template-columns: 270px;
    justify-content: center;
  }
}

.referral-step-item {
  padding: 0px 35px;
  text-align: center;
  position: relative;
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .referral-step-item {
    padding: 0px 0px;
  }
}
.referral-step-item .icon span {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 50%;
  margin-bottom: 20px;
  position: relative;
  z-index: 5;
}
.referral-step-item .icon span::before {
  position: absolute;
  content: "";
  height: calc(100% + 25px);
  width: calc(100% + 25px);
  background-color: rgba(255, 255, 255, 0.1);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: -1;
}
.referral-step-item .icon span i {
  font-size: 20px;
  color: #563AEF;
}
.referral-step-item .content .title {
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 10px;
}
.referral-step-item .content .description {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
}
.referral-step-item .step-arrow {
  position: absolute;
  inset-inline-end: -30%;
  top: 30px;
  transform: translateY(-50%);
}
.referral-step-item .step-arrow svg {
  width: 100%;
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
  .referral-step-item .step-arrow {
    width: 50%;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .referral-step-item .step-arrow {
    display: none;
  }
}

.referral-share-item {
  background: #ffffff;
  box-shadow: 0px 4px 16px rgba(134, 131, 213, 0.1);
  border-radius: 10px;
  padding: 30px 30px;
}
.referral-share-item .title {
  margin-bottom: 11px;
  font-size: 24px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .referral-share-item .title {
    font-size: 20px;
  }
}
.referral-share-item .description {
  margin-bottom: 25px;
  max-width: 489px;
}
.referral-share-item .bottom-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px 15px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.referral-share-item .bottom-content .client-meta {
  display: flex;
  align-items: center;
  gap: 10px;
}
.referral-share-item .bottom-content .client-thumb {
  display: flex;
  align-items: center;
}
.referral-share-item .bottom-content .client-thumb .thumb {
  width: 44px;
  border: 1px solid rgba(92, 89, 88, 0.2);
  height: 44px;
  border-radius: 50%;
}
.referral-share-item .bottom-content .client-thumb .thumb:not(:first-child) {
  margin-inline-start: -20px;
}
.referral-share-item .bottom-content .client-thumb .thumb :last-child {
  background-color: #FAFAFA;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  border-radius: 50%;
  color: #0C0C14;
  border: 1px solid rgba(110, 110, 115, 0.2);
  font-size: 14px;
  font-weight: 500;
}

.referral-user {
  display: flex;
  align-items: center;
  gap: 12px;
}
.referral-user .thumb {
  width: 36px;
}
.referral-user .thumb img {
  border-radius: 6px;
}
.referral-user .content .description {
  color: #0C0C14;
}

/*----------------------------------------
fund-transfer  history
-----------------------------------------*/
.fund-transfer-history-field {
  display: grid;
  grid-template-columns: repeat(2, 1fr) auto;
  width: 100%;
  gap: 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
  padding: 20px 20px;
  margin-bottom: 30px;
}
@media (max-width: 575px) {
  .fund-transfer-history-field {
    grid-template-columns: 1fr;
  }
}
.fund-transfer-history-field .dropdown-toggle::after {
  display: none;
}

.site-custom-table {
  min-width: 1100px;
}
.site-custom-table .contents {
  display: #143134;
  width: 100%;
}
.site-custom-table .contents .site-table-list {
  display: table-row;
}
.site-custom-table .contents .site-table-list:nth-child(3) .site-table-col .found-history-description .icon {
  background: linear-gradient(103.88deg, rgba(253, 127, 255, 0.2) 0.6%, rgba(172, 61, 255, 0.2) 137.96%);
  color: #E56BFF;
}
.site-custom-table .contents .site-table-list:nth-child(4) .site-table-col .found-history-description .icon {
  background: linear-gradient(102.71deg, rgba(41, 180, 117, 0.1) 0.86%, rgba(224, 190, 56, 0.1) 106.45%);
  color: #29B475;
}
.site-custom-table .contents .site-table-list:nth-child(5) .site-table-col .found-history-description .icon {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
  color: #E74B54;
}
.site-custom-table .contents .site-table-list:nth-child(6) .site-table-col .found-history-description .icon {
  background: linear-gradient(103.33deg, rgba(128, 10, 246, 0.1) 1.03%, rgba(44, 175, 123, 0.1) 102.09%);
  color: #800AF6;
}
.site-custom-table .contents .site-table-list:nth-child(7) .site-table-col .found-history-description .icon {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
  color: #FFAC3E;
}
.site-custom-table .contents .site-table-list:nth-child(8) .site-table-col .found-history-description .icon {
  background: linear-gradient(103.52deg, rgba(154, 184, 201, 0.1) 5.94%, rgba(33, 240, 116, 0.1) 100.8%);
  color: #10E264;
}
.site-custom-table .contents .site-table-col .found-history-description {
  display: flex;
  align-items: center;
  max-width: 380px;
}
.site-custom-table .contents .site-table-col .found-history-description .icon {
  height: 50px;
  min-width: 50px;
  border-radius: 10px;
  background: linear-gradient(103.88deg, rgba(215, 241, 255, 0.485) 0.6%, rgba(147, 208, 241, 0.5) 137.96%);
  color: #02BAD8;
  text-align: center;
  margin-inline-end: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.site-custom-table .contents .site-table-col .found-history-description .content {
  font-size: 16px;
}
.site-custom-table .contents .site-table-col .found-history-description .content .title {
  font-weight: 700;
  margin-bottom: 3px;
  font-size: 14px;
}
.site-custom-table .contents .site-table-col .found-history-description .content .title .msg {
  height: 25px;
  width: 25px;
  line-height: 23px;
  background: #563AEF;
  color: #ffffff;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  margin-inline-start: 3px;
}
.site-custom-table .contents .site-table-col .found-history-description .content .title .msg svg {
  width: 13px;
}
.site-custom-table .contents .site-table-col .found-history-description .content .title a {
  color: #0C0C14;
}
.site-custom-table .contents .site-table-col .found-history-description .content .title a:hover {
  color: #563AEF;
}
.site-custom-table .contents .site-table-col .found-history-description .content .date {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.4);
}
.site-custom-table .contents .site-table-col .found-history-description:nth-child(2) .icon {
  background: linear-gradient(103.88deg, rgba(253, 127, 255, 0.2) 0.6%, rgba(172, 61, 255, 0.2) 137.96%);
}

/*----------------------------------------
Profile settings
-----------------------------------------*/
.profile-info-content {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 35px;
}
.profile-info-content .thumb {
  width: 125px;
}
@media (max-width: 575px) {
  .profile-info-content .thumb {
    width: 100px;
  }
}
.profile-info-content .thumb img {
  border-radius: 50%;
}
.profile-info-content .content .upload-label {
  color: #5C5958;
  font-size: 14px;
  border-bottom: 1px solid #5C5958;
  margin-bottom: 10px;
  display: block;
  font-weight: 700;
}
.profile-info-content .content .info {
  color: #F34141;
  font-weight: 500;
  font-size: 14px;
}

.profile-information .title {
  font-size: 20px;
  margin-bottom: 25px;
}

.two-factor-auth-wrapper {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 10px;
  padding: 25px 30px 25px;
  margin-bottom: 20px;
}
@media (max-width: 575px) {
  .two-factor-auth-wrapper {
    padding: 15px 20px 15px;
  }
}
.two-factor-auth-wrapper .qr-code {
  margin-top: 20px;
  margin-bottom: 35px;
}
.two-factor-auth-wrapper .qr-code .white-qr-img {
  display: none;
}
.two-factor-auth-wrapper .qr-code img {
  border-radius: 8px;
}
.two-factor-auth-wrapper .description {
  font-weight: 600;
}
.two-factor-auth-wrapper .description-two {
  max-width: 436px;
  font-weight: 600;
}

.otp-form {
  margin-top: 25px;
}
.otp-form .inputs .verification {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.otp-form .inputs .verification input {
  width: 50px;
  height: 50px;
  text-align: center;
  font-size: 16px;
  color: #0C0C14;
  font-weight: 500;
}
.otp-form .otp-not-send {
  margin-top: 15px;
}
.otp-form .otp-not-send .link {
  color: #563AEF;
  text-decoration: underline;
  font-weight: 600;
}
.otp-form .otp-not-send .link:hover {
  text-decoration: none;
}

.two-factor-auth-main .attention {
  margin-bottom: 25px;
}
.two-factor-auth-main .attention .attention-text {
  color: #FF8112;
  font-weight: 400;
  display: flex;
  gap: 7px;
  align-items: center;
}

.action-checkbox-item {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.2);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
}
.action-checkbox-item:not(:last-child) {
  margin-bottom: 20px;
}
.action-checkbox-item .title {
  margin-bottom: 0;
}

.account-close-content .attention {
  display: flex;
  align-items: start;
  gap: 10px;
  max-width: 525px;
  margin-bottom: 25px;
}
.account-close-content .attention-text {
  color: #FF8112;
}

.social-sign-btn {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.6);
  border-radius: 6px;
  width: 100%;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.social-sign-btn:hover {
  border-color: #563AEF;
  color: #563AEF;
}

.profile-change-password-from {
  margin-top: 35px;
}
.profile-change-password-from .button-inner {
  margin-top: 40px;
}

/*----------------------------------------
withdraw Style
-----------------------------------------*/
.withdraw-area .button-inner {
  padding-top: 30px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.withdraw-item-wrapper {
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 6px;
  padding: 20px 20px;
  margin-bottom: 20px;
}
.withdraw-item-wrapper .title {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 12px;
}

.withdraw-item-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 575px) {
  .withdraw-item-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.withdraw-item {
  min-height: 70px;
  display: flex;
  align-items: center;
  border: 1px solid rgba(173, 171, 168, 0.3);
  justify-content: center;
  padding: 0 20px;
  border-radius: 6px;
}

/*----------------------------------------
withdraw Style
-----------------------------------------*/
.withdraw-history-table {
  margin-top: 30px;
}

.withdraw-history-form {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  width: 100%;
  gap: 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
  padding: 20px 20px;
  margin-bottom: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .withdraw-history-form {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .withdraw-history-form {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .withdraw-history-form {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .withdraw-history-form {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .withdraw-history-form {
    grid-template-columns: 1fr;
  }
}
.withdraw-history-form .input-select .nice-select {
  background-color: #ffffff;
}
.withdraw-history-form .dropdown-toggle::after {
  display: none;
}
.withdraw-history-form .input-field input {
  height: 44px;
  background: #ffffff;
}

/*----------------------------------------
Support Ticket Style
-----------------------------------------*/
.support-ticket-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr) auto auto;
  width: 100%;
  gap: 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.1);
  border-radius: 6px;
  padding: 20px 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .support-ticket-form-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .support-ticket-form-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .support-ticket-form-grid {
    grid-template-columns: 1fr;
  }
}
.support-ticket-form-grid .input-select .nice-select {
  background-color: #ffffff;
}
.support-ticket-form-grid .dropdown-toggle::after {
  display: none;
}
.support-ticket-form-grid .input-field input {
  background: #ffffff;
}

.support-tickets-grid {
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.support-tickets-grid .support-tickets-item {
  width: calc(50% - 34px);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .support-tickets-grid .support-tickets-item {
    width: calc(80% - 34px);
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .support-tickets-grid .support-tickets-item {
    width: 100%;
  }
}
.support-tickets-grid .support-tickets-item .salutation {
  margin-bottom: 20px;
  font-size: 14px;
}
.support-tickets-grid .support-tickets-item .message-body {
  margin-bottom: 20px;
  font-size: 14px;
}
.support-tickets-grid .support-tickets-item .message-footer .email {
  font-size: 14px;
}
.support-tickets-grid .support-tickets-item .message-attachments {
  margin-top: 30px;
}
.support-tickets-grid .support-tickets-item.right-item {
  margin-left: auto;
}
.support-tickets-grid .support-tickets-item.right-item .support-tickets-aviator {
  justify-content: start;
}

.support-tickets-aviator {
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}
.support-tickets-aviator .thumb {
  width: 38px;
  flex: 0 0 auto;
}
.support-tickets-aviator .contents .title {
  font-size: 14px;
}
.support-tickets-aviator .contents .info {
  font-size: 12px;
}

.support-tickets-card {
  background: rgba(241, 241, 241, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  padding: 24px 24px;
}
@media (max-width:450px) {
  .support-tickets-card {
    padding: 16px 16px;
  }
}
.support-tickets-card .message-footer .regards {
  font-size: 14px;
}
.support-tickets-card .message-footer .name {
  font-weight: 700;
  font-size: 14px;
}
.support-tickets-card .single-attachment .attach {
  font-size: 14px;
}

.support-tickets-input-wrapper {
  margin-top: 225px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .support-tickets-input-wrapper {
    margin-top: 150px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .support-tickets-input-wrapper {
    margin-top: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .support-tickets-input-wrapper {
    margin-top: 80px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .support-tickets-input-wrapper {
    margin-top: 50px;
  }
}

/*----------------------------------------
Notification Style
-----------------------------------------*/
.notification-popup {
  margin-top: 25px !important;
  border: 0px;
  padding: 18px 20px 20px;
  background-color: #ffffff;
  box-shadow: 0px 25px 70px rgba(8, 10, 55, 0.1);
  max-width: 400px;
}

.header-notifications > .title {
  font-size: 20px;
  border-bottom: 1px solid rgb(229, 229, 229);
  margin-bottom: 25px;
  padding-bottom: 15px;
}
.header-notifications .notifications-item-wrapper {
  max-height: 320px;
  overflow-y: scroll;
  padding-inline-end: 5px;
}
.header-notifications .notifications-item-wrapper::-webkit-scrollbar {
  width: 5px;
}
.header-notifications .notifications-item-wrapper::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.2);
}
.header-notifications .notifications-item-wrapper::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #ffffff;
}
.header-notifications .notifications-item {
  padding: 10px 10px;
}
.header-notifications .notifications-item:hover {
  border-color: #563AEF;
}
.header-notifications .notifications-item:not(:last-child) {
  margin-bottom: 14px;
}
.header-notifications .notification-list {
  width: 90%;
}
.header-notifications .notification-list .content .title {
  font-size: 14px;
  margin-bottom: 8px;
  font-weight: 500;
  line-height: 1.5;
}
.header-notifications .notification-list .content .meta span {
  font-size: 12px;
}
.header-notifications .btn-wrap {
  margin-top: 20px;
}
.header-notifications .btn-wrap .site-btn.btn-xxs i {
  font-size: 20px !important;
}

.notifications-item {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 15px;
  background: #FAFAFA;
  border: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 6px;
  padding: 19px 20px;
}
.notifications-item:not(:last-child) {
  margin-bottom: 24px;
}
.notifications-item:nth-child(2) .notification-list .icon {
  background: linear-gradient(103.88deg, rgba(253, 127, 255, 0.2) 0.6%, rgba(172, 61, 255, 0.2) 137.96%);
  color: #E56BFF;
}
.notifications-item:nth-child(3) .notification-list .icon {
  background: linear-gradient(102.71deg, rgba(41, 180, 117, 0.1) 0.86%, rgba(224, 190, 56, 0.1) 106.45%);
  color: #29B475;
}
.notifications-item:nth-child(4) .notification-list .icon {
  background: linear-gradient(103.52deg, rgba(11, 192, 171, 0.1) 0%, rgba(231, 75, 84, 0.1) 100.37%);
  color: #E74B54;
}
.notifications-item:nth-child(5) .notification-list .icon {
  background: linear-gradient(105.43deg, rgba(255, 172, 62, 0.1) -10.83%, rgba(101, 150, 244, 0.1) 89.63%);
  color: #6596F4;
}
.notifications-item:nth-child(6) .notification-list .icon {
  background: linear-gradient(103.33deg, rgba(128, 10, 246, 0.1) 1.03%, rgba(44, 175, 123, 0.1) 102.09%);
  color: #800AF6;
}

.notification-list {
  display: flex;
}
.notification-list .icon {
  height: 40px;
  min-width: 40px;
  border-radius: 10px;
  background: linear-gradient(103.88deg, rgba(215, 241, 255, 0.485) 0.6%, rgba(147, 208, 241, 0.5) 137.96%);
  color: #02BAD8;
  text-align: center;
  margin-inline-end: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
.notification-list .content .title {
  font-size: 18px;
  margin-bottom: 6px;
}
.notification-list .content .title span {
  color: #563AEF;
}
.notification-list .content .meta {
  display: flex;
  gap: 20px;
}
.notification-list .content .meta span {
  font-size: 14px;
}
.notification-list .content .meta span:not(:first-child) {
  position: relative;
}
.notification-list .content .meta span:not(:first-child)::before {
  position: absolute;
  content: "";
  height: 5px;
  width: 5px;
  inset-inline-start: -12px;
  top: 50%;
  transform: translateY(-50%);
  background-color: #5C5958;
  border-radius: 50%;
}

.notifications-right-content {
  display: flex;
  align-items: center;
  gap: 10px 20px;
}
.notifications-right-content .status-icon {
  width: 8px;
  height: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #563AEF;
  border-radius: 50%;
}
.notifications-right-content .notifications-link .site-btn {
  background: rgba(134, 131, 213, 0.1);
  gap: 8px;
  color: #563aef;
  font-weight: 600;
  font-size: 16px;
  border-radius: 6px;
  border: 0;
}
.notifications-right-content .notifications-link .site-btn:hover {
  background-color: #563AEF;
  color: #ffffff;
}

/*----------------------------------------
identity alert Style
-----------------------------------------*/
.identity-alert {
  padding: 20px;
  border: 2px dashed;
  border-radius: 6px;
  display: flex;
  align-items: center;
}
.identity-alert .icon {
  height: 70px;
  min-width: 70px;
  text-align: center;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 15px;
  font-size: 20px;
}
.identity-alert .icon svg {
  height: 22px;
}
.identity-alert .contents .head {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 5px;
}
.identity-alert .contents .kyc-btn {
  height: 35px;
  padding: 0 15px;
  margin-top: 10px;
  font-weight: 500;
}
.identity-alert .contents .kyc-btn:hover {
  color: #ffffff;
}
.identity-alert .contents .content {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  font-weight: 700;
}
.identity-alert .contents .content p {
  display: inline-block;
  margin-bottom: 0;
}
.identity-alert .contents .content small {
  margin-top: 5px;
  display: block;
}
.identity-alert.not-approved {
  border: 2px dashed rgba(243, 65, 65, 0.4);
  background: rgba(243, 65, 65, 0.1);
}
.identity-alert.not-approved .icon {
  background: #F34141;
  color: #ffffff;
}
.identity-alert.approved {
  border: 2px dashed rgba(192, 253, 191, 0.4);
  background: rgba(192, 253, 191, 0.1);
}
.identity-alert.approved .icon {
  background: #C0FDBF;
  color: #ffffff;
}
.identity-alert.pending {
  border: 2px dashed rgba(255, 172, 62, 0.6);
  background: rgba(255, 172, 62, 0.1);
}
.identity-alert.pending .icon {
  background: #FFAC3E;
  color: #0C0C14;
}

/*----------------------------------------
  MOdal list style
-----------------------------------------*/
.modal-list-content {
  border: 1px solid #ddd;
  border-radius: 8px;
}
.modal-list-content .heading {
  padding: 10px 10px;
}
.modal-list-content .modal-list-info ul li {
  display: none;
}
.modal-list-content .modal-list-info ul li:not(:last-child) {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
}
.modal-list-content .modal-list-info .list-item {
  padding: 10px 10px;
  list-style: none;
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 14px;
}

.underline-btn {
  color: rgba(0, 190, 86, 0.5);
  font-weight: 700;
  border-bottom: 2px solid rgba(0, 190, 86, 0.5);
  line-height: 1.2;
}
.underline-btn:hover, .underline-btn:focus {
  color: rgba(0, 190, 86, 0.5);
}

/*----------------------------------------
  Referral tree style
-----------------------------------------*/
.main-referral-tree-item {
  padding: 0 16px;
  position: relative;
}
@media (max-width: 575px) {
  .main-referral-tree-item {
    padding: 0 8px;
  }
}

.main-referral-tree-card-inner {
  position: relative;
}
.main-referral-tree-card-inner::before {
  position: absolute;
  content: "";
  height: 5px;
  width: 5px;
  background: rgba(173, 171, 168, 0.3);
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
  z-index: 5;
}

.main-referral-tree-card {
  padding: 15px 15px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -o-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  display: inline-flex;
  flex-direction: column;
  gap: 10px;
  background: rgba(86, 58, 239, 0.1);
  backdrop-filter: blur(4.69592px);
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -o-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  min-width: 240px;
}
.main-referral-tree-card::before {
  content: "";
  position: absolute;
  inset: 0;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -o-border-radius: 12px;
  -ms-border-radius: 12px;
  border-radius: 12px;
  padding: 1px;
  background: linear-gradient(139.9deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2) 100%);
  -webkit-mask: linear-gradient(var(--td-white) 0 0) content-box, linear-gradient(var(--td-white) 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: -1;
}
.main-referral-tree-card.tree-parent {
  background: #563AEF;
  min-width: max-content;
}
.main-referral-tree-card.tree-parent::before {
  display: none;
}
.main-referral-tree-card.tree-parent::after {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  background: rgba(173, 171, 168, 0.3);
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% - 3px);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  z-index: 5;
}
.main-referral-tree-card.tree-parent .content .title {
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}
.main-referral-tree-card .thumb {
  width: 44px;
  margin: 0 auto;
  height: 44px;
}
.main-referral-tree-card .thumb img {
  border-radius: 50%;
  width: 100%;
  height: 100%;
}
.main-referral-tree-card .content .title {
  font-size: 14px;
  margin-bottom: 0;
}
.main-referral-tree-card .content .info {
  font-size: 12px;
  font-weight: 500;
}

.main-referral-wrapper {
  max-width: max-content;
  margin: 0 auto;
  margin-top: 15px;
}
@media screen and (max-width: 2220px) {
  .main-referral-wrapper {
    overflow-x: scroll;
    margin-top: 10px;
  }
}

.main-referral-tree {
  min-width: 1000px;
  padding-bottom: 20px;
}
.main-referral-tree ul {
  padding-top: 20px;
  position: relative;
  transition: all 0.5s;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}
.main-referral-tree ul ul::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  border-left: 1px solid rgba(173, 171, 168, 0.3);
  width: 0;
  height: 20px;
}
.main-referral-tree li {
  float: left;
  text-align: center;
  list-style-type: none;
  position: relative;
  padding: 20px 5px 0 5px;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
}
.main-referral-tree li::after {
  right: auto;
  left: 50%;
  border-left: 1px solid rgba(173, 171, 168, 0.3);
}
.main-referral-tree li:only-child {
  padding-top: 0;
}
.main-referral-tree li:last-child::before {
  border-right: 1px solid rgba(173, 171, 168, 0.3);
  border-radius: 0 0px 0 0;
}
.main-referral-tree li:first-child::after {
  border-radius: 0px 0 0 0;
}

.main-referral-tree li::before,
.main-referral-tree li::after {
  content: "";
  position: absolute;
  top: 0;
  right: 50%;
  border-top: 1px solid rgba(173, 171, 168, 0.3);
  width: 50%;
  height: 20px;
}

.main-referral-tree li:only-child::after,
.main-referral-tree li:only-child::before {
  display: none;
}

.main-referral-tree li:first-child::before,
.main-referral-tree li:last-child::after {
  border: 0 none;
}

/*----------------------------------------
/* cookies style
/*----------------------------------------*/
.caches-privacy {
  position: fixed;
  bottom: 20px;
  inset-inline-start: 30px;
  width: 430px;
  border-radius: 8px;
  padding: 20px 20px;
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  z-index: 11;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.08);
}
@media (max-width:450px) {
  .caches-privacy {
    width: auto;
    padding: 20px;
    inset-inline-start: 15px;
    inset-inline-end: 15px;
  }
}
.caches-privacy .content {
  margin-bottom: 15px;
}
.caches-privacy .content .title {
  font-size: 20px;
  margin-bottom: 10px;
}
@media (max-width: 575px) {
  .caches-privacy .content .title {
    font-size: 18px;
  }
}
.caches-privacy .content p {
  font-size: 14px;
  margin-bottom: 0;
}
.caches-privacy .content p a {
  color: #563AEF;
}
.caches-privacy .caches-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.caches-privacy .caches-btn .learn-more {
  font-size: 15px;
  color: rgba(0, 0, 0, 0.7);
  font-weight: 500;
  text-decoration: underline;
}
.caches-privacy .caches-btn .learn-more:hover {
  color: #563AEF;
  text-decoration: none;
}
.caches-privacy .caches-btn .learn-more.btn-one:hover {
  color: #563AEF;
}
.caches-privacy .caches-btn .learn-more.btn-two:hover {
  color: #FC5D19;
}
.caches-privacy .caches-btn .shifter-btn {
  height: 40px;
}
.caches-privacy .caches-btn .shifter-btn .btn-hover-slide {
  padding: 0px 26px;
}

.cookies-btn {
  padding: 0.4375rem 1.375rem;
  border-radius: 30px;
  font-size: 14px;
  box-shadow: 0 0 1px 1px #563AEF inset;
  color: #563AEF;
  transition: 0.3s;
}
.cookies-btn:hover {
  color: #ffffff;
  background-color: #563AEF;
}
.cookies-btn.btn-one {
  box-shadow: 0 0 1px 1px #563AEF inset;
  color: #563AEF;
}
.cookies-btn.btn-one:hover {
  color: #ffffff;
  border-color: #563AEF;
  background-color: #563AEF;
}
.cookies-btn.btn-two {
  box-shadow: 0 0 1px 1px #FC5D19 inset;
  color: #FC5D19;
}
.cookies-btn.btn-two:hover {
  color: #ffffff;
  border-color: #FC5D19;
  background-color: #FC5D19;
}

.frontend-editor-data {
  background: rgba(255, 217, 27, 0.1411764706);
  padding: 14px;
  border-radius: 8px;
  margin-bottom: 30px;
}

.no-data-found {
  text-align: center;
  padding: 15px 0;
  font-size: 14px;
  font-weight: 500;
  color: rgba(110, 110, 115, 0.5215686275);
}
.no-data-found img {
  height: 60px;
  width: auto;
  margin-bottom: 10px;
}

/*# sourceMappingURL=styles.css.map */