.wf-active body {
  font-family: Poppins,system-ui,-apple-system,"Segoe UI","Roboto","Helvetica Neue","Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
}

#hitpaw-online-root {
  min-height: 100vh;
}

#hitpaw-online-root h1,
#hitpaw-online-root h2,
#hitpaw-online-root h3,
#hitpaw-online-root h4,
#hitpaw-online-root h5,
#hitpaw-online-root h6 {
  font-weight: 700 !important;
}

.section-3 {
  padding: 0;
}

.section-3 .item:not(:last-child) {
  margin-bottom: 64px;
}

.section-3 .item .lft {
  max-width: 734px;
}

.section-3 .item .lft p {
  font-size: 20px;
  color: #000000B2;
}

.section-3 .item .rgt {
  max-width: 630px;
  border-radius: 24px;
  padding: 7px;
  border: 2px solid #fff;
  background: linear-gradient(111.63deg, #FFF8FE 2.17%, #FFFFFF 100.78%);
  margin: 0;
}

.section-3 .item .rgt.video1 {
  box-shadow: 0px 8px 48px 0px #C29D4D6E;
}

.section-3 .item .rgt.video2 {
  box-shadow: 0px 8px 48px 0px rgba(97, 193, 129, 0.55);
}

.section-3 .item .rgt.video3 {
  box-shadow: 0px 8px 48px 0px rgba(140, 127, 238, 0.72);
}

.section-3 .item .rgt.video4 {
  box-shadow: 0px 8px 48px 0px rgba(217, 130, 178, 0.68);
}

.section-3 .item .rgt video {
  border-radius: 20px;
}

.section-3 .item-style2 .item {
  padding: 46px 22px 46px 64px;
  border-radius: 32px;
}

.section-3 .item-style2 .item .lft {
  max-width: 670px;
}

.section-3 .item-style2 .item.item1 {
  background: linear-gradient(270deg, #FFF7E3 46.68%, rgba(255, 250, 236, 0.08) 106.82%);
}

.section-3 .item-style2 .item.item1 h3 {
  color: #D78A17;
}

.section-3 .item-style2 .item.item2 {
  background: linear-gradient(270.98deg, #F4FFD2 0.65%, rgba(244, 255, 210, 0) 98.96%);
}

.section-3 .item-style2 .item.item2 h3 {
  color: #435705;
}

.section-3 .item-style2 .item.item3 {
  background: linear-gradient(270deg, #E0DCFF 0%, rgba(224, 220, 255, 0.08) 100%);
}

.section-3 .item-style2 .item.item3 h3 {
  color: #5244B5;
}

.section-3 .item-style2 .item.item4 {
  background: linear-gradient(270deg, #FFE3EF 0%, rgba(255, 227, 239, 0.08) 100%);
}

.section-3 .item-style2 .item.item4 h3 {
  color: #91335B;
}

.section-3 .item-style2 .item.item1 .lft h4,
.section-3 .item-style2 .item.item1 .lft p {
  color: #D78A17;
}

.section-3 .item-style2 .item.item2 .lft h4,
.section-3 .item-style2 .item.item2 .lft p {
  color: #435705;
}

.section-3 .item-style2 .item.item3 .lft h4,
.section-3 .item-style2 .item.item3 .lft p {
  color: #5244B5;
}

.section-3 .item-style2 .item.item4 .lft h4,
.section-3 .item-style2 .item.item4 .lft p {
  color: #91335B;
}

.section-3 .item-style3 .item {
  padding: 32px 32px 32px 64px;
  border-radius: 32px;
}

.section-3 .item-style3 .item .lft {
  max-width: none;
  width: 638px;
}

.section-3 .item-style3 .item.item1 {
  background: linear-gradient(270.98deg, #DDF3FF 11.78%, rgba(221, 243, 255, 0) 107.29%);
}

.section-3 .item-style3 .item.item2 {
  padding: 32px 64px 32px 32px;
  background: linear-gradient(90.98deg, rgba(255, 236, 206, 0) -7.1%, #FFECCE 99.35%);
}

.section-3 .item-style3 .item.item3 {
  background: linear-gradient(270deg, #FFE3E4 0%, rgba(255, 227, 228, 0.08) 100%);
}

.section-3 .item-style3 .item.item4 {
  padding: 32px 64px 32px 32px;
  background: linear-gradient(270deg, #E5FFB6 0%, rgba(229, 255, 182, 0.08) 100%);
}

.section-3 .item-style3 .item.item1 .lft h4,
.section-3 .item-style3 .item.item1 .lft p {
  color: #294E63;
}

.section-3 .item-style3 .item.item2 .lft h4,
.section-3 .item-style3 .item.item2 .lft p {
  color: #C17D11;
}

.section-3 .item-style3 .item.item3 .lft h4,
.section-3 .item-style3 .item.item3 .lft p {
  color: #932E32;
}

.section-3 .item-style3 .item.item4 .lft h4,
.section-3 .item-style3 .item.item4 .lft p {
  color: #576D2F;
}

@media (max-width: 1599.98px) {
  .section-3 .item:not(:last-child) {
    margin-bottom: 48px;
  }

  .section-3 .item .lft {
    max-width: 645px;
  }

  .section-3 .item .rgt {
    max-width: 539px;
  }

  .section-3 .item .lft p {
    font-size: 16px;
  }

  .section-3 .item-style2 .item {
    padding-left: 32px;
  }

  .section-3 .item-style2 .item .lft {
    max-width: 609px;
  }

  .section-3 .item-style3 .item {
    padding: 32px 24px 32px 48px;
  }

  .section-3 .item-style3 .item .lft {
    width: 573px;
  }

  .section-3 .item-style3 .item.item2,
  .section-3 .item-style3 .item.item4 {
    padding: 32px 48px 32px 24px;
  }
}

@media (max-width: 1279.98px) {
  .section-3 .item .lft {
    max-width: 500px;
  }

  .section-3 .item .rgt {
    max-width: 400px;
  }

  .section-3 .item-style2 .item .lft {
    max-width: 450px;
  }

  .section-3 .item-style2 .item {
    padding-top: 23px;
    padding-bottom: 23px;
  }
}

@media (max-width: 991.98px) {
  .section-3 .item:not(:last-child) {
    margin-bottom: 32px;
  }

  .section-3 .item .lft,
  .section-3 .item .rgt {
    max-width: 100%;
  }

  .section-3 .item .lft {
    text-align: center;
    margin-top: 24px;
  }

  .section-3 .item-style2 .item {
    padding-left: 22px;
    padding-bottom: 16px;
    border-radius: 16px;
  }

  .section-3 .item-style2 .item.item1 {
    background: linear-gradient(180deg, #FFF7E3 0%, rgba(255, 250, 236, 0.08) 100%);
  }

  .section-3 .item-style2 .item.item2 {
    background: linear-gradient(180.49deg, #F4FFD2 2.07%, rgba(244, 255, 210, 0) 99.6%);
  }

  .section-3 .item-style2 .item.item3 {
    background: linear-gradient(180deg, #E0DCFF 0%, rgba(224, 220, 255, 0.08) 100%);
  }

  .section-3 .item-style2 .item.item4 {
    background: linear-gradient(180deg, #FFE3EF 0%, rgba(255, 227, 239, 0.08) 100%);
  }

  .section-3 .item-style2 .item .lft {
    margin-top: 8px;
    padding: 0 8px;
  }

  .section-3 .item-style3 .item,
  .section-3 .item-style3 .item.item2,
  .section-3 .item-style3 .item.item4 {
    padding: 0;
    border-radius: 16px;
  }

  .section-3 .item-style3 .item.item1 {
    background: linear-gradient(180.49deg, #DDF3FF 12.01%, rgba(221, 243, 255, 0) 99.65%);
  }

  .section-3 .item-style3 .item.item2 {
    background: linear-gradient(0.49deg, rgba(255, 236, 206, 0) 0.52%, #FFECCE 99.68%);
  }

  .section-3 .item-style3 .item.item3 {
    background: linear-gradient(180deg, #FFE3E4 0%, rgba(255, 227, 228, 0.08) 100%);
  }

  .section-3 .item-style3 .item.item4 {
    background: linear-gradient(180deg, #E5FFB6 0%, rgba(229, 255, 182, 0.08) 100%);
  }

  .section-3 .item-style3 .item .lft {
    width: 100%;
    margin-top: 8px;
    margin-bottom: 16px;
    padding: 0 8px;
  }
}

@media (max-width: 767.98px) {
  .section-3 .item .lft p {
    font-size: 12px;
  }
}

#fun-gray-gif-sec {
  margin-bottom: 60px;
  padding: 100px 0 64px;
}

#fun-gray-gif-sec>div.color-bg {
  height: 65%;
  bottom: 0;
  left: 0;
  background: linear-gradient(0deg, #F8F8F8, #F8F8F8);
  z-index: -1
}

#fun-gray-gif-sec .gif-list {
  max-width: 1028px;
  margin-right: auto;
  margin-left: auto;
  overflow: hidden;
}

#fun-gray-gif-sec .gif-list .cell {
  width: 300px !important;
  opacity: 0.4;
}

#fun-gray-gif-sec .gif-list .cell.swiper-slide-active {
  opacity: 1;
}

#fun-gray-gif-sec .gif-list .cell .info {
  bottom: 0;
  left: 0;
  height: 90px;
  font-size: 24px;
  opacity: 0;
}

#fun-gray-gif-sec .gif-list .cell.swiper-slide-active .info {
  opacity: 1;
}

#fun-gray-gif-sec .gif-list .cell .info img {
  margin-top: -40px;
}

#fun-gray-gif-sec .swiper-button-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 0 0 0;
  gap: 100px;
}

#fun-gray-gif-sec .swiper-button-prev,
#fun-gray-gif-sec .swiper-button-next {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  margin: 0;
  background-color: var(--bs-primary);
  width: 56px;
  height: 56px;
  border-radius: 100px;
}

#fun-gray-gif-sec .swiper-button-prev::after,
#fun-gray-gif-sec .swiper-button-next::after {
  content: "";
  width: 24px;
  height: 24px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" stroke="%23fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m9 5l7 7l-7 7"></path></svg>') no-repeat center/contain;
}

#fun-gray-gif-sec .swiper-button-prev::after {
  transform: rotate(180deg);
}

@media (min-width: 992px) {
  .more-tools-list .swiper-wrapper {
    gap: 1.75rem;
    flex-wrap: wrap;
    justify-content: center;
  }
}

.more-tools-list .item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
}

@media (min-width: 992px) {
  .more-tools-list .item {
    gap: 1.75rem;
  }
}

.more-tools-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  color: #000;
  border-radius: 100px;
  background-color: #F9F8FF;
  padding: 12px 24px;
  width: 100%;
  font-size: 14px;
  transition: all 0.3s linear;
}

@media (min-width: 768px) {
  .more-tools-list a {
    width: 50%;
  }
}

@media (min-width: 992px) {
  .more-tools-list a {
    padding: 20px 24px;
    width: 30%;
    font-size: 18px;
  }
}

@media (min-width: 1600px) {
  .more-tools-list a {
    width: 28%;
    font-size: 20px;
  }
}

.more-tools-list a.bcolor-1 {
  background-color: #EFEDFF;
}

.more-tools-list a.bcolor-2 {
  background-color: rgba(255, 191, 89, 0.15);
}

.more-tools-list a.bcolor-3 {
  background-color: #D9F9FF;
}

.more-tools-list a.bcolor-4 {
  background-color: #E6FFD2;
}

.more-tools-list a.bcolor-5 {
  background-color: #E9EEFF;
}

.more-tools-list a.bcolor-6 {
  background-color: #FFFDD8;
}

.more-tools-list a.bcolor-7 {
  background-color: #FFEFEF;
}

.more-tools-list a.bcolor-8 {
  background-color: #FFE9FE;
}

.more-tools-list a span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.more-tools-list a:hover:not(.disabled) {
  text-decoration: none;
  color: var(--bs-primary);
  transform: scale(1.08);
}

.more-tools-list a.disabled:hover {
  text-decoration: none;
  cursor: default;
}