@import url("../../../pro.fontawesome.com/releases/v6.0.0-beta1/css/all.css");

.box-item {
  position: relative;
  -webkit-backface-visibility: hidden;
  width: 100%;
  margin-bottom: 35px;
  max-width: 100%;
}

.flip-box {
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  perspective: 1000px;
  -webkit-perspective: 1000px;
  cursor: pointer;
}

.flip-box-front,
.flip-box-back {
  background-size: cover;
  background-position: center;
  border-radius: 20px;
  min-height: 250px;
  -ms-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -webkit-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-front {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-front {
  -ms-transform: rotateY(-180deg);
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;

  -ms-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-back {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box .inner {
  position: absolute;
  left: 0;
  width: 100%;
  padding: 10px;
  outline: 1px solid transparent;
  -webkit-perspective: inherit;
  perspective: inherit;
  z-index: 2;
  text-align: center;
  transform: translateY(-50%) translateZ(60px) scale(0.94);
  -webkit-transform: translateY(-50%) translateZ(60px) scale(0.94);
  -ms-transform: translateY(-50%) translateZ(60px) scale(0.94);
  top: 50%;
}
.flip-box .inner img {
  width: 100px;
  margin: auto;
  filter: drop-shadow(0px 10px 6px #00000060);
}
.flip-box .inner h3 {
  color: #fff;
}
.flip-box .inner h4 {
  color: #fff;
  font-size: 14px;
}
.flip-box-header {
  font-size: 34px;
}

.flip-box-back .inner h4 {
  margin-bottom: 15px;
  font-size: 20px;
}
.flip-box p {
  color: #fff;
}

.flip-box-img {
  margin-top: 25px;
}

.flip-box-button {
  background-color: transparent;
  border: 2px solid #fff;
  border-radius: 2px;
  color: #fff;
  cursor: pointer;
  font-size: 20px;
  font-weight: bold;
  margin-top: 25px;
  padding: 15px 20px;
  text-transform: uppercase;
}

.broker-ratting-box {
  min-width: 300px;
}
.broker-ratting-box h2 {
  font-size: 55px;
}
.broker-ratting-box p {
  font-weight: 600;
  font-size: 18px;
}
.nav-item .dropdown-menu li a .icon {
  width: 25px;
  margin-right: 8px;
}
.hero-version5 .hero-version5-items .hero-content5 {
  padding-left: 10px;
}
.plan-tab .table {
  text-align: center;
  border: 1px solid #020850;
}
.plan-tab .table th {
  vertical-align: middle;
  background-color: #020850;
  border-right: 1px solid #dcc27e;
}
.plan-tab .table th h4 {
  color: #dcc27e;
}
.plan-tab .table th:first-child {
  background: transparent;
  border: 1px solid #020850;
}
.plan-tab .table th:last-child {
  border-right: 0px;
}
.plan-tab .table th:first-child h4 {
  color: #020850;
}
.plan-tab .table tbody td:first-child {
  font-weight: 700;
}
.plan-tab .table tbody td {
  border-right: 1px solid #020850;
  padding: 20px 5px;
}
.plan-tab .table tbody tr:nth-child(even) {
  background: #dcc27e;
}
.hero-version3.islamic::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/islamic-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.demo::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/demo-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.ecn::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/ecn-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.premium::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/premium-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.security::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/securityfund-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.deposit::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/depositimg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.nbp::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/np-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.margin::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/margin-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.nbp::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/np-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.multi::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/multiplat-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.aboutus::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/about-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.cont::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/contact-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.achieve::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/achievement-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.product::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/product-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.career::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/career-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}

.hero-version3.partner::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/partner-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.bonus::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/bonus-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.calendar::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/calendar-bg.jpg) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.global::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/global-bg.png) no-repeat center center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.hero-version3.regulation::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/regulation-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.social-bg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/social-media-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.standard-bg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/standard-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.swapfree-bg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/swapfree-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.milestone::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/milestone-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.blog-bg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none;
    background: url(../img/blog-bg.jpg) no-repeat center center;
    background-size: cover;
    opacity: 1;
    z-index: -1;
}
.hero-version3.exclusive {
  padding: 50px;
}
.hero-version3.exclusive .section__content {
  padding-bottom: 10px;
}
.hero-version3.exclusive::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: none;
  background: url(../img/exclusive-bg.jpg) no-repeat center;
  background-size: cover;
  opacity: 1;
  z-index: -1;
}
.wb-1{
  background: url(../img/wb1.jpg) no-repeat center;
  background-size: cover;
}
.wb-2{
  background: url(../img/wb2.jpg) no-repeat center;
  background-size: cover;
}
.blue1{
  background: url(../img/blue-bg.jpg) no-repeat top!important;
  background-size: cover;
}
.img-mob{
  position: relative;
  z-index: 0;
}
.box-img{
  position:relative;
}
.box-img .img-main{
  position: relative;
}
.box-img .arrow{
      position: absolute;
    left: 0;
    bottom: 0;
    width: 150px;
    animation:floatd 3s infinite;
}
.box-img .coin{
      position: absolute;
    right: 0;
    top: 0;
    width: 150px;
    animation:floatZoom 3s infinite;
}
.float{
  animation:float 3s infinite;
}
@keyframes float {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(0, -15px); }
  100% { transform: translate(0, 0); }
}
@keyframes floatd {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(10px, -10px); }
  100% { transform: translate(0, 0); }
}
@keyframes floatZoom {
  0%   { transform: translateY(0) scale(1); }
  50%  { transform: translateY(-10px) scale(1.1); }
  100% { transform: translateY(0) scale(1); }
}
.img-mob .mob1{
  width: 250px;
  transition: .3s ease;
}
.img-mob .mob2{
 position: absolute;
    width: 250px;
    left: 50%;
    transform: translateX(-50%);
    top: 10%;
    z-index: -1;
    transition: .3s ease;
}
.img-mob:hover .mob2{
    top:0;
}
.img-mob:hover .mob1{
    scale:1.1;
}
.travel-bg {
  background: url(../img/exl-img.jpg) no-repeat;
  background-size: cover;
}
.city .card {
  padding: 15px;
  box-shadow: 0px 6px 12px 0px rgb(0 0 0 / 27%);
  border: 1px solid #a27932;
  margin-bottom: 50px;
  min-height: 750px !important;
}
.travel-bg .section__header p {
  font-size: 18px;
}
.section__content h4 {
  color: #dcc27e;
}
.color1 {
  color: #a27932;
}
.color2 {
  color: #dcc27e;
}
.cmn-bg4 .section__header-sub-title{
  color: #dcc27e;
}
.cmn-bg4 p{
  color: #fff;
}
.plan-tab .btn_theme_active:hover,
.btn_theme_active:focus {
  color: #dcc27e;
}
.feature-section .card .card__title a {
  font-size: 20px;
}
.headingFive b {
  color: #a27932;
}
.featstyle2 {
  padding-bottom: 70px;
  padding-top:70px;
}
.featstyle2 .card {
  padding: 10px;
}
.featstyle2 .card .card__title {
  font-size: 18px;
  margin-bottom: 0;
  margin-left: 10px;
}

.featstyle2 .card .icon img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  transition: 0.3s ease;
}
.featstyle2 .card:hover .icon img {
  filter: invert(1);
}
.featstyle2 .card:hover .card__title {
  color: #dcc27e;
}
.fundsec .section__content {
  padding: 30px 20px;
  background: #fff;
  box-shadow: -10px 7px 16px #00000047;
  margin-bottom: 50px;
  border-radius: 30px 10px;
  min-height: 460px;
  border: 1px solid #dcc27e;
  transition: 0.3s ease;
  cursor: pointer;
}
.fundsec .section__content-list02 {
  border-radius: 20px;
  padding: 15px;
  background: #faf9f8;
  /* box-shadow: 8px 14px 20px 2px #00000024; */
  border: 1px solid #a27932;
}
.fundsec .section__content-list02 b {
  font-size: 20px;
  color: #020850;
}
.fundsec .section__content-list02 img {
  filter: invert(0.5) sepia(1) saturate(20) hue-rotate(16deg) brightness(0.7);
}
.fundsec .section__content:hover {
  background: radial-gradient(#1d29bf, #020850);
  scale: 1.02;
}
.fundsec .section__content:hover .section__content-text {
  color: #fff;
}
.fundsec .section__content:hover .section__content-title {
  color: #dcc27e;
}
.fundsec .section__content:hover .btn_theme_active::after {
  background-color: #dcc27e;
}
.flip-box:hover .flip-box-front{
  background: linear-gradient(#020850,#DCC27E ) !important;
  box-shadow: 0 5px 5px #00000046;
}
.reward-page {
  margin-top: 60px;
  padding: 15px;
  border-radius: 40px;
  background-color: #020850;
  border: 1px solid #dcc27e;
}
.about5-thumb-inner .thumb2{
  transition: .3s ease;
}
.about5-thumb-inner:hover .thumb2{
      bottom: 55px;
}
.reward-page ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.reward-page .btn_theme {
  font-size: 20px;
  color: #020850;
}
.reward-page .btn_theme img {
  width: 45px;
}
.cal-box {
  padding: 30px 25px;
  background: #0026d140;
  margin-top: 30px;
  border: 2px solid #dcc27e;
  border-radius: 20px;
}
.cal-box p:first-child {
  margin-top: 0;
  margin-bottom: 20px;
}
.cal-sec .note {
  color: #fff;
}
.cal-box p {
  font-size: 25px;
  color: #fff;
  margin-top: 20px;
}
.cal-box .rang-slid {
  width: 100%;
}
.cal-box .rang-slid::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px; /* 1 */
  height: 40px;
  background: #fff;
  box-shadow: -200px 0 0 200px red; /* 2 */
  border: 2px solid #999; /* 1 */
}

.cal-box .rang-slid[type="range"] {
  margin: auto;
  -webkit-appearance: none;
  position: relative;
  overflow: hidden;
  height: 15px;
  width: 100%;
  cursor: pointer;
  border-radius: 0; /* iOS */
}
.cal-box #referrals {
  font-weight: 700;
  color: #dcc27e;
}
.cal-box p #earnings {
  font-size: 50px;
  font-weight: 500;
  color: #dcc27f;
}
.cal-box .rang-slid::-webkit-slider-runnable-track {
  background: #ddd;
}

.pack {
  transition: 0.3s ease;
  cursor: pointer;
}
.pack:hover {
  transform: translateY(-10px);
  box-shadow: 0 5px 15px #00000050;
}
.pack:hover .thumb img {
  transform: scale(1.2);
}
.pack .thumb img {
  transition: 0.3s ease;
}
.pack .broker-ratting-box {
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.pack .broker-ratting-box::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--bs-border-radius-xl);
  transform: scale(0);
  height: 100%;
  width: 100%;
  background: linear-gradient(180deg, #aa8933, #dcc27f, #aa8933);
  z-index: -1;
  transition: 0.3s ease;
}
.pack:hover .broker-ratting-box::before{
  transform: scale(1);
}
/* .pack:hover .broker-ratting-box {
  background: linear-gradient(180deg, #aa8933, #dcc27f, #aa8933);
} */

/*
 * 1. Set to 0 width and remove border for a slider without a thumb
 * 2. Shadow is negative the full width of the input and has a spread 
 *    of the width of the input.
 */
.cal-box .rang-slid::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px; /* 1 */
  height: 40px;
  background: #fff;
  box-shadow: -400px 0 0 400px #dcc27e; /* 2 */
  border: 2px solid #999; /* 1 */
}

.cal-box .rang-slid::-moz-range-track {
  height: 40px;
  background: #ddd;
}

.cal-box .rang-slid::-moz-range-thumb {
  background: #fff;
  height: 40px;
  width: 20px; /* 1 */
  border: 3px solid #999; /* 1 */
  border-radius: 0 !important;
  box-shadow: -400px 0 0 400px #dcc27e;
  box-sizing: border-box;
}

.cal-box .rang-slid::-ms-fill-lower {
  background: #dcc27e;
}

.cal-box .rang-slid::-ms-thumb {
  background: #fff;
  border: 2px solid #999; /* 1 */
  height: 40px;
  width: 20px; /* 1 */
  box-sizing: border-box;
}

.cal-box .rang-slid::-ms-ticks-after {
  display: none;
}

.cal-box .rang-slid::-ms-ticks-before {
  display: none;
}

.cal-box .rang-slid::-ms-track {
  background: #ddd;
  color: transparent;
  height: 40px;
  border: none;
}

.cal-box .rang-slid::-ms-tooltip {
  display: none;
}
.chat {
  padding: 25px;
  border: 1px solid #a27932;
  border-radius: 12px;
  background: linear-gradient(45deg, #a27932, #dcc27e, #b49442);
}
.chat .user {
  width: 60%;
  padding: 14px;
  border-radius: 20px 20px 0 20px;
  background: #fff;
  box-shadow: -13px 9px 12px #00000050;
}
.chat .support {
  width: 60%;
  text-align: right;
  margin-left: auto;
  padding: 14px;
  border-radius: 20px 20px 20px 0;
  background: #020850;
  box-shadow: -13px 9px 12px #00000050;
  color: #fff;
}
.cta {
  padding: 40px 20px;
  border-radius: 20px;
  margin-bottom: 100px;
  background: linear-gradient(179deg, #aa8933, #dcc27f, #aa8933);
  position: relative;
}
.cta p {
  font-size: 30px;
  text-align: center;
  margin-bottom: 25px;
}
.cta img {
  filter: drop-shadow(-9px 4px 6px #00000060);
  position: absolute;
  width: 400px;
  right: 0;
  bottom: -80px;
}
.legacy-box {
  background: url(../img/legacy-bg.jpg) no-repeat center;
  background-size: cover;
  padding: 50px 20px;
  border-radius: 20px;
}
.attain-card .card__title {
  font-size: 18px;
}
.attain-card:hover .card__title {
  color: #dcc27e;
}
.attain-card .icon {
  width: 80px;
}
.join .accordion-button {
  font-size: 25px;
}
.join .accordion-body p {
  font-size: 18px !important;
}
.platform {
  transition: 0.3s ease;
}
.platform:hover {
  scale: 1.05;
}
.footer-top {
  padding-bottom: 30px;
}
footer .disclaim {
  padding-bottom: 30px;
}
footer .disclaim p {
  margin-bottom: 10px;
  color: #ffffffd0;
}
footer .disclaim p b {
  color: #dcc27e;
}
.d-grid li a:hover {
  color: #dcc27e !important;
}
@media (max-width: 1024px) {
  .broker-ratting-box {
    min-width: 250px;
  }
  .hero-version3.exclusive .section__content {
    padding-top: 50px;
  }
}
.plat-sec-feat .card {
  --grad: #dcc27e, #aa8933;
  padding: 2.5rem;
  background-image: linear-gradient(to bottom left, #edeef1, #f3f4f7);
  border-radius: 2rem;
  gap: 1.5rem;
  display: grid;
  min-height: 280px;
  grid-template: "title icon" "content content" "bar bar" / 1fr auto;
  font-family: system-ui, sans-serif;
  color: #444447;
  box-shadow: inset -2px 2px hsl(0 0 100% / 1),
    -20px 20px 40px hsl(0 0 0 / 0.25);
  border: 1px solid #a2793200;

  .title {
    font-size: 1.5rem;
    grid-area: title;
    align-self: end;
    text-transform: uppercase;
    font-weight: 500;
    word-break: break-all;
  }
  .icon {
    grid-area: icon;
    font-size: 3rem;
    transition: 0.3s ease;

    > i {
      color: transparent;
      background: linear-gradient(to right, var(--grad));
      background-clip: text;
    }
  }
  .content {
    grid-area: content;
    & > *:first-child {
      margin-top: 0rem;
    }
    & > *:last-child {
      margin-bottom: 0rem;
    }
  }
  &::after {
    content: "";
    grid-area: bar;
    height: 2px;
    background-image: linear-gradient(90deg, var(--grad));
    /*     margin-inline: -1.5rem; */
  }
}
.plat-sec-feat .card:hover {
  border: 1px solid #a27932;
}
.plat-sec-feat .card:hover .icon {
  scale: 1.5;
}
.product-card {
  background: linear-gradient(#dcc27e, #aa8933);
  border-radius: 20px;
  border: 1px solid transparent;
  transition: 0.3s ease;
}
.product-card .icon {
  width: 60px;
}
.product-card h4 {
  font-size: 18px;
  text-align: center;
}
.product-card:hover {
  background: #fff;
  border: 1px solid #a27932;
}
.cmn-bg4 {
  background: url(../img/cmn-bg-4.jpg) no-repeat center;
  background-size: cover;
}
.reward-card {
  background: url(../img/reward-card.jpg) no-repeat center;
  background-size: cover;
  padding: 50px 25px;
  border-radius: 50px;
  margin-bottom: 25px;
  border: 5px solid #dcc27e;
}
.reward-card.bg2 {
  background: url(../img/reward-card-bg2.png) no-repeat center;
  background-size: cover;
}

.reward-card h2 {
  margin-bottom: 15px;
}
.reward-card h4{
      background: linear-gradient(179deg, #aa8933, #DCC27F, #aa8933);
    text-align: center;
    padding: 10px 20px;
    width: fit-content;
    border-radius: 10px;
}
.reward-card img {
  transition: 0.3s ease;
}
.reward-card:hover img {
  scale: 1.15;
}

.all_page_bg {
    background-image: url('../img/pagebg2.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.live-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px;
    background: #ff1a1a;
    color: #fff;
    font-size: 8px;
    font-weight: 600;
    border-radius: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: 0 0 8px rgba(255, 0, 0, 0.6);
    animation: pulseGlow 1.5s infinite ease-in-out;
}

.live-dot {
    width: 6px;
    height: 6px;
    background: #fff;
    border-radius: 50%;
    animation: blink 0.8s infinite alternate;
}

/* blinking dot */
@keyframes blink {
    0% {
        opacity: 0.2;
        transform: scale(0.9);
    }

    100% {
        opacity: 1;
        transform: scale(1.15);
    }
}

/* glowing badge */
@keyframes pulseGlow {
    0% {
        box-shadow: 0 0 6px rgba(255, 0, 0, 0.5);
    }

    100% {
        box-shadow: 0 0 14px rgba(255, 0, 0, 0.9);
    }
}