/* bt_macheteverse - THE stylesheet. Built from the legacy bucket style.css and
   every inline <style> block the legacy views carried; nothing is loaded from the
   bucket any more. Per-portal colours live in colors_settings.php, not here. */

/* ============================================================
   theme_assets/macheteverse/css/style.css (was served from the bucket)
   ============================================================ */
/*!--------------------
Template Name: Influtics - Social Influencer Portfolio & Video Sharing HTML Template
Author: tempticspro
Version: 1.0

CSS INDEX
=================== 
01. CUSTOM PROPERTIES
02. GLOBAL
03. Components
04. CSS Animation
05. Header
06. Hero
07. Social Links
08. Reels
09. Services
10. Intro
11. Live
12. Videos
13. Contact
14. Article
15. Footer

--- INNER PAGES

16. About Page
17. Service Page
18. Service Details Page
19. Videos Page
20. Video Details Page
21. Video Shop Page
22. Video Shop Details Page
23. Login Page
24. Checkout Page
25. Blogs Page
26. Pricing Page
27. Contact Page
28. Blog Details Page

*/
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
:root {
  --ttRed: #FF0000;
  --ttLightRed: #F2EEEA;
  --ttGray: #B5B5B5;
  --ttGray2: #808080;
  --black: #000;
  --white: #fff;
  --tt-pink: #F820A3;
  --tt-gold: #FFA945;
  --tt-gradient-1: linear-gradient(90deg, var(--tt-pink) 0%, var(--tt-gold) 100%);
  --font-inter: "Inter", sans-serif;
  --plyr-color-main: var(--ttRed);
}

html {
  overflow-x: hidden;
}

body {
  font-family: var(--font-inter);
  margin: auto;
}

ul {
  list-style: none inside;
  padding: 0;
  margin: 0;
}

a,
button,
img,
svg path {
  transition: 0.4s ease;
}

a {
  text-decoration: none;
  vertical-align: top;
}

button {
  background-color: transparent;
  border: none;
}

img {
  max-width: 100%;
}

i {
  line-height: 1;
}

p {
  line-height: 1.75;
}

[data-sal] {
  transition-duration: 1s;
  transition-delay: 0.2s;
}

@media screen and (max-width: 479px) {
  .col-xxs-12 {
    width: 100%;
  }
}
@media (min-width: 1400px) {
  .container {
    max-width: 1434px;
  }
}

@media screen and (max-width: 575px) {
  .row-cols-xs-1 > * {
    width: 100%;
  }
}

@media screen and (max-width: 479px) {
  .row-cols-xxs-1 > * {
    width: 100%;
  }
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

input[type=radio]:checked + span::after {
  opacity: 1;
}

input {
  outline: none;
  border: none;
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s ease;
}
.preloader .loader {
  width: 150px;
  aspect-ratio: 1.154;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  display: grid;
  background: conic-gradient(from 0deg at 50% 60%, #0219A6 120deg, rgba(0, 0, 0, 0) 0), conic-gradient(from 120deg at 50% 60%, #0219A6 120deg, rgba(0, 0, 0, 0) 0), conic-gradient(from 240deg at 50% 60%, #0219A6 120deg, rgba(0, 0, 0, 0) 0), conic-gradient(from 0deg at 50% 60%, #E5002A 120deg, rgba(0, 0, 0, 0) 0), conic-gradient(from 120deg at 50% 60%, #E5002A 120deg, rgba(0, 0, 0, 0) 0), conic-gradient(from 240deg at 50% 60%, #E5002A 120deg, rgba(0, 0, 0, 0) 0), #0219A6;
  background-size: 200% 200%;
  background-repeat: no-repeat;
  animation: l8 1.5s infinite;
}
@keyframes l8 {
  0% {
    background-position: left, top, right;
  }
  30%, 50% {
    background-position: left, top, right, center, center, center;
  }
  80%, 100% {
    background-position: center;
  }
}

.tt-container {
  display: flex;
}
.tt-container__left {
  width: 300px;
  height: 100vh;
  position: sticky;
  top: 0;
  flex-shrink: 0;
}
@media screen and (max-width: 1199px) {
  .tt-container__left {
    width: 270px;
  }
}
.tt-container__right {
  width: calc(100% - 300px);
  padding: 30px;
  flex-grow: 1;
  overflow: hidden;
}
@media screen and (max-width: 1199px) {
  .tt-container__right {
    padding: 20px;
  }
}

.tt-section-heading {
  color: var(--ttRed);
  margin-bottom: 22px;
}
.tt-section-heading__btn {
  background: rgba(255, 0, 0, 0.1);
  border-radius: 99px;
  padding: 0 10px;
  height: 30px;
  display: flex;
  align-items: center;
  font-size: 15px;
  color: var(--ttRed);
  flex-shrink: 0;
}
.tt-section-heading__btn:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.tt-section-title {
  color: var(--black);
  font-weight: 700;
  font-size: 15px;
}

.sa-single-accordion-item {
  transition: 0.4s ease;
}

.sa-single-accordion-item.open .sa-single-accordion-item__header i {
  transform: rotate(90deg);
}
.sa-single-accordion-item.open .sa-single-accordion-item__body {
  grid-template-rows: 1fr;
  padding-top: 9px;
}

.sa-single-accordion-item__header i {
  transition: transform 0.4s ease;
  display: inline-block;
  color: #000;
}

.sa-single-accordion-item__title {
  color: #000;
}

.sa-single-accordion-item__body {
  transition: all 0.4s ease;
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
}

.sa-single-accordion-item__body > * {
  overflow: hidden;
}

.tt-slider-nav {
  background-color: var(--white);
  border-radius: 999px;
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: absolute;
  z-index: 1;
  top: 44%;
  transform: translateY(-50%);
  right: 0;
  color: var(--ttRed);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}
.tt-slider-nav:hover {
  background-color: rgb(255, 0, 0);
  color: var(--white);
}

.tt-inner-page-banner {
  border-radius: 20px;
  position: relative;
  z-index: 1;
  background: no-repeat center center;
  background-size: cover;
  color: var(--white);
  padding: clamp(60px, 10.73vw, 206px) 15px;
  text-align: center;
  overflow: hidden;
}
.tt-inner-page-banner::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.7);
}
.tt-inner-page-title {
  font-weight: 700;
  font-size: 36px;
  margin-bottom: 0;
}
@media screen and (max-width: 479px) {
  .tt-inner-page-title {
    font-size: 30px;
  }
}
.tt-inner-page-inner-title {
  font-weight: 700;
  font-size: 24px;
  margin-bottom: 15px;
  margin-top: 50px;
}
@media screen and (max-width: 575px) {
  .tt-inner-page-inner-title {
    margin-top: 30px;
  }
}

.jo-container {
  margin: 0 13.281vw;
}
@media screen and (max-width: 1599px) {
  .jo-container {
    margin: 0 10.281vw;
  }
}
@media screen and (max-width: 1399px) {
  .jo-container {
    margin: 0 7.281vw;
  }
}
@media screen and (max-width: 1199px) {
  .jo-container {
    margin: 0 3.281vw;
  }
}
@media screen and (max-width: 991px) {
  .jo-container {
    margin: 0 15px;
  }
}

.jo-sidebar {
  position: fixed;
  z-index: 10;
  right: 0;
  height: 100%;
  overflow: auto;
  background: #fff;
  z-index: 999;
  transform: translateX(100%);
  transition: 0.4s ease;
  padding: 40px 15px;
  padding-top: 15px;
  max-width: 100%;
  border-left: 1px solid var(--ttRed);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (max-width: 479px) {
  .jo-sidebar {
    padding: 30px 15px;
    padding-top: 15px;
  }
}
.jo-sidebar.active {
  transform: translateX(0);
}
.jo-sidebar__heading {
  gap: 30px;
  padding-bottom: 15px;
}
.jo-sidebar .logo {
  max-width: 65%;
}
.jo-sidebar-close-btn {
  transform: rotate(45deg);
}
.jo-sidebar .jo-header-nav-in-mobile nav {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.jo-sidebar .jo-header-nav-in-mobile nav a {
  color: var(--black);
  padding: 12px 15px;
}
.jo-sidebar .jo-header-nav-in-mobile nav a:hover {
  color: var(--tt-pink);
}
.jo-sidebar .jo-header-nav-in-mobile nav .has-sub-menu.active > a {
  color: var(--tt-pink);
}
.jo-sidebar .jo-header-nav-in-mobile nav .has-sub-menu .jo-header-submenu li {
  border: none;
  padding-bottom: 6px;
}
.jo-sidebar .jo-header-nav-in-mobile nav .has-sub-menu .jo-header-submenu a {
  padding: 0 15px;
}
@media screen and (max-width: 991px) {
  .jo-sidebar .jo-header-nav-in-mobile nav > * {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
  }
  .jo-sidebar .jo-header-nav-in-mobile nav > *:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  }
}
.jo-sidebar-socials.tt-footer-top__socials {
  margin-top: 15px;
  justify-content: flex-start;
  gap: 10px;
}
.jo-sidebar-socials.tt-footer-top__socials a {
  border-color: rgba(0, 0, 0, 0.2);
  color: var(--ttRed);
  width: 35px;
  font-size: 18px;
}
.jo-sidebar .jo-btn {
  width: 100%;
  margin-top: 15px;
}
.jo-sidebar .jo-btn i {
  font-size: 10px;
  padding-right: 5px;
}

.jo-header-nav-in-mobile {
  margin: 0 -15px;
}
@media screen and (max-width: 479px) {
  .jo-header-nav-in-mobile {
    margin: 0 -15px;
  }
}

.jo-section-title {
  font-weight: 700;
  font-size: clamp(26px, 2.08vw, 40px);
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: var(--black);
}

.jo-btn {
  background: var(--tt-gradient-1);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  height: 42px;
  gap: 3px;
  border-radius: 6px;
  color: var(--white);
  position: relative;
  z-index: 1;
}
.jo-btn::before {
  position: absolute;
  content: "";
  inset: 0;
  border-radius: 6px;
  z-index: -1;
  background: linear-gradient(90deg, var(--tt-gold) 0%, var(--tt-pink) 100%);
  transition: 0.4s ease;
}
.jo-btn:hover {
  color: var(--white);
}
.jo-btn:hover::before {
  opacity: 0;
}

.jo-breadcrumb {
  padding: 14.323vw 0 11.458vw;
  background: url(../img/breadcrumb-bg.jpg) no-repeat center center;
  background-size: cover;
  text-align: center;
  position: relative;
  z-index: 1;
  color: var(--white);
  overflow: hidden;
}
@media screen and (max-width: 1199px) {
  .jo-breadcrumb {
    padding: 140px 0 100px;
  }
}
@media screen and (max-width: 479px) {
  .jo-breadcrumb {
    padding: 130px 0 80px;
  }
}
.jo-breadcrumb::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--tt-pink), var(--tt-gold));
  z-index: -1;
  opacity: 80%;
}
.jo-breadcrumb-nav {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
.jo-breadcrumb-nav a {
  color: var(--white);
}
.jo-breadcrumb-nav a:hover {
  color: var(--black);
}

.jo-page-title {
  color: var(--white);
  margin-bottom: 3px;
}

.jo-radio label {
  position: relative;
  display: inline-block;
}
.jo-radio label > span {
  padding-left: 30px;
  display: inline-block;
}
.jo-radio label > span::before, .jo-radio label > span::after {
  content: "";
  position: absolute;
  width: 20px;
  aspect-ratio: 1/1;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.jo-radio label > span::after {
  width: 8px;
  aspect-ratio: 1/1;
  background-color: var(--ttRed);
  border: none;
  left: 6px;
  opacity: 0;
}
.jo-radio input[type=radio]:checked + span::after {
  opacity: 1;
}

.jo-select-wrapper {
  height: 100%;
}
.jo-tab {
  transition: 0.2s ease;
  pointer-events: none;
  display: none;
}
.jo-tab.active {
  display: block;
  pointer-events: all;
}

.tt-channel-content-pagination > button {
  color: var(--ttRed);
  height: 20px;
}
.tt-channel-content-pagination .pages {
  display: flex;
  gap: 11px;
  overflow: auto;
}
.tt-channel-content-pagination .pages a {
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  background-color: rgba(158, 158, 158, 0.102);
  font-weight: 700;
  font-size: 16px;
  color: var(--black);
  border-radius: 50%;
  flex-shrink: 0;
}
@media screen and (max-width: 479px) {
  .tt-channel-content-pagination .pages a {
    width: 32px;
  }
}
.tt-channel-content-pagination .pages a:hover, .tt-channel-content-pagination .pages a.active {
  background-color: var(--ttRed);
  color: var(--white);
}

.jo-inner-faq {
  padding: 4.583vw 0 5.208vw;
}
@media screen and (max-width: 991px) {
  .jo-inner-faq {
    padding: 38px 0 50px;
  }
}

.tt-accordion {
  margin: 2.448vw 12.5vw 0;
}
@media screen and (max-width: 1199px) {
  .tt-accordion {
    margin: 25px 12.5vw 0;
  }
}
@media screen and (max-width: 991px) {
  .tt-accordion {
    margin: 25px 15px 0;
  }
}
@media screen and (max-width: 479px) {
  .tt-accordion {
    margin: 25px 0 0;
  }
}
.tt-accordion .sa-single-accordion-item {
  padding: 30px 20px;
  border-radius: 10px;
  background-color: #f4f4f4;
}
.tt-accordion .sa-single-accordion-item:not(:last-child) {
  margin-bottom: 20px;
}
.tt-accordion .sa-single-accordion-item__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tt-accordion .sa-single-accordion-item__header .left {
  display: flex;
  gap: 20px;
  align-items: center;
}
.tt-accordion .sa-single-accordion-item__header .left > * {
  margin-bottom: 0;
}
.tt-accordion .sa-single-accordion-item__header .left h5 {
  font-weight: bold;
  font-size: 20px;
}
@media screen and (max-width: 991px) {
  .tt-accordion .sa-single-accordion-item__header .left h5 {
    font-size: 18px;
  }
}
.tt-accordion .sa-single-accordion-item__header .left .order-num {
  color: var(--ttRed);
}
.tt-accordion .sa-single-accordion-item__title {
  margin-bottom: 0;
  transition: 0.4s ease;
}
.tt-accordion .sa-single-accordion-item__body {
  padding-left: 40px;
}
.tt-accordion .sa-single-accordion-item__body p {
  margin-bottom: 0;
  color: var(--white);
  font-weight: 600;
}
.tt-accordion .sa-single-accordion-item.open {
  background-color: var(--ttRed);
  color: var(--white);
}
.tt-accordion .sa-single-accordion-item.open .sa-single-accordion-item__header .order-num {
  color: var(--white);
}
.tt-accordion .sa-single-accordion-item.open .sa-single-accordion-item__title {
  color: var(--white);
}
.tt-accordion .sa-single-accordion-item.open .sa-single-accordion-item__header i {
  color: var(--white);
}
.tt-accordion .sa-single-accordion-item.open .sa-single-accordion-item__body {
  padding-top: 20px;
}

.jo-circle-box > * {
  position: absolute;
  width: 50px;
  height: 50px;
  opacity: 50%;
  transform-origin: left;
}
.jo-circle-box .circle-1 {
  left: 10%;
  top: 30%;
  animation: services-triangle 6s linear infinite alternate;
}
.jo-circle-box .circle-2 {
  left: 30%;
  top: 65%;
  animation: services-triangle 8s linear infinite alternate;
}
.jo-circle-box .circle-3 {
  left: 70%;
  top: 70%;
  animation: services-triangle 10s linear infinite alternate;
}
.jo-circle-box .circle-4 {
  left: 90%;
  top: 32%;
  animation: services-triangle 9s linear infinite alternate;
}

@keyframes services-triangle {
  0% {
    -webkit-transform: rotate(0deg) translateX(-50px);
    -moz-transform: rotate(0deg) translateX(-50px);
    -ms-transform: rotate(0deg) translateX(-50px);
    transform: rotate(0deg) translateX(-50px);
  }
  100% {
    -webkit-transform: rotate(360deg) translateY(100px);
    -moz-transform: rotate(360deg) translateY(100px);
    -ms-transform: rotate(360deg) translateY(100px);
    transform: rotate(360deg) translateY(100px);
  }
}
.tt-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 60px;
  margin-bottom: 30px;
}
@media screen and (max-width: 1199px) {
  .tt-header {
    gap: 20px;
  }
}
@media screen and (max-width: 575px) {
  .tt-header {
    margin-bottom: 20px;
  }
}
.tt-header button {
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.tt-header button i {
  font-size: 16px;
}
.tt-header button:hover {
  color: var(--ttRed);
}
@media screen and (max-width: 767px) {
  .tt-header__search-wrapper {
    position: fixed !important;
    width: auto !important;
    left: 20px;
    right: 20px;
    z-index: 22;
  }
}
.tt-header__search {
  background-color: var(--white);
  width: 100%;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 100px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: 55px;
}
@media screen and (max-width: 767px) {
  .tt-header__search {
    position: fixed;
    z-index: 99;
    width: auto;
    top: 60px;
    left: 10px;
    right: 10px;
    height: 50px;
    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.1);
    transform: translateY(-10%);
    opacity: 0;
    pointer-events: none;
    transition: 0.2s ease;
  }
  .tt-header__search.active {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }
}
.tt-header__search input {
  background: transparent;
  border: none;
  width: 100%;
  height: 100%;
}
.tt-header__search button {
  font-size: 18px;
  color: var(--ttRed);
}
.tt-header__search button:hover {
  color: var(--black);
}
.tt-header-search-suggestion {
  background-color: var(--white);
  position: absolute;
  z-index: 22;
  box-shadow: 0px 4px 64px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  padding: 12px 20px;
  width: 100%;
  top: calc(100% + 10px);
  display: none;
}
.tt-header-search-suggestion.active {
  display: block;
}
@media screen and (max-width: 767px) {
  .tt-header-search-suggestion {
    top: 90px;
  }
}
.tt-header-search-suggestion a {
  display: block;
  color: var(--black);
  padding: 6px 0;
}
.tt-header-search-suggestion a:hover {
  color: var(--ttRed);
}
.tt-header__right {
  flex-shrink: 0;
  display: flex;
  gap: 20px;
}
@media screen and (max-width: 1199px) {
  .tt-header__right {
    gap: 15px;
  }
}
.tt-header__right button {
  border: 1px solid rgba(181, 181, 181, 0.25);
  height: 40px;
  padding: 0 15px;
  border-radius: 99px;
}
@media screen and (max-width: 1199px) {
  .tt-header__right button {
    padding: 0 11px;
  }
}

.tt-mobile-nav {
  position: fixed;
  bottom: 0;
  z-index: 99;
  left: 0;
  right: 0;
  background-color: var(--white);
  display: none;
  padding: 21px 20px 15px;
  align-items: center;
  justify-content: space-between;
  background: var(--white);
  box-shadow: 0px 4px 70px rgba(0, 0, 0, 0.1);
  border-radius: 20px 20px 0px 0px;
}
@media screen and (max-width: 767px) {
  .tt-mobile-nav {
    display: flex;
  }
}
.tt-mobile-nav a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  color: var(--black);
  font-size: 14px;
}
.tt-mobile-nav a:hover, .tt-mobile-nav a.active {
  color: var(--ttRed);
}
.tt-mobile-nav a i {
  font-size: 16px;
}

.jo-header {
  position: fixed;
  z-index: 99;
  inset: 0 6.25vw auto;
  padding: 0 1.563vw;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(75px);
  border-radius: 0px 0px 20px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
}
@media screen and (max-width: 1599px) {
  .jo-header {
    inset: 0 60px auto;
  }
}
@media screen and (max-width: 1399px) {
  .jo-header {
    inset: 0 40px auto;
  }
}
@media screen and (max-width: 1199px) {
  .jo-header {
    padding: 0 20px;
  }
}
@media screen and (max-width: 991px) {
  .jo-header {
    padding: 15px 20px;
  }
}
@media screen and (max-width: 767px) {
  .jo-header {
    inset: 0 20px auto;
  }
}
@media screen and (max-width: 479px) {
  .jo-header {
    inset: 0 0 auto;
    padding: 12px;
  }
}
.jo-header-right {
  display: flex;
  align-items: center;
  gap: 4.167vw;
  flex-shrink: 0;
}
@media screen and (max-width: 1399px) {
  .jo-header-right {
    gap: 60px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-header-right {
    gap: 40px;
  }
}
@media screen and (max-width: 479px) {
  .jo-header-right .jo-btn {
    font-size: 14px;
    padding: 0 10px;
    height: 38px;
  }
}
.jo-header-right .jo-btn.jo-header-sidebar-open-btn {
  padding-top: 3px;
}
@media screen and (max-width: 479px) {
  .jo-header-right .jo-btn.jo-header-sidebar-open-btn {
    padding: 5px 10px 0 !important;
  }
}
.jo-header-right .jo-btn.jo-header-sidebar-open-btn i {
  font-size: 18px;
  padding-right: 0;
}
@media screen and (max-width: 479px) {
  .jo-header-right .jo-btn.jo-header-sidebar-open-btn i {
    font-size: 16px;
  }
}
.jo-header-right .jo-btn i {
  font-size: 10px;
  padding-top: 1px;
  padding-right: 5px;
}
.jo-header-nav nav {
  font-weight: 500;
  display: flex;
  gap: 2.604vw;
}
@media screen and (max-width: 1399px) {
  .jo-header-nav nav {
    gap: 30px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-header-nav nav {
    gap: 20px;
  }
}
@media screen and (max-width: 991px) {
  .jo-header-nav nav {
    display: none;
  }
}
.jo-header-nav nav a {
  color: var(--black);
  font-size: clamp(13px, 0.833vw, 16px);
  height: clamp(70px, 3.89vw, 74px);
  display: grid;
  align-items: center;
}
.jo-header-nav nav a:not([href]):hover, .jo-header-nav nav a:hover {
  color: var(--tt-pink);
}
.jo-header-submenu {
  position: absolute;
  min-width: 200px;
  background-color: var(--white);
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.03);
  top: 100%;
  left: 0;
  opacity: 0;
  transition: 0.4s ease, pointer-events 0s;
  transform: translateY(-5px);
  pointer-events: none;
  width: max-content;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
  border-radius: 0 0 10px 10px;
  overflow: hidden;
}
.jo-header-submenu li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.jo-header-submenu li:last-child {
  border-bottom: 0;
}
.jo-header-submenu li a {
  height: auto;
  padding: 8px 15px;
  display: inline-block;
  width: 100%;
}
@media screen and (max-width: 991px) {
  .jo-header-submenu li a {
    padding: 4px 10px;
  }
}
@media screen and (max-width: 991px) {
  .jo-header-submenu {
    position: static;
    transform: translateY(0);
    opacity: 1;
    width: 100%;
    overflow: hidden;
    box-shadow: none;
  }
}

.has-sub-menu {
  position: relative;
  display: grid;
  grid-template-rows: max-content 0fr;
  transition: 0.4s ease;
}
.has-sub-menu > a {
  position: relative;
}
@media screen and (max-width: 991px) {
  .has-sub-menu > a::before, .has-sub-menu > a::after {
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 1px;
    background-color: var(--tt-pink);
  }
  .has-sub-menu > a::after {
    transform: rotate(90deg) translateX(-5%);
    transition: 0.4s ease;
  }
}
@media screen and (max-width: 991px) {
  .has-sub-menu.active {
    grid-template-rows: max-content 1fr;
  }
}
.has-sub-menu.active > a::after {
  transform: rotate(0deg);
}
.has-sub-menu.active .jo-header-submenu {
  margin-bottom: 5px;
  pointer-events: all;
}
.has-sub-menu:hover .jo-header-submenu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.jo-inner-header {
  background-color: var(--white);
}

.jo-banner {
  background: url(../img/banner-2-bg.jpg) no-repeat center center;
  background-size: cover;
  padding: 8.125vw 0 0;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media screen and (max-width: 1599px) {
  .jo-banner {
    padding: 126px 0 0;
  }
}
@media screen and (max-width: 1199px) {
  .jo-banner {
    padding: 106px 0 0;
  }
}
.jo-banner .vector {
  position: absolute;
  bottom: 115px;
  right: 0;
}
.jo-banner-container {
  margin: 0 7.031vw;
}
@media screen and (max-width: 1599px) {
  .jo-banner-container {
    margin: 0 75px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-banner-container {
    margin: 0 45px;
  }
}
@media screen and (max-width: 479px) {
  .jo-banner-container {
    margin: 0 15px;
  }
}
.jo-banner__txt {
  position: relative;
}
.jo-banner__txt .vector {
  bottom: -65px;
  right: 370px;
}
.jo-banner__title {
  margin-top: 25px;
  font-size: clamp(34px, 5.73vw, 110px);
  font-weight: 700;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 30px;
}
.jo-banner__title > span:first-child {
  display: block;
}
.jo-banner__title span.styled {
  position: relative;
  z-index: 1;
}
.jo-banner__title span.styled::before, .jo-banner__title span.styled::after {
  position: absolute;
  content: "";
  inset: 0;
  top: -30px;
  z-index: -1;
  background: url(../img/banner-txt-vector-1.svg) no-repeat center center;
  background-size: 100% 100%;
}
.jo-banner__title span.styled::after {
  background-image: url(../img/banner-txt-vector-2.svg);
  z-index: 1;
  inset: -10px;
  left: -8px;
  top: -30px;
}
.jo-banner__notifi {
  background-color: var(--white);
  border-radius: 999px;
  padding: 5px 8px;
  max-width: 160px;
  display: flex;
  gap: 8px;
  align-items: center;
  position: relative;
  font-size: 14px;
  color: var(--ttGray2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
.jo-banner__notifi > img {
  width: 40px;
  aspect-ratio: 1/1;
  display: inline-block;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.jo-banner__notifi .icon {
  position: absolute;
  top: 0;
  right: 10px;
  transform: translateY(-40%);
  border-radius: 999px;
  box-shadow: 0 5px 7px rgba(0, 0, 0, 0.3);
}
.jo-banner__notifi .icon img {
  width: 30px;
}
.jo-banner__btns {
  display: flex;
  gap: 20px;
}
.jo-banner__btns > *:last-child {
  background: none;
}
.jo-banner__btns > *:last-child:hover {
  background: var(--tt-pink);
}
.jo-banner__btns > *:last-child::before {
  border: 1px solid transparent;
  background: linear-gradient(90deg, var(--tt-pink), var(--white)) border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
}
@media screen and (max-width: 991px) {
  .jo-banner__img {
    text-align: center;
  }
}
.jo-banner__img > img {
  max-width: 33.854vw;
}
@media screen and (max-width: 991px) {
  .jo-banner__img > img {
    max-width: 60%;
    margin: auto;
  }
}
.jo-banner__img::before, .jo-banner__img::after {
  transform: translateX(-50%) !important;
  pointer-events: none;
}
.jo-banner__img .jo-banner__notifi {
  position: absolute;
  top: 70%;
  left: 0;
  text-align: left;
}
.jo-banner__followers {
  background: url(../img/banner-follower-count.svg) no-repeat center center;
  background-size: contain;
  text-align: center;
  font-size: 14px;
  padding: 28px 32px;
  position: absolute;
  right: 0;
  top: 30%;
}
@media screen and (max-width: 479px) {
  .jo-banner__followers {
    padding: 18px 22px;
  }
}
.jo-banner__followers .number {
  font-weight: 700;
  font-size: 26px;
  color: var(--ttRed);
  display: block;
  margin-bottom: 0;
  line-height: 1;
}
@media screen and (max-width: 479px) {
  .jo-banner__followers .number {
    font-size: 22px;
  }
}

.jo-social-links {
  padding: 100px 0 50px;
}
@media screen and (max-width: 1399px) {
  .jo-social-links {
    padding: 70px 0 20px;
  }
}
@media screen and (max-width: 767px) {
  .jo-social-links {
    padding: 50px 0 10px;
  }
}
@media screen and (min-width: 1400px) {
  .jo-social-links .container {
    max-width: 1417px;
  }
}
@media (min-width: 576px) {
  .jo-social-links .row {
    --bs-gutter-x: 1.25vw;
  }
}
@media screen and (max-width: 1399px) {
  .jo-social-links .row {
    --bs-gutter-x: 15px;
    --bs-gutter-y: 15px;
  }
}

.jo-social-link {
  background-color: var(--white);
  box-shadow: 0 4px 70px rgba(255, 0, 0, 0.1);
  border-radius: 10px;
  padding: 1.563vw 1.042vw;
  display: flex;
  gap: 0.781vw;
  align-items: center;
}
@media screen and (max-width: 1399px) {
  .jo-social-link {
    padding: 15px;
    flex-wrap: wrap;
    gap: 8px;
  }
}
@media screen and (max-width: 479px) {
  .jo-social-link {
    gap: 10px;
  }
}
.jo-social-link .icon {
  max-width: clamp(40px, 2.604vw, 50px);
  flex-shrink: 0;
}
.jo-social-link .txt {
  flex-grow: 1;
}
.jo-social-link .txt h5 {
  font-weight: 600;
  font-size: clamp(18px, 1.042vw, 20px);
  margin-bottom: 0.156vw;
}
.jo-social-link .txt span {
  font-weight: 400;
  font-size: clamp(12px, 0.729vw, 14px);
  color: var(--ttGray2);
}
.jo-social-link .jo-btn {
  padding: 0 8px;
  font-size: 13px;
  height: 29px;
  flex-shrink: 0;
}

.jo-reels {
  padding: 50px 0;
}
@media screen and (max-width: 991px) {
  .jo-reels {
    padding: 50px 0 0;
  }
}
@media screen and (max-width: 767px) {
  .jo-reels {
    padding: 40px 0 0;
  }
}
.jo-reels-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 48px;
  gap: 8px;
}
@media screen and (max-width: 479px) {
  .jo-reels-heading {
    margin-bottom: 10px;
  }
}
.jo-reels-heading button {
  flex-shrink: 0;
  background-color: rgba(255, 0, 0, 0.1);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 99px;
  color: var(--ttRed);
  transition: 0.4s ease;
}
.jo-reels-heading button i {
  padding-top: 2px;
}
.jo-reels-heading button:hover {
  color: var(--white);
  background-color: var(--ttRed);
}

.jo-reels-container {
  max-width: 1920px;
  margin: auto;
  padding: 0px 3.91vw;
}

@media screen and (max-width: 991px) {
  .jo-reel .plyr {
    min-width: 0;
  }
}
.jo-reel .plyr__poster {
  background-color: transparent;
}
.jo-reel-video {
  margin-bottom: 16px;
  border-radius: 20px;
  overflow: hidden;
}
.jo-reel-video video {
  max-width: 100%;
  height: 25.63vw;
  max-height: 492px;
  width: 100%;
  object-fit: cover;
  background: #ddd;
  vertical-align: top;
}
@media screen and (max-width: 767px) {
  .jo-reel-video video {
    height: 42.63vw;
  }
}
@media screen and (max-width: 575px) {
  .jo-reel-video video {
    height: 66.63vw;
  }
}
@media screen and (max-width: 479px) {
  .jo-reel-video video {
    height: 138.73vw;
  }
}
.jo-reel .link {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 20px;
}
.jo-reel-title a {
  font-weight: 700;
  font-size: 1.042vw;
  color: var(--black);
}
@media screen and (max-width: 1399px) {
  .jo-reel-title a {
    font-size: 16px;
  }
}
.jo-reel-title a:hover {
  color: var(--tt-pink);
}
.jo-reel-info {
  color: var(--ttGray2);
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.platform-tag,
.jo-reel .link {
  background-color: var(--white);
  padding: 10px 15px;
  width: max-content;
  border-radius: 99px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
}
.platform-tag img,
.jo-reel .link img {
  width: 16px;
}

.jo-services {
  padding: 2.604vw 0;
}
@media screen and (max-width: 991px) {
  .jo-services {
    padding: 40px 0;
  }
}
@media (min-width: 1400px) {
  .jo-services .container {
    max-width: 1417px;
  }
}
.jo-services-wrapper {
  padding: 2.604vw;
  background-color: #FFF1F1;
  border-radius: 20px;
}
@media screen and (max-width: 1399px) {
  .jo-services-wrapper {
    padding: 30px;
  }
}
@media screen and (max-width: 991px) {
  .jo-services-wrapper {
    padding: 20px;
  }
}
@media screen and (max-width: 479px) {
  .jo-services-wrapper {
    padding: 15px;
  }
}
.jo-services-wrapper .heading {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding-bottom: 26px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
@media screen and (max-width: 479px) {
  .jo-services-wrapper .heading {
    margin-bottom: 20px;
    padding-bottom: 21px;
  }
}
.jo-services-tabs-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 1.563vw;
}
@media screen and (max-width: 991px) {
  .jo-services-tabs-wrapper {
    flex-direction: column;
  }
}
@media screen and (max-width: 479px) {
  .jo-services-tabs-wrapper {
    gap: 20px;
  }
}
.jo-services-tab-navs {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 0.781vw, 15px);
  flex-shrink: 0;
}
@media screen and (max-width: 991px) {
  .jo-services-tab-navs {
    width: 100%;
    text-align: center;
  }
}
.jo-services-tab-navs .tab-nav {
  background-color: var(--white);
  border-radius: 10px;
  height: 3.906vw;
  min-width: 19.271vw;
  text-align: left;
  padding: 0 1.042vw;
  font-weight: 600;
  font-size: 1.042vw;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1399px) {
  .jo-services-tab-navs .tab-nav {
    min-width: 0;
    font-size: 16px;
    height: 55px;
  }
}
@media screen and (max-width: 991px) {
  .jo-services-tab-navs .tab-nav {
    font-size: 14px;
    height: 45px;
    padding: 0 15px;
    text-align: center;
  }
}
.jo-services-tab-navs .tab-nav::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 10px;
  background: linear-gradient(90deg, var(--tt-pink) 0%, var(--tt-gold) 100%);
  z-index: -1;
  opacity: 0;
  transition: 0.4s ease;
}
.jo-services-tab-navs .tab-nav.active {
  color: var(--white);
}
.jo-services-tab-navs .tab-nav.active::before {
  opacity: 1;
}

.tt-tab {
  overflow: hidden;
  opacity: 0;
  height: 0;
  pointer-events: none;
  transition: 0.4s ease;
}
.tt-tab.active {
  opacity: 1;
  height: auto;
  pointer-events: auto;
}

.tt-service-tab {
  display: flex;
  gap: 1.563vw;
  background-color: var(--white);
  padding: 1.563vw;
  border-radius: 10px;
}
@media screen and (max-width: 1199px) {
  .tt-service-tab {
    flex-direction: column;
    gap: 20px;
  }
}
@media screen and (max-width: 767px) {
  .tt-service-tab {
    padding: 20px;
  }
}
@media screen and (max-width: 479px) {
  .tt-service-tab {
    padding: 15px;
  }
}
.tt-service-tab .img {
  max-width: 21.302vw;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
}
@media screen and (max-width: 1399px) {
  .tt-service-tab .img {
    max-width: 350px;
  }
}
.tt-service-tab .title {
  font-size: clamp(17px, 1.042vw, 20px);
  font-weight: 700;
  color: var(--black);
  margin-bottom: 0.365vw;
}
@media screen and (max-width: 991px) {
  .tt-service-tab .title {
    margin-bottom: 12px;
  }
}
.tt-service-tab .descr {
  font-weight: 400;
  font-size: clamp(13px, 0.833vw, 16px);
  line-height: 1.65;
  color: var(--ttGray2);
  margin-bottom: 0.885vw;
}
@media screen and (max-width: 991px) {
  .tt-service-tab .descr {
    margin-bottom: 15px;
  }
}
.tt-service-tab .list {
  font-size: clamp(13px, 0.833vw, 16px);
  list-style: disc inside;
  padding-left: 10px;
  margin-bottom: 0;
}
.tt-service-tab .list li:not(:last-child) {
  margin-bottom: 0.521vw;
}

.jo-intro-lives-wrapper {
  background: url(../img/intro-live-bg.png) var(--black) no-repeat center center;
  background-size: cover;
  padding: 50px 0;
}

.jo-intro {
  overflow: hidden;
  position: relative;
  padding: 50px 0;
}
@media screen and (max-width: 1399px) {
  .jo-intro {
    padding: 20px 0 50px;
  }
}
.jo-intro__txt {
  color: var(--white);
}
.jo-intro__txt .jo-section-title {
  color: var(--white);
  margin-bottom: 22px;
}
.jo-intro__txt .jo-btn::after {
  content: "";
  position: absolute;
  inset: 1px;
  background-color: var(--black);
  z-index: -1;
  border-radius: 6px;
  transition: 0.4s ease;
}
.jo-intro__txt .jo-btn:hover::after {
  opacity: 0;
}
.jo-intro__descr {
  margin-bottom: 33px;
  font-size: clamp(13px, 0.833vw, 16px);
}
.jo-intro__list {
  padding: 0;
  margin: 0;
  margin-bottom: 50px;
}
.jo-intro__list li {
  position: relative;
  padding-left: 35px;
  list-style: none;
  font-weight: 600;
  font-size: clamp(13px, 0.833vw, 16px);
}
.jo-intro__list li:not(:last-child) {
  margin-bottom: 18px;
}
.jo-intro__list li::before {
  position: absolute;
  content: "";
  left: 0;
  top: 1px;
  width: 20px;
  height: 20px;
  background: url(../img/checkmark-badge.svg) no-repeat center center;
  background-size: 100% 100%;
}
.jo-intro__img {
  display: flex;
  justify-content: flex-start;
  margin-left: 34px;
  position: relative;
}
@media screen and (max-width: 479px) {
  .jo-intro__img {
    margin-left: 0;
  }
}
.jo-intro__img .play-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 56px;
  width: 114px;
  aspect-ratio: 1/1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--white);
  color: var(--ttRed);
  border-radius: 99px;
  font-size: 26px;
  box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.5);
  animation: btn-shadow-anim 2.5s linear infinite forwards;
}
@media screen and (max-width: 767px) {
  .jo-intro__img .play-btn {
    left: 26px;
    width: 84px;
  }
}
@media screen and (max-width: 479px) {
  .jo-intro__img .play-btn {
    left: 10px;
    width: 70px;
    font-size: 20px;
  }
}
.jo-intro__img .play-btn:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-intro__img img {
  max-width: none;
  max-height: 34.371vw;
  border-radius: 999px 0 0 999px;
}
.jo-intro__vector {
  position: absolute;
  top: 27px;
  left: -427px;
  animation: spin 5.5s linear infinite forwards;
}
@media screen and (max-width: 1799px) {
  .jo-intro__vector {
    left: -497px;
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes btn-shadow-anim {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
  }
  100% {
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
  }
}
.jo-upcoming-lives {
  color: var(--white);
  padding: 50px 0;
}
@media screen and (max-width: 1399px) {
  .jo-upcoming-lives {
    padding: 20px 0;
  }
}
.jo-upcoming-lives__heading {
  text-align: center;
  border: solid rgba(255, 255, 255, 0.2);
  border-width: 1px 0 1px 0;
  color: var(--white);
  padding: 40px 0 30px;
  margin-bottom: 50px;
}
@media screen and (max-width: 1399px) {
  .jo-upcoming-lives__heading {
    padding: 30px 0 20px;
  }
}
.jo-upcoming-lives__heading .jo-section-title {
  color: var(--white);
}
.jo-upcoming-live {
  display: flex;
  align-items: center;
  gap: 2.604vw;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 20px;
  padding: 1.563vw;
}
@media screen and (max-width: 1399px) {
  .jo-upcoming-live {
    gap: 30px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-upcoming-live {
    align-items: flex-start;
  }
}
@media screen and (max-width: 991px) {
  .jo-upcoming-live {
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .jo-upcoming-live {
    padding: 15px;
  }
}
.jo-upcoming-live:not(:last-child) {
  margin-bottom: 30px;
}
.jo-upcoming-live__img {
  border-radius: 20px;
  overflow: hidden;
  flex-shrink: 0;
  max-width: 26.458vw;
}
@media screen and (max-width: 1399px) {
  .jo-upcoming-live__img {
    max-width: 478px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-upcoming-live__img {
    max-width: 418px;
  }
}
.jo-upcoming-live__txt .platform-tag {
  margin-bottom: 1.302vw;
}
.jo-upcoming-live__txt .title {
  font-weight: 700;
  font-size: 20px, 1.25vw, 24px;
}
.jo-upcoming-live__txt .date {
  font-size: clamp(12px, 0.729vw, 14px);
  font-weight: 500;
  padding-bottom: 1.302vw;
  display: inline-block;
}
@media screen and (max-width: 479px) {
  .jo-upcoming-live__txt .date {
    padding-bottom: 15px;
  }
}
.jo-upcoming-live__txt .descr {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 1.042vw;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 1.667vw;
  font-size: clamp(13px, 0.833vw, 16px);
}
@media screen and (max-width: 479px) {
  .jo-upcoming-live__txt .descr {
    padding-top: 15px;
    margin-bottom: 20px;
  }
}

.jo-videos {
  padding: 100px 0;
}
@media screen and (max-width: 1399px) {
  .jo-videos {
    padding: 70px 0;
  }
}
.jo-videos__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 45px;
  flex-wrap: wrap;
  gap: 8px;
}
.jo-videos__heading .jo-section-title {
  margin-bottom: 0;
}
.jo-videos__heading .jo-videos__btn {
  color: var(--ttRed);
}
.jo-videos__heading .jo-videos__btn i {
  padding-top: 4px;
  padding-right: 4px;
}
.jo-videos__heading .jo-videos__btn:hover {
  color: var(--white);
}
.jo-videos__heading .jo-videos__btn:hover::after {
  opacity: 0;
}
.jo-videos__heading .jo-videos__btn::after {
  position: absolute;
  inset: 1px;
  content: "";
  z-index: -1;
  background-color: var(--white);
  border-radius: 5px;
  transition: 0.4s ease;
}
.jo-videos-slider {
  margin-bottom: 30px;
}

.jo-video-card {
  border-radius: 20px;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  z-index: 1;
  max-width: 35.94vw;
  min-width: 30vw;
}
@media screen and (max-width: 991px) {
  .jo-video-card {
    max-width: 350px;
  }
}
@media screen and (max-width: 479px) {
  .jo-video-card {
    max-width: 315px;
  }
}
.jo-video-card:hover::before {
  opacity: 1;
}
.jo-video-card:hover .bottom {
  transform: translateY(0);
}
.jo-video-card::before {
  position: absolute;
  content: "";
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(255, 30, 132, 0.5), var(--tt-gold));
  opacity: 0;
  transition: 0.4s ease;
}
.jo-video-card__img {
  width: 100%;
  object-fit: contain;
  background-color: #f5f5f5;
}
.jo-video-card__txt {
  position: absolute;
  inset: 40px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
@media screen and (max-width: 1399px) {
  .jo-video-card__txt {
    inset: 30px;
  }
}
@media screen and (max-width: 1199px) {
  .jo-video-card__txt {
    inset: 20px;
  }
}
@media screen and (max-width: 479px) {
  .jo-video-card__txt {
    inset: 15px;
  }
}
.jo-video-card__btn {
  border: 1px solid var(--white);
  border-radius: 50%;
  width: 50px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  padding-top: 1px;
  color: var(--white);
}
.jo-video-card__btn:hover {
  background-color: var(--white);
  color: var(--tt-pink);
}
.jo-video-card__premium-tag {
  width: 50px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--black);
  background-color: var(--white);
  border-radius: 50%;
  padding-top: 1px;
}
.jo-video-card .bottom {
  transform: translateY(calc(100% - 27px));
  transition: 0.4s ease;
}
.jo-video-card .price {
  display: inline-block;
  background: var(--white);
  border-radius: 999px;
  font-weight: 600;
  font-size: 12px;
  padding: 3.5px 10px;
  color: var(--ttRed);
  margin-bottom: 10px;
}
.jo-video-card__title {
  font-weight: 700;
  font-size: clamp(21px, 1.26vw, 24px);
  line-height: 29px;
  color: var(--white);
  margin-bottom: 4px;
  display: inline-block;
}
.jo-video-card__title:hover {
  color: var(--tt-pink);
}
.jo-video-card__infos {
  color: var(--white);
  font-weight: 300;
}
.jo-video-card__infos > *:not(:last-child) {
  border-right: 1px solid var(--white);
  padding-right: 10px;
  margin-right: 5px;
}

.jo-contact {
  overflow: hidden;
}
.jo-contact .top {
  padding-top: 100px;
  background: url(../img/contact-bg.jpg) no-repeat center center;
  background-size: cover;
}
@media screen and (max-width: 1399px) {
  .jo-contact .top {
    padding-top: 70px;
  }
}
@media screen and (max-width: 991px) {
  .jo-contact .top {
    padding: 70px 0;
  }
}
.jo-contact__img {
  position: relative;
  z-index: 1;
}
.jo-contact__img::before, .jo-contact__img::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -50px;
  left: 50%;
  transform: translateX(-42%);
  width: 594px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.5);
  animation: scale 3s infinite linear;
}
.jo-contact__img::after {
  width: 510px;
  height: 510px;
  top: -7px;
  transform: translateX(-40.8%);
}
.jo-contact-form-wrapper {
  border-radius: 20px;
  background-color: var(--white);
  padding: 2.083vw;
  box-shadow: 0px 4px 70px rgba(255, 0, 0, 0.1);
  margin-bottom: -225px;
}
@media screen and (max-width: 1199px) {
  .jo-contact-form-wrapper {
    padding: 30px;
  }
}
@media screen and (max-width: 991px) {
  .jo-contact-form-wrapper {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 479px) {
  .jo-contact-form-wrapper {
    padding: 20px;
  }
}
.jo-contact-form-wrapper > .icon {
  display: inline-block;
  margin-bottom: 0.781vw;
}
.jo-contact-form-wrapper .jo-section-title {
  margin-bottom: 0.781vw;
}
@media screen and (max-width: 1399px) {
  .jo-contact-form-wrapper .jo-section-title {
    margin-bottom: 10px;
  }
}
.jo-contact-form-wrapper p {
  margin-bottom: 1.563vw;
}
@media screen and (max-width: 1399px) {
  .jo-contact-form-wrapper p {
    margin-bottom: 12px;
  }
}
.jo-contact-form > *:not(:last-child) {
  margin-bottom: 1.458vw;
}
@media screen and (max-width: 1399px) {
  .jo-contact-form > *:not(:last-child) {
    margin-bottom: 15px;
  }
}
.jo-contact-form label {
  display: block;
  width: max-content;
  max-width: 100%;
  font-weight: 600;
  color: var(--black);
  font-size: clamp(13px, 0.833vw, 16px);
  margin-bottom: 0.885vw;
}
.jo-contact-form input,
.jo-contact-form textarea {
  border: 1px solid rgba(0, 0, 0, 0.15);
  height: clamp(56px, 3.385vw, 65px);
  width: 100%;
  padding: 0 1.302vw;
  font-size: clamp(13px, 0.833vw, 16px);
  font-weight: 500;
  color: var(--black);
  border-radius: 10px;
  background-color: rgba(245, 245, 245, 0.5);
}
@media screen and (max-width: 479px) {
  .jo-contact-form input,
  .jo-contact-form textarea {
    padding: 0 15px;
    height: 45px;
  }
}
.jo-contact-form textarea {
  height: clamp(120px, 7.187vw, 138px);
  padding: 0.781vw 1.302vw;
}
@media screen and (max-width: 1399px) {
  .jo-contact-form textarea {
    padding: 15px;
  }
}
.jo-contact-form textarea:focus {
  outline: none;
}
.jo-contact .jo-btn {
  font-size: clamp(13px, 0.833vw, 16px);
}
.jo-contact .bottom {
  padding-bottom: 100px;
  background-color: #FFF1F1;
}
@media screen and (max-width: 1399px) {
  .jo-contact .bottom {
    padding-bottom: 70px;
  }
}
@media screen and (max-width: 767px) {
  .jo-contact .bottom {
    padding-bottom: 50px;
  }
}
.jo-contact .bottom .blank-space {
  pointer-events: none;
}

@keyframes scale {
  0% {
    scale: 1;
    opacity: 1;
  }
  100% {
    scale: 1.1;
    opacity: 0;
  }
}
.jo-partners-title {
  font-weight: 600;
  font-size: 24px;
  color: var(--black);
  text-align: center;
  margin-bottom: 40px;
  margin-top: 45px;
}
.jo-partners-slider-pagination {
  text-align: center;
  margin-top: 55px;
}
.jo-partners-slider-pagination .swiper-pagination-bullet-active {
  background-color: var(--ttRed);
}

.jo-articles {
  padding: 100px 0;
}
@media screen and (max-width: 1399px) {
  .jo-articles {
    padding: 70px 0;
  }
}
.jo-articles .jo-section-title {
  margin-bottom: 30px;
}

.jo-article {
  border: 1px solid #e5e5e5;
  padding: 24px;
  border-radius: 16px;
}
@media screen and (max-width: 1199px) {
  .jo-article {
    padding: 18px;
  }
}
.jo-article__img {
  overflow: hidden;
  border-radius: 10px;
  margin-bottom: 20px;
  position: relative;
}
.jo-article__img img {
  width: 100%;
  aspect-ratio: 402/265;
}
.jo-article .date {
  position: absolute;
  bottom: 30px;
  left: 30px;
  background-color: var(--white);
  border-radius: 10px;
  font-weight: 500;
  font-size: clamp(11px, 0.729vw, 14px);
  color: var(--black);
  display: inline-block;
  text-transform: uppercase;
  overflow: hidden;
  text-align: center;
}
@media screen and (max-width: 1399px) {
  .jo-article .date {
    bottom: 20px;
    left: 20px;
  }
}
.jo-article .date .number {
  background: var(--ttRed);
  display: block;
  color: var(--white);
  padding: 3px;
  border-radius: 10px;
}
.jo-article .date .txt {
  padding: 2px 11px;
  display: block;
}
.jo-article__infos {
  display: flex;
  align-items: center;
  gap: 1.563vw;
  font-size: clamp(12px, 0.729vw, 14px);
  font-weight: 500;
  margin-bottom: 0.625vw;
}
.jo-article__info {
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 1;
}
.jo-article__info i {
  font-size: 18px;
  color: var(--ttRed);
}
.jo-article__title {
  font-weight: 600;
  font-size: clamp(19px, 1.146vw, 22px);
  margin-bottom: 1.302vw;
  line-height: 1.4;
}
@media screen and (max-width: 1399px) {
  .jo-article__title {
    margin-bottom: 18px;
  }
}
.jo-article__title a {
  color: var(--black);
  display: inline-block;
}
.jo-article__title a:hover {
  color: var(--ttRed);
}
.jo-article__btn {
  font-weight: 600;
  color: var(--ttRed);
  font-size: clamp(13px, 0.833vw, 16px);
  display: inline-flex;
}
.jo-article__btn:hover {
  color: var(--black);
}
.jo-article__btn .icon {
  font-size: 22px;
  line-height: 0.7;
  padding-top: 1px;
  padding-left: 4px;
}

.tt-footer {
  background-color: var(--black);
  padding: 55px 30px;
  color: var(--white);
}
@media screen and (max-width: 479px) {
  .tt-footer {
    padding: 45px 20px;
  }
}
.tt-footer-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 35px;
  padding-bottom: 40px;
}
@media screen and (max-width: 1399px) {
  .tt-footer-top {
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .tt-footer-top > * {
    flex-grow: 1;
  }
}
.tt-footer-top__about {
  max-width: 600px;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .tt-footer-top__about {
    max-width: 100%;
  }
}
.tt-footer-top__logo {
  margin-bottom: 20px;
  display: inline-block;
}
.tt-footer-top__descr {
  margin-bottom: 30px;
}
.tt-footer-top__socials {
  display: flex;
  align-items: center;
  gap: 15px;
}
.tt-footer-top__socials a {
  width: 47px;
  font-size: 20px;
  color: rgba(255, 255, 255, 0.7);
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d2d2d2;
  border-radius: 50%;
  transition: 0.4s ease;
}
.tt-footer-top__socials a i {
  padding-top: 3px;
}
.tt-footer-top__socials a:hover {
  background-color: var(--ttRed);
  color: var(--white);
  border-color: var(--ttRed);
}
.tt-footer-widget__title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 18px;
}
.tt-footer-widget__links a {
  font-size: 16px;
  display: block;
  margin-bottom: 8px;
  color: var(--white);
}
.tt-footer-widget__links a:hover {
  color: var(--ttRed);
}
.tt-footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 20px 0 0;
  gap: 20px 10px;
}
.tt-footer-bottom p,
.tt-footer-bottom a {
  color: rgba(255, 255, 255, 0.5);
}
.tt-footer-bottom .links {
  gap: 8px 35px;
}
.tt-footer-bottom a:hover {
  color: var(--ttRed);
}

.jo-footer {
  background-color: var(--black);
}
.jo-footer-top {
  padding: 2.76vw 1.563vw;
  background: linear-gradient(90deg, var(--ttRed), var(--tt-gold));
  border-radius: 0 0 20px 20px;
}
@media screen and (max-width: 1199px) {
  .jo-footer-top {
    padding: 40px 1.563vw;
  }
}
@media screen and (max-width: 991px) {
  .jo-footer-top {
    padding: 30px 10px;
  }
}
.jo-footer-top .logo {
  width: 211px;
}
@media screen and (max-width: 1199px) {
  .jo-footer-top .logo {
    width: 150px;
  }
}
.jo-footer-top__nwsltr {
  display: flex;
  background-color: var(--white);
  border-radius: 999px;
  padding: 5px;
}
@media screen and (max-width: 479px) {
  .jo-footer-top__nwsltr {
    flex-direction: column;
    border-radius: 20px;
    gap: 5px;
  }
}
.jo-footer-top__nwsltr input {
  background-color: transparent;
  width: 100%;
  height: 3.385vw;
  padding: 0 25px;
  font-size: 16px;
}
@media screen and (max-width: 1199px) {
  .jo-footer-top__nwsltr input {
    height: 45px;
  }
}
@media screen and (max-width: 479px) {
  .jo-footer-top__nwsltr input {
    padding: 0 15px;
  }
}
.jo-footer-top__nwsltr button,
.jo-footer-top__nwsltr .bt-footer-cta__btn {
  height: auto;
  border-radius: 999px;
  flex-shrink: 0;
  padding: 0 1.25vw;
}
@media screen and (max-width: 479px) {
  .jo-footer-top__nwsltr button,
.jo-footer-top__nwsltr .bt-footer-cta__btn {
    height: 45px;
  }
}
.jo-footer-top__nwsltr button::before,
.jo-footer-top__nwsltr .bt-footer-cta__btn::before {
  border-radius: 999px;
}
.jo-footer-top__socials a {
  position: relative;
  z-index: 1;
  border: 1px solid var(--white);
  color: var(--white);
}
.jo-footer-top__socials a:hover::before {
  opacity: 1;
}
.jo-footer-top__socials a::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--tt-pink) 0%, var(--tt-gold) 100%);
  opacity: 0;
  transition: 0.4s ease;
}
.jo-footer-middle {
  padding: 3.125vw 0 2.083vw;
  color: var(--white);
}
@media screen and (max-width: 479px) {
  .jo-footer-middle {
    padding: 40px 0;
  }
}
.jo-footer-widget__title {
  font-weight: 700;
  font-size: clamp(17px, 1.042vw, 20px);
  margin-bottom: 20px;
}
.jo-footer-contact a {
  font-size: clamp(22px, 1.563vw, 30px);
  font-weight: 500;
  color: #b5b5b5;
}
@media screen and (max-width: 479px) {
  .jo-footer-contact a {
    font-size: 22px;
  }
}
.jo-footer-links .links {
  font-size: clamp(13px, 0.833vw, 16px);
  display: grid;
  gap: 8px 40px;
  grid-template-columns: repeat(2, max-content);
}
.jo-footer-links .links a {
  font-weight: 500;
  color: #b5b5b5;
}
.jo-footer-links .links a:hover {
  color: var(--ttRed);
}
.jo-footer-gallery .imgs {
  display: flex;
  gap: 15px;
}
.jo-footer-gallery .imgs img {
  border-radius: 10px;
  max-width: clamp(80px, 5.208vw, 100px);
}
.jo-footer .tt-footer-bottom {
  padding-bottom: 20px;
  border-top-color: rgba(255, 255, 255, 0.2);
  font-size: clamp(13px, 0.833vw, 16px);
  justify-content: center;
}

.jo-inner-social-links {
  padding: 100px 0;
}
@media screen and (max-width: 1399px) {
  .jo-inner-social-links {
    padding: 70px 0;
  }
}
@media screen and (max-width: 767px) {
  .jo-inner-social-links {
    padding: 50px 0;
  }
}

.jo-inner-videos {
  background-color: #FFF1F1;
}

.jo-inner-about {
  padding: 5.208vw 0 4.323vw;
}
@media screen and (max-width: 991px) {
  .jo-inner-about {
    padding: 50px 0 47px;
  }
}
.jo-inner-about .top-wrapper {
  border-radius: 20px;
  border: 1px solid rgba(0, 0, 0, 0.15);
}
.jo-inner-about-left {
  background: url(../img/inner-about-left-bg.png) var(--black) no-repeat center center;
  background-size: cover;
  height: 100%;
  border-radius: 20px;
  padding: 2.083vw 5.729vw;
  width: max-content;
  max-width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1199px) {
  .jo-inner-about-left {
    padding: 25px 50px;
  }
}
@media screen and (max-width: 991px) {
  .jo-inner-about-left {
    width: 100%;
  }
}
@media screen and (max-width: 479px) {
  .jo-inner-about-left {
    padding: 25px 35px;
  }
}
.jo-inner-about-left .title {
  color: var(--white);
  font-weight: 600;
  font-size: clamp(21px, 1.25vw, 24px);
  margin-bottom: clamp(18px, 1.198vw, 22px);
}
.jo-inner-about-left .jo-btn {
  border-radius: 999px;
}
.jo-inner-about-left .jo-btn::before {
  border-radius: 999px;
}
.jo-inner-about-left .sub-title {
  font-size: 16px;
  font-weight: 500;
  color: var(--ttGray2);
  margin-top: clamp(20px, 1.563vw, 30px);
  margin-bottom: 0;
}
.jo-inner-about-left .img {
  position: relative;
  border-radius: 999px;
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
  margin-bottom: clamp(20px, 2.083vw, 40px);
}
.jo-inner-about-left .img img {
  border: 0.9vw solid var(--white);
  border-radius: 999px;
  max-width: 15.937vw;
  aspect-ratio: 1/1;
}
@media screen and (max-width: 1599px) {
  .jo-inner-about-left .img img {
    max-width: 17.937vw;
  }
}
@media screen and (max-width: 1199px) {
  .jo-inner-about-left .img img {
    max-width: 20.937vw;
  }
}
@media screen and (max-width: 991px) {
  .jo-inner-about-left .img img {
    max-width: 100%;
  }
}
.jo-inner-about-left .img .follower-tag {
  position: absolute;
  top: 42px;
  left: -33px;
  background-color: #18E76E;
  border-radius: 999px;
  color: var(--white);
  padding: 4px 10px;
  font-weight: 400;
  font-size: clamp(13px, 0.781vw, 15px);
}
.jo-inner-about-txt {
  padding: 1.563vw;
  padding-left: 0;
}
@media screen and (max-width: 991px) {
  .jo-inner-about-txt {
    padding: 25px;
  }
}
@media screen and (max-width: 575px) {
  .jo-inner-about-txt {
    padding: 15px;
  }
}
.jo-inner-about .jo-section-title {
  margin-bottom: 1.198vw;
}
.jo-inner-about-second-title {
  font-size: clamp(26px, 2.083vw, 40px);
  font-weight: 500;
  font-style: italic;
  line-height: 1.5;
  margin-bottom: 0;
  margin-top: 4.167vw;
}
@media screen and (max-width: 767px) {
  .jo-inner-about-second-title {
    font-size: 22px;
  }
}
@media screen and (max-width: 479px) {
  .jo-inner-about-second-title {
    font-size: 20px;
  }
}
.jo-inner-about-second-title .txt-gold {
  color: var(--tt-gold);
}
.jo-inner-about-second-title .txt-pink {
  color: var(--tt-pink);
}

.jo-inner-services {
  padding: 5.208vw 0;
}
@media screen and (max-width: 991px) {
  .jo-inner-services {
    padding: 50px 0;
  }
}

.jo-inner-service {
  background-color: #FFF1F1;
  border: none;
  border-radius: 20px;
  padding: clamp(15px, 1.563vw, 30px);
}
.jo-inner-service .jo-article__img {
  border-radius: 15px;
}
.jo-inner-service .jo-article__img img {
  aspect-ratio: 390/261;
}
.jo-inner-service .jo-article__info {
  gap: 10px;
}
.jo-inner-service .jo-article__info i {
  font-size: clamp(17px, 1.042vw, 20px);
}
.jo-inner-service .jo-article__title {
  font-size: clamp(17px, 1.042vw, 20px);
  font-weight: 700;
  margin-bottom: 10px;
}
.jo-inner-service-descr {
  color: var(--ttGray2);
  font-size: clamp(18px, 1.146vw, 22px);
}
.jo-inner-service .jo-btn {
  gap: 6px;
  color: var(--tt-pink);
}
.jo-inner-service .jo-btn::after {
  content: "";
  position: absolute;
  z-index: -1;
  background-color: #FFF1F1;
  position: absolute;
  inset: 1px;
  border-radius: 4px;
  transition: 0.4s ease;
}
.jo-inner-service .jo-btn:hover {
  color: var(--white);
}
.jo-inner-service .jo-btn:hover::after {
  opacity: 0;
}
.jo-inner-service .jo-btn .icon {
  font-size: 10px;
  padding-top: 4px;
}

.jo-inner-features {
  background: url(../img/features-bg.jpg) no-repeat center center;
  background-size: cover;
  padding: 5.208vw 0;
}
@media screen and (max-width: 991px) {
  .jo-inner-features {
    padding: 50px 0;
  }
}

.jo-inner-feature {
  text-align: center;
}
.jo-inner-feature .icon {
  width: 6.25vw;
  max-width: 100%;
  padding-top: 0.625vw;
  aspect-ratio: 1/1;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  margin: auto;
  margin-bottom: 1.563vw;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(45px, 3.125vw, 60px);
  background: linear-gradient(180deg, var(--ttRed), var(--tt-gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media screen and (max-width: 991px) {
  .jo-inner-feature .icon {
    width: 65px;
  }
}
@media screen and (max-width: 767px) {
  .jo-inner-feature .icon {
    padding-top: 7px;
  }
}
.jo-inner-feature .title {
  font-weight: 700;
  font-size: clamp(17px, 1.042vw, 20px);
  color: var(--white);
}

.jo-inner-main-content {
  padding: 5.208vw 0;
}
@media screen and (max-width: 991px) {
  .jo-inner-main-content {
    padding: 50px 0;
  }
}

.jo-service-details-sidebar {
  background-color: #FFF1F1;
  border-radius: 20px;
  padding: 1.719vw;
}
@media screen and (max-width: 991px) {
  .jo-service-details-sidebar {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
  }
  .jo-service-details-sidebar > * {
    width: calc((100% - 15px) / 2);
  }
}
@media screen and (max-width: 991px) and (max-width: 479px) {
  .jo-service-details-sidebar > * {
    width: calc((100% - 15px) / 1);
  }
}
@media screen and (max-width: 479px) {
  .jo-service-details-sidebar {
    justify-content: center;
    padding: 25px 14px;
  }
}
.jo-service-details-sidebar .service-list li:not(:last-child) {
  margin-bottom: clamp(12px, 1.042vw, 20px);
}
.jo-service-details-sidebar .service-list a {
  padding: clamp(7.5px, 0.66vw, 12.5px) clamp(12px, 1.042vw, 20px);
  border-radius: 10px;
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, var(--ttRed), var(--tt-gold));
  font-weight: 500;
  font-size: 20px;
  color: var(--black);
}
@media screen and (max-width: 1599px) {
  .jo-service-details-sidebar .service-list a {
    font-size: 18px;
  }
}
@media screen and (max-width: 575px) {
  .jo-service-details-sidebar .service-list a {
    font-size: 16px;
  }
}
.jo-service-details-sidebar .service-list a::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 1px;
  background-color: #FFF1F1;
  border-radius: 8.5px;
  transition: 0.4s ease;
}
.jo-service-details-sidebar .service-list a:hover, .jo-service-details-sidebar .service-list a.current {
  color: var(--white);
}
.jo-service-details-sidebar .service-list a:hover::before, .jo-service-details-sidebar .service-list a.current::before {
  opacity: 0;
}
.jo-service-details__cta {
  margin-top: 1.563vw;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 991px) {
  .jo-service-details__cta {
    margin-top: 0;
  }
}
.jo-service-details__cta .img {
  position: relative;
  z-index: 1;
  border-radius: 20px;
  overflow: hidden;
}
.jo-service-details__cta .img::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.7);
}
.jo-service-details__cta .txt {
  position: absolute;
  bottom: clamp(25px, 2.604vw, 50px);
  z-index: 2;
  color: var(--white);
  text-align: center;
  width: 100%;
}
.jo-service-details__cta .txt .icon {
  font-size: clamp(25px, 2.604vw, 50px);
  line-height: 1;
  margin-bottom: 6px;
}
.jo-service-details__cta .txt .title {
  font-weight: 600;
  font-size: clamp(14px, 0.938vw, 18px);
  display: block;
  margin-bottom: 0.781vw;
}
.jo-service-details__cta .txt a {
  font-weight: 700;
  font-size: clamp(18px, 1.25vw, 24px);
  color: var(--white);
}
.jo-service-details__cta .txt a:hover {
  color: var(--tt-pink);
}
.jo-service-details-cover-img {
  margin-bottom: 1.563vw;
}
@media screen and (max-width: 1199px) {
  .jo-service-details-cover-img {
    margin-bottom: 18px;
  }
}
.jo-service-details-cover-img img {
  border-radius: 20px;
  aspect-ratio: 930/433;
  max-width: 100%;
  object-fit: cover;
}
.jo-service-details__tag {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 0.677vw;
  display: flex;
  align-items: center;
  gap: 5px;
}
@media screen and (max-width: 1199px) {
  .jo-service-details__tag {
    margin-bottom: 12px;
  }
}
.jo-service-details__tag .icon {
  font-size: 20px;
  line-height: 0.7;
  color: var(--ttRed);
}
.jo-service-details__title {
  font-weight: 700;
  font-size: clamp(24px, 1.25vw, 24px);
}
.jo-service-details__descr {
  font-size: 15px;
  color: var(--ttGray2);
}
.jo-service-details__inner-imgs {
  display: flex;
  gap: 24px;
  margin: 1.823vw 0;
}
@media screen and (max-width: 767px) {
  .jo-service-details__inner-imgs {
    gap: 15px;
  }
}
@media screen and (max-width: 479px) {
  .jo-service-details__inner-imgs {
    flex-direction: column;
  }
}
.jo-service-details__inner-imgs img {
  width: 100%;
  border-radius: 20px;
}
.jo-service-details-related-services {
  background-color: #FFF1F1;
}
.jo-service-details-related-services .heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: clamp(20px, 2.083vw, 40px);
}
.jo-service-details-related-services .heading .jo-section-title {
  margin-bottom: 0;
}

.jo-related-services-slider .jo-inner-service {
  background-color: var(--white);
}
.jo-related-services-slider-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
}
.jo-related-services-slider-nav button:hover {
  color: var(--ttRed);
}

.jo-videos-toggle-switch {
  position: relative;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin-bottom: 2.604vw;
}
@media screen and (max-width: 991px) {
  .jo-videos-toggle-switch {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 479px) {
  .jo-videos-toggle-switch {
    gap: 8px;
  }
}
.jo-videos-toggle-switch .toggle-label {
  font-weight: 500;
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: 0.4s ease;
}
@media screen and (max-width: 479px) {
  .jo-videos-toggle-switch .toggle-label {
    font-size: 14px;
  }
}
.jo-videos-toggle-switch .toggle-label.premium {
  color: rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 479px) {
  .jo-videos-toggle-switch .toggle-label i {
    display: none;
  }
}
.jo-videos-toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.jo-videos-toggle-switch input:checked ~ .slider {
  background-color: var(--black);
}
.jo-videos-toggle-switch input:checked ~ .slider:before {
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
}
.jo-videos-toggle-switch input:checked ~ .toggle-label.premium {
  color: var(--black);
}
.jo-videos-toggle-switch input:checked ~ .toggle-label.free {
  color: rgba(0, 0, 0, 0.3);
}
.jo-videos-toggle-switch .slider {
  cursor: pointer;
  position: relative;
  width: 36px;
  display: block;
  height: 20px;
  background-color: var(--black);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 999px;
}
.jo-videos-toggle-switch .slider::before {
  position: absolute;
  content: "";
  aspect-ratio: 1/1;
  left: 2px;
  bottom: 2px;
  top: 2px;
  background-color: var(--white);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}

.jo-inner-videos-filter-nav {
  margin-bottom: 3.333vw;
  gap: 10px;
}
@media screen and (max-width: 991px) {
  .jo-inner-videos-filter-nav {
    margin-bottom: 25px;
  }
}
.jo-inner-videos-filter-nav button {
  background: linear-gradient(90deg, var(--ttRed), var(--tt-gold));
  border-radius: 6px;
  height: 2.188vw;
  padding: 0 20px;
  color: var(--ttRed);
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1599px) {
  .jo-inner-videos-filter-nav button {
    height: 38px;
  }
}
@media screen and (max-width: 479px) {
  .jo-inner-videos-filter-nav button {
    padding: 0 10px;
    height: 35px;
    font-size: 14px;
  }
}
.jo-inner-videos-filter-nav button::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 1px;
  background-color: var(--white);
  border-radius: 4.5px;
  transition: 0.4s ease;
}
.jo-inner-videos-filter-nav button:hover, .jo-inner-videos-filter-nav button.active {
  color: var(--white);
}
.jo-inner-videos-filter-nav button:hover::before, .jo-inner-videos-filter-nav button.active::before {
  opacity: 0;
}

.jo-inner-videos-row {
  --bs-gutter-y: 1.563vw;
  --bs-gutter-x: 1.563vw;
}

.jo-inner-video-card {
  max-width: none;
  min-width: 0;
}
.jo-inner-video-card::before {
  background: linear-gradient(0deg, rgb(0, 0, 0), transparent);
  opacity: 1;
}
.jo-inner-video-card .jo-video-card__txt {
  top: auto;
}
.jo-inner-video-card .bottom {
  transform: translate(0);
}
@media screen and (max-width: 479px) {
  .jo-inner-video-card .jo-video-card__btn {
    width: 40px;
  }
}
.jo-inner-video-card .jo-video-card__title {
  margin-top: 1.302vw;
  margin-bottom: 1.042vw;
  font-size: clamp(18px, 1.25vw, 24px);
}
.jo-inner-video-card .jo-video-card__img {
  aspect-ratio: 690/617;
  object-fit: cover;
}
@media screen and (max-width: 575px) {
  .jo-inner-video-card .jo-video-card__img {
    aspect-ratio: 1410/617;
  }
}
@media screen and (max-width: 479px) {
  .jo-inner-video-card .jo-video-card__img {
    aspect-ratio: 1410/967;
  }
}
.jo-inner-video-card--big .jo-video-card__img {
  aspect-ratio: 1410/617;
}
@media screen and (max-width: 479px) {
  .jo-inner-video-card--big .jo-video-card__img {
    aspect-ratio: 1410/967;
  }
}

.jo-inner-video-card-2 {
  border-radius: 0;
  max-width: none;
}
.jo-inner-video-card-2::before {
  content: none;
}
.jo-inner-video-card-2 .jo-video-card__img {
  aspect-ratio: 330/430;
  border-radius: 20px;
}
.jo-inner-video-card-2 .jo-video-card__txt {
  position: static;
  color: var(--black);
}
.jo-inner-video-card-2 .jo-video-card__btn {
  color: var(--ttRed);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-color: var(--white);
}
.jo-inner-video-card-2 .jo-video-card__btn:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-inner-video-card-2 .jo-video-card__title {
  color: var(--black);
  font-size: clamp(17px, 1.042vw, 20px);
  font-weight: 500;
  margin-top: 0.99vw;
  margin-bottom: 0.573vw;
}
.jo-inner-video-card-2 .jo-video-card__title:hover {
  color: var(--ttRed);
}
.jo-inner-video-card-2 .jo-video-card__infos {
  color: var(--black);
}
.jo-inner-video-card-2--big {
  margin: 0.521vw 0;
}
.jo-inner-video-card-2--big .jo-video-card__img {
  aspect-ratio: 1410/561;
  object-fit: cover;
}
@media screen and (max-width: 479px) {
  .jo-inner-video-card-2--big .jo-video-card__img {
    aspect-ratio: 1/1;
  }
}
.jo-inner-video-card-2--big .jo-video-card__btn {
  width: clamp(50px, 4.792vw, 92px);
  font-size: clamp(16px, 1.25vw, 22px);
}

.jo-inner-videos-slider .swiper-slide {
  max-width: 35.938vw;
  min-width: 276px;
}
@media screen and (max-width: 575px) {
  .jo-inner-videos-slider .jo-inner-video-card .jo-video-card__img {
    aspect-ratio: 690/617;
  }
}
.jo-inner-videos-slider-nav button {
  width: 45px;
  aspect-ratio: 1/1;
  background-color: rgba(255, 0, 0, 0.1);
  border-radius: 999px;
  color: var(--ttRed);
  padding-top: 6.5px;
}
.jo-inner-videos-slider-nav button:hover {
  background-color: var(--ttRed);
  color: var(--white);
}

.jo-inner-page-container {
  margin: 0 19.71vw;
}
@media screen and (max-width: 1599px) {
  .jo-inner-page-container {
    margin: 0 15.71vw;
  }
}
@media screen and (max-width: 1399px) {
  .jo-inner-page-container {
    margin: 0 12.71vw;
  }
}
@media screen and (max-width: 1199px) {
  .jo-inner-page-container {
    margin: 0 9.71vw;
  }
}
@media screen and (max-width: 991px) {
  .jo-inner-page-container {
    margin: 0 15px;
  }
}

.jo-video-details-wrapper {
  padding: 5.25vw 0;
}

.jo-video-details-cover {
  overflow: hidden;
  border-radius: 20px;
  position: relative;
  z-index: 2;
  margin-bottom: clamp(22px, 1.58vw, 30px);
}
.jo-video-details-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 35%, #000000 100%);
  z-index: 1;
}
.jo-video-details-cover img {
  width: 100%;
  aspect-ratio: 1170/570;
}
.jo-video-details-cover .video-btn {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: var(--white);
  font-weight: 500;
  text-align: center;
}
.jo-video-details-cover .video-btn a {
  border: 1px solid rgba(255, 255, 255, 0.2);
  width: clamp(60px, 5.25vw, 100px);
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(20px, 1.42vw, 27px);
  color: var(--white);
  margin: auto;
  margin-bottom: 15px;
}
.jo-video-details-cover .video-btn a:hover {
  background-color: var(--white);
  color: var(--tt-pink);
}
.jo-video-details-cover .video-btn a i {
  padding-top: 4px;
}
.jo-video-details-txt h2 {
  font-weight: 700;
  font-size: clamp(21px, 1.26vw, 24px);
  color: var(--black);
  margin-bottom: clamp(13px, 0.84vw, 16px);
  margin-top: 20px;
}
.jo-video-details-txt p {
  font-size: 15px;
  color: var(--ttGray2);
}
.jo-video-details-txt ul {
  font-size: clamp(13px, 0.79vw, 15px);
  color: var(--black);
  font-weight: 500;
  margin-bottom: clamp(30px, 2.84vw, 54px);
  margin-top: clamp(20px, 1.58vw, 30px);
}
.jo-video-details-txt ul li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 15px;
}
.jo-video-details-txt ul li::before {
  content: "\f11f";
  font-family: flaticon_jio_-_influencer !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ttRed);
  font-size: 14px;
}
.jo-video-details-txt ul li:last-child {
  margin-bottom: 0;
}
.jo-video-details-txt blockquote {
  background-color: rgba(255, 0, 0, 0.1);
  padding: clamp(20px, 1.58vw, 30px);
  border-radius: 20px;
  font-size: clamp(17px, 1.05vw, 20px);
  color: var(--ttGray2);
  font-style: italic;
  display: flex;
  align-items: center;
  gap: clamp(15px, 1.05vw, 20px);
}
@media screen and (max-width: 479px) {
  .jo-video-details-txt blockquote {
    flex-wrap: wrap;
  }
}
.jo-video-details-txt-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.jo-video-details-shares {
  display: flex;
  align-items: center;
  gap: 20px;
}
.jo-video-details-shares .share-options {
  display: flex;
  gap: 8px;
}
.jo-video-details-shares .share-options a {
  width: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  border: 1px solid rgba(210, 210, 210, 0.88);
  color: var(--ttGray2);
  border-radius: 999px;
  font-size: 13px;
  padding-top: 3px;
}
.jo-video-details-shares .share-options a:hover {
  background-color: var(--ttRed);
  border-color: var(--ttRed);
  color: var(--white);
}
.jo-video-details-cta {
  background: linear-gradient(45deg, var(--ttRed), var(--tt-gold));
  color: var(--white);
  padding: clamp(30px, 2.63vw, 50px);
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  align-items: center;
  justify-content: space-between;
  border-radius: 20px;
  margin-top: clamp(50px, 5.25vw, 100px);
}
.jo-video-details-cta h3 {
  font-weight: 500;
  font-size: clamp(32px, 2.1vw, 40px);
}
.jo-video-details-cta .jo-btn {
  border: 1px solid var(--white);
}
.jo-video-details-cta .jo-btn i {
  font-size: 10px;
  padding-top: 1px;
  padding-right: 3px;
}

.jo-related-videos-slider-nav button:hover {
  color: var(--ttRed);
}

.jo-video-shop {
  padding: 5.25vw 0;
}
.jo-video-shop-sidebar {
  background-color: #FFF1F1;
  padding: clamp(15px, 1.58vw, 30px);
  border-radius: 20px;
}
.jo-video-shop-sidebar-widget-title {
  font-size: clamp(15px, 0.95vw, 18px);
  font-weight: 600;
  color: var(--black);
  margin-bottom: clamp(13px, 0.84vw, 16px);
}
.jo-video-shop-sidebar > * {
  margin-bottom: clamp(20px, 2.1vw, 40px);
}
.jo-video-shop-sidebar > *:last-child {
  margin-bottom: 0;
}
.jo-video-shop-search-form {
  background-color: var(--white);
  height: 60px;
  border-radius: 10px;
  display: flex;
  align-items: center;
}
.jo-video-shop-search-form input {
  background-color: transparent;
  height: 100%;
  padding: 15px;
  width: 100%;
}
.jo-video-shop-search-form button {
  flex-shrink: 0;
  color: var(--ttRed);
  font-size: 20px;
  padding-right: 15px;
  padding-top: 6px;
  padding-left: 0;
}
.jo-video-shop-price-filter-form {
  background-color: var(--white);
  border-radius: 10px;
  padding: 15px;
}
.jo-video-shop-price-filter-form .noUi-base {
  margin-bottom: 8px;
}
.jo-video-shop-price-filter-form .noUi-horizontal {
  height: 7px;
  border: 1px solid var(--ttRed);
}
.jo-video-shop-price-filter-form .noUi-handle {
  width: 18px;
  height: 18px;
  box-shadow: none;
  border: 5px solid var(--ttRed);
  border-radius: 50%;
  top: -7px;
}
.jo-video-shop-price-filter-form .noUi-handle::before, .jo-video-shop-price-filter-form .noUi-handle::after {
  content: none;
}
.jo-video-shop-price-filter-form .noUi-connect {
  background-color: var(--ttRed);
}
.jo-video-shop-price-filter-form .noUi-touch-area::before,
.jo-video-shop-price-filter-form .noUi-touch-area::after {
  content: none;
}
.jo-video-shop-price-filter-form .filtered-price {
  font-weight: 500;
  font-size: 12px;
  color: var(--black);
  display: block;
  margin-top: 10px;
}
.jo-video-shop-categories-link {
  background-color: var(--white);
  border-radius: 10px;
  padding: 25px 15px;
}
.jo-video-shop-categories-link a {
  display: flex;
  justify-content: space-between;
  color: var(--black);
  margin-bottom: 15px;
}
.jo-video-shop-categories-link a:hover {
  color: var(--ttRed);
}
.jo-video-shop-categories-link a:last-child {
  margin-bottom: 0;
}
.jo-video-shop-video-status-form {
  background-color: var(--white);
  border-radius: 10px;
  padding: 15px;
}
.jo-video-shop-video-status-form > *:not(:last-child) {
  margin-bottom: 10px;
}
.jo-video-shop-video-status-form label {
  position: relative;
  display: inline-block;
}
.jo-video-shop-video-status-form span {
  padding-left: 30px;
  display: inline-block;
}
.jo-video-shop-video-status-form span::before, .jo-video-shop-video-status-form span::after {
  content: "";
  position: absolute;
  width: 20px;
  aspect-ratio: 1/1;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.jo-video-shop-video-status-form span::after {
  width: 8px;
  aspect-ratio: 1/1;
  background-color: var(--ttRed);
  border: none;
  left: 6px;
  opacity: 0;
}
.jo-video-shop-video-status-form input[type=radio]:checked + span::after {
  opacity: 1;
}
.jo-video-shop-row {
  --bs-gutter-x: 30px;
  --bs-gutter-y: 30px;
}
@media screen and (max-width: 1599px) {
  .jo-video-shop-row {
    --bs-gutter-x: 20px;
    --bs-gutter-y: 20px;
  }
}

.jo-video-shop-item .premium-badge {
  position: absolute;
  top: clamp(20px, 1.58vw, 30px);
  left: clamp(20px, 1.58vw, 30px);
  width: clamp(40px, 2.63vw, 50px);
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--white);
  color: var(--ttRed);
  border-radius: 50%;
  padding-top: 5px;
}
.jo-video-shop-item .jo-video-card__btn {
  transform: translate(0);
  bottom: clamp(20px, 1.58vw, 30px);
  left: clamp(20px, 1.58vw, 30px);
  top: auto;
  width: clamp(40px, 2.63vw, 50px);
}
.jo-video-shop-item .jo-video-card__infos {
  color: var(--ttRed);
  font-weight: 500;
}
.jo-video-shop-item .jo-video-card__title:hover {
  color: var(--ttRed);
}

.jo-video-shop-details {
  padding-top: clamp(60px, 5.25vw, 100px);
  padding-bottom: clamp(60px, 5.25vw, 100px);
}
.jo-video-shop-details-video-cover {
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: clamp(17px, 1.21vw, 23px);
}
.jo-video-shop-details-video-cover .jo-video-card__btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--white);
  color: var(--ttRed);
  width: clamp(50px, 3.68vw, 70px);
  font-size: clamp(15px, 0.95vw, 18px);
}
.jo-video-shop-details-video-cover .jo-video-card__btn:hover {
  color: var(--white);
  background-color: var(--ttRed);
}
.jo-video-shop-details-title {
  font-weight: 600;
  font-size: clamp(22px, 1.58vw, 30px);
  margin-bottom: clamp(13px, 0.84vw, 16px);
}
.jo-video-shop-details-descr {
  color: var(--ttGray2);
  font-size: clamp(13px, 0.79vw, 15px);
}
.jo-video-shop-details-sidebar > * {
  margin-bottom: 0;
}
.jo-video-shop-details-sidebar-title {
  font-weight: 600;
  font-size: clamp(15px, 0.95vw, 18px);
}
.jo-video-shop-details-video-info {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: clamp(15px, 1.58vw, 30px);
}
@media screen and (max-width: 1799px) {
  .jo-video-shop-details-video-info {
    padding: clamp(15px, 1.28vw, 30px);
  }
}
.jo-video-shop-details-video-info:last-child {
  border: none;
}
.jo-video-shop-details-video-info p {
  font-size: 14px;
}
.jo-video-shop-details-video-info .jo-btn {
  width: 100%;
  margin-top: clamp(10px, 1vw, 19px);
}
@media screen and (max-width: 1799px) {
  .jo-video-shop-details-video-info .jo-btn {
    padding: 0 15px;
  }
}
.jo-video-shop-details-video-info .jo-btn i {
  font-size: 10px;
}

.jo-login {
  padding: 12.4vw 0 10.19vw 38.62vw;
  background: url(../img/login-bg.jpg) no-repeat center center;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .jo-login {
    padding: 12.4vw 0 10.19vw 28.62vw;
  }
}
@media screen and (max-width: 479px) {
  .jo-login {
    padding: 12.4vw 15px 10.19vw 15px;
  }
}

.jo-auth-form-wrapper {
  background-color: var(--white);
  width: max-content;
  max-width: 100%;
  border-radius: 20px;
  overflow: hidden;
  max-width: clamp(310px, 30.11vw, 573px);
}
@media screen and (max-width: 767px) {
  .jo-auth-form-wrapper {
    max-width: clamp(290px, 60.11vw, 573px);
  }
}
@media screen and (max-width: 479px) {
  .jo-auth-form-wrapper {
    max-width: clamp(290px, 100%, 100%);
    width: 100%;
  }
}
.jo-auth-form-wrapper .heading {
  background-color: var(--ttRed);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(25px, 2.1vw, 40px);
  color: var(--white);
}
.jo-auth-form-wrapper .heading .logo {
  max-width: 40%;
}
.jo-auth-form-wrapper .heading h3 {
  margin-bottom: 0;
  font-weight: 600;
  font-size: clamp(18px, 1.58vw, 30px);
}
.jo-auth-form-wrapper .bottom {
  padding: clamp(25px, 2.1vw, 40px);
}
.jo-auth-form-wrapper form input {
  width: 100%;
  border: 1px solid rgba(0, 0, 0, 0.22);
  height: clamp(45px, 4.2vw, 80px);
  padding: clamp(15px, 1.58vw, 30px);
  border-radius: 10px;
  margin-bottom: clamp(15px, 1.05vw, 20px);
}
.jo-auth-form-wrapper form .forget-password-btn {
  color: var(--ttGray2);
  font-size: clamp(13px, 0.84vw, 16px);
  padding-top: clamp(7px, 0.53vw, 10px);
  padding-bottom: clamp(15px, 1.16vw, 22px);
}
.jo-auth-form-wrapper form .forget-password-btn:hover {
  color: var(--ttRed);
}
.jo-auth-form-wrapper form .jo-btn {
  width: 100%;
  height: clamp(45px, 2.73vw, 52px);
}
.jo-auth-form-wrapper p {
  text-align: center;
  margin-top: clamp(20px, 1.58vw, 30px);
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-auth-form-wrapper p a {
  color: var(--ttRed);
}
.jo-auth-form-wrapper p a:hover {
  color: var(--black);
}

.jo-register {
  padding-top: clamp(50px, 5.25vw, 100px);
  padding-bottom: clamp(50px, 5.25vw, 100px);
}

.jo-checkout-wrapper {
  margin: 5.25vw 26.01vw;
}
@media screen and (max-width: 1199px) {
  .jo-checkout-wrapper {
    margin: 5.25vw 20.01vw;
  }
}
@media screen and (max-width: 991px) {
  .jo-checkout-wrapper {
    margin: 60px 15px;
  }
}

.jo-checkout-form {
  background-color: rgba(255, 0, 0, 0.06);
  border-radius: 20px;
}
.jo-checkout-form .form-block {
  padding: clamp(20px, 2.1vw, 40px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.jo-checkout-form .form-block:last-child {
  border-bottom: 0;
}
.jo-checkout-form .form-block .block-title {
  font-weight: 600;
  font-size: clamp(22px, 1.58vw, 30px);
  margin-bottom: clamp(18px, 1.21vw, 23px);
}
.jo-checkout-form .form-block p {
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-checkout-form .form-block p a {
  color: var(--ttRed);
}
.jo-checkout-form input {
  width: 100%;
  height: clamp(50px, 4.2vw, 80px);
  padding: clamp(15px, 1.58vw, 30px);
  border-radius: 10px;
  margin-bottom: clamp(15px, 1.05vw, 20px);
}

.jo-checkout-payment-methods label {
  display: flex;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding-bottom: clamp(8px, 0.79vw, 15px);
  margin-bottom: clamp(8px, 0.79vw, 15px);
  font-weight: 600;
}
.jo-checkout-payment-methods label > span::before, .jo-checkout-payment-methods label > span::after {
  top: 16px;
}
.jo-checkout-payment-methods label .content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.jo-checkout-note {
  width: 100%;
  background-color: var(--white);
  border-radius: 10px;
  padding: clamp(15px, 1.58vw, 30px);
  border: 1px solid transparent;
  height: 212px;
  margin-top: clamp(25px, 2.1vw, 40px);
  vertical-align: top;
  margin-bottom: clamp(30px, 2.36vw, 43px);
}
.jo-checkout-note:focus, .jo-checkout-note:focus-visible, .jo-checkout-note:focus-within {
  outline: none;
  border-color: var(--ttRed);
}

.jo-checkout-agreement-wrapper {
  margin-bottom: clamp(20px, 2.1vw, 40px);
}
.jo-checkout-agreement-wrapper label {
  padding-left: 30px;
  position: relative;
  display: inline-block;
}
.jo-checkout-agreement-wrapper label .txt::before,
.jo-checkout-agreement-wrapper label .txt::after {
  content: "";
  position: absolute;
  width: 20px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 1px solid var(--ttGray2);
  top: 4px;
  left: 0;
}
.jo-checkout-agreement-wrapper label .txt::after {
  width: 10px;
  top: 9px;
  left: 5px;
  border: none;
  background-color: var(--ttRed);
  opacity: 0;
}
.jo-checkout-agreement-wrapper label input:checked ~ .txt::after {
  opacity: 1;
}

.jo-checkout-total {
  margin-bottom: clamp(10px, 0.95vw, 18px);
}
.jo-checkout-total h4 {
  font-weight: 600;
  font-size: clamp(20px, 1.58vw, 30px);
  margin-bottom: 0.53vw;
}
.jo-checkout-total .number {
  font-weight: 600;
  font-size: clamp(24px, 2.1vw, 40px);
}

.jo-inner-blogs {
  padding: clamp(60px, 5.25vw, 100px) 0;
}
.jo-inner-blogs-sidebar > * {
  margin-bottom: clamp(15px, 1.26vw, 24px);
}
.jo-inner-blogs-sidebar-widget {
  padding: clamp(25px, 2.1vw, 40px) clamp(15px, 1.58vw, 30px);
  background-color: rgba(255, 0, 0, 0.1);
  border-radius: 10px;
}
.jo-inner-blogs-sidebar-widget-title {
  font-weight: 700;
  font-size: clamp(18px, 1.16vw, 22px);
  color: var(--black);
  position: relative;
  padding-bottom: clamp(4px, 0.47vw, 9px);
  margin-bottom: clamp(15px, 1.58vw, 30px);
}
.jo-inner-blogs-sidebar-widget-title::before {
  content: "";
  position: absolute;
  bottom: 0;
  height: 2px;
  width: clamp(35px, 2.63vw, 50px);
  background-color: var(--ttRed);
}
.jo-inner-blogs-search-form {
  background-color: var(--white);
  height: clamp(45px, 3.15vw, 60px);
  border-radius: 10px;
  padding: 0 clamp(12px, 1.05vw, 20px);
  display: flex;
  align-items: center;
}
.jo-inner-blogs-search-form input {
  width: 100%;
  background-color: transparent;
}
.jo-inner-blogs-search-form button {
  color: var(--ttRed);
  padding: 0;
  padding-top: 3px;
  font-size: 20px;
}
.jo-inner-blogs-categories a {
  background-color: var(--white);
  border-radius: 10px;
  height: clamp(46px, 2.94vw, 56px);
  padding: 0 clamp(15px, 1.05vw, 20px);
  background-color: var(--white);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: clamp(13px, 0.84vw, 16px);
  color: var(--black);
  margin-bottom: clamp(9px, 0.63vw, 12px);
}
.jo-inner-blogs-categories a:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-inner-blogs-sidebar-post {
  display: flex;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  align-items: center;
  gap: clamp(12px, 0.79vw, 15px);
  padding: clamp(12px, 1.05vw, 20px) 0;
}
.jo-inner-blogs-sidebar-post:first-child {
  padding-top: 0;
}
.jo-inner-blogs-sidebar-post:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.jo-inner-blogs-sidebar-post .img {
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 10px;
}
.jo-inner-blogs-sidebar-post .img img {
  width: 78px;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.jo-inner-blogs-sidebar-post .date {
  font-size: clamp(12px, 0.74vw, 14px);
  color: var(--ttRed);
  display: flex;
  align-items: center;
  gap: 8px;
}
.jo-inner-blogs-sidebar-post .date .icon {
  padding-top: 4px;
  font-size: 16px;
}
.jo-inner-blogs-sidebar-post .title {
  font-size: clamp(13px, 0.84vw, 16px);
  line-height: 1.6;
  margin-bottom: 0;
}
.jo-inner-blogs-sidebar-post .title a {
  font-weight: 600;
  color: var(--black);
}
.jo-inner-blogs-sidebar-post .title a:hover {
  color: var(--ttRed);
}
.jo-inner-blogs-tags {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(3px, 0.63vw, 6px);
}
.jo-inner-blogs-tags a {
  height: clamp(28px, 1.79vw, 34px);
  padding: 0 clamp(9px, 0.63vw, 12px);
  background-color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  color: var(--black);
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-inner-blogs-tags a:hover {
  background-color: var(--ttRed);
  color: var(--white);
}

.jo-inner-blog {
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: clamp(15px, 1.58vw, 30px);
  margin-bottom: clamp(18px, 1.26vw, 24px);
  border-radius: 20px;
}
.jo-inner-blog-img {
  margin-bottom: clamp(18px, 1.26vw, 24px);
  border-radius: 20px;
  overflow: hidden;
}
.jo-inner-blog-img img {
  width: 100%;
  aspect-ratio: 869/470;
  object-fit: cover;
}
.jo-inner-blog-infos {
  display: flex;
  flex-wrap: wrap;
  gap: 4px clamp(15px, 1.58vw, 30px);
  font-size: 14px;
  margin-bottom: clamp(11px, 0.74vw, 14px);
}
.jo-inner-blog-infos > *:not(:first-child) {
  position: relative;
  padding-left: clamp(22px, 1.94vw, 37px);
}
.jo-inner-blog-infos > *:not(:first-child)::before {
  content: "";
  position: absolute;
  width: 7px;
  aspect-ratio: 1/1;
  background-color: var(--ttRed);
  border-radius: 50%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.jo-inner-blog-infos .author {
  color: var(--ttRed);
  font-weight: 500;
}
.jo-inner-blog-infos .author .name {
  color: var(--ttGray2);
  font-weight: 400;
}
.jo-inner-blog-infos .date {
  color: var(--black);
}
.jo-inner-blog-title {
  font-weight: 700;
  font-size: clamp(20px, 1.26vw, 24px);
  margin-bottom: clamp(10px, 0.79vw, 15px);
}
.jo-inner-blog-title a {
  color: var(--black);
}
.jo-inner-blog-title a:hover {
  color: var(--ttRed);
}
.jo-inner-blog-descr {
  color: var(--ttGray2);
  font-size: clamp(13px, 0.84vw, 16px);
  margin-bottom: clamp(18px, 1.37vw, 26px);
}
.jo-inner-blog-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.jo-inner-blog-actions > * {
  height: clamp(36px, 2.21vw, 42px);
  border-radius: 10px;
}
.jo-inner-blog-actions a {
  aspect-ratio: 1/1;
  background-color: rgba(255, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ttRed);
  font-size: clamp(17px, 1.05vw, 20px);
}
.jo-inner-blog-actions a:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-inner-blog-actions .share-btn {
  border: 1px solid rgba(255, 0, 0, 0.1);
  padding: 0 clamp(10px, 1.16vw, 22px);
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-inner-blog-actions .share-btn:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-inner-blog-actions .share-btn:hover i {
  color: var(--white);
}
.jo-inner-blog-actions .share-btn i {
  color: var(--ttRed);
  padding-top: 2px;
  transition: 0.4s ease;
}

.jo-inner-pricing-plan {
  background-color: var(--white);
  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);
  padding: clamp(25px, 2.1vw, 40px);
  position: relative;
  overflow: hidden;
  z-index: 1;
  border-radius: 16px;
  background: url(../img/pricing-plan-bg.svg) rgba(0, 0, 0, 0.02) no-repeat;
  background-position-x: 0;
  background-position-y: 0;
  background-size: cover;
}
.jo-inner-pricing-plan::before {
  content: "";
  position: absolute;
  z-index: -1;
  background: url(../img/pricing-plan-vector.svg) no-repeat center center;
  background-size: 100% 100%;
  width: 317px;
  height: 268px;
  top: 60%;
  transform: translateY(-50%);
  right: 0;
  pointer-events: none;
}
.jo-inner-pricing-plan .plan-icon {
  width: clamp(60px, 3.68vw, 70px);
  aspect-ratio: 1/1;
  border-radius: 8px;
  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);
  position: absolute;
  top: 0;
  left: 0;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--white);
}
.jo-inner-pricing-plan .plan-icon img {
  max-width: clamp(35px, 2.63vw, 50px);
}
.jo-inner-pricing-plan .heading {
  padding-left: clamp(45px, 3.68vw, 70px);
  padding-left: 80px;
  border-bottom: 1px solid #D4DCFF;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: clamp(25px, 2.1vw, 40px);
}
.jo-inner-pricing-plan .heading .title {
  font-weight: 700;
  font-size: clamp(20px, 1.26vw, 24px);
}
.jo-inner-pricing-plan .heading .sub-title {
  font-size: clamp(13px, 0.84vw, 16px);
  font-weight: 300;
}
.jo-inner-pricing-plan .heading .price {
  font-weight: 700;
  font-size: clamp(24px, 1.58vw, 30px);
}
.jo-inner-pricing-plan .plan-features {
  padding: clamp(25px, 2.1vw, 40px) 0 clamp(15px, 1.58vw, 30px);
}
.jo-inner-pricing-plan .plan-features li {
  position: relative;
  padding: 0 24px;
  font-weight: 600;
  margin-bottom: clamp(9px, 0.63vw, 12px);
}
.jo-inner-pricing-plan .plan-features li:last-child {
  margin-bottom: 0;
}
.jo-inner-pricing-plan .plan-features li::before, .jo-inner-pricing-plan .plan-features li::after {
  content: "";
  position: absolute;
  top: 3px;
  width: 16px;
  aspect-ratio: 1/1;
}
.jo-inner-pricing-plan .plan-features li::before {
  left: 0;
  background: url(../img/checkmark.svg) no-repeat center center;
  background-size: cover;
}
.jo-inner-pricing-plan .plan-features li::after {
  right: 0;
  content: "\f121";
  font-family: flaticon_jio_-_influencer !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #445375;
}
.jo-inner-pricing-plan-btn {
  height: clamp(45px, 2.94vw, 56px);
  background-color: var(--ttRed);
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-weight: 600;
  gap: 10px;
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-inner-pricing-plan-btn:hover {
  color: var(--white);
  background-color: var(--black);
}
.jo-inner-pricing-plan-btn i {
  font-size: 14px;
}

.jo-contact-info {
  border: 1px solid rgba(255, 0, 0, 0.1);
  padding: clamp(15px, 1.58vw, 30px);
  border-radius: 16px;
  text-align: center;
}
.jo-contact-info .icon {
  border: 1px solid rgba(255, 0, 0, 0.1);
  border-radius: 8px;
  width: clamp(55px, 3.68vw, 70px);
  aspect-ratio: 1/1;
  margin: auto;
  padding: 5px;
  color: var(--ttRed);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(25px, 1.84vw, 35px);
  margin-bottom: clamp(10px, 0.84vw, 16px);
}
.jo-contact-info .title {
  font-weight: 700;
  font-size: clamp(18px, 1.26vw, 24px);
  margin-bottom: clamp(7px, 0.53vw, 10px);
}
.jo-contact-info .title a {
  color: var(--black);
}
.jo-contact-info .title a:hover {
  color: var(--ttRed);
}
.jo-contact-info .descr {
  margin-bottom: 0;
  color: #445375;
  font-size: clamp(13px, 0.84vw, 16px);
}

.jo-inner-contact-form-section {
  background-color: rgba(255, 0, 0, 0.05);
  padding-top: clamp(50px, 5.25vw, 100px);
}
.jo-inner-contact-form-wrapper {
  background-color: var(--white);
  padding: clamp(25px, 2.36vw, 45px);
  border-radius: 16px;
  margin-bottom: clamp(50px, 5.25vw, 100px);
}
.jo-inner-contact-from-left-title {
  font-weight: 700;
  font-size: clamp(25px, 2.1vw, 40px);
  margin-bottom: clamp(33px, 3.05vw, 58px);
}
.jo-inner-contact-img {
  background: url(../img/inner-contact-img-vector.svg) no-repeat top center;
  background-size: contain;
  padding-top: 25px;
}
.jo-inner-contact-form-title {
  font-weight: 700;
  font-size: clamp(24px, 1.58vw, 30px);
}
.jo-inner-contact-form input,
.jo-inner-contact-form textarea,
.jo-inner-contact-form .ss-main {
  height: clamp(45px, 3.15vw, 60px);
  border: 1px solid rgba(255, 0, 0, 0.1);
  border-radius: 8px;
  width: 100%;
  padding: 0 clamp(15px, 1.05vw, 20px);
}
.jo-inner-contact-form input:focus, .jo-inner-contact-form input:focus-visible, .jo-inner-contact-form input:focus-within,
.jo-inner-contact-form textarea:focus,
.jo-inner-contact-form textarea:focus-visible,
.jo-inner-contact-form textarea:focus-within,
.jo-inner-contact-form .ss-main:focus,
.jo-inner-contact-form .ss-main:focus-visible,
.jo-inner-contact-form .ss-main:focus-within {
  outline: none;
  box-shadow: none;
}
.jo-inner-contact-form textarea {
  padding: clamp(15px, 1.05vw, 20px);
  height: 150px;
  vertical-align: top;
  margin-bottom: clamp(15px, 1.58vw, 30px);
}
.jo-inner-contact-form .submit-btn {
  height: clamp(45px, 3.15vw, 60px);
  background-color: var(--ttRed);
  border-radius: 8px;
  width: 100%;
  color: var(--white);
  font-weight: 600;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}
.jo-inner-contact-form .submit-btn:hover {
  background-color: var(--black);
  color: var(--white);
}
.jo-inner-contact-form .submit-btn i {
  font-size: 12px;
  padding-top: 3px;
}

.ss-content .ss-list .ss-option.ss-highlighted,
.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {
  background-color: var(--ttRed);
}

.ss-content .ss-list .ss-option:hover {
  background-color: var(--ttRed);
}

.jo-blog-details-img {
  border-radius: 20px;
  overflow: hidden;
}
.jo-blog-details-txt p {
  font-size: 15px;
  color: var(--ttGray2);
}
.jo-blog-details-txt ul {
  font-size: clamp(13px, 0.79vw, 15px);
  color: var(--black);
  font-weight: 500;
  margin-bottom: clamp(30px, 1.58vw, 30px);
  margin-top: clamp(20px, 1.58vw, 30px);
}
.jo-blog-details-txt ul li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 15px;
}
.jo-blog-details-txt ul li::before {
  content: "\f11f";
  font-family: flaticon_jio_-_influencer !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ttRed);
  font-size: 14px;
}
.jo-blog-details-txt ul li:last-child {
  margin-bottom: 0;
}
.jo-blog-details-txt blockquote {
  background-color: rgba(255, 0, 0, 0.05);
  padding: clamp(30px, 2.1vw, 40px) clamp(20px, 1.58vw, 30px);
  padding-right: clamp(80px, 6.83vw, 130px);
  border-left: 4px solid var(--ttRed);
  font-size: 16px;
  font-weight: 500;
  font-style: italic;
  position: relative;
}
@media screen and (max-width: 479px) {
  .jo-blog-details-txt blockquote {
    flex-wrap: wrap;
  }
}
.jo-blog-details-txt blockquote .quotation-icon {
  position: absolute;
  bottom: 30px;
  right: 30px;
}
.jo-blog-details-inner-imgs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(15px, 1.58vw, 30px);
  margin-bottom: 15px;
}
@media screen and (max-width: 479px) {
  .jo-blog-details-inner-imgs {
    grid-template-columns: repeat(1, 1fr);
  }
}
.jo-blog-details-inner-imgs img {
  width: 100%;
  aspect-ratio: 450/269;
  border-radius: 15px;
}
.jo-blog-details-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: space-between;
  border: solid #D4DCFF;
  border-width: 1px 0 1px 0;
  padding: 20px 0;
}
.jo-blog-details-actions .tags-wrapper,
.jo-blog-details-actions .share {
  display: flex;
  gap: 15px;
  align-items: center;
}
.jo-blog-details-actions .title {
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 0;
}
.jo-blog-details-actions .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.jo-blog-details-actions .tags a {
  height: 34px;
  background-color: #F8F8F8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  padding: 0 16px;
  color: var(--black);
}
.jo-blog-details-actions .tags a:hover {
  background-color: var(--ttRed);
  color: var(--white);
}
.jo-blog-details-actions .share-options {
  display: flex;
  gap: 20px;
  align-items: center;
  font-size: 18px;
}
.jo-blog-details-actions .share-options a {
  color: #445375;
}
.jo-blog-details-actions .share-options a:hover {
  color: var(--ttRed);
}

.jo-blog-comments {
  margin-top: clamp(30px, 3.15vw, 60px);
}
.jo-blog-comments-title {
  font-weight: 600;
  font-size: clamp(20px, 1.26vw, 24px);
  margin-bottom: clamp(28px, 1.84vw, 35px);
}

.jo-blog-comment {
  display: flex;
  gap: 20px;
}
.jo-blog-comment:not(:last-child) {
  border-bottom: 1px solid #D4DCFF;
  padding-bottom: clamp(25px, 2.1vw, 40px);
  margin-bottom: clamp(25px, 2.1vw, 40px);
}
.jo-blog-comment-user-img {
  flex-shrink: 0;
}
.jo-blog-comment-user-img img {
  width: clamp(56px, 5.04vw, 96px);
  border-radius: 50%;
}
.jo-blog-comment-txt {
  padding-top: clamp(20px, 1.31vw, 25px);
}
.jo-blog-comment-txt .heading {
  margin-bottom: 12px;
}
.jo-blog-comment-txt .name {
  font-weight: 500;
  font-size: clamp(17px, 1.05vw, 20px);
}
.jo-blog-comment-txt .date {
  color: #445375;
  font-size: clamp(13px, 0.84vw, 16px);
}
.jo-blog-comment-txt .descr {
  color: #445375;
}
.jo-blog-comment-txt .reply-btn {
  border-radius: 999px;
  background-color: rgba(255, 0, 0, 0.1);
  height: 30px;
  font-size: 14px;
  padding: 0 16px;
  color: var(--ttRed);
}
.jo-blog-comment-txt .reply-btn:hover {
  background-color: var(--ttRed);
  color: var(--white);
}

.jo-blog-comment-form-wrapper {
  padding-top: clamp(30px, 3.15vw, 60px);
  border-top: 1px solid rgba(255, 0, 0, 0.1);
  margin-top: clamp(25px, 2.1vw, 40px);
}
.jo-blog-comment-form-title {
  font-weight: 600;
  font-size: clamp(21px, 1.26vw, 24px);
  margin-bottom: clamp(25px, 2.1vw, 40px);
}
.jo-blog-comment-form label {
  display: block;
  font-weight: 500;
  margin-bottom: 10px;
}
.jo-blog-comment-form input,
.jo-blog-comment-form textarea {
  height: clamp(55px, 2.94vw, 56px);
  border: 1px solid rgba(255, 0, 0, 0.1);
  border-radius: 4px;
  width: 100%;
  padding: 0 clamp(15px, 1.05vw, 20px);
}
.jo-blog-comment-form input:focus, .jo-blog-comment-form input:focus-visible, .jo-blog-comment-form input:focus-within,
.jo-blog-comment-form textarea:focus,
.jo-blog-comment-form textarea:focus-visible,
.jo-blog-comment-form textarea:focus-within {
  outline: none;
}
.jo-blog-comment-form textarea {
  padding: clamp(15px, 1.05vw, 20px);
  height: 200px;
  vertical-align: top;
}
.jo-blog-comment-form button {
  background-color: var(--ttRed);
  height: clamp(45px, 2.94vw, 56px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 clamp(18px, 1.26vw, 24px);
  border-radius: 6px;
  gap: 8px;
  color: var(--white);
  margin-top: clamp(15px, 1.58vw, 30px);
}
.jo-blog-comment-form button i {
  font-size: 22px;
  padding-top: 3px;
}/*# sourceMappingURL=style.css.map */

/* ============================================================
   theme_assets/macheteverse/css/default.css
   ============================================================ */
/* Deafult Margin & Padding */
/*-- Margin Top --*/
.mt-5 {
	margin-top: 5px;
}
.mt-10 {
	margin-top: 10px;
}
.mt-15 {
	margin-top: 15px;
}
.mt-20 {
	margin-top: 20px;
}
.mt-25 {
	margin-top: 25px;
}
.mt-30 {
	margin-top: 30px;
}
.mt-35 {
	margin-top: 35px;
}
.mt-40 {
	margin-top: 40px;
}
.mt-45 {
	margin-top: 45px;
}
.mt-50 {
	margin-top: 50px;
}
.mt-55 {
	margin-top: 55px;
}
.mt-60 {
	margin-top: 60px;
}
.mt-65 {
	margin-top: 65px;
}
.mt-70 {
	margin-top: 70px;
}
.mt-75 {
	margin-top: 75px;
}
.mt-80 {
	margin-top: 80px;
}
.mt-85 {
	margin-top: 85px;
}
.mt-90 {
	margin-top: 90px;
}
.mt-95 {
	margin-top: 95px;
}
.mt-100 {
	margin-top: 100px;
}
.mt-105 {
	margin-top: 105px;
}
.mt-110 {
	margin-top: 110px;
}
.mt-115 {
	margin-top: 115px;
}
.mt-120 {
	margin-top: 120px;
}
.mt-125 {
	margin-top: 125px;
}
.mt-130 {
	margin-top: 130px;
}
.mt-135 {
	margin-top: 135px;
}
.mt-140 {
	margin-top: 140px;
}
.mt-145 {
	margin-top: 145px;
}
.mt-150 {
	margin-top: 150px;
}
.mt-155 {
	margin-top: 155px;
}
.mt-160 {
	margin-top: 160px;
}
.mt-165 {
	margin-top: 165px;
}
.mt-170 {
	margin-top: 170px;
}
.mt-175 {
	margin-top: 175px;
}
.mt-180 {
	margin-top: 180px;
}
.mt-185 {
	margin-top: 185px;
}
.mt-190 {
	margin-top: 190px;
}
.mt-195 {
	margin-top: 195px;
}
.mt-200 {
	margin-top: 200px;
}
/*-- Margin Bottom --*/

.mb-5 {
	margin-bottom: 5px;
}
.mb-10 {
	margin-bottom: 10px;
}
.mb-15 {
	margin-bottom: 15px;
}
.mb-20 {
	margin-bottom: 20px;
}
.mb-25 {
	margin-bottom: 25px;
}
.mb-30 {
	margin-bottom: 30px;
}
.mb-35 {
	margin-bottom: 35px;
}
.mb-40 {
	margin-bottom: 40px;
}
.mb-45 {
	margin-bottom: 45px;
}
.mb-50 {
	margin-bottom: 50px;
}
.mb-55 {
	margin-bottom: 55px;
}
.mb-60 {
	margin-bottom: 60px;
}
.mb-65 {
	margin-bottom: 65px;
}
.mb-70 {
	margin-bottom: 70px;
}
.mb-75 {
	margin-bottom: 75px;
}
.mb-80 {
	margin-bottom: 80px;
}
.mb-85 {
	margin-bottom: 85px;
}
.mb-90 {
	margin-bottom: 90px;
}
.mb-95 {
	margin-bottom: 95px;
}
.mb-100 {
	margin-bottom: 100px;
}
.mb-105 {
	margin-bottom: 105px;
}
.mb-110 {
	margin-bottom: 110px;
}
.mb-115 {
	margin-bottom: 115px;
}
.mb-120 {
	margin-bottom: 120px;
}
.mb-125 {
	margin-bottom: 125px;
}
.mb-130 {
	margin-bottom: 130px;
}
.mb-135 {
	margin-bottom: 135px;
}
.mb-140 {
	margin-bottom: 140px;
}
.mb-145 {
	margin-bottom: 145px;
}
.mb-150 {
	margin-bottom: 150px;
}
.mb-155 {
	margin-bottom: 155px;
}
.mb-160 {
	margin-bottom: 160px;
}
.mb-165 {
	margin-bottom: 165px;
}
.mb-170 {
	margin-bottom: 170px;
}
.mb-175 {
	margin-bottom: 175px;
}
.mb-180 {
	margin-bottom: 180px;
}
.mb-185 {
	margin-bottom: 185px;
}
.mb-190 {
	margin-bottom: 190px;
}
.mb-195 {
	margin-bottom: 195px;
}
.mb-200 {
	margin-bottom: 200px;
}
/*-- Padding Top --*/

.pt-5 {
	padding-top: 5px;
}
.pt-10 {
	padding-top: 10px;
}
.pt-15 {
	padding-top: 15px;
}
.pt-20 {
	padding-top: 20px;
}
.pt-25 {
	padding-top: 25px;
}
.pt-30 {
	padding-top: 30px;
}
.pt-35 {
	padding-top: 35px;
}
.pt-40 {
	padding-top: 40px;
}
.pt-45 {
	padding-top: 45px;
}
.pt-50 {
	padding-top: 50px;
}
.pt-55 {
	padding-top: 55px;
}
.pt-60 {
	padding-top: 60px;
}
.pt-65 {
	padding-top: 65px;
}
.pt-70 {
	padding-top: 70px;
}
.pt-75 {
	padding-top: 75px;
}
.pt-80 {
	padding-top: 80px;
}
.pt-85 {
	padding-top: 85px;
}
.pt-90 {
	padding-top: 90px;
}
.pt-95 {
	padding-top: 95px;
}
.pt-100 {
	padding-top: 100px;
}
.pt-105 {
	padding-top: 105px;
}
.pt-110 {
	padding-top: 110px;
}
.pt-115 {
	padding-top: 115px;
}
.pt-120 {
	padding-top: 120px;
}
.pt-125 {
	padding-top: 125px;
}
.pt-130 {
	padding-top: 130px;
}
.pt-135 {
	padding-top: 135px;
}
.pt-140 {
	padding-top: 140px;
}
.pt-145 {
	padding-top: 145px;
}
.pt-150 {
	padding-top: 150px;
}
.pt-155 {
	padding-top: 155px;
}
.pt-160 {
	padding-top: 160px;
}
.pt-165 {
	padding-top: 165px;
}
.pt-170 {
	padding-top: 170px;
}
.pt-175 {
	padding-top: 175px;
}
.pt-180 {
	padding-top: 180px;
}
.pt-185 {
	padding-top: 185px;
}
.pt-190 {
	padding-top: 190px;
}
.pt-195 {
	padding-top: 195px;
}
.pt-200 {
	padding-top: 200px;
}
/*-- Padding Bottom --*/

.pb-5 {
	padding-bottom: 5px;
}
.pb-10 {
	padding-bottom: 10px;
}
.pb-15 {
	padding-bottom: 15px;
}
.pb-20 {
	padding-bottom: 20px;
}
.pb-25 {
	padding-bottom: 25px;
}
.pb-30 {
	padding-bottom: 30px;
}
.pb-35 {
	padding-bottom: 35px;
}
.pb-40 {
	padding-bottom: 40px;
}
.pb-45 {
	padding-bottom: 45px;
}
.pb-50 {
	padding-bottom: 50px;
}
.pb-55 {
	padding-bottom: 55px;
}
.pb-60 {
	padding-bottom: 60px;
}
.pb-65 {
	padding-bottom: 65px;
}
.pb-70 {
	padding-bottom: 70px;
}
.pb-75 {
	padding-bottom: 75px;
}
.pb-80 {
	padding-bottom: 80px;
}
.pb-85 {
	padding-bottom: 85px;
}
.pb-90 {
	padding-bottom: 90px;
}
.pb-95 {
	padding-bottom: 95px;
}
.pb-100 {
	padding-bottom: 100px;
}
.pb-105 {
	padding-bottom: 105px;
}
.pb-110 {
	padding-bottom: 110px;
}
.pb-115 {
	padding-bottom: 115px;
}
.pb-120 {
	padding-bottom: 120px;
}
.pb-125 {
	padding-bottom: 125px;
}
.pb-130 {
	padding-bottom: 130px;
}
.pb-135 {
	padding-bottom: 135px;
}
.pb-140 {
	padding-bottom: 140px;
}
.pb-145 {
	padding-bottom: 145px;
}
.pb-150 {
	padding-bottom: 150px;
}
.pb-155 {
	padding-bottom: 155px;
}
.pb-160 {
	padding-bottom: 160px;
}
.pb-165 {
	padding-bottom: 165px;
}
.pb-170 {
	padding-bottom: 170px;
}
.pb-175 {
	padding-bottom: 175px;
}
.pb-180 {
	padding-bottom: 180px;
}
.pb-185 {
	padding-bottom: 185px;
}
.pb-190 {
	padding-bottom: 190px;
}
.pb-195 {
	padding-bottom: 195px;
}
.pb-200 {
	padding-bottom: 200px;
}



/*-- Padding Left --*/
.pl-0 {
	padding-left: 0px;
}
.pl-5 {
	padding-left: 5px;
}
.pl-10 {
	padding-left: 10px;
}
.pl-15 {
	padding-left: 15px;
}
.pl-20{
	padding-left: 20px;
}
.pl-25 {
	padding-left: 35px;
}
.pl-30 {
	padding-left: 30px;
}
.pl-35 {
	padding-left: 35px;
}

.pl-35 {
	padding-left: 35px;
}

.pl-40 {
	padding-left: 40px;
}

.pl-45 {
	padding-left: 45px;
}

.pl-50 {
	padding-left: 50px;
}

.pl-55 {
	padding-left: 55px;
}

.pl-60 {
	padding-left: 60px;
}
.pl-65 {
	padding-left: 65px;
}
.pl-70 {
	padding-left: 70px;
}
.pl-75 {
	padding-left: 75px;
}
.pl-80 {
	padding-left: 80px;
}
.pl-85 {
	padding-left: 80px;
}
.pl-90 {
	padding-left: 90px;
}
.pl-95 {
	padding-left: 95px;
}
.pl-100 {
	padding-left: 100px;
}


/*-- Padding Right --*/
.pr-0 {
	padding-right: 0px;
}
.pr-5 {
	padding-right: 5px;
}
.pr-10 {
	padding-right: 10px;
}
.pr-15 {
	padding-right: 15px;
}
.pr-20{
	padding-right: 20px;
}
.pr-25 {
	padding-right: 35px;
}
.pr-30 {
	padding-right: 30px;
}
.pr-35 {
	padding-right: 35px;
}

.pr-35 {
	padding-right: 35px;
}

.pr-40 {
	padding-right: 40px;
}

.pr-45 {
	padding-right: 45px;
}

.pr-50 {
	padding-right: 50px;
}

.pr-55 {
	padding-right: 55px;
}

.pr-60 {
	padding-right: 60px;
}
.pr-65 {
	padding-right: 65px;
}
.pr-70 {
	padding-right: 70px;
}
.pr-75 {
	padding-right: 75px;
}
.pr-80 {
	padding-right: 80px;
}
.pr-85 {
	padding-right: 80px;
}
.pr-90 {
	padding-right: 90px;
}
.pr-95 {
	padding-right: 95px;
}
.pr-100 {
	padding-right: 100px;
}

/* font weight */
.f-700{font-weight: 700;}
.f-600{font-weight: 600;}
.f-500{font-weight: 500;}
.f-400{font-weight: 400;}
.f-300{font-weight: 300;}

/* Background Color */

.gray-bg {
	background: #f7f7fd;
}
.white-bg {
	background: #fff;
}
.black-bg {
	background: #222;
}
.theme-bg {
	background: #222;
}
.primary-bg {
	background: #222;
}
/* Color */

.white-color {
	color: #fff;
}
.black-color {
	color: #222;
}
.theme-color {
	color: #222;
}
.primary-color {
	color: #222;
}
/* black overlay */

[data-overlay] {
	position: relative;
}
[data-overlay]::before {
	background: #000 none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}
[data-overlay="3"]::before {
	opacity: 0.3;
}
[data-overlay="4"]::before {
	opacity: 0.4;
}
[data-overlay="5"]::before {
	opacity: 0.5;
}
[data-overlay="6"]::before {
	opacity: 0.6;
}
[data-overlay="7"]::before {
	opacity: 0.7;
}
[data-overlay="8"]::before {
	opacity: 0.8;
}
[data-overlay="9"]::before {
	opacity: 0.9;
}

/* ============================================================
   landing_file/css/new_custom.css
   ============================================================ */
.header-banner h1 span {
    display: block;
    font-size: 22px;
    margin-top: 20px;
}
.card-footer .post-actions a.copy_embed,
.card-footer .post-actions a.copy_rss{display: none; !important}
body .header-banner h4 {
    text-transform: none;
    font-size: 18px;
	letter-spacing: 1px;
	    font-family: 'Montserrat-Regular';
}
.logoo {
    max-width: 100%;
}
.featured_srvc{    padding: 30px 0;
    color: #fff;
   /* background-image: linear-gradient(to bottom right, #008037, green, #03EADA);*/
    color: #fff;
}
.category-list a:hover,
.category-list a.active{color:#0B0C0C; border-bottom:2px solid #36a4f7}
.featured_srvc .container{margin:20px auto}
.trending-activites{padding-top:30px;}
.black_section{
background:#fff;
color:#000;
}
.flexx_boxx{ overflow:hidden}
.flexx_boxx .col{padding:0}

.container2 {
    max-width: 100%;
    overflow: hidden;
}
.featured_block  {
    margin-top: 50px;
}
.activities-content {
    margin-bottom: 20px;
}
.category-list {
    padding: 20px 0;
}
.trending-activites .thumbnail img {
    min-height: 0 !important;
    object-fit: contain;
}
.category-list a {
    margin-right: 10px;
    font-size: 19px;
}
.flexx_boxx h1{margin-top:0}
/*.featured_block .flexx_boxx .caption {
    max-width: 468px;
    margin-right: 20px;
    margin: 0 auto;
}*/
/*.featured_block .flexx_boxx{align-items: center;}*/
.featured_block .flexx_boxx .thumbnail{background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center center !important;
    color: #FFFFFF;
	height:400px !important;
	
}
.freatured_posts  .filter{
   padding-left:10px;
   padding-right:10px;
}

.trending-activites .thumbnail .caption {
    background: transparent;
    color: white;
}
.trending-activites .freatured_posts .thumbnail{background-color:transparent !important;background:none !important;}
.trending-activites .thumbnail .caption {
    background: none !important;
    color: #000;
    padding: 10px 0;
}
.trending-activites .freatured_posts .caption p a {
    color: #000 !important;
    border-bottom: 1px solid #000;
}
.flexrow {
    -ms-flex-wrap: wrap;
    -ms-flex: 0 1 auto;
    -webkit-box-flex: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    flex: 0 1 auto;
    padding: 20px 0;
	align-items: center;
}
.button.button--primary {
    background-image: linear-gradient(to bottom right, #fff 50%, #121118 50%);
    background-position-x: -400px;
    background-position-y: -400px;
    background-repeat: no-repeat;
    background-size: 950px 690px;
    color: #fff;
    transition: all 300ms cubic-bezier(0.85, 0, 0.4, 1);
    border-radius: .29412rem;
    border: 0 none;
    font-weight: 500;
    letter-spacing: .05882rem;
    padding: 1.17647rem 2.05882rem;
    font-size: 1.2em;
    line-height: 1.5em;
    padding: 12px 15px;
    margin-top: 21px;
}
.button.button--primary:hover{
background-position-x: 0;
    background-position-y: 0;
    color: #121118;
}
.button--textCta.mktoButton {
    color: #fff;
    display: inline-block;
    padding-left: 0;
}
.gray_section p,
p.type-large{font-size: 1.3em;
    margin-top: 20px}
.block--pageSection.background--northernLights {
    background-image: linear-gradient(to bottom right, #4100A3, #1998C7, #03EADA);
    color: #fff;
}
.gray_section{
padding: 50px 0;
}
.button--textCta-arrow {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjEzcHgiIHZpZXdCb3g9IjAgMCAyMCAxMyIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5Db21iaW5lZCBTaGFwZTwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSIwMC1NTUUtVHlwZS1TdHlsZS1TaGVldCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTYxMy4wMDAwMDAsIC0zNTEwLjAwMDAwMCkiIGZpbGw9IiMwRDUyRkYiIGZpbGwtcnVsZT0ibm9uemVybyI+ICAgICAgICAgICAgPGcgaWQ9IkNUQS10ZXh0LWxpbmstLS1CbHVlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0ODcuMDAwMDAwLCAzNTA0LjAwMDAwMCkiPiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTQzLjE4OTc4MiwxMS42NjA5NTA2IEwxMzkuNTA0NzAxLDcuOTE4ODA5NSBDMTM5LjE4NDUwOSw3LjU4MzgyOTkxIDEzOS4xOTY0OTcsNy4wNTI3MDg0NyAxMzkuNTMxNDc2LDYuNzMyNTE2NTYgQzEzOS44NjY0NTYsNi40MTIzMjQ2NSAxNDAuMzk3NTc3LDYuNDI0MzEyNDMgMTQwLjcxNzc2OSw2Ljc1OTI5MjAyIEwxNDUuNzYyMTQ3LDExLjg5OTE3ODUgQzE0Ni4wNzcyMzcsMTIuMjI4ODIxIDE0Ni4wNzEzNjQsMTIuNzQ5NzcwMiAxNDUuNzQ4OTIxLDEzLjA3MjIyNDQgTDE0MC43MDQ1NDMsMTguMjU0MjM3OCBDMTQwLjM3Njg3OSwxOC41ODE5MTI3IDEzOS44NDU2MjMsMTguNTgxOTIxOSAxMzkuNTE3OTQ4LDE4LjI1NDI1ODQgQzEzOS4xOTAyNzMsMTcuOTI2NTk1IDEzOS4xOTAyNjQsMTcuMzk1MzM4MyAxMzkuNTE3OTI3LDE3LjA2NzY2MzQgTDE0My4xMzUwNDIsMTMuMzM5MDQ5NCBMMTI2LjgzNTUwOSwxMy4zMzkwNDk0IEMxMjYuMzcyMTE1LDEzLjMzOTA0OTQgMTI1Ljk5NjQ2LDEyLjk2MzM5NDIgMTI1Ljk5NjQ2LDEyLjUgQzEyNS45OTY0NiwxMi4wMzY2MDU4IDEyNi4zNzIxMTUsMTEuNjYwOTUwNiAxMjYuODM1NTA5LDExLjY2MDk1MDYgTDE0My4xODk3ODIsMTEuNjYwOTUwNiBaIiBpZD0iQ29tYmluZWQtU2hhcGUiPjwvcGF0aD4gICAgICAgICAgICA8L2c+ICAgICAgICA8L2c+ICAgIDwvZz48L3N2Zz4=);
    background-repeat: no-repeat;
    /* display: inline-block; */
    height: .88235rem;
    margin-left: .70588rem;
    position: relative;
    top: .17647rem;
    transition: all 200ms cubic-bezier(0.64, 0.04, 0.35, 1);
    width: 1.76471rem;
    background-position: calc(100% - 7px) center;
    height: auto;
    margin-left: 0;
    padding-right: 2.05882rem;
    top: 0;
    width: auto;
    margin-left: 6px;
}
.trending-activites  .show-more {
    color: #000;
    margin-bottom: 30px;
}
.metas {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
	padding:20px 0
}
.freatured_posts h2{padding:10px 0}
.flexx_boxx .nextBtn {
    border-radius: 8px;
    padding: 9px 30px;
    background: #FEDC00;
    border-color: #FEDC00;
    color: #0C2C5B;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 14px;
}
.button--textCta{font-size: 17px;
    font-weight: 700;
	color:#121118;
	text-transform:uppercase;
}
.metas .author {
       display: flex;
}
.metas .author figure {
    width: 36px;
    height: 36px;
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 0;
}
.logoo {
    height: auto;
    max-width: 154px;
    padding: 0;
}
.metas a{color:#000;max-width: 150px;}
.metas .author figure img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}
.featured_block .flexx_boxx .caption p{    font-size: 16px;}
/*.featured_block .flexx_boxx .caption{
    max-width: 468px;
    margin-right: 20px;
    margin: 0 auto;
}*/
 .divider.divider--h4, .body--mm .block--pageSection.background--trueWhite .divider.divider--h5, .body--mm .block--pageSection.background--trueWhite .divider.divider--h6 {
    border-color: #121118;
	border-top: 4px solid;
	margin:15px 0;
}
.block--quote .quote-text {
    font-weight: 500;
    margin-bottom: 0;
	  font-family: 'Montserrat-SemiBold'
	
}
blockquote.quote{border:none}
.block--quote .attribution {
    padding: 0 20px;
    display: block;
}
.attribution-text--bold{ font-family: 'Montserrat-SemiBold'; margin-right:5px}
.block--pageSection.background--bcBlack {
    background: #121118;
    color: #fff;
}
/* bacome a partner*/
.background--sunset h2 {
    display: block;
    font-family: 'Montserrat-Bold';
    margin-bottom: 20px;
    font-size: 4rem;
    text-transform: capitalize;
}
.block h4{ margin-bottom: 20px;
    font-size: 2.5rem;
	
	font-family: 'Montserrat-SemiBold';
	}
.content_box {
    font-size: 1.8rem;
    margin-bottom: 30px;
    overflow: hidden;
}
.content_box2 {
    font-size: 1.5rem;
    margin-bottom: 20px;
	 margin-top: 20px;
    overflow: hidden;
}
.block-container h2{    display: block;
    font-family: 'Montserrat-Bold';
    margin-bottom: 20px;
    font-size: 4rem;
    text-transform: capitalize;}
.block-container{padding:30px 0; overflow:hidden}
.block--pageSection.background--sunset {
    background-image: linear-gradient(to right bottom, #e9af0c, #fe8128, #ff4e4d, #f01173, #c5009a, #a600a8, #7b0fb6, #2b23c2, #251cbf, #1d15bc, #140bb8, #0700b5);
    color: #fff;
}
.block--pageSection.background--lightGrey {
    background: #EDEFF3;
    color: #121118;
}
.multiColumn-flexrow{align-items: start;}

.block--pageSection.background--bcBlack  .button--textCta-arrow {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjEzcHgiIHZpZXdCb3g9IjAgMCAyMCAxMyIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5Db21iaW5lZCBTaGFwZTwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSIwMC1NTUUtVHlwZS1TdHlsZS1TaGVldCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTk1MS4wMDAwMDAsIC0zNTEwLjAwMDAwMCkiIGZpbGw9IiMwM0VBREEiIGZpbGwtcnVsZT0ibm9uemVybyI+ICAgICAgICAgICAgPGcgaWQ9IkNUQS10ZXh0LWxpbmstLS1HcmVlbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoODI1LjAwMDAwMCwgMzUwNC4wMDAwMDApIj4gICAgICAgICAgICAgICAgPHBhdGggZD0iTTE0My4xODk3ODIsMTEuNjYwOTUwNiBMMTM5LjUwNDcwMSw3LjkxODgwOTUgQzEzOS4xODQ1MDksNy41ODM4Mjk5MSAxMzkuMTk2NDk3LDcuMDUyNzA4NDcgMTM5LjUzMTQ3Niw2LjczMjUxNjU2IEMxMzkuODY2NDU2LDYuNDEyMzI0NjUgMTQwLjM5NzU3Nyw2LjQyNDMxMjQzIDE0MC43MTc3NjksNi43NTkyOTIwMiBMMTQ1Ljc2MjE0NywxMS44OTkxNzg1IEMxNDYuMDc3MjM3LDEyLjIyODgyMSAxNDYuMDcxMzY0LDEyLjc0OTc3MDIgMTQ1Ljc0ODkyMSwxMy4wNzIyMjQ0IEwxNDAuNzA0NTQzLDE4LjI1NDIzNzggQzE0MC4zNzY4NzksMTguNTgxOTEyNyAxMzkuODQ1NjIzLDE4LjU4MTkyMTkgMTM5LjUxNzk0OCwxOC4yNTQyNTg0IEMxMzkuMTkwMjczLDE3LjkyNjU5NSAxMzkuMTkwMjY0LDE3LjM5NTMzODMgMTM5LjUxNzkyNywxNy4wNjc2NjM0IEwxNDMuMTM1MDQyLDEzLjMzOTA0OTQgTDEyNi44MzU1MDksMTMuMzM5MDQ5NCBDMTI2LjM3MjExNSwxMy4zMzkwNDk0IDEyNS45OTY0NiwxMi45NjMzOTQyIDEyNS45OTY0NiwxMi41IEMxMjUuOTk2NDYsMTIuMDM2NjA1OCAxMjYuMzcyMTE1LDExLjY2MDk1MDYgMTI2LjgzNTUwOSwxMS42NjA5NTA2IEwxNDMuMTg5NzgyLDExLjY2MDk1MDYgWiIgaWQ9IkNvbWJpbmVkLVNoYXBlIj48L3BhdGg+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+);
    background-repeat: no-repeat;
    display: inline-block;
    height: .88235rem;
    margin-left: .70588rem;
    position: relative;
    top: .17647rem;
    transition: all 200ms cubic-bezier(0.64, 0.04, 0.35, 1);
    width: 1.76471rem;
    background-position: calc(100% - 7px) center;
    height: auto;
    margin-left: 0;
    padding-right: 2.05882rem;
    top: 0;
    width: auto;
}

.block--pageSection.background--bcBlack .button.button--textCta{
    color: #fff;
    display: inline-block;
    padding-left: 0;
}
.block--pageSection.background--lightGrey {
    background: #EDEFF3;
    color: #121118;
    overflow: hidden;
}
.block--logoCarousel .slider-controls img {
    align-self: center;
    opacity: 0.3;
    transition: opacity 200ms;
	margin: 0 auto;
}
.slider-controls .slider-controls-item {
    border-bottom: 1px solid #AFB4BE;
    cursor: pointer;
    display: flex;
    flex: 1;
    height: 80px;
    padding-bottom: .23529rem;
    text-align: center;
}
.quote_fix.block--quote .quote-text {
    font-size: 2rem;
}
.block--logoCarousel .slider-controls .slider-controls-item.slick-current, .bodyCarousel .slider-controls .slider-controls-item.slick-current {
    border-bottom: 5px solid #0D52FF;
    padding-bottom: 0;
}
.block--logoCarousel .slider-controls, .bodyCarousel .slider-controls {
    display: initial !important;
}

.quote_fix blockquote,
.quote_fix .attribution{padding-left:0 !important;}
.ovflow_hide{overflow:hidden}
.block--quote .divider {
    border-bottom: 2px solid;
    margin-bottom: 1.76471rem;
    margin-top: 1.76471rem;
    width: 2.94118rem;
}
.slider-nav img{margin-bottom:20px}
.slider-nav .slick-track{transform: translate3d(0px, 0px, 0px)!important;}
.block--pageSection.background--atmosphere {
    background-image: linear-gradient(to bottom right, #4100A3, #0D52FF);
    color: #fff;
}

/* end a partner*/

/*Services*/
.btnsss .btn {
    border: 1px solid #1B9CF2;
    font-weight: bold;
    padding: 6px 20px;
    margin-bottom: 5px;
    font-size: 13px;
    background: #1B9CF2;
    color: #fff !important;
}
.eq_hight {position:relative}
.btnsss {
    text-align: center;
    margin: 0 auto;
    /*position: absolute;
    bottom: 20px;*/
}
.btnsss .btn:hover{background:#011BFF !important; color:#fff !important;}
/*.btnsss .btn:first-child{margin-right:10px}*/
.servicess .price_tag {
    display: inline-block;
    padding: 4px 0;
    background: #fff9bf;
    font-weight: 700;
    margin-top: 10px;
    text-align: center;
    border-radius: 5px;
    font-family: 'Montserrat-ExtraBold';
    padding: 4px 12px;
    text-align: right;
}
.servicess .img_boxx{
background: transparent linear-gradient(49deg, #FFFFFF 0%, #FFFFFF 20%, #E9E9E9 41%, #D2D2D2 60%, #E9E9E9 81%, #FFFFFF 100%) 0% 0% no-repeat padding-box;

}
.service_post a{color: #1B9CF2 !important;}
.trending-activites .service_post .caption p a{color: #1B9CF2 !important; text-decoration:none; border:none !important;}
.trending-activites.servicess .eq_hight .thumbnail {
    height: calc(100% 15px) !important;
    height: calc(100% - 10px);
}
.trending-activites.servicess .thumbnail .title_block{ min-height:48px;}
.trending-activites.servicess .thumbnail .title_block h4 {
    text-transform: capitalize;
    font-weight: 800;
    color: #000;
    margin-bottom: 6px;
    line-height: 1.5;
	font-family: 'Montserrat-SemiBold';
    font-size: 15px;
	 
}
.title_block .line{
    height: 3px;
    background: #011BFF;
    width: 102px;
    display: block;
}
.trending-activites.servicess .thumbnail .caption{

padding: 10px 14px;
}
.trending-activites .service_post  .thumbnail .caption h5 {
    font-size: 14px;
	letter-spacing:0;
	margin-bottom: 0;
	min-height:45px;
}
.trending-activites .service_post  .thumbnail .caption h5 a{font-size:12px}
nav.navbar-findcond .navbar-right>li.last_child,
nav.navbar-findcond .navbar-right>li:last-child {
    display: block;
    display: flex !IMPORTANT;
    align-items: center;
    color: white;
    font-size: 23px;
    line-height: 2;
	max-width:100% !important;
}
.holder_div{margin-bottom:15px}
.trending-activites.servicess .flexx_boxx .thumbnail  {
  /*  display: flex;
    flex-direction: column;
   
   */
    position: relative;
    overflow: hidden;
    background-color: #fff;
    border-radius: 18px;
    white-space: normal;
    box-shadow: 2px 4px 12px rgb(0 0 0 / 8%);
    transition: all .3s cubic-bezier(0,0,.5,1);
	padding-bottom: 12px !important;
}
body .profile_listt .btn-primary {
	 font-family: 'Montserrat-Bold';
	background-color:#fff !important;
    display: block;
    color: #000 !important;
	border: none;
}
.post_loooppp .img-xs {
    width: 37px;
    height: 37px;
}
.post_loooppp .d-flex {
    display: flex !important;
    justify-content: space-between;
}
.post_loooppp .fallow_btt{
    margin-left: 7px;
    margin-right: 0;
}
.post_loooppp .tx-11 {
    font-size: 11px;
}
.post_loooppp .img-fluid{max-width:100%}
.post_loooppp .ml-2 {
    margin-left: 0.5rem !important;
}
.post_loooppp .rounded-circle {
    border-radius: 50% !important;
}
.post_loooppp .card-header {
    padding: 10px 5px;
}
.post_loooppp .card-header {
    padding: 0.875rem 0;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, 0);
    border-bottom: 1px solid #f2f4f9;
}

.post_loooppp .badge {
    padding: 6px;
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 7px;
}
.post_loooppp .badge {
    padding: 6px 5px;
    border-radius: 3px;
}
.post_loooppp .mr-4, 
.post_loooppp .mx-4 {
    margin-right: 1.5rem !important;
}
.post_loooppp .icon-md {
    width: 16px;
    height: 16px;
}
.post_loooppp .card-footer {
    padding: 0.875rem 0;
    background-color: rgba(0, 0, 0, 0);
    border-top: 1px solid #f2f4f9;
}
.trending-activites.servicess .thumbnail .caption2,
.post_loooppp.eq_hight {
position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
	height:100%;
}
.service_post .eq_hight .holder_div,
.post_loooppp .card-body {
    flex: 1 1 auto;
}
.post_loooppp .card-footer p{
    font-size: 12px;
    line-height: 1.2;
}
.post_loooppp  .card-body .card_content {
    padding: 10px 0;
	padding-bottom:0;
}
.post_loooppp .badge-primary {
    color: #fff;
	white-space:normal;
    background-color: #727cf5;
}
.jcf-list .jcf-option{white-space:normal !important;}
/*end service*/

@media (max-width: 767px){
	.service_post .filter {height:auto !important;}
	.featured_block {
    margin-top: 0;
}
.featured_block2 .flexx_boxx{display:block !important;}
.featured_block2 .flexx_boxx p{word-break:break-all}
.featured_block2 .flexx_boxx .badge-secondary2 {
    word-break: break-all;
    display: block;
    white-space: normal;
    line-height: 1.2;
}
	.flexx_boxx {
    overflow: hidden;
	display:block !important;
    /*flex-flow: column-reverse;*/
}
.button.button--primary {
    padding: 11px 12px;
    font-size: 14px;
	display:block;
	    text-align: center
}
.featured_block2 .caption{max-width:100%; padding:10px}
.cta-section {
    padding-top: 10px;
    padding-bottom: 10px;
}
.flexx_boxx .nextBtn {
    padding: 9px 12px;
    font-size: 12px;
}
.featured_srvc .caption h2,
.featured_block.filter2 h2 {
    font-size: 18px !important;
}
.activities-content h1 {
    font-size: 23px;
}
.block--pageSection.background--northernLights{padding:10px}
	.featured_block .flexx_boxx .thumbnail{height:auto !important;}
	.flexrow{display:block}
	.eq_hight {height:auto !important;}
	.gray_section p, p.type-large {
    font-size: 1em;
}
	.block-container h2 {
    margin-bottom: 15px;
    font-size: 2.5rem;
}
	.mobile_none{margin-top:0;}
	.flexrow.rev_mobile{
	    flex-flow: column-reverse;
		    padding: 12px;
	}
}

/* ============================================================
   layouts/header_css.php [block 1]
   ============================================================ */
:root {
--tg-body-font-family: 'Inter', sans-serif;
--tg-heading-font-family: 'Manrope', sans-serif;
--tg-primary-color: #F4796C;
--tg-secondary-color: #183354;
--tg-body-font-color: #545E69;
--tg-heading-font-color: #183354;
--tg-paragraph-color: #545E69;
--tg-icon-color: #6D757F;
--tg-border-color: #DFDFDF;
--tg-border-dark: #273341;
--tg-body-font-size: 16px;
--tg-body-font-weight: 400;
--tg-heading-font-weight: 700;
--tg-body-line-height: 1.75;
--tg-heading-line-height: 1.2;
--tg-blue: #0d6efd;
--tg-indigo: #6610f2;
--tg-purple: #6f42c1;
--tg-pink: #d63384;
--tg-red: #dc3545;
--tg-orange: #fd7e14;
--tg-yellow: #ffc107;
--tg-green: #198754;
--tg-teal: #E8F1F1;
--tg-cyan: #0dcaf0;
--tg-white: #ffffff;
--tg-black: #0C1622;
--tg-black-two: #000000;
--tg-gray: #D9D9D9;
--tg-gray-two: #BACCE1;
--tg-gray-three: #F9F9F7;
--facebook: #104E87;
--twitter: #2EB4FF;
--linkedin: #0C7ED0;
--instagram: #FF2F7A;
--youtube: #c4302b;
--skype: #00aff0;
}
.trending-post-active [class*="col-"] {
    padding: 0 4px;
}
.custom-container {
    max-width: 1860px;
}
.transparent-header {
    position: absolute;
    left: 0;
    top: 0px;
    width: 100%;
    z-index: 9;
    height: auto;
}
.container {
    max-width: 1320px;
}
.title_block .line, body .btn-primary, button, .social_media li a {
    color: #fff !important;
}
.view-all-btn .link-btn {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    position: relative;
    border-radius: 4px;
    border: 1px solid #CFCFCF;
    padding: 10px 17px;
    color: var(--tg-secondary-color);
    gap: 10px;
    --arrow-hover-move-x: 110%;
    --arrow-hover-move-y: 100%;
}
#header-fixed-height.active-height {
    display: block;
    height: 95px;
}
/* header-top */
.header-top-wrap {
    background: var(--tg-secondary-color);
    padding: 6px 35px;
}
.header-top-menu .list-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}
.header-top-menu .list-wrap li a {
    color: var(--tg-white);
    font-family: var(--tg-heading-font-family);
    font-size: 13px;
    font-weight: 700;
    line-height: normal;
    text-transform: capitalize;
}
.header-top-menu .list-wrap li a:hover {
    color: var(--tg-primary-color);
}
.header-top-social {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.header-top-social .title {
    margin-bottom: 0;
    color: var(--tg-white);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    margin-right: 6px;
    line-height: 1;
}
.header-top-social .list-wrap {
    display: flex;
    align-items: center;
    gap: 14px;
}
.header-top-social .list-wrap li a {
    font-size: 14px;
    color: var(--tg-white);
}
.header-top-social .list-wrap li a:hover {
    color: var(--tg-primary-color);
}
/* menu */
.menu-area {
    border-bottom: 1px solid var(--tg-gray);
}
.menu-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}
.logo img {
    max-height: 50px;
}
.header-left-side {
    display: flex;
    height: 100%;
}
.offcanvas-toggle {
    border-right: 1px solid var(--tg-gray);
    width: 100px;
}
.offcanvas-toggle a {
    padding: 30px 30px 30px 35px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    height: 100%;
}
.offcanvas-toggle a span {
    width: 33px;
    height: 2px;
    border-radius: 2px;
    background: var(--tg-primary-color);
    transition: .3s linear;
}
.navbar-wrap {
    display: flex;
}
.navbar-wrap ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0 0;
    margin: 0 0 0 185px;
}
.navbar-wrap ul li {
    list-style: none;
    display: block;
    position: relative;
}
.navbar-wrap ul li a {
    font-size: 14px;
    font-weight: 700;
    text-transform: capitalize;
    color: var(--tg-heading-font-color);
    padding: 40px 17px;
    display: flex;
    align-items: center;
    line-height: 1;
    position: relative;
    z-index: 1;
    font-family: var(--tg-heading-font-family);
    gap: 5px;
}
.navbar-wrap > ul > li.menu-item-has-children > a::after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    color: var(--tg-icon-color);
    font-size: 14px;
    line-height: 0;
    transition: all 0.3s ease-out 0s;
}
.navbar-wrap > ul > li.menu-item-has-children.active > a::after, .navbar-wrap > ul > li.menu-item-has-children:hover > a::after {
    color: var(--tg-primary-color);
}
.navbar-wrap > ul > li.active > a, .navbar-wrap > ul > li:hover > a {
    color: var(--tg-primary-color);
}
.main-menu .navigation li.menu-item-has-children .dropdown-btn {
    display: none;
}
.header-right-side {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 35px;
}
.header-search-wrap form {
    position: relative;
    width: 340px;
}
.header-search-wrap form input {
    width: 100%;
    border: 1px solid var(--tg-gray);
    background: transparent;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 400;
    color: var(--tg-secondary-color);
    padding: 12px 45px 12px 20px;
    line-height: 1;
    height: 45px;
}
.header-search-wrap form input::placeholder {
font-size: 14px;
font-weight: 400;
color: var(--tg-body-font-color);
}
.header-search-wrap form button {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    font-size: 20px;
    line-height: 0;
    color: var(--tg-secondary-color);
}
.header-search-wrap form button:hover {
    color: var(--tg-primary-color);
}
.header-action > ul {
    display: flex;
    align-items: center;
    margin-left: 25px;
}
.header-action > ul li {
    position: relative;
    margin-left: 25px;
    line-height: 0;
}
.header-action ul li:first-child {
    margin-left: 0;
}
.header-action ul li a {
    color: var(--tg-paragraph-color);
    font-size: 24px;
    line-height: 0;
    position: relative;
    font-weight: 700;
}
.header-action ul li a:hover {
    color: var(--tg-primary-color);
}
.header-action ul li a span {
    position: absolute;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--tg-primary-color);
    color: var(--tg-white);
    font-size: 11px;
    font-weight: 600;
    border-radius: 50%;
    right: -10px;
    top: -4px;
}
.header-cart {
    display: flex;
    align-items: center;
    gap: 15px;
}
.header-cart strong {
    font-size: 14px;
    font-weight: 600;
    color: var(--tg-secondary-color);
}
.header-action .header-sine-in a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: var(--tg-secondary-color);
}
.header-action .header-sine-in {
    margin-left: 20px;
}
.header-action .header-sine-in a i {
    color: var(--tg-body-font-color);
    font-size: 24px;
}
.header-action .header-sine-in a:hover i {
    color: var(--tg-primary-color);
    transition: all 0.3s ease-out 0s;
}
.header-action .header-btn .btn {
    color: var(--tg-white);
    font-size: 14px;
    padding: 13px 22px;
}
.navbar-wrap ul li .sub-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    min-width: 230px;
    border: 1px solid #f5f5f5;
    background: var(--tg-white);
    margin: 0 0;
    transform: scale(1, 0);
    transform-origin: 0 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
    -moz-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
    box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
    border-radius: 0 0 5px 5px;
    padding: 18px 0;
    display: block;
    visibility: hidden;
    opacity: 0;
    z-index: 9;
}
.navbar-wrap ul li .sub-menu .sub-menu {
    right: auto;
    left: 100%;
    top: 0;
}
.navbar-wrap ul li .sub-menu li {
    margin-left: 0;
    text-align: left;
    display: block;
}
.navbar-wrap ul li .sub-menu li a {
    padding: 9px 15px 9px 25px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--tg-heading-font-color);
    text-transform: capitalize;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    justify-content: space-between;
}
.navbar-wrap ul li .sub-menu > li.active > a, .navbar-wrap ul li .sub-menu li a:hover {
    color: var(--tg-primary-color);
}
.navbar-wrap ul li .sub-menu > li > a::before, .navbar-wrap ul li .sub-menu li a::before {
    content: "";
    position: absolute;
    width: 3px;
    height: 0px;
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: 15px;
    background: var(--tg-primary-color);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
}
.navbar-wrap ul li .sub-menu > li.active > a::before, .navbar-wrap ul li .sub-menu li a:hover::before {
    height: 11px;
    opacity: 1;
    visibility: visible;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.navbar-wrap ul li .sub-menu > li.menu-item-has-children > a::after {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    color: var(--tg-icon-color);
    font-size: 14px;
    line-height: 0;
    transition: all 0.3s ease-out 0s;
}
.navbar-wrap ul li .sub-menu > li.menu-item-has-children.active > a::after, .navbar-wrap ul li .sub-menu > li.menu-item-has-children > a:hover::after {
    color: var(--tg-primary-color);
}
.navbar-wrap ul li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}
.sticky-menu {
    position: fixed;
    left: 0;
    margin: auto;
    top: 0;
    width: 100%;
    z-index: 99;
    background: var(--tg-white);
    -webkit-animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    border-radius: 0;
}
.menu-area.sticky-menu {
    border-bottom: none;
}
/* header-four */
.header-top-wrap-three {
    background: var(--tg-secondary-color);
    padding: 11px 0;
}
.header-top-left-two .list-wrap {
    display: flex;
    align-items: center;
    gap: 20px;
}
.header-top-left-two .list-wrap li a {
    color: var(--tg-white);
    font-weight: 14px;
    font-weight: 600;
}
.header-top-left-two .list-wrap li a:hover {
    color: var(--tg-primary-color);
}
.header-top-right-two {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
}
.offcanvas-toggle.offcanvas-toggle-two {
    border-right: none;
    width: auto;
}
.header-top-right-two .header-top-social .list-wrap li a {
    font-size: 16px;
}
.header-logo-area-two {
    padding: 35px 0 0;
}
.header-search-wrap.header-search-wrap-three {
    display: flex;
    align-items: center;
}
.header-search-wrap.header-search-wrap-three form {
    width: 200px;
}
.header-search-wrap.header-search-wrap-three form input {
    width: 100%;
    border: none;
    background: transparent;
    border-radius: 0;
    font-size: 14px;
    font-weight: 400;
    color: var(--tg-secondary-color);
    padding: 0 45px 0 0;
    line-height: 1.6;
    height: auto;
}
.header-search-wrap.header-search-wrap-three form button {
    right: 0px;
    font-size: 24px;
    color: var(--tg-icon-color);
}
.header-search-wrap.header-search-wrap-three form button:hover {
    color: var(--tg-secondary-color);
}
.header-action.header-action-two .list-wrap {
    justify-content: flex-end;
}
.menu-style-four .menu-nav {
    justify-content: center;
}
.menu-style-four .navbar-wrap ul {
    margin: 0 auto;
}
.menu-style-four .navbar-wrap ul li a {
    font-size: 16px;
    padding: 37px 20px;
}
.menu-area.menu-style-four {
    border-bottom: none;
}
.banner-post-item {
    position: relative;
}
<!--
bannerrr--> 
.blog-post-meta.white-blog-meta .list-wrap li {
    display: flex;
    align-items: center;
    color: var(--tg-icon-color);
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.52px;
    text-transform: uppercase;
    gap: 5px;
}
a, button {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    text-decoration: none;
}
.post-title a {
    color: inherit;
    display: inline;
    padding-bottom: 0;
    -webkit-transition: background-size 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: background-size 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
    background-image: -webkit-gradient(linear, left top, left bottom, from(currentColor), color-stop(98%, currentColor));
    background-image: linear-gradient(to bottom, currentColor 0%, currentColor 98%);
    background-size: 0 1px;
    background-repeat: no-repeat;
    background-position: left 100%;
}
.banner-post-three:hover .banner-post-content-three .post-title a {
    background-size: 100% 2px;
}
.blog-post-meta .list-wrap li i {
    line-height: 0;
    font-size: 16px;
}
.blog-post-meta .list-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}
.banner-post-thumb {
    overflow: hidden;
    position: relative;
}
.banner-post-thumb::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    background: linear-gradient(360deg, rgba(0, 5, 11, 0.89) 0%, rgba(10, 23, 41, 0.00) 100%);
    pointer-events: none;
}
.banner-post-thumb img {
    height: 600px;
    width: 100%;
    object-fit: cover;
}
.banner-post-item:hover .banner-post-thumb img {
    transform: scale(1.1);
}
.banner-post-content {
    text-align: center;
    position: absolute;
    left: 100px;
    right: 100px;
    bottom: 50px;
}
.post-tag {
    color: var(--tg-white);
    font-family: var(--tg-heading-font-family);
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.78px;
    text-transform: uppercase;
    background: var(--tg-primary-color);
    display: inline-block;
    border-radius: 3px;
    padding: 4px 10px;
    margin-bottom: 15px;
}
.banner-post-content .post-title {
    color: var(--tg-white);
    font-size: 28px;
    margin-bottom: 20px;
    line-height: 1.28;
}
.banner-post-content .post-title a {
    background-size: 0 2px;
}
.banner-post-content .post-title a:hover {
    color: var(--tg-white);
}
.banner-post-item:hover .banner-post-content .post-title a {
    background-size: 100% 2px;
}
.blog-post-meta.white-blog-meta .list-wrap li {
    color: var(--tg-gray-two);
}
.blog-post-meta .list-wrap li {
    display: flex;
    align-items: center;
    color: var(--tg-icon-color);
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.52px;
    text-transform: uppercase;
    gap: 5px;
}
.blog-post-meta.white-blog-meta .list-wrap li a {
    color: var(--tg-gray-two);
}
.blog-post-meta.white-blog-meta .list-wrap li a:hover {
    color: var(--tg-primary-color);
}
/* banner-post-two */
.banner-post-inner .row {
--bs-gutter-x: 20px;
}
.banner-post-inner .row .col-70 {
    width: 69.7%;
    flex: 0 0 auto;
}
.banner-post-inner .row .col-30 {
    width: 30.3%;
    flex: 0 0 auto;
}
.banner-post-two {
    position: relative;
    margin-bottom: 20px;
}
.banner-post-two.big-post .banner-post-thumb-two img {
    width: 100%;
    height: 615px;
    object-fit: cover;
}
.banner-post-two:hover .banner-post-thumb-two img {
    transform: scale(1.1);
}
.banner-post-thumb-two {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}
.banner-post-thumb-two::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.89) 16.31%, rgba(10, 23, 41, 0.00) 108.6%);
    pointer-events: none;
}
.banner-post-content-two {
    position: absolute;
    left: 40px;
    bottom: 40px;
    right: 50px;
}
.banner-post-content-two .post-title {
    font-size: 28px;
    color: var(--tg-white);
    margin-bottom: 15px;
    line-height: 1.4;
}
.banner-post-content-two .post-title a:hover {
    color: var(--tg-white);
}
.banner-post-content-two .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.banner-post-two.big-post:hover .banner-post-content-two .post-title a {
    background-size: 100% 2px;
}
.banner-post-two:hover .banner-post-content-two .post-title a {
    background-size: 100% 1px;
}
.banner-post-two.small-post .banner-post-content-two {
    left: 25px;
    right: 25px;
    bottom: 20px;
}
.banner-post-two.small-post .banner-post-content-two .post-title {
    font-size: 18px;
    margin-bottom: 12px;
    line-height: 1.3;
}
.banner-post-two.small-post .banner-post-thumb-two img {
    width: 100%;
    height: 192px;
    object-fit: cover;
}
/* banner-post-three */
.banner-post-three {
    position: relative;
}
.banner-post-thumb-three {
    position: relative;
    overflow: hidden;
}
.banner-post-thumb-three::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.89) 0%, rgba(0, 0, 0, 0.55) 0.01%, rgba(10, 23, 41, 0.00) 53.96%);
    pointer-events: none;
}
.banner-post-thumb-three img {
    width: 100%;
    height: 530px;
    object-fit: cover;
}
.banner-post-three:hover .banner-post-thumb-three img {
    transform: scale(1.1);
}
.banner-post-content-three {
    text-align: center;
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 60px;
}
.banner-post-content-three .post-title {
    color: var(--tg-white);
    font-size: 28px;
    margin-bottom: 20px;
    line-height: 1.4;
}
.banner-post-content-three .post-title a:hover {
    color: var(--tg-white);
}
.banner-post-three:hover .banner-post-content-three .post-title a {
    background-size: 100% 2px;
}
/*=============================
	12. Latest Post
===============================*/
.section-title-wrap {
    display: flex;
    align-items: center;
    gap: 30px;
    justify-content: space-between;
    position: relative;
    padding-bottom: 20px;
}
.section-title .title {
    margin-bottom: 0;
    font-size: 28px;
}
.section-title-line {
    width: 100%;
    height: 5px;
    position: absolute;
    left: 0;
    bottom: 0;
    border: 1px solid var(--tg-border-color);
    border-left: none;
    border-right: none;
}
.section-title-line::before {
    content: "";
    position: absolute;
    left: 0;
    top: -1px;
    width: 40px;
    height: 5px;
    background: var(--tg-primary-color);
}
.section-title-line::after {
    content: "";
    position: absolute;
    left: 36px;
    top: -1.5px;
    width: 10px;
    height: 6px;
    background: var(--tg-white);
    clip-path: polygon(40% 0, 100% 0%, 60% 100%, 0 100%);
}
.view-all-btn .link-btn {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    position: relative;
    border-radius: 4px;
    border: 1px solid #CFCFCF;
    padding: 10px 17px;
    color: var(--tg-secondary-color);
    gap: 10px;
    --arrow-hover-move-x: 110%;
    --arrow-hover-move-y: 100%;
}
.view-all-btn .link-btn .svg-icon svg {
    color: var(--tg-primary-color);
    width: 10px;
    transition: all 0.3s ease-out 0s;
    transform: translateY(-2px);
}
.view-all-btn .link-btn svg path {
    transition: transform .38s cubic-bezier(.37, .08, .02, .93), opacity .18s ease-out;
}
.view-all-btn .link-btn svg path:nth-of-type(1) {
    transform: translateX(0) translateY(0);
    opacity: 1;
    transition-delay: .15s, .15s;
}
.view-all-btn .link-btn svg path:nth-of-type(2) {
    transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y));
    opacity: .5;
    transition-delay: 0s, 0s;
}
.view-all-btn .link-btn:hover svg path:nth-of-type(1) {
    transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y)));
    opacity: 0;
    transition-delay: 0s, 0s;
}
.view-all-btn .link-btn:hover svg path:nth-of-type(2) {
    transform: translateX(0) translateY(0);
    opacity: 1;
    transition-delay: .15s, .15s;
}
.view-all-btn .link-btn:hover {
    border-color: var(--tg-secondary-color);
    color: var(--tg-white);
    background: var(--tg-secondary-color);
}
.view-all-btn .link-btn:hover .svg-icon svg {
    color: var(--tg-white);
}
.latest-post-inner-wrap > .row > .col-70 {
    width: 69.7%;
    flex: 0 0 auto;
}
.latest-post-inner-wrap > .row > .col-30 {
    width: 30.3%;
    flex: 0 0 auto;
}
.latest-post-item-wrap > .row > .col-66 {
    width: 66.5%;
}
.latest-post-item-wrap > .row > .col-34 {
    width: 33.5%;
}
.latest-post-item.big-post .featured-post-thumb img {
    height: 390px;
    object-fit: cover;
    width: 100%;
}
.latest-post-item.big-post .featured-post-content {
    padding: 30px 0 0;
}
.latest-post-item.big-post .featured-post-content p {
    width: 90%;
    margin: 0 auto;
}
.latest-post-item.big-post .featured-post-content .post-title {
    font-size: 28px;
}
.latest-post-item.big-post:hover .featured-post-content .post-title a {
    background-size: 100% 2px;
}
.latest-post-item.big-post .blog-post-meta .list-wrap {
    margin-bottom: 12px;
}
.latest-post-item.small-post .featured-post-thumb img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}
.latest-post-item.small-post .featured-post-content .post-title {
    font-size: 20px;
    line-height: 1.4;
}
.latest-post-item.small-post {
    margin-bottom: 20px;
}
.sidebar-wrap {
    margin-left: 40px;
}
.sidebar-wrap.sidebar-wrap-two {
    top: 70px;
}
.sidebar-avatar {
    text-align: center;
    position: relative;
    background: var(--tg-gray-three);
    padding: 100px 30px 45px;
    margin-top: 100px;
    z-index: 1;
}
.sidebar-avatar::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 6px;
    background: var(--tg-primary-color);
}
.featured-post-content {
    position: relative;
    text-align: center;
    padding: 25px 0 0;
}
.trending-shape-wrap img:nth-child(1) {
    right: 0;
    top: 0;
}
.trending-shape-wrap img {
    position: absolute;
    z-index: -1;
}
.featured-post-content .post-tag {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -13px;
}
.sidebar-avatar-thumb {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    width: 180px;
    margin-top: -100px;
}
.sidebar-avatar-thumb img {
    border-radius: 50%;
}
.sidebar-avatar-content .title {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 12px;
}
.sidebar-avatar-content p {
    margin-bottom: 20px;
}
.avatar-social .list-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.avatar-social .list-wrap li a {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--tg-primary-color);
    color: var(--tg-white);
    border-radius: 50%;
    font-size: 15px;
}
.avatar-social .list-wrap li a:hover {
    background: var(--tg-secondary-color);
}
.sidebar-avatar-shape img {
    position: absolute;
    z-index: -1;
}
.sidebar-avatar-shape img:nth-child(1) {
    right: 0;
    top: 0;
}
.sidebar-avatar-shape img:nth-child(2) {
    left: 0;
    bottom: 0;
}
.sidebar-widget {
    margin-bottom: 25px;
}
.sidebar-widget:last-child {
    margin-bottom: 0;
}
.widget-title {
    position: relative;
    padding-bottom: 20px;
}
.widget-title .title {
    margin-bottom: 0;
    font-size: 22px;
}
.sidebar-social-wrap .list-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}
.sidebar-social-wrap .list-wrap li a {
    display: flex;
    align-items: center;
    background: var(--tg-teal);
    font-size: 14px;
    font-weight: 500;
    text-transform: capitalize;
    color: var(--tg-secondary-color);
    gap: 10px;
    border-radius: 4px;
    padding: 10px 20px;
    min-width: 162px;
    justify-content: center;
}
.sidebar-social-wrap .list-wrap li a i {
    font-size: 18px;
}
.sidebar-social-wrap .list-wrap li a:hover {
    background: var(--tg-primary-color);
    color: var(--tg-white);
}

/* latest-post-two */
.sidebar-avatar-two {
    background: var(--tg-gray-three);
    border-radius: 6px;
    padding: 25px 40px 40px;
    text-align: center;
}
.sidebar-avatar-two .sidebar-avatar-thumb {
    position: inherit;
    width: 170px;
    margin-top: 0;
    transform: translateX(0);
    border: 5px solid var(--tg-white);
    border-radius: 50%;
    margin: 0 auto 20px;
    filter: drop-shadow(0px 20px 50px rgba(0, 0, 0, 0.10));
}
.sidebar-avatar-two .sidebar-avatar-content p {
    margin-bottom: 20px;
    color: #6D757F;
    line-height: 1.5;
}
.sidebar-avatar-two .avatar-social .list-wrap li a {
    width: 50px;
    height: 50px;
    background: var(--tg-white);
    color: var(--tg-secondary-color);
    border-radius: 50%;
    font-size: 20px;
    border: 1px solid #D0D0D0;
}
.sidebar-avatar-two .avatar-social .list-wrap li a:hover {
    background: var(--tg-primary-color);
    border-color: var(--tg-primary-color);
    color: var(--tg-white);
}
.sidebar-social-wrap.sidebar-social-two .list-wrap li a {
    background: #F0F0F0;
}
.sidebar-social-wrap.sidebar-social-two .list-wrap li a:hover {
    background: var(--tg-primary-color);
}
.overlay-post-content-three .post-title {
    font-size: 28px;
    color: var(--tg-white);
    margin-bottom: 15px;
    line-height: 1.3;
}
.overlay-post-thumb-three::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.00) 100%);
    pointer-events: none;
}
.overlay-post-three {
    position: relative;
}
/*=============================
	18. Trending Post
===============================*/
.trending-post-inner .col-70 {
    width: 69.7%;
    flex: 0 0 auto;
}
.trending-post-inner .col-30 {
    width: 30.3%;
    flex: 0 0 auto;
}
.recent-post-wrap {
    margin-bottom: 30px;
}
.recent-post-wrap .row .col-54 {
    width: 53.8%;
    flex: 0 0 auto;
}
.recent-post-wrap .row .col-46 {
    width: 46.2%;
    flex: 0 0 auto;
}
.overlay-post-two {
    position: relative;
    margin-bottom: 20px;
}
.overlay-post-two:hover .overlay-post-thumb img {
    transform: scale(1.1);
}
.overlay-post-two:hover .overlay-post-content .post-title a {
    background-size: 100% 2px;
}
.overlay-post-two .overlay-post-content {
    left: 25px;
    bottom: 30px;
    right: 25px;
}
.overlay-post-two .overlay-post-thumb::after {
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.00) 100%);
}
.overlay-post-two .overlay-post-thumb img {
    height: 520px;
}
.horizontal-post-two {
    display: flex;
    gap: 18px;
    flex-direction: row-reverse;
    margin-bottom: 20px;
}
.horizontal-post-two .horizontal-post-thumb {
    width: 160px;
    flex: 0 0 auto;
    margin: 0;
}
.horizontal-post-two:hover .horizontal-post-thumb img {
    transform: scale(1.1);
}
.horizontal-post-two .horizontal-post-content .post-title {
    margin-bottom: 12px;
    font-size: 18px;
    line-height: 1.4;
}
.horizontal-post-two:hover .horizontal-post-content .post-title a {
    background-size: 100% 1px;
}
.trending-post-wrap {
    padding: 50px 0 20px;
}
.trending-post {
    display: flex;
    gap: 25px;
    margin-bottom: 30px;
}
.trending-post-thumb {
    width: 54%;
    flex: 0 0 auto;
    border-radius: 6px;
    overflow: hidden;
}
.trending-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.trending-post:hover .trending-post-thumb img {
    transform: scale(1.1);
}
.trending-post-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.trending-post-content .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.trending-post-content .post-title {
    font-size: 28px;
    margin-bottom: 15px;
    line-height: 1.3;
}
.trending-post:hover .trending-post-content .post-title a {
    background-size: 100% 2px;
}
.trending-post-content .blog-post-meta {
    margin-bottom: 15px;
}
.trending-post-content p {
    margin-bottom: 20px;
}
.trending-post-two {
    margin-bottom: 30px;
}
.trending-post-thumb-two {
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 15px;
}
.trending-post-thumb-two img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}
.trending-post-two:hover .trending-post-thumb-two img {
    transform: scale(1.1);
}
.trending-post-thumb-two .post-tag {
    position: absolute;
    left: 20px;
    top: 20px;
}
.trending-post-content-two .post-title {
    margin-bottom: 12px;
    font-size: 20px;
    line-height: 1.4;
}
.trending-post-two:hover .trending-post-content-two .post-title a {
    background-size: 100% 1px;
}
.trending-post-content-two .blog-post-meta .list-wrap {
    justify-content: flex-start;
}

/* trending-post-two */
.trending-post-area-two {
    background: var(--tg-teal);
    position: relative;
    padding: 80px 0;
    z-index: 1;
}
.trending-shape-wrap img {
    position: absolute;
    z-index: -1;
}
.trending-shape-wrap img:nth-child(1) {
    right: 0;
    top: 0;
}
.trending-shape-wrap img:nth-child(2) {
    left: 0;
    bottom: 0;
}
.trending-post-active [class*="col-"] {
    padding: 0 4px;
}
.trending-post-active .slick-arrow {
    position: absolute;
    left: -15px;
    top: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 0;
    line-height: 0;
    color: var(--tg-white);
    font-weight: 700;
    font-size: 20px;
    background: var(--tg-primary-color);
    border: none;
    transform: translateY(-50%);
    z-index: 3;
    opacity: 0;
    transition: .3s linear;
}
.trending-post-active .slick-prev.slick-arrow i {
    transform: rotate(180deg);
}
.trending-post-active .slick-next.slick-arrow {
    left: auto;
    right: -15px;
}
.trending-post-active .slick-arrow:hover {
    background: var(--tg-secondary-color);
}
.trending-post-active:hover .slick-arrow {
    opacity: 1;
}
.overlay-post-four .overlay-post-content-three {
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: 30px;
}
.overlay-post-four .overlay-post-thumb-three {
    border-radius: 6px;
}
.overlay-post-four .overlay-post-thumb-three::after {
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.00) 74.67%);
}
.overlay-post-four .overlay-post-thumb-three img {
    height: 420px;
}
.overlay-post-four .overlay-post-content-three .post-title {
    font-size: 20px;
    margin-bottom: 15px;
    line-height: 1.4;
}
.overlay-post-three.overlay-post-four:hover .post-title a {
    background-size: 100% 1px;
}

/* trending-post-three */
.trending-post-area-three {
    background: #0C192A;
    padding: 70px 0 40px;
}
.section-title.white-title .title {
    color: var(--tg-white);
}
.section-title-line.black-line {
    border: 1px solid #253346;
    border-left: none;
    border-right: none;
}
.section-title-line.black-line::after {
    background: #0C192A;
}
.overlay-post-five {
    position: relative;
    margin-bottom: 30px;
}
.overlay-post-thumb-five {
    position: relative;
    border-radius: 6px;
    overflow: hidden;
}
.overlay-post-thumb-five img {
    width: 100%;
    height: 404px;
    object-fit: cover;
}
.overlay-post-five:hover .overlay-post-thumb-five img {
    transform: scale(1.1);
}
.overlay-post-thumb-five::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.20) 100%);
    pointer-events: none;
    border-radius: 6px;
}
.overlay-post-content-five {
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 35px;
}
.overlay-post-content-five .post-title {
    margin-bottom: 15px;
    color: var(--tg-white);
    font-size: 28px;
    line-height: 1.3;
}
.overlay-post-content-five .post-title a:hover {
    color: var(--tg-white);
}
.overlay-post-five:hover .overlay-post-content-five .post-title a {
    background-size: 100% 2px;
}
.overlay-post-content-five .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.horizontal-post-three {
    display: flex;
    gap: 25px;
    margin-bottom: 30px;
}
.horizontal-post-thumb-three {
    border-radius: 5px;
    width: 180px;
    overflow: hidden;
    flex: 0 0 auto;
}
.horizontal-post-thumb-three img {
    width: 100%;
    object-fit: cover;
    height: 100%;
}
.horizontal-post-three:hover .horizontal-post-thumb-three img {
    transform: scale(1.1);
}
.horizontal-post-content-three {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.horizontal-post-content-three .post-title {
    color: var(--tg-white);
    margin-bottom: 15px;
    font-size: 20px;
    line-height: 1.4;
}
.horizontal-post-content-three .post-title a:hover {
    color: var(--tg-white);
}
.horizontal-post-three:hover .horizontal-post-content-three .post-title a {
    background-size: 100% 1px ;
}
/*=============================
	24. Weekly Post
===============================*/
.weekly-post-inner-wrap .row .col-70 {
    width: 69.7%;
    flex: 0 0 auto;
}
.weekly-post-inner-wrap .row .col-30 {
    width: 30.3%;
    flex: 0 0 auto;
}
.weekly-post-item {
    display: flex;
    gap: 40px;
    margin-bottom: 20px;
}
.weekly-post-thumb {
    width: 440px;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 6px;
}
.weekly-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.weekly-post-item:hover .weekly-post-thumb img {
    transform: scale(1.1);
}
.weekly-post-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.weekly-post-content .post-title {
    font-size: 22px;
    margin-bottom: 15px;
    line-height: 1.4;
}
.weekly-post-item:hover .weekly-post-content .post-title a {
    background-size: 100% 1px;
}
.weekly-post-content .blog-post-meta {
    margin-bottom: 15px;
}
.weekly-post-content p {
    margin-bottom: 20px;
}
.weekly-post-content .view-all-btn .link-btn {
    font-weight: 600;
}
.hot-post-item {
    margin-bottom: 20px;
}
.hot-post-item:last-child {
    margin-bottom: 0;
}
.hot-post-thumb {
    overflow: hidden;
    border-radius: 5px;
    margin-bottom: 20px;
}
.hot-post-thumb img {
    height: 220px;
    object-fit: cover;
    width: 100%;
}
.hot-post-item:hover .hot-post-thumb img {
    transform: scale(1.1);
}
.hot-post-content .post-title {
    margin-bottom: 15px;
    font-size: 20px;
    line-height: 1.3;
}
.hot-post-item:hover .hot-post-content .post-title a {
    background-size: 100% 1px;
}
.hot-post-content .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.sidebar-img img {
    border-radius: 5px;
}

/* weekly-post-two */
.weekly-post-item.weekly-post-two {
    flex-direction: row-reverse;
    margin-bottom: 30px;
}
.sidebar-overlay-post {
    position: relative;
    margin-bottom: 25px;
}
.so-post-thumb {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}
.so-post-thumb::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.00) 100%);
    pointer-events: none;
}
.so-post-thumb img {
    width: 100%;
    height: 364px;
    object-fit: cover;
}
.sidebar-overlay-post:hover .so-post-thumb img {
    transform: scale(1.1);
}
.so-post-content {
    position: absolute;
    left: 30px;
    bottom: 30px;
    right: 25px;
}
.so-post-content .post-title {
    color: var(--tg-white);
    font-size: 20px;
    line-height: 1.4;
}
.so-post-content .post-title a:hover {
    color: var(--tg-white);
}
.sidebar-overlay-post:hover .so-post-content .post-title a {
    background-size: 100% 1px;
}
.so-post-content .blog-post-meta .list-wrap {
    justify-content: flex-start;
}

/* weekly-post-three */
.weekly-post-three {
    margin-bottom: 30px;
}
.weekly-post-three .weekly-post-thumb {
    position: relative;
    margin-bottom: 15px;
    width: 100%;
}
.weekly-post-three .weekly-post-thumb .post-tag {
    position: absolute;
    left: 30px;
    top: 30px;
}
.weekly-post-three .weekly-post-thumb img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.weekly-post-three:hover .weekly-post-thumb img {
    transform: scale(1.1);
}
.weekly-post-three:hover .weekly-post-content .post-title a {
    background-size: 100% 1px;
}
.weekly-post-three .weekly-post-content p {
    margin-bottom: 0;
}
.sidebar-newsletter-form-two .form-grp input {
    width: 100%;
    border: none;
    border-radius: 5px;
    background: var(--tg-white);
    text-align: center;
    font-size: 14px;
    padding: 13px 20px;
    color: var(--tg-secondary-color);
    height: 50px;
}
.sidebar-newsletter-form-two .form-grp input::placeholder {
    font-size: 14px;
    color: #6D757F;
}
.sidebar-newsletter-form-two .btn {
    width: 100%;
    background: var(--tg-primary-color);
    justify-content: center;
    text-transform: uppercase;
    margin-top: 15px;
}
.sidebar-newsletter-form-two .btn::before {
    background: var(--tg-white);
}
.sidebar-newsletter-form-two .btn:hover {
    color: var(--tg-primary-color);
}
.form-check {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    margin-top: 20px;
}
.form-check .form-check-input {
    border-radius: 3px;
    border: 1px solid #436793;
    margin: 0 8px 0 0;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    background-color: var(--tg-secondary-color);
    cursor: pointer;
}
.form-check .form-check-input:focus {
    outline: 0;
    box-shadow: none;
}
.form-check label {
    text-align: left;
    font-size: 14px;
    color: #7488A1;
    user-select: none;
}

/* weekly-post-four */
.weekly-post-item.weekly-post-four {
    margin-bottom: 40px;
}
.post-tag-two {
    font-size: 13px;
    letter-spacing: 0.78px;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1;
    color: var(--tg-icon-color);
    border-radius: 3px;
    border: 1px solid #B8C1CD;
    padding: 4.5px 8px;
    margin-bottom: 8px;
    display: inline-block;
}
/*=============================
	16. Spotlight Post
===============================*/
.spotlight-post-inner-wrap .row .col-70 {
    width: 69.7%;
    flex: 0 0 auto;
}
.spotlight-post-inner-wrap .row .col-30 {
    width: 30.3%;
    flex: 0 0 auto;
}
.spotlight-post-item-wrap {
    margin-bottom: 30px;
}
.spotlight-post-item-wrap .row .col-57 {
    width: 57.4%;
    flex: 0 0 auto;
}
.spotlight-post-item-wrap .row .col-43 {
    width: 42.6%;
    flex: 0 0 auto;
}
.spotlight-post {
    margin-bottom: 20px;
}
.spotlight-post-thumb {
    border-radius: 6px;
    overflow: hidden;
}
.spotlight-post.big-post .spotlight-post-thumb {
    margin-bottom: 20px;
}
.spotlight-post.big-post .spotlight-post-thumb img {
    width: 100%;
    object-fit: cover;
    height: 300px;
}
.spotlight-post:hover .spotlight-post-thumb img {
    transform: scale(1.1);
}
.spotlight-post.big-post .spotlight-post-content .post-title {
    font-size: 28px;
    margin-bottom: 18px;
    line-height: 1.28;
}
.spotlight-post-content .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.post-title.bold-underline a {
    background-size: 0 2px;
}
.spotlight-post:hover .post-title.bold-underline a {
    background-size: 100% 2px;
}
.spotlight-post.small-post {
    display: flex;
    flex-direction: row-reverse;
    gap: 20px;
}
.spotlight-post.small-post .spotlight-post-thumb {
    width: 140px;
    flex: 0 0 auto;
}
.spotlight-post.small-post .spotlight-post-thumb img {
    width: 140px;
    height: 100%;
    object-fit: cover;
}
.spotlight-post.small-post .spotlight-post-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.spotlight-post-content .post-title {
    margin-bottom: 13px;
    font-size: 20px;
    line-height: 1.3;
}
.spotlight-post:hover .post-title a {
    background-size: 100% 1px;
}
.ta-overlay-post-two {
    position: relative;
    margin-bottom: 10px;
}
.overlay-post-thumb-two {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
}
.overlay-post-thumb-two::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.20) 100%);
    pointer-events: none;
}
.overlay-post-thumb-two img {
    height: 300px;
    width: 100%;
    object-fit: cover;
}
.ta-overlay-post-two:hover .overlay-post-thumb-two img {
    transform: scale(1.1);
}
.overlay-post-content-two {
    position: absolute;
    left: 30px;
    bottom: 30px;
    right: 30px;
}
.overlay-post-content-two .post-title {
    margin-bottom: 15px;
    font-size: 20px;
    color: var(--tg-white);
    line-height: 1.3;
}
.overlay-post-content-two .post-title a:hover {
    color: var(--tg-white);
}
.ta-overlay-post-two:hover .overlay-post-content-two .post-title a {
    background-size: 100% 1px;
}
.post-tag-three {
    background: rgba(255, 255, 255, 0.30);
}
.post-tag-three:hover {
    background: var(--tg-primary-color);
}
.overlay-post-content-two .blog-post-meta .list-wrap {
    justify-content: flex-start;
}
.popular-post-item-wrap .row {
    --bs-gutter-x: 10px;
}
.widget-title-two {
    display: flex;
    align-items: center;
}
.widget-title-two .title {
    margin-bottom: 0;
    font-size: 20px;
    font-weight: 800;
    color: var(--tg-white);
    padding: 8px 28px;
    position: relative;
    z-index: 1;
    white-space: nowrap;
}
.sidebar-newsletter {
    background: var(--tg-secondary-color);
    border-radius: 5px;
    text-align: center;
    padding: 50px 35px 30px;
    position: relative;
    z-index: 1;
}
.sidebar-newsletter .icon {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #7B96B7;
    opacity: 0.1;
    top: 28px;
    font-size: 75px;
    line-height: 0;
    z-index: -1;
}
.sidebar-newsletter .title {
    color: var(--tg-white);
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 25px;
}
.sidebar-newsletter p {
    margin-bottom: 30px;
    color: var(--tg-white);
    font-weight: 500;
}
.sidebar-newsletter-form form {
    position: relative;
}
.sidebar-newsletter-form input {
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    color: var(--tg-white);
    border: none;
    background: var(--tg-primary-color);
    border-radius: 5px;
    padding: 13px 45px 13px 20px;
    height: 50px;
}
.sidebar-newsletter-form input::placeholder {
    color: var(--tg-white);
    font-size: 14px;
    font-weight: 400;
    opacity: .8;
}
.sidebar-newsletter-form button {
    border: none;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    color: var(--tg-white);
    padding: 0;
    line-height: 1;
}
.sidebar-newsletter-form button svg {
    width: 16px;
    height: 16px;
}
.rc-post-wrap .popular-post {
    margin-bottom: 15px;
}
.rc-post-wrap .popular-post:last-child {
    margin-bottom: 0;
}
.sidebar-widget-two {
    margin-bottom: 50px;
}
.sidebar-widget-two:last-child {
    margin-bottom: 0;
}
.sidebar-categories .list-wrap li {
    margin-bottom: 5px;
}
.sidebar-categories .list-wrap li:last-child {
    margin-bottom: 0;
}
.sidebar-categories .list-wrap li a {
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    justify-content: space-between;
    padding: 25px 25px;
    min-height: 80px;
    z-index: 1;
    --arrow-hover-move-x: 110%;
    --arrow-hover-move-y: 100%;
}
.sidebar-categories .list-wrap li a::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.65) 34.9%, rgba(0, 0, 0, 0.00) 97.88%);
    pointer-events: none;
    z-index: -1;
}
.sidebar-categories .list-wrap li a .post-tag {
    margin-bottom: 0;
    border-radius: 30px;
    transition: all 0.3s ease-out 0s;
}
.sidebar-categories .list-wrap li a:hover .post-tag {
    background: var(--tg-primary-color);
}
.sidebar-categories .right-arrow svg {
    width: 16px;
    color: var(--tg-white);
    transition: all 0.3s ease-out 0s;
}
.sidebar-categories .right-arrow svg path {
    transition: transform .38s cubic-bezier(.37, .08, .02, .93), opacity .18s ease-out;
}
.sidebar-categories .right-arrow svg path:nth-of-type(1) {
    transform: translateX(0) translateY(0);
    opacity: 1;
    transition-delay: .15s, .15s;
}
.sidebar-categories .right-arrow svg path:nth-of-type(2) {
    transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y));
    opacity: .5;
    transition-delay: 0s, 0s;
}
.sidebar-categories .list-wrap li a:hover .right-arrow svg path:nth-of-type(1) {
    transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y)));
    opacity: 0;
    transition-delay: 0s, 0s;
}
.sidebar-categories .list-wrap li a:hover .right-arrow svg path:nth-of-type(2) {
    transform: translateX(0) translateY(0);
    opacity: 1;
    transition-delay: .15s, .15s;
}
/*=============================
	29. Instagram
===============================*/
.instagram-inner-wrap {
    padding: 0 10px;
}
.instagram-inner-wrap .row {
    --bs-gutter-x: 10px;
}
.instagram-inner-wrap .row .col {
    padding: 0 5px;
}
.instagram-item {
    margin-bottom: 10px;
    overflow: hidden;
}
.instagram-item a {
    position: relative;
}
.instagram-item a::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--tg-secondary-color);
    opacity: 0;
    pointer-events: none;
    transition: all ease 0.8s;
    transform: scale(0);
}
.instagram-item a::before {
    content: "\f00e"; /* Zoom icon instead of Instagram */
    position: absolute;
    z-index: 2;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 30px;
    color: var(--tg-white);
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all ease 0.8s;
    transition: all ease 0.8s;
}
.instagram-item a:hover::before {
    visibility: visible;
    opacity: 1;
}
.instagram-item:hover a::after {
    opacity: .8;
    transform: scale(1);
}
.instagram-item img {
    height: 200px;
    object-fit: cover;
}
.instagram-item img:hover {
    transform: scale(1.1);
}

/*=============================
	31. Footer
===============================*/
.footer-area {
    background: var(--tg-black);
}
.footer-top {
    padding: 100px 0 60px;
    position: relative;
    z-index: 1;
}
.footer-shape {
    background-size: cover;
    background-position: center;
    height: 61px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
}
.footer-widget {
    margin-bottom: 40px;
}
.fw-logo {
    margin-bottom: 20px;
}
.footer-content p {
    margin-bottom: 0;
    color: var(--tg-gray-two);
    width: 95%;
}
.footer-widget .fw-title {
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 20px;
    color: var(--tg-white);
    font-size: 20px;
    font-weight: 800;
}
.footer-widget .fw-title::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 32px;
    height: 5px;
    background: var(--tg-primary-color);
    clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%);
}
.footer-link-wrap .list-wrap li {
    margin-bottom: 8px;
}
.footer-link-wrap .list-wrap li:last-child {
    margin-bottom: 0;
}
.footer-link-wrap .list-wrap li a {
    color: var(--tg-gray-two);
    font-size: 15px;
    font-weight: 500;
    position: relative;
    text-transform: capitalize;
}
.footer-link-wrap .list-wrap li a::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: var(--tg-gray-two);
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: transform 0.4s cubic-bezier(1, 0, 0, 1);
    transition: transform 0.4s cubic-bezier(.74, .72, .27, .24);
}
.footer-link-wrap .list-wrap li a:hover::before {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}
.footer-top .row [class*="col-"]:nth-child(3) .footer-widget {
    margin-left: 55px;
}
.footer-bottom {
    border-top: 1px solid #202E3F;
    padding: 35px 0;
}
.footer-bottom-menu .list-wrap {
    display: flex;
    align-items: center;
    gap: 25px;
}
.footer-bottom-menu .list-wrap li {
    position: relative;
}
.footer-bottom-menu .list-wrap li::before {
    content: "";
    position: absolute;
    right: -14px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #7C91AA;
}
.footer-bottom-menu .list-wrap li:last-child::before {
    display: none;
}
.footer-bottom-menu .list-wrap li a {
    color: #7C91AA;
    position: relative;
}
.footer-bottom-menu .list-wrap li a::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #7C91AA;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: transform 0.4s cubic-bezier(1, 0, 0, 1);
    transition: transform 0.4s cubic-bezier(.74, .72, .27, .24);
}
.footer-bottom-menu .list-wrap li a:hover::before {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}
.copyright-text p {
    margin-bottom: 0;
    color: #7C91AA;
    text-align: right;
}

/* footer-two */
.footer-area-two {
    margin-top: -100px;
    padding: 100px 0 0;
}

/* footer-three */
.footer-top-two {
    background: #0C192A;
    padding: 100px 0;
    position: relative;
    z-index: 1;
}
.footer-shape-two {
    position: absolute;
    left: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 95px;
    z-index: -1;
}
.footer-content-two {
    text-align: center;
}
.footer-content-two p {
    margin-bottom: 45px;
    color: var(--tg-gray-two);
    text-transform: capitalize;
}
.footer-social .list-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px 50px;
}
.footer-social .list-wrap li a {
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    color: var(--tg-white);
    gap: 8px;
}
.footer-social .list-wrap li a i {
    font-size: 20px;
}
.footer-social .list-wrap li a:hover {
    color: var(--tg-primary-color);
}
.footer-bottom-two {
    background: #061120;
    padding: 26px 0;
}
.copyright-text-two p {
    margin-bottom: 0;
    text-align: center;
    color: #7C91AA;
}

/* footer-four */
.footer-top-three .footer-content p {
    color: var(--tg-body-font-color);
}
.footer-top-three .footer-widget .fw-title {
    color: var(--tg-secondary-color);
}
.footer-top-three .footer-link-wrap .list-wrap li a {
    color: var(--tg-body-font-color);
}
.footer-top-three .footer-link-wrap .list-wrap li a:hover {
    color: var(--tg-secondary-color);
}
.footer-top-three .footer-link-wrap .list-wrap li a::before {
    background: var(--tg-secondary-color);
}
.footer-bottom-three {
    border-color: var(--tg-border-color);
}
.footer-bottom-three .footer-bottom-menu .list-wrap li a {
    color: var(--tg-body-font-color);
}
.footer-bottom-three .footer-bottom-menu .list-wrap li a:hover {
    color: var(--tg-secondary-color);
}
.footer-bottom-three .footer-bottom-menu .list-wrap li a::before {
    background: var(--tg-secondary-color);
}
.footer-bottom-three .copyright-text p {
    color: var(--tg-body-font-color);
}
.jo-footer-links .links {
    font-size: clamp(13px, 0.833vw, 16px);
    display: flex;
    flex-flow: column;
}
@media screen and (max-width: 767px) {
	.header-top-wrap-three .tt-footer-top__socials {
    justify-content: center;
    margin: 12px 0;
}
	.jo-intro__img img {
    max-width: none;
    max-height: 100%;
    border-radius: 0;
    width: 100%;
		margin-top: 14px;
}
	.jo-intro__img .play-btn {
        left: 10px;
        width: 70px;
        font-size: 20px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
	.jo-inner-video-card-2--big .jo-video-card__img {
        aspect-ratio: unset !important;
	}
.trending-post-area-two {
    padding: 30px 0;
}
.jo-footer-top__nwsltr input {
        display: none;
    }
.pb-80 {
    padding-bottom: 20px;
}
.pt-80 {
    padding-top: 20px;
}
.section-title .title {
    margin-bottom: 0;
    font-size: 22px;
}
.sidebar-wrap {
    margin-left: 0;
    position: static;
    top: 100px;
}
.section-title-wrap {
    gap: 10px;
    flex-flow: row wrap;
}
body .list_style_posts .card-footer p {
    margin-left: 5px;
    font-size: 13px;
    margin-top: 3px;
}
body .list_style_posts .card-footer .post-actions {
    gap: 11px;
}
	.card_content{margin-top: 12px}
	body .pt-60 {
    padding-top: 0;
}
	.banner-post-thumb-three img {
    height: 300px;
}
	body .blog-post-meta.white-blog-meta .list-wrap li {
    color: #fff;
    font-size: 14px;
    color: #fff;
}
}
	.banner-post-content-three .post-title {
    font-size: 24px;
    line-height: 1;
}
	.fix_droppp ul li:first-child {
    text-transform: uppercase;
    font-weight: 600;
}
	body .fix_droppp .dropdown-menu {
    margin-top: 17px !important;
    min-width: 500px;
    background: #f9f9f9;
    -ms-box-shadow: 0 2px 15px 0px rgba(248, 71, 62, 0.09);
    -moz-box-shadow: 0 2px 15px 0px rgba(248, 71, 62, 0.09);
    -webkit-box-shadow: 0 2px 15px 0px rgba(248, 71, 62, 0.09);
    box-shadow: 0 2px 15px 0px rgba(248, 71, 62, 0.09);
    border-radius: 10px;
    border: none;
    border-radius: 5px;
}
	body .logoo {
        max-width: 190px;
    }
body .jo-header {
		padding-top: 5px;
		flex-flow: row;
		justify-content: space-between;
	}

/* ============================================================
   layouts/landing_header.php [block 1]
   ============================================================ */
.news_cards {
		position: relative;
	}

	.news_cards:after {
		content: '';
		position: absolute;
		w: 100%;
		width: 100%;
		height: 100%;
		background-color: rgba(57, 103, 197, 0.20);
		display: block;
		visibility: visible;
		left: 0;
		top: 0;
		border-radius: 30px;
	}

	#Top_bar .menu li ul li a {
		border-bottom: none;
		padding: 5px 12px;
		line-height: 1.3;
	}

	@media (min-width: 768px) {
		.mga_dropdown {
			width: auto !important;
		}

		.mga_dropdown li {
			float: none !important;
			width: 180px !important;
			margin-bottom: 0 !important;
		}
	}

	.news_cards .news_detail {
		position: relative;
		z-index: 1
	}

	.captcha-fake-field {
		background: transparent;
		bottom: 0;
		border: none;
		display: block;
		height: 1px;
		left: 12px;
		width: 1px;
		position: absolute;
		z-index: -1;
	}

	.form_group.captcha {
		margin-bottom: 30px;
	}

	.captcha {
		position: relative;
	}

	nav.navbar-findcond button.navbar-toggle {
		background: none !important;
		margin-top: 15px;
	}

	.navbar-toggle .icon-bar {
		display: block;
		width: 30px;
		height: 3px;
		border-radius: 1px;
		margin-top: 26px;
	}

	.badge-secondary2 {
		border-radius: 0;
		padding: 5px 11px;
		background: #36a4f7;
	}

	.trending-activites .thumbnail .caption {
		padding: 14px 15px;
	}

	#ios_popup .modal-footer {
		border-top: none;
		text-align: center;
	}

	#ios_popup .modal-footer button {
		text-transform: capitalize;
	}

	#ios_popup .modal-header {
		padding: 0;
		border-bottom: none;
	}

	#ios_popup .modal-header .close {
		margin-top: 10px;
		margin-right: 10px;
		background: #FEDC00 !important;
		background: none;
		font-size: 30px;
		opacity: 1;
		width: 30px;
		height: 30px;
		line-height: 35px;
		border-radius: 100%;
	}

	nav.navbar-findcond .navbar-right li a {
		font-size: 16px;
		font-weight: 600;
	}

	.trending-list .btn:hover,
	.trending-list .btn.active2 {
		background: #36a4f7 !important;
	}

	.trending-activites .fluid-width-video-wrapper {
		min-height: 226px;
	}

	@media (min-width: 768px) and (max-width: 991px) {
		nav.navbar-findcond .navbar-right .btn-project {
			padding: 12px 10px !important;
		}
	}

	@media (max-width: 1100px) {
		.navbar-findcond .container {
			display: flex;
			flex-flow: column;
			align-items: center;
		}
	}

	@media (max-width: 767px) {
		#Top_bar #logo img.logo-main {
			height: 44px;
		}

		#Side_slide #menu ul li.submenu .menu-toggle {
			color: #fff;
			opacity: 1
		}

		#Side_slide #menu ul li a {
			font-size: 14px;
			color: #fff;
		}
	}

/* layouts/landing_header.php [block 2]: per-portal colours, generated in colors_settings.php */
/* ============================================================
   layouts/landing_header.php [block 3]
   ============================================================ */
#Top_bar.is-sticky {
			height: auto !important
		}

		#Top_bar .menu>li>a span:not(.description) {
			padding: 0 16px;
		}

		#Top_bar .menu li ul li {
			min-width: 240px;
		}

		body.site_id_17 #Top_bar #logo,
		body.site_id_17 .header-fixed #Top_bar #logo,
		body.site_id_17 header-plain #Top_bar #logo,
		body.site_id_17 .header-transparent #Top_bar #logo {
			height: 61px;
			line-height: 60px;
			padding: 0;
			margin-top: 15px;
		}

		.slick-dots li button {
			font-size: 0 !important
		}

/* ============================================================
   header_fix.php [block 1]
   ============================================================ */
.post-share-tag .bi-share{
	color: #fff;
    background: red;
    padding: 10px;
    border-radius: 10px;
}
	.post-share-tag .post-tag-cloud ul li a:hover {
    background: #000 !important;
}
	.post-share-tag{margin-top: 20px}
	html body .gray_ara .btn-outline-primary {

    height: auto;
    padding: 10px 19px;
    line-height: 1.2;
    white-space: normal;
    text-align: left;
}
.blog-details-wrapper .blog-post-item .tagss {
    background: none !important;
}
	body, body p, body span, body li, body td, body th {
    color: #202020;
}
body .share-items p:hover, .ts-speaker-popup .ts-speaker-popup-content .ts-speakers-social a:hover, html body .post-tags a:hover, html body .btn--theme:hover, html body .owl-prev-btn:hover, html body .owl-next-btn:hover, html body .BackTo:hover, html body .header ul.navbar-nav > li.header-ticket .ticket-btn:hover, html body .btn:hover {
    color: #fff !important;
}
.fix_droppp .dropdown-menu {
    transform: none !important;
    top: 30px !important;
    right: 0 !important;
    left: auto;
}
	body .header-top-left-two  .list-wrap .fix_droppp li a{color:#202020 !important}
	.fix_droppp .dropdown-menu *{color:#202020}
.dropdown-menu.show {
    display: block !important; 
	}
.header.header-transparent {
    position: static;
}
.header.sticky {
    position: fixed !important;
}
.header-top-right-two {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
}
.header-top-left-two .list-wrap {
    display: flex;
	list-style: none;
    align-items: center;
    gap: 20px;
}
	
.ts-speaker-popup-content .ts-speakers-social a {
    color: #fff;
    margin-right: 5px;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-block;
    text-align: center;
    line-height: 35px;
   
}	
.post_content .post_content ul,
.post_content .post_content ol{list-style: none; padding-left: 0}
	.ts-speaker-popup .ts-speaker-popup-content .ts-speakers-social a i{ font: normal normal normal 14px / 1 FontAwesome;}
.header-top-wrap-three {
    background: var(--tg-secondary-color);
    padding: 11px 0;
}
.header-top-left-two .list-wrap li a {
    font-size: 15px;
}
.header-top-left-two .list-wrap li a {
    color: var(--tg-white) !important;
    font-weight: 14px;
    font-weight: 600;
}
.header .navbar-light .navbar-toggler, .single-intro-text .count-number, body .schedule-listing .schedule-slot-time, html body .btn--theme, body .share-items p, .schedule-listing:nth-of-type(even) .schedule-slot-time, html body .owl-prev-btn, html body .owl-next-btn, html body .BackTo, body .theme_bg2, body .ts-speaker-popup button.mfp-close, html body .gray_ara .btn-outline-primary.active, html body .gray_ara .btn-outline-primary:hover, html body .header ul.navbar-nav > li.header-ticket .ticket-btn, html body .btn{color:#fff !important;}
	
	
	@media (max-width: 767px) {
		html body .fix_droppp .dropdown-menu {
    min-width: 100% !important;
    margin-top: 70px !important;
}
		.dropdown.fix_droppp{position: static}
		.jo-sidebar-close-btn {
			width: 40px;
			height: 40px;
			position: absolute;
			right: 15px;
		}
    .collapse22 {
		margin-left: 0 !important;
    }
	.header-top-right-two {
		display: flex;
		align-items: center;
		justify-content: center !important;
		gap: 28px;
	}
	.gray_ara {
    padding: 10px;
}
	   html body .gray_ara .btn-outline-primary {
    width: 100%;
    white-space: normal;
height: auto;
    line-height: 1.4;
    padding: 12px 15px;
}
	.header-top-right-two {
    justify-content: center;
    gap: 28px;
}
	  html body .gray_ara .navbar-nav {
    background: #fff;
    flex-flow: column;
    padding: 12px  13px !important;
}
}

/* header_fix.php [block 2]: per-portal colours, generated in colors_settings.php */
/* ============================================================
   themes/global_css.php [block 1]
   ============================================================ */
.ellipsis-2 {
	white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media (max-width: 767px) {
	.jo-footer-top .tt-footer-top__socials{
				justify-content: center !important;
			}
		.jo-footer-top .row{    flex-flow: column;
		gap: 10px;
			justify-content: center;
			align-items: center !important;
			text-align: center;
			}
	.jo-footer-top .tt-footer-top__socials a{width: auto}
	.jo-footer-top .tt-footer-top__socials a i {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
    body .page-banner-area {
                min-height: 100px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
   
    }
	body .page-banner-title h2{margin-bottom: 0; font-size: 6vw}
	body .page-banner-title {
    position: absolute;
    top: auto;
    height: auto;
}
}

/* ============================================================
   feed_css.php [block 1]
   ============================================================ */
.post_titlee a{color:#252525}
	/*body .list_style_posts .card_content a{color:#F820A3}
	body .list_style_posts .card_content .badge{background-color: #F820A3 !important;
	}*/
/*	#ajax_load_more{display: none !important}*/
@media only screen and (min-width: 1200px) {
    .container {
        max-width: 1320px;
    }
}
.img-xs {
    width: 37px;
    height: 37px;
}
.rounded-circle {
    border-radius: 50% !important;
}
.post_loop .card-footer,
.post_loop .card-header {
    padding-left: 0;
    padding-right: 0;
	background: none !important;
	border:none !important;
}
.post_loop .card-header p {
    margin-bottom: 3px;
    line-height: 1;
    margin-left: 8px;
    font-size: 14px;
    margin-right: 9px;
}
.list_style_posts .card-footer .post-actions .icon-md {
    width: 20px;
    height: 20px;
    margin-top: 3px;
	}
	.list_style_posts .card-footer .post-actions a{color:#6c757d!important}
.list_style_posts .card-footer p {
    margin-bottom: 0;
    margin-left: 5px;
    font-size: 14px;
    margin-top: 4px;
}
.list_style_posts .card-footer .post-actions {
    gap: 20px;
}
.icon-md {
    font-size: 2rem;
}
.list_style_posts .card-footer .post-actions a {
    margin: 0 !important;
    gap: 2px;
    align-items: center;
    justify-content: center;
}
.share-container {
    max-width: 470px !important;
}
.play_icon img {
    width: 35px !important;
    min-height: 0 !important;
}
.abs_hide_box {
    position: absolute;
    right: 0;
    bottom: 12px;
}
.fallow_btn {
    cursor: pointer;
    background-color: #F820A3 !important;
    color: #fff;
    border-radius: 5px;
    padding: 2px 9px;
    align-self: center;
    font-weight: 600;
    font-size: 14px;
}
.hide_post_details {
    display: none;
}
	.list_style_posts  .bg-info{background: none !important}
.list_style_posts .card-body{padding: 0}
.list_style_posts .card_content  .badge  {
    background-color: #20a0ec !important;
    border: none !important;
    border-radius: 0;
    padding: 6px 14px;
    border-radius: 3px;
    font-weight: normal;
    font-size: 14px;
}
.list_style_posts {
	margin-bottom: 1.5rem;
    border-radius: 10px;
    border: 1px solid #f2f4f9;
}

/* ============================================================
   landing.php [block 1]
   ============================================================ */
.jo-inner-videos-slider2 a:hover {
    opacity: 0.8;
  }

  .jo-article2 {
    position: relative
  }

  .jo-article2 .jo-article__txt {
    inset: 0;
    margin: 0;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    padding: 12px 14px;
    top: auto;
  }

  .jo-article2 .jo-article__txt * {
    color: #fff !important;
    opacity: 1;
    position: relative;
    z-index: 2;
  }

  .fallow_btn {
    color: #fff !important;
  }

  .section-title .title {
    margin-bottom: 0;
    font-size: 20px;
  }

  .ig-screen-landing .jo-inner-video-card .jo-video-card__img {
    aspect-ratio: unset;
    object-fit: cover;
  }

  .ig-screen-landing .jo-inner-video-card .bottom {
    margin-top: 5.302vw;
    position: absolute;
    top: auto;
    right: 0;
    bottom: 50px;
    padding-left: 3vw;
    padding-right: 3vw;
    max-width: 550px;
  }

  .ig-screen-landing .jo-video-card__txt {
    overflow: hidden;
    top: 20px !important;
  }

  .swiper-pagination-bullet-active {
    background: #ff0000;
    /* Change to your preferred color */
  }

  .ig-screen-landing .jo-inner-video-card .jo-inner-video-card .bottom {
    margin-top: 0.302vw;
    position: absolute;
    z-index: 1;
  }

  .ig-screen-landing .jo-inner-video-card .bottom::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* Apply your gradient and opacity here */
    background: var(--ttRed);
    opacity: 0.5;

    z-index: -1;
    /* Puts the background behind the text */
    border-radius: inherit;
    /* Matches parent shape if needed */
  }



  .ig-screen-landing .jo-inner-video-card .jo-video-card__title {
    position: relative;
    opacity: 1;
    line-height: 1.3;
    color: #fff;
    font-size: 1.5rem;
  }

  .ig-screen-landing .jo-video-card {
    border-radius: 0
  }

  .card-header .dropdown {
    display: none
  }

  .overlay-post-four .overlay-post-thumb-three img {
    width: 100%;
    object-fit: cover;
  }

  .ig-screen-landing .jo-inner-video-card::before {
    background: linear-gradient(0deg, rgb(0, 0, 0), transparent);
    opacity: 1;
    background: none;
  }

  .swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0;
    margin: auto;
    position: absolute;
    bottom: 12px !important;
    top: auto;
    z-index: 9;
    width: 100% !important;
    text-align: center;
  }
.f-slider-wrapper .f-slide-item{padding: 10px;}
  .slick-dots li button {
    border-radius: 50%;
    text-indent: -999px;
    width: 20px;
    height: 20px;
    background: #ddd !important;
  }

  .jo-article2 a:hover {
    color: #fff !important;
    opacity: 0.8
  }

  .slick-dots li.slick-active button {
    background: #15116b !important;
  }

  .jo-article__img2 .img-fluid {
    height: 175px;
    position: relative;
    width: 100%;
    object-fit: cover;
  }

  .jo-article2 .jo-article__txt * {
    color: #fff
  }

  .jo-article__img2:after {
    background: #00000080;
    content: "";
    inset: 0;
    position: absolute;
    z-index: 1;
  }

  .ig-screen-landing .jo-inner-video-card .jo-video-card__title {
    margin-top: 1.302vw;
    margin-bottom: 1.302vw;
  }

  .lines_2 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .lines_5 {
    display: -webkit-box !important;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sidebar-wrap2 .slick-slide {
    height: auto !important;
    /* Let content dictate height */
    outline: none;
  }

  /* Force the container to handle overflow correctly */
  .slick-vertical .slick-list {
    padding: 0 !important;
  }

  .jo-article2 .jo-article__title {
    font-weight: 600;
    font-size: clamp(17px, 1.146vw, 22px);
    margin-bottom: 1.302vw;
    line-height: 1.2;
    font-weight: 500;
  }

  .jo-article2 .jo-article__infos {
    margin-bottom: 5px;
  }

  .slick-dots {
    position: absolute;
    bottom: 10px;
    text-align: center;
    margin: auto;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 5px;
  }

  .swiper-pagination-bullet {
    background: #000;
    width: 18px;
    height: 18px;
  }

  .ig-screen-landing .jo-video-card__title:hover {
    color: #fff !important;
    position: relative;
    opacity: .8;
  }

  .section-title .title {
    font-weight: 600;
  }

  @media screen and (max-width: 767px) {
    body .jo-header {
      padding: 10px 5px;
    }

    body .pt-30 {
      padding-top: 0 !important;
    }

    .ig-screen-landing .jo-inner-video-card .jo-video-card__title {
      font-size: clamp(1.5rem, 1.25vw, 24px);
    }

    .add_margin_mobile {
      margin-top: 30px
    }

    body .pt-60 {
      padding-top: 0;
      padding-bottom: 10px;
    }

    .jo-article__img2 .img-fluid {
      height: 250px;
    }

    .section-title-wrap {
      margin-top: 15px;
    }
  }

/* ============================================================
   landing/header.php (search panel) [block 1]
   ============================================================ */
.bt-macheteverse-search-panel {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.6);
    padding: 40px 16px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
  }
  .bt-macheteverse-search-panel__dialog {
    position: relative;
    max-width: 1180px;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
  }
  .bt-macheteverse-search-panel__close {
    position: absolute;
    top: 0;
    right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    cursor: pointer;
  }
  .bt-macheteverse-search-panel .live-feed-search {
    margin: 0;
  }
  .bt-macheteverse-search-panel .container {
    display: flex;
    justify-content: center;
  }
  .bt-macheteverse-search-panel .live-feed-search {
    width: 100%;
    max-width: 1080px;
  }
  .bt-macheteverse-search-panel .mxc-subtabs {
    display: none !important;
  }
  .bt-macheteverse-search-panel .live-feed-search__form {
    background: #ffffff;
  }
  .bt-macheteverse-search-toggle svg {
    width: 22px;
    height: 22px;
  }

/* ============================================================
   theme_includes/hero_slider.php [block 1]
   ============================================================ */
@keyframes btHeroShimmer {
      0% {
        background-position: -200% 0;
      }
      100% {
        background-position: 200% 0;
      }
    }

    .ig-screen-landing .jo-inner-video-card .jo-video-card__txt2 {
      position: absolute;
      z-index: 3;
      right: 0;
      bottom: 0;
      width: 100%;
    }

    .ig-screen-landing .jo-inner-video-card .jo-video-card__txt2 a {
      position: relative;
      z-index: 6;
      pointer-events: auto;
    }

    .ig-screen-landing .jo-inner-video-card .full-card-link {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 4;
      text-decoration: none;
    }

    .ig-screen-landing .jo-inner-video-card .featured-video-popup .play_icon img {
      width: 73px !important;
      min-height: 0 !important;
    }

    .ig-screen-landing .jo-inner-video-card .featured-video-popup {
      top: 50% !important;
      left: 50% !important;
      transform: translate(-50%, -50%) !important;
      margin: 0 !important;
    }

    .ig-screen-landing .jo-inner-video-card .featured-video-popup .play_icon {
      display: block;
      line-height: 0;
    }

    .ig-screen-landing .jo-inner-video-card {
      background: #e9eef3;
      overflow: hidden;
    }

    .ig-screen-landing .jo-inner-video-card .jo-video-card__img {
      display: block;
      width: 100%;
      min-height: 420px;
      object-fit: cover;
      background: linear-gradient(90deg, #e9eef3 0%, #f5f7fa 50%, #e9eef3 100%);
      background-size: 200% 100%;
      animation: btHeroShimmer 1.4s linear infinite;
    }

    .ig-screen-landing .jo-inner-videos-slider2 .slick_slider:not(.slick-initialized) {
      overflow: hidden;
    }

    .ig-screen-landing .jo-inner-videos-slider2 .slick_slider:not(.slick-initialized) .item {
      display: none;
    }

    .ig-screen-landing .jo-inner-videos-slider2 .slick_slider:not(.slick-initialized) .item:first-child {
      display: block;
    }

/* ============================================================
   theme_includes/featured_services.php [block 1]
   ============================================================ */
@keyframes btFeaturedShimmer {
      0% {
        background-position: -200% 0;
      }
      100% {
        background-position: 200% 0;
      }
    }

    .slick-vertical .slick-slide {
      display: block;
      height: auto;
      border-bottom: 14px solid transparent;
    }
    .slick-vertical .slick-slide:last-child {
      border-bottom: 0;
    }
    /* Horizontal styling for mobile */
    .sidebar-wrap2:not(.slick-vertical) .item {
      padding: 0 10px;
    }
    .sidebar-wrap2:not(.slick-vertical) .slick-track {
      display: flex;
      gap: 0;
    }
    .sidebar-wrap2:not(.slick_verticle) .item {
      margin-bottom: 14px;
    }
    .sidebar-wrap2:not(.slick_verticle) .item:last-child {
      margin-bottom: 0;
    }

    .sidebar-wrap2.slick_verticle:not(.slick-initialized) {
      overflow: hidden;
    }

    .sidebar-wrap2.slick_verticle:not(.slick-initialized) .item:nth-child(n+3) {
      display: none;
    }

    .jo-inner-service2 .jo-article__img2 {
      background: #e9eef3;
      overflow: hidden;
    }

    .jo-inner-service2 .jo-article__img2 img {
      display: block;
      width: 100%;
      min-height: 250px;
      object-fit: cover;
      background: linear-gradient(90deg, #e9eef3 0%, #f5f7fa 50%, #e9eef3 100%);
      background-size: 200% 100%;
      animation: btFeaturedShimmer 1.4s linear infinite;
    }

    .jo-inner-service2 .full-card-link {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 4;
      text-decoration: none;
    }
    .jo-inner-service2 .jo-article__txt {
      position: relative;
      z-index: 3;
    }
    .jo-inner-service2 .jo-article__txt a {
      position: relative;
      z-index: 6;
      pointer-events: auto;
    }

/* ============================================================
   featured_news_slider.php [block 1]
   ============================================================ */
/* Scoped styles for the featured news slider */
#bt_featured_news_slider {
    padding-top: 30px;
    padding-bottom: 20px;
}

#bt_featured_news_slider .top-header-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

#bt_featured_news_slider .view-all-link {
    color: var(--tg-primary-color);
    font-weight: 600;
}

#bt_featured_news_slider .f-slider-wrapper {
    margin: 0 -10px;
}

#bt_featured_news_slider .f-slide-col {
    padding: 0 10px;
}

#bt_featured_news_slider .f-card {
    background: #fff;
    border: 1px solid #f0f0f0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    border-radius: 4px;
    overflow: hidden;
    height: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
}

#bt_featured_news_slider .f-card-img-wrap {
    margin-bottom: 0;
    position: relative;
    overflow: hidden;
}

#bt_featured_news_slider .f-card-img-wrap img {
    width: 100%;
    height: 370px;
    object-fit: cover;
}

#bt_featured_news_slider .f-date-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: var(--tg-primary-color);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 2px;
    z-index: 2;
}

#bt_featured_news_slider .f-card-body {
    padding: 20px;
}

#bt_featured_news_slider .f-cat-wrap {
    font-size: 11px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}
#bt_featured_news_slider  button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    padding: 10px;
}
#bt_featured_news_slider .f-cat-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--tg-primary-color);
    margin-right: 8px;
}

#bt_featured_news_slider .f-card-title {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
    color: #000;
    min-height: 44px;
    margin-bottom: 15px;
    margin-top: 8px;
}

#bt_featured_news_slider .f-card-title a {
    color: inherit;
}

#bt_featured_news_slider .f-divider {
    height: 1px;
    background: #e5e7eb;
    margin-bottom: 15px;
    width: 100%;
}

#bt_featured_news_slider .f-card-excerpt {
    font-size: 15px;
    color: #252525;
    line-height: 1.5;
    font-weight: 400;
}

/* Custom Slick Arrows */
#bt_featured_news_slider .custom-slick-prev,
#bt_featured_news_slider .custom-slick-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    outline: none;
    padding: 0;
    color: #000;
    cursor: pointer;
    z-index: 10;
}

#bt_featured_news_slider .custom-slick-prev {
    left: -35px;
}

#bt_featured_news_slider .custom-slick-next {
    right: -35px;
}

@media (max-width: 1200px) {
    #bt_featured_news_slider .custom-slick-prev {
        left: 5px;
    }
    #bt_featured_news_slider .custom-slick-next {
        right: 5px;
    }
    #bt_featured_news_slider .f-slider-wrapper {
        margin: 0;
    }
}

/* ============================================================
   featured_news_slider.php [block 2]
   ============================================================ */
/* Prevent vertical stacking before Slick loads */
  .macheteverse-sidebar-slider:not(.slick-initialized) {
    display: flex;
    overflow: hidden;
    gap: 20px;
    flex-wrap: nowrap;
  }
  .macheteverse-sidebar-slider:not(.slick-initialized) .f-slide-item {
    flex: 0 0 calc(33.333% - 14px);
    min-width: 250px;
  }
  @media (max-width: 991px) {
    .macheteverse-sidebar-slider:not(.slick-initialized) .f-slide-item {
      flex: 0 0 calc(50% - 10px);
    }
  }
  @media (max-width: 575px) {
    .macheteverse-sidebar-slider:not(.slick-initialized) .f-slide-item {
      flex: 0 0 100%;
    }
  }

/* ============================================================
   sections/dml_widget.php [block 1]
   ============================================================ */
.dml-widget-title-wrap .title {
      font-size: 16px;
      letter-spacing: .04em;
    }

    /* --------------------------------------------------------------------
       Keep all 4 stories visible.

       embed.js renders 4 story cards PLUS a programmatic ad slot in the same
       nowrap flex row. When that ad fills, its JS adds .is-visible to the ad
       slot and .hidden to the 4th card, so the last story appears and is then
       pulled back out — the row stays at 4 columns but one of them is the ad.

       We do not sell that slot, so drop the ad item and force the 4th card
       back.

       Both declarations must be !important, and the un-hide selector must stay
       MORE SPECIFIC than the vendor rule it is beating:

         theirs  div.dml-widget-container div.dml-wrapper .dml-item.hidden
                 -> (0,4,2)  display: none !important
         ours    ... .dml-item.dmla-page-card.hidden
                 -> (0,5,2)  display: flex !important

       Equal importance, so specificity decides and the extra .dmla-page-card is
       the whole margin. Do not "simplify" that class out of the selector — it
       loses to theirs on a tie-break by source order, since embed.js injects its
       stylesheet after this one.
       -------------------------------------------------------------------- */
    div.dml-widget-container div.dml-wrapper .dml-item.dml-programmatic-ad-tag,
    div.dml-widget-container div.dml-wrapper .dml-item.dml-programmatic-ad-tag.is-visible {
      display: none !important;
    }

    div.dml-widget-container div.dml-wrapper .dml-item.dmla-page-card.hidden {
      display: flex !important;
    }

/* ============================================================
   landing/inc/city_park_events.php [block 1]
   ============================================================ */
.bt-events-section {
        padding: 20px 0;

    }

    .bt-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

    .bt-header h2 {
        text-transform: uppercase;
        font-weight: 900;
        margin: 0;
        font-size: 22px;
        color: var(--site_color_g);
    }

    /* Arrow Styling - Forced Visibility */
    .bt-slider-arrows {
        display: flex;
        gap: 5px;
    }

    .bt-slider-arrows button {
        background: var(--site_color_g);
        color: #fff;
        border: none;
        width: 35px;
        height: 35px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: 0.3s;
        z-index: 10;
    }

    .bt-slider-arrows button:hover {
        background: var(--site_color_g);
    }

    .bt-event-slider {
        margin: 0 -8px;
    }

    .bt-event-slider:not(.slick-initialized) {
        display: flex;
        flex-wrap: nowrap;
        overflow: hidden;
    }

    .bt-event-slider:not(.slick-initialized) .event-slide {
        flex: 0 0 25%;
        min-width: 25%;
        padding: 0 8px;
        box-sizing: border-box;
    }

    .bt-event-slider .slick-track {
        display: block;
    }

    .bt-event-slider .slick-list {
        overflow: hidden;
    }

    .bt-event-slider .slick-slide {
        height: auto;
        padding: 0 8px;
        box-sizing: border-box;
        float: left;
    }

    .bt-event-slider .slick-slide > div {
        height: 100%;
    }

    .bt-event-slider .slick-slide > div > .event-slide {
        height: 100%;
    }

    .event-slide {
        height: 100%;
        width: 100%;
        display: flex;
    }

    /* The Card */
    .event-card {
        text-decoration: none;
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 100%;
        width: 100%;
        border: 1px solid #eee;
        margin: 0;
        transition: 0.3s;
        background: #fff;
        box-sizing: border-box;
    }

    .event-card:hover {
        border-color: var(--site_color_g);
        transform: translateY(-3px);
    }

    /* Image Box */
    .img-box {
        height: 250px !important;
        /* Shorter for 4-per-row layout */
        background-size: cover;
        background-position: center;
        position: relative;
        border-bottom: 3px solid var(--site_color_g);
    }

    .date-badge {
        position: absolute;
        bottom: 0;
        left: 0;
        background: var(--site_color_g);
        color: #fff;
        padding: 4px 10px;
        font-weight: bold;
        font-size: 14px;
        text-transform: capitalize;
    }

    /* Text Content */
    .info-box {
        padding: 12px;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        min-height: 155px;
    }

    .info-box h3 {
        color: var(--site_color_g);
        font-size: 16px;
        font-weight: 700;
        margin: 0 0 5px 0;
        line-height: 1.3;
        min-height: 42px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .event-venue {
        color: var(--site_font_color_g);
        font-size: 15px;
        text-transform: capitalize;
        margin: 0 0 4px 0;
        font-weight: 600;
        min-height: 22px;
    }

    .event-location {
        color: var(--site_font_color_g);
        font-size: 14px;
        text-transform: capitalize;
        margin: 0 0 6px 0;
        min-height: 20px;
    }

    .event-time {
        color: var(--site_font_color_g);
        font-size: 14px;
        margin: auto 0 0;
        display: flex;
        align-items: center;
        gap: 8px;
        font-weight: 600;
    }

    .event-time svg {
        flex: 0 0 auto;
    }

    @media (max-width: 1199px) {
        .bt-event-slider:not(.slick-initialized) .event-slide {
            flex-basis: 33.3333%;
            min-width: 33.3333%;
        }
    }

    @media (max-width: 991px) {
        .bt-event-slider:not(.slick-initialized) .event-slide {
            flex-basis: 50%;
            min-width: 50%;
        }
    }

    @media (max-width: 600px) {
        .bt-event-slider:not(.slick-initialized) .event-slide {
            flex-basis: 100%;
            min-width: 100%;
        }
    }

    /* Add Event Button */
    .add-event-btn {
        margin-left: 15px;
        font-size: 13px;
        color: #ffffff !important;
        background-color: var(--site_color_g);
        display: inline-flex;
        align-items: center;
        text-decoration: none !important;
        font-weight: 600;
        padding: 6px 14px;
        border-radius: 4px;
        transition: all 0.3s ease;
        text-transform: capitalize;
    }
    .add-event-btn span, .add-event-btn svg {
        color: #ffffff !important;
        fill: #ffffff !important;
    }
    .add-event-btn:hover {
        background-color: #222;
        color: #ffffff !important;
        transform: translateY(-2px);
    }

/* ============================================================
   theme_includes/instagram_gallery.php [block 1]
   ============================================================ */
/* Premium Instagram Gallery styling */
    .instagram-item {
        aspect-ratio: 1 / 1;
        overflow: hidden;
        border-radius: 12px;
        position: relative;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
        background: #f8fafc;
        transition: box-shadow 0.3s ease;
    }
    .instagram-item:hover {
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
    }
    .instagram-item img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
        transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .instagram-item:hover img {
        transform: scale(1.06);
    }
    .instagram-item__title {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: linear-gradient(to top, rgba(15, 23, 42, 0.9) 0%, rgba(15, 23, 42, 0.4) 70%, transparent 100%);
        color: #fff !important;
        padding: 20px 12px 12px;
        font-size: 13px;
        font-weight: 500;
        text-align: center;
        opacity: 0;
        transform: translateY(8px);
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        pointer-events: none;
        z-index: 2;
    }
    .instagram-item:hover .instagram-item__title {
        opacity: 1;
        transform: translateY(0);
    }

    /* Slick Slider Arrow overrides */
    .custom-gallery-slider {
        padding-bottom: 60px; /* space for arrows */
        position: relative;
    }

    /* Before slick initialises — and permanently, if its JS fails to load — the
       slides are plain block-level divs, i.e. every gallery image stacked full
       width down the page. That is the "gallery spread all over the place"
       symptom, and it used to last until the LAST image finished downloading
       (see the init script below). Laying the un-initialised list out as a
       clipped row means the section occupies one row's height from first paint,
       whatever JS does or doesn't do afterwards. */
    .custom-gallery-slider:not(.slick-initialized) {
        display: flex;
        flex-wrap: nowrap;
        overflow: hidden;
    }
    .custom-gallery-slider:not(.slick-initialized) > div {
        flex: 0 0 var(--bt-gallery-col, 25%);
        max-width: var(--bt-gallery-col, 25%);
    }
    @media (max-width: 991px) {
        .custom-gallery-slider:not(.slick-initialized) > div {
            flex-basis: var(--bt-gallery-col-md, 33.3333%);
            max-width: var(--bt-gallery-col-md, 33.3333%);
        }
    }
    @media (max-width: 767px) {
        .custom-gallery-slider:not(.slick-initialized) > div { flex-basis: 50%; max-width: 50%; }
    }
    @media (max-width: 575px) {
        .custom-gallery-slider:not(.slick-initialized) > div { flex-basis: 100%; max-width: 100%; }
    }
    .custom-gallery-slider .custom-arrow {
        position: absolute;
        bottom: 0;
        top: auto;
        transform: none;
        background: #214FFB;
        color: #fff;
        border: none;
        border-radius: 4px;
        width: 40px;
        height: 40px;
        display: flex !important;
        justify-content: center;
        align-items: center;
        z-index: 10;
        cursor: pointer;
        transition: all 0.2s;
        font-size: 16px;
    }
    .custom-gallery-slider .custom-arrow:hover {
        background: #102e9e;
    }
    .custom-gallery-slider .slick-prev {
        left: calc(50% - 45px); /* Left of center */
    }
    .custom-gallery-slider .slick-next {
        right: calc(50% - 45px); /* Right of center */
        left: auto;
    }

    /* Premium Lightbox2 overrides */
    .lightboxOverlay {
        background-color: rgba(15, 23, 42, 0.9) !important;
    }
    .lightbox {
        font-family: inherit !important;
    }
    .lightbox .lb-image {
        border-radius: 12px !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
        border: none !important;
    }
    .lightbox .lb-outerContainer {
        background-color: transparent !important;
        border-radius: 12px !important;
        border: none !important;
    }
    .lightbox .lb-dataContainer {
        padding-top: 15px !important;
        color: #fff !important;
    }
    .lightbox .lb-data .lb-caption {
        font-size: 15px !important;
        font-weight: 500 !important;
        line-height: 1.5 !important;
        color: #f8fafc !important;
    }
    .lightbox .lb-data .lb-number {
        font-size: 12px !important;
        color: #94a3b8 !important;
        margin-top: 4px !important;
    }
    .lightbox .lb-close {
        background: none !important;
        position: relative;
        width: 24px;
        height: 24px;
        opacity: 0.7;
        transition: opacity 0.2s;
    }
    .lightbox .lb-close:hover {
        opacity: 1;
    }
    .lightbox .lb-close::before,
    .lightbox .lb-close::after {
        content: '';
        position: absolute;
        height: 18px;
        width: 2px;
        background-color: #fff;
        left: 11px;
        top: 3px;
    }
    .lightbox .lb-close::before {
        transform: rotate(45deg);
    }
    .lightbox .lb-close::after {
        transform: rotate(-45deg);
    }

/* ============================================================
   theme_includes/featured_video_overlay.php [block 1]
   ============================================================ */
.featured-video-host {
      position: relative;
      overflow: hidden;
    }

    .featured-video-host .featured-video-popup {
      position: absolute;
      top: 50%;
      left: 50%;
      z-index: 10;
      display: inline-block;
      transform: translate(-50%, -50%);
      transition: transform 0.2s ease;
      pointer-events: auto;
    }

    .featured-video-host .featured-video-popup:hover,
    .featured-video-host .featured-video-popup:focus {
      transform: translate(-50%, -50%) scale(1.06);
      outline: none;
    }

    .featured-video-host .featured-video-popup .play_icon {
      display: block;
      width: 56px;
    }

    .featured-video-host .featured-video-popup .play_icon img {
      display: block;
      width: 100%;
      height: auto;
      display: block;
    }

    .featured-video-host .featured-video-sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .featured-video-host.featured-video-host--overlay::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.18) 100%);
      pointer-events: none;
      z-index: 2;
    }

    @media (max-width: 767px) {
      .featured-video-host .featured-video-popup .play_icon {
        width: 48px;
      }
    }

/* ============================================================
   clbtr_loop_fragment.php [block 1]
   ============================================================ */
.clbtr_item img {
        height: 250px;
        object-fit: cover;
        border-radius: 10px;
        width: 100%;
    }

    .clbtr_item .jo-article__img {
        margin-bottom: 12px;
        position: relative;
    }

    .clbtr_item h4 {
        font-size: 1rem !important;
        font-weight: 600;
        line-height: 1.3;
    }

    .clbtr_item:hover .jo-article__img::after {
        opacity: 1;
    }

    .clbtr_item .jo-article__img::after {
        content: "";
        position: absolute;
        left: 0;
        opacity: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: -webkit-linear-gradient(90deg, rgb(64, 55, 227) 0%, rgb(44, 195, 193) 0%, rgb(48, 198, 181) 0%, rgba(25, 228, 124, 0.4) 100%);
        pointer-events: none;
        border-radius: 10px;
        transition: all 0.5s;
    }

/* ============================================================
   landing/loop/post_loop.php [block 1]
   ============================================================ */
.ellipsis-2-lines {
  display: -webkit-box;
  -webkit-line-clamp: 2;       /* Limit to 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ellipsis-3-lines {
  display: -webkit-box;
  -webkit-line-clamp: 3;       /* Limit to 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ============================================================
   theme_includes/live_feed_search_form.php [block 1]
   ============================================================ */
.live-feed-search {
  margin: 18px 0 35px;
}
.live-feed-search__form {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #e7ecf3;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}
.live-feed-search__input-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
  position: relative;
}
/* ── Autocomplete dropdown ── */
.lfs-autocomplete-list {
  position: absolute;
  top: calc(100% + 10px);
  left: -10px;
  right: -10px;
  background: #fff;
  border: 1px solid #e7ecf3;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .14);
  max-height: 380px;
  overflow-y: auto;
  z-index: 1000;
  padding: 6px 0;
}
.lfs-autocomplete-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  cursor: pointer;
  font-size: 13.5px;
  color: #1f2937;
  transition: background .12s ease;
}
.lfs-autocomplete-item:hover,
.lfs-autocomplete-item.is-active {
  background: #f3f6fa;
}
.lfs-autocomplete-item .lfs-ac-icon {
  flex-shrink: 0;
  color: #94a3b8;
}
.lfs-autocomplete-item .lfs-ac-label {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lfs-autocomplete-item .lfs-ac-label mark {
  background: #fff3a3;
  color: inherit;
  padding: 0 1px;
}
.lfs-autocomplete-item .lfs-ac-sub {
  font-size: 11.5px;
  color: #94a3b8;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lfs-autocomplete-item .lfs-ac-badge {
  flex-shrink: 0;
  font-size: 10.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .3px;
  padding: 2px 7px;
  border-radius: 10px;
  background: #eef2f7;
  color: #5b6776;
}
.lfs-autocomplete-item .lfs-ac-badge-business { background: #e7f3ff; color: #1972d2; }
.lfs-autocomplete-item .lfs-ac-badge-content  { background: #e9f9ee; color: #1f8a48; }
.lfs-autocomplete-item .lfs-ac-badge-newsroom { background: #fff4e5; color: #b65c00; }
.lfs-autocomplete-item .lfs-ac-badge-recent   { background: #f1ecff; color: #6a47d3; }
.lfs-autocomplete-item .lfs-ac-badge-hint     { background: #eef2f7; color: #5b6776; }
.lfs-autocomplete-item.is-loading {
  cursor: default;
  color: #64748b;
}
.lfs-autocomplete-item.is-loading:hover {
  background: transparent;
}
.lfs-ac-spinner {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #dbe3ee;
  border-top-color: #0042c6;
  animation: lfsSpin .7s linear infinite;
  flex-shrink: 0;
}
@keyframes lfsSpin {
  to { transform: rotate(360deg); }
}
.lfs-autocomplete-item .lfs-ac-remove {
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: #aab2bd;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
}
.lfs-autocomplete-item .lfs-ac-remove:hover {
  background: #e6ebf1;
  color: #555;
}
.live-feed-search__input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
  font-size: 14px;
  color: #1f2937;
  padding: 6px 0;
}
.live-feed-search__input::placeholder {
  color: #94a3b8;
}
.live-feed-search__select-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 180px;
  padding: 0 12px;
  border-left: 1px solid #e7ecf3;
}
.live-feed-search__select {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
  font-size: 14px;
  color: #1f2937;
  padding: 6px 0;
  cursor: pointer;
}
.live-feed-search__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 10px;
  background: #0042c6;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 12px 18px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .2s ease;
}
.live-feed-search__submit:hover,
.live-feed-search__submit:focus {
  background: #0035a0;
  color: #fff;
}
.live-feed-search__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 991px) {
  .live-feed-search__form {
    flex-wrap: wrap;
  }
  .live-feed-search__input-wrap {
    flex: 1 1 100%;
  }
  .live-feed-search__select-wrap {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
    border-left: 0;
    border-top: 1px solid #e7ecf3;
    padding: 12px 0 0;
  }
}
@media (max-width: 767px) {
  .live-feed-search__select-wrap {
    flex: 1 1 100%;
  }
  .live-feed-search__submit {
    width: 100%;
  }
}

/* ============================================================
   news_top.php [block 1]
   ============================================================ */
.jo-inner-videos-filter-nav {
    gap: 10px; /* Adds nice spacing between buttons */
}
:root {

    --sinace-black-rgb: 15, 33, 60;
    --sinace-primary-rgb: 237, 242, 248;
    --sinace-bdr-color: #d9e1e9;
    --sinace-bdr-color-rgb: 217, 225, 233;
    --sinace-letter-spacing: -0.04em;
}
/*--------------------------------------------------------------
# News One
--------------------------------------------------------------*/
.news-one {
  position: relative;
  display: block;
  padding: 120px 0 90px;
  z-index: 1;
}

.news-one__single {
  position: relative;
  display: block;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.07);
  margin-bottom: 30px;
}

.news-one__img-box {
  position: relative;
  display: block;
}

.news-one__img {
  position: relative;
  display: block;
  overflow: hidden;
}

.news-one__img img {
  width: 100%;
  transition: all 500ms ease;
  transform: scale(1);
}

.news-one__single:hover .news-one__img img {
  transform: scale(1.05);
}

.news-one__img>a {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(var(--sinace-black-rgb), 0.4);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 30px;
  color: var(--thm-base);
  transition: opacity 500ms ease, visibility 500ms ease, transform 500ms ease;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-30%);
}

.news-one__img>a>span {
  position: relative;
}

.news-one__img>a>span::before {
  content: '';
  width: 20px;
  height: 2px;
  background-color: var(--site_color_g);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 500ms ease;
}

.news-one__img>a>span::after {
  content: '';
  transition: all 500ms ease;
  width: 2px;
  height: 20px;
  background-color: var(--site_color_g);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.news-one__img>a:hover>span::before,
.news-one__img>a:hover>span::after {
  background-color: var(--sinace-white);
}

.news-one__single:hover .news-one__img>a {
  visibility: visible;
  transform: translateY(0%);
  opacity: 1;
}

.news-one__date {
  position: absolute;
  top: 15px;
  left: 15px;
  background-color: var(--site_color_g);
  padding: 10px 20px 12px;
}

.news-one__date p {
  font-size: 12px;
  font-weight: 600;
  line-height: 12px;
  color: var(--sinace-white);
}

.news-one__content {
  position: relative;
  display: block;
  padding: 10px;
  background-position: center top;
  transition-delay: .1s;
  transition-timing-function: ease-in-out;
  transition-duration: .5s;
  transition-property: all;
  transform-origin: bottom;
  transform-style: preserve-3d;
  transform: scaleY(1);
}

.news-one__single:hover .news-one__content {
  transform: scaleY(0.0);
}

.news-one__meta {
  position: relative;
  display: flex;
  align-items: center;
}

.news-one__meta li {
  position: relative;
  display: flex;
  align-items: center;
}

.news-one__meta li+li {
  margin-left: 13px;
}

.news-one__meta li .icon {
  position: relative;
  display: inline-block;
}

.news-one__meta li .icon span {
  position: relative;
  display: inline-block;
  font-size: 14px;
  color: var(--site_color_g);
}

.news-one__meta li .text {
  margin-left: 4px;
}

.news-one__meta li .text p {
  font-size: 14px;
  font-weight: 400;
  line-height: 14px;
}

.news-one__meta li>span {
  font-size: 14px;
  margin-right: 12px;
}

.news-one__title {
  position: relative;
  font-size: 22px;
  font-weight: 600;
  line-height: 34px;
  margin-top: 4px;
  padding-bottom: 17px;
  margin-bottom: 12px;
  border-bottom: 2px solid var(--sinace-bdr-color);
}

.news-one__title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  height: 2px;
  width: 70px;
  background-color: var(--site_color_g);
}
.news-one__date p {

    padding: 0 !important;
    margin: 0 !important;
    color: #fff;
}
.news-one__title a {
  color: var(--sinace-black);
}

.news-one__text {
  font-size: 15px;
}

.news-one__hover {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background-position: center top;
  transition-delay: .1s;
  transition-timing-function: ease-in-out;
  transition-duration: .5s;
  transition-property: all;
  transform-origin: bottom;
  transform-style: preserve-3d;
  transform: scaleY(0);
  z-index: 2;
}

.news-one__single:hover .news-one__hover {
  transform: scaleY(1.0);
}

.news-one__hover-content {
  position: relative;
  display: block;
  padding: 10px;
}

.news-one__hover-title {
  position: relative;
  font-size: 22px;
  font-weight: 600;
  line-height: 34px;
  margin-top: 4px;
  padding-bottom: 17px;
  margin-bottom: 12px;
  border-bottom: 2px solid var(--sinace-bdr-color);
}

.news-one__hover-title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  height: 2px;
  width: 70px;
  background-color: var(--site_color_g);
}

.news-one__hover-title a {
  color: var(--sinace-black);
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}

.news-one__hover-title a:hover {
  color: var(--site_color_g);
}

.news-one__hover-text {
  font-size: 15px;
}

.news-one__hover-btn-box {
  position: relative;
  display: block;
}
.news-one__meta li .text p {
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    margin: 0;
}
.elpise_2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.news-one__img img {
    height: 360px;
    width: 100%;
    object-fit: cover;
}
.news-one__hover-btn-box a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--site_color_g);
  font-size: 16px;
  font-weight: 600;
  line-height: 12px;
  color: #fff;
  padding: 15px 40px 16px;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}

.news-one__hover-btn-box a:hover {
  color: var(--site_color_g);
}

.news-one__hover-btn-box a span {
  font-size: 14px;
}
/* --- Standard Category Tab Styles --- */
.jo-inner-videos-filter-nav a {
    background: var(--site_color_g);
    border-radius: 6px;
    height: auto;
    padding: 4px 17px;
    color: #252525;
    position: relative;
    z-index: 1;
    text-decoration: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3px;
}
.jo-inner-videos-filter-nav a.active span,
.jo-inner-videos-filter-nav a:hover span {
    color: #fff !important;
}
.jo-inner-videos-filter-nav a:hover::before, 
.jo-inner-videos-filter-nav a.active::before {
    opacity: 1;
    background: var(--site_color_g);
    color: #fff !important;
}
.jo-inner-videos-filter-nav a::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 1px;
    background-color: var(--white);
    border-radius: 4.5px;
    transition: 0.4s ease;
}
.jo-inner-videos-filter-nav a:hover, 
.jo-inner-videos-filter-nav a.active {
    color: var(--white);
}

/* --- Standout "Load More" Button Styles --- */
.jo-inner-videos-filter-nav button.load-more-cats {
    background: transparent;
    border: 2px solid var(--site_color_g);
    border-radius: 6px;
    padding: 3px 17px;
    color: #252525 !important;
    font-weight: 600;
    cursor: pointer;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 15px; /* Pushes it slightly 'outside' the normal cluster */
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05); /* Adds depth */
}
.jo-inner-videos-filter-nav button.load-more-cats:hover {
    background: var(--site_color_g);
    color: #fff !important;
    transform: translateY(1px); /* Slight press effect */
}
.jo-inner-videos-filter-nav button.load-more-cats i {
    transition: transform 0.3s ease;
}
.jo-inner-videos-filter-nav button.load-more-cats:hover i {
    transform: translateY(3px); /* Arrow points down on hover */
}

/* Global Hover Overrides */
body .header-top-left-two .list-wrap li a:hover, 
.view-all-btn a:hover, 
.jo-inner-videos-filter-nav a:hover, 
.jo-btn:hover, 
body .fallow_btn:hover, 
body .list_style_posts:hover .card_content .badge:hover {
    color: #fff !important;
}

.category-filter-nav.smaller-tabs .tab-nav {
    font-size: 13px !important;
    padding: 6px 12px !important;
    margin: 3px !important;
}

/* ============================================================
   theme_includes/landing_scripts.php (skeleton) [block 1]
   ============================================================ */
@keyframes shimmer {
  0% { background-position: -468px 0; }
  100% { background-position: 468px 0; }
}
.shimmer-placeholder {
  animation-duration: 1.25s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: shimmer;
  animation-timing-function: linear;
  background: #f6f7f8;
  background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
  background-size: 800px 104px;
  position: relative;
}
.skeleton-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
}
.skeleton-line {
  height: 10px;
  margin-bottom: 8px;
  border-radius: 4px;
}
.skeleton-image {
  height: 180px;
  border-radius: 8px;
  margin-bottom: 15px;
}

/* ============================================================
   landing/pages/about_us.php [block 1]
   ============================================================ */
:root {
  --sinace-font: 'Lexend', sans-serif;
  --sinace-gray: #6e7279;
  --sinace-gray-rgb: 110, 114, 121;
  --sinace-white: #ffffff;
  --sinace-white-rgb: 255, 255, 255;
  --sinace-base: var(--site_color_g);
  --sinace-base-rgb: 0, 172, 189;
  --sinace-black: var(--site_font_color_g);
  --sinace-black-rgb: 37, 37, 37;
  --sinace-primary: #edf2f8;
  --sinace-primary-rgb: 237, 242, 248;
  --sinace-bdr-color: #d9e1e9;
  --sinace-bdr-color-rgb: 217, 225, 233;
  --sinace-letter-spacing: -0.04em
}.rs-about.style2 .histort-part .single-history .tab-btn [class^="icon-"]{color:#fff}
.expectation-one {
  position: relative;
  display: block;
  padding-top: 120px;
  background-color: var(--sinace-black);
  overflow: hidden;
  z-index: 1;
}
.expectation-one__bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: .10;
  mix-blend-mode: luminosity;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  z-index: -1;
}
.expectation-one .section-title__tagline {
  color: var(--sinace-white);
}
.expectation-one .section-title__title {
  color: var(--sinace-white);
}
.expectation-one__inner {
  position: relative;
  display: block;
  border-top: 1px solid rgba(var(--sinace-white-rgb), .10);
}
.expectation-one__inner .container {
  max-width: 1700px;
}
.expectation-one__points {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.expectation-one__points li {
  position: relative;
  display: block;
  padding-top: 87px;
  padding-bottom: 71px;
}
.expectation-one__points li::before {
  content: "";
  position: absolute;
  top: 0;
  right: -83px;
  bottom: 0;
  width: 1px;
  background-color: rgba(var(--sinace-white-rgb), .10);
}
.expectation-one__points li:last-child::before {
  display: none;
}
.expectation-one__points li+li {
  margin-left: 165px;
}
.expectation-one__points li .icon {
  position: relative;
  display: inline-block;
}
.expectation-one__points li .icon span {
  position: relative;
  display: inline-block;
  font-size: 64px;
  color: var(--sinace-base);
  -webkit-transition: all 500ms linear;
  transition: all 500ms linear;
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
.expectation-one__points li:hover .icon span {
  transform: scale(.9);
}
.expectation-one__title {
  font-size: 24px;
  font-weight: 600;
  line-height: 34px;
  margin-top: 15px;
  margin-bottom: 13px;
}
.expectation-one__title a {
  color: var(--sinace-white);
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.expectation-one__title a:hover {
  color: var(--sinace-base);
}
.expectation-one__text {
  color: rgba(var(--sinace-white-rgb), .70);
}
.about-four {
  position: relative;
  display: block;
  padding: 40px 0 40px;
}
.about-four__left {
  position: relative;
  display: block;
  margin-right: 110px;
}
.about-four__img-box {
  position: relative;
  display: block;
}
.about-four__shape-1 {
  position: absolute;
  left: -23px;
  top: 40px;
  border-style: solid;
  border-width: 6px;
  border-color: rgb(228, 0, 19);
  background-color: rgba(24, 41, 57, 0);
  width: 538px;
  height: 429px;
}
.about-four__img {
  position: relative;
  display: block;
  z-index: 1;
}
.about-four__img img {
  width: 100%;
}
.about-four__img-two {
  position: absolute;
  top: 0;
  right: -110px;
  z-index: 2;
}
.about-four__img-two img {
  width: auto;
}
.about-four__right {
  position: relative;
  display: block;
  margin-left: 70px;
}
.about-four__right .section-title {
  margin-bottom: 31px;
}
.about-four__points {
  position: relative;
  display: block;
  margin-top: 31px;
  margin-bottom: 45px;
}
.about-four__points li {
  position: relative;
  display: flex;
  align-items: center;
}
.about-four__points li+li {
  margin-top: 9px;
}
.about-four__points li .icon {
  position: relative;
  display: inline-block;
}
.about-four__points li .icon span {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 17px;
  height: 17px;
  font-size: 9px;
  color: var(--sinace-white);
  background-color: var(--sinace-base);
  border-radius: 50%;
}
.about-four__points li .text {
  margin-left: 22px;
}
.about-four__points li .text p {
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  color: var(--sinace-black);
}
.about-four__btn-box {
  position: relative;
  display: inline-block;
}
.about-four__shape-2 {
  position: absolute;
  bottom: 5px;
  right: -145px;
}
.about-four__shape-2 img {
  width: auto;
}

@media (max-width: 1199px) {
.expectation-one__points li+li {
        margin-left: 80px;
    }
.expectation-one__points li::before {
        right: -40px;
    }
.about-four__left {
        max-width: 600px;
        margin: 0 auto 0;
    }
.about-four__right {
        max-width: 600px;
        margin: 60px auto 0;
    }
.expectation-one__points li+li {
        margin-left: 80px;
    }
.expectation-one__points li::before {
        right: -40px;
    }
.about-four__left {
        max-width: 600px;
        margin: 0 auto 0;
    }
.about-four__right {
        max-width: 600px;
        margin: 60px auto 0;
    }
.expectation-one__points {
        justify-content: inherit;
        flex-direction: column;
        align-items: baseline;
        padding: 80px 0 70px;
    }
.expectation-one__points li+li {
        margin-left: 0;
        margin-top: 50px;
    }
.expectation-one__points li {
        padding-top: 0;
        padding-bottom: 0;
    }
.expectation-one__points li::before {
        display: none;
    }
.about-four__left {
        margin-right: 0;
    }
.about-four__img-two {
        display: none;
    }
.about-four__shape-1 {
        display: none;
    }
.about-four__right {
        margin-left: 0;
        margin-top: 60px;
    }

}

/* Service & History Extra CSS */
.services-one {
  position: relative;
  display: block;
  background-color: #eef3f8;
  padding: 120px 0 360px;
  z-index: 1;
}
.services-one__bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 414px;
  opacity: .15;
  mix-blend-mode: luminosity;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  z-index: -1;
}
.services-one__top {
  position: relative;
  display: block;
  margin-bottom: 51px;
}
.services-one__left {
  position: relative;
  display: block;
}
.services-one__left .section-title {
  margin-bottom: 0;
}
.services-one__right {
  position: relative;
  display: block;
}
.services-one__text {
  margin-top: 13px;
}
.services-one__bottom {
  position: relative;
  display: block;
}
.services-one__single {
  position: relative;
  display: block;
  margin-bottom: 30px;
}
.services-one__title-box {
  position: relative;
  display: block;
  background-color: var(--sinace-white);
  padding: 24px 30px 60px;
  z-index: 1;
}
.services-one__title-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--sinace-black);
  background-position: center top;
  transition-delay: .1s;
  transition-timing-function: ease-in-out;
  transition-duration: .5s;
  transition-property: all;
  transform-origin: top;
  transform-style: preserve-3d;
  transform: scaleY(0);
  z-index: -1;
}
.services-one__single:hover .services-one__title-box::before {
  transform: scaleY(1.0);
}
.services-one__title {
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
}
.services-one__title a {
  color: #222232;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.services-one__single:hover .services-one__title a {
  color: var(--sinace-white);
}
.services-one__img-box {
  position: relative;
  display: block;
}
.services-one__img {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1;
}
.services-one__img:before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: "";
  background-color: rgba(var(--sinace-black-rgb), .30);
  width: 0%;
  transform: translateY(100%);
  transition: all 500ms ease;
  z-index: 1;
}
.services-one__single:hover .services-one__img:before {
  transform: translateY(0);
  width: 100%;
}
.services-one__img img {
  width: 100%;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.services-one__single:hover .services-one__img img {
  transform: scale(1.05);
}
.services-one__icon {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  top: -38px;
  right: 20px;
  border-radius: 50%;
  background-color: var(--sinace-base);
  z-index: 2;
}
.services-one__icon span {
  position: relative;
  display: inline-block;
  font-size: 32px;
  color: var(--sinace-white);
  transition: all 500ms linear;
  transition-delay: 0.1s;
  transform: scale(1);
}
.services-one__single:hover .services-one__icon span {
  transform: scale(0.9);
}
.services-one__read-more {
  position: relative;
  display: block;
}
.services-one__read-more a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 600;
  line-height: 22px;
  color: var(--sinace-white);
  padding: 11px 30px 12px;
  background-color: var(--sinace-black);
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.services-one__read-more a:hover {
  background-color: var(--sinace-base);
}
.services-one__read-more a span {
  font-size: 16px;
}
.project-one {
  position: relative;
  display: block;
  padding: 40px 0 40px;
  z-index: 1;
}
.project-one .container {
  max-width: 1800px;
}
.project-one__bottom {
  position: relative;
  display: block;
}
.project-one__carousel {
  position: relative;
  display: block;
}
.project-one__single {
  position: relative;
  display: block;
}
.project-one__img-box {
  position: relative;
  display: block;
}
.project-one__img {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1;
}
.project-one__img:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(var(--sinace-black-rgb), .60);
  visibility: hidden;
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-transform: scaleY(0) translateZ(100px);
  transform: scaleY(0) translateZ(100px);
  -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
  z-index: 1;
}
.project-one__single:hover .project-one__img:before {
  visibility: visible;
  -webkit-transform: scaleY(1) translateZ(0px);
  transform: scaleY(1) translateZ(0px);
}
.project-one__img img {
  width: 100%;
  transition: all 500ms ease;
  transform: scale(1);
}
.project-one__single:hover .project-one__img img {
  transform: scale(1.05);
}
.project-one__content {
  position: relative;
  display: block;
  background-color: var(--sinace-black);
  padding: 33px 50px 47px;
  margin-top: -110px;
  margin-right: 260px;
  background-position: center bottom;
  transition-delay: .1s;
  transition-timing-function: ease-in-out;
  transition-duration: .5s;
  transition-property: all;
  transform-origin: bottom;
  transform-style: preserve-3d;
  transform: scaleY(0);
  z-index: 2;
}
.project-one__single:hover .project-one__content {
  transform: scaleY(1.0);
}
.project-one__content p {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--sinace-base);
}
.project-one__content h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  margin-top: 1px;
}
.project-one__content h3 a {
  color: var(--sinace-white);
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.project-one__content h3 a:hover {
  color: var(--sinace-base);
}
.project-one__arrow {
  position: absolute;
  top: 0;
  right: -50px;
}
.project-one__arrow a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  font-size: 16px;
  color: var(--sinace-white);
  background-color: var(--sinace-base);
  -webkit-transform: scale(0);
  transform: scale(0);
  opacity: 0;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.project-one__single:hover .project-one__arrow a {
  -webkit-transform: scale(1);
  transform: scale(1);
  transition-delay: 500ms;
  opacity: 1;
}
.project-one__arrow a:hover {
  color: var(--sinace-black);
  background-color: var(--sinace-white);
}
.project-one__carousel.owl-theme .owl-nav {
  position: relative;
  display: block;
  margin: 30px 0 0;
}
.project-one__carousel.owl-theme .owl-nav .owl-next {
  height: 52px;
  width: 52px;
  line-height: 52px;
  border-radius: 50%;
  color: var(--sinace-black);
  background-color: var(--sinace-primary);
  font-size: 16px;
  margin: 0;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
}
.project-one__carousel.owl-theme .owl-nav .owl-prev {
  height: 52px;
  width: 52px;
  line-height: 52px;
  border-radius: 50%;
  color: var(--sinace-black);
  background-color: var(--sinace-primary);
  font-size: 16px;
  margin: 0;
  text-align: center;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
  position: relative;
  display: inline-block;
}
.project-one__carousel.owl-theme .owl-nav .owl-next {
  margin-left: 5px;
}
.project-one__carousel.owl-theme .owl-nav .owl-prev {
  margin-right: 5px;
}
.project-one__carousel.owl-theme .owl-nav .owl-next span,
.project-one__carousel.owl-theme .owl-nav .owl-prev span {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.project-one__carousel.owl-theme .owl-nav .owl-next:hover,
.project-one__carousel.owl-theme .owl-nav .owl-prev:hover {
  background-color: var(--sinace-base);
  color: var(--sinace-white);
}

@media (max-width: 1199px) {
.services-one__left .section-title__title {
        font-size: 34px;
        line-height: 44px;
    }
.project-one__content {
        margin-right: 50px;
        padding: 33px 20px 47px;
    }
.project-one__content h3 {
        font-size: 19px;
    }
.project-one__content {
        margin-right: 50px;
        padding: 33px 20px 47px;
    }
.project-one__content {
        margin-right: 50px;
        padding: 33px 20px 47px;
    }
.project-one__content h3 {
        font-size: 19px;
    }
.project-one__content {
        margin-right: 150px;
    }
.project-one__content {
        margin-right: 100px;
        padding: 33px 25px 47px;
    }

}


/* Clean Section Title & Button */
.section-title { margin-bottom: 30px; }
.section-title__tagline-box { display: inline-block; margin-bottom: 10px; }
.section-title__tagline { color: var(--sinace-base); font-size: 16px; font-weight: 700; text-transform: uppercase; }
.section-title__title { color: var(--sinace-black); font-size: 46px; font-weight: 700; line-height: 1.2; }

/* In dark sections, make text white */
.expectation-one .section-title__title { color: var(--sinace-white); }
.expectation-one .section-title__tagline { color: var(--sinace-white); }

.thm-btn {
    display: inline-block;
    vertical-align: middle;
    background-color: var(--sinace-base);
    color: var(--sinace-white);
    font-size: 14px;
    font-weight: 700;
    padding: 14px 40px;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-transform: uppercase;
}
.thm-btn:hover { background-color: var(--sinace-black); color: var(--sinace-white); }

/* ============================================================
   landing/pages/s_about_new.php [block 1]
   ============================================================ */
/* --- SINACE THEME VARIABLES --- */
    /* --- EXACT CSS STRUCTURE FROM SOURCE --- */
    .rs-about.style2 {
        position: relative;
        padding-top: 40px;
        padding-bottom: 40px;
    }

        /* --- RESETS & FIXES --- */
    .rs-about.style2 ul.histort-part {
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .rs-about.style2 .position-relative {
        position: relative !important;
    }
    .rs-about.style2 .img-part {
        position: relative;
    }

        .rs-about.style2 .img-part img {
        border-radius: 5px;
        width: 100%;
        max-width: 100%;
        height: auto;
        object-fit: cover;
    }



    /* The Vertical Floating Box */
    .rs-about .histort-part {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        border: none;
        display: block;
    }

    .rs-about .histort-part .single-history {
        display: block;
        margin-bottom: 30px;
    }

    .rs-about.style2 .histort-part .single-history:last-child {
        border-bottom: none;
    }

    .rs-about.style2 .histort-part .single-history .tab-btn {
        padding: 28px 20px 22px;
        box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.1);
        border: none;
        border-radius: 5px;
        width: 230px;
        font-size: 20px;
        font-weight: 500;
        text-align: center;
        color: #ffffff;
        background: #171F32;
        transition: all 0.3s ease;
    }

    /* Icon Styling within Tab */
    .rs-about.style2 .histort-part .single-history .tab-btn [class^="icon-"] {
        display: block;
        font-family: 'icomoon' !important;
        /* Forces your icomoon font */
        font-size: 34px;
        margin-bottom: 10px;
        transition: all 0.3s ease;
    }

    /* Exact Active State Mapping */
    .rs-about.style2 .histort-part .single-history .tab-btn.active {
        background: var(--sinace-base);
        color: var(--sinace-white);
    }

    .rs-about.style2 .histort-part .single-history .tab-btn.active [class^="icon-"] {
        color: var(--sinace-white);
    }

    /* Right Side Content Spacing */
    .rs-about.style2 .pl-50 {
        padding-left: 50px;
    }

    .rs-about.style2 .sec-title .title {
        font-size: 36px;
        line-height: 46px;
        font-weight: 700;
        color: var(--sinace-black);
        margin: 0 0 15px;
    }

    .rs-about.style2 .sec-title .desc {
        font-size: 16px;
        line-height: 28px;
        color: var(--sinace-gray);
        margin-bottom: 0;
    }

    .rs-about.style2 .btn-part {
        margin-top: 25px;
    }

    .rs-about.style1 .img-part {
        position: relative;
    }

    /* Theme Button (Readon) */
    .rs-about.style2 .btn-part .readon {
        background-color: var(--sinace-base);
        color: var(--sinace-white);
        padding: 12px 30px 12px 30px;
        display: inline-block;
        border-radius: 3px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.3s ease;
    }

    .rs-about.style2 .btn-part .readon:hover {
        background-color: var(--sinace-black);
        color: var(--sinace-white);
    }

    /* Content Image underneath text */
    .rs-about.style2 .tab-img {
        margin-top: 30px;
    }

    .rs-about.style2 .tab-img img {
        border-radius: 5px;
        width: 100%;
        height: auto;
    }

    /* Logic for toggling panes */
    .rs-about.style2 .tab-pane {
        display: none;
    }

    .rs-about.style2 .tab-pane.active {
        display: block;
        animation: rsFadeUp 0.5s ease;
    }

    @keyframes rsFadeUp {
        0% {
            opacity: 0;
            transform: translateY(20px);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Exact Responsive Breakpoints */
    @media (max-width: 991px) {
        .rs-about.style2 .pl-50 {
            padding-left: 15px;
            margin-top: 50px;
        }

        .rs-about.style2 .histort-part {
            position: relative;
            top: 0;
            right: 0;
            transform: none;
            width: 100%;
            display: flex;
            margin-top: 30px;
        }

        .rs-about.style2 .histort-part .single-history {
            flex: 1;
            border-bottom: none;
            border-right: 1px solid var(--sinace-bdr-color);
        }

        .rs-about.style2 .histort-part .single-history:last-child {
            border-right: none;
        }
    }

    @media (max-width: 767px) {
        .rs-about.style2 .histort-part {
            display: block;
        }

        .rs-about.style2 .histort-part .single-history {
            border-right: none;
            border-bottom: 1px solid var(--sinace-bdr-color);
        }
    }

/* ============================================================
   landing/pages/contact.php [block 1]
   ============================================================ */
.error{color:red}
	#hiddenRecaptcha-error{margin-bottom: 10px}
  @media (max-width: 767px) {
    .mcb-section {
      padding-top: 30px !important;
    }

    .column_attr {
      margin-top: 30px !important;
    }

    .contactt_form {
      padding: 50px 11px 40px !important;
    }

    .g-recaptcha div {
      width: 100% !important
    }

    #Content h1 {
      font-size: 2rem;
    }

    .button-primary {
      padding: 10px 21px;
      margin-top: 20px;
      font-size: 14px;
      width: max-content;
    }

  }

/* ============================================================
   landing/pages/best_off.php [block 1]
   ============================================================ */
.mv-title {
      font-size: 2.1rem;
      font-weight: 700;
      margin-bottom: 18px;
      color: #2c3e50;
      letter-spacing: -1px;
    }
    .mv-info {
      font-size: 1.1rem;
      color: #444;
      margin-bottom: 18px;
    }
    .mv-cta {
      background: #f5f7fa;
      border-radius: 8px;
      padding: 18px 20px;
      margin-top: 18px;
      text-align: center;
      font-size: 1.2rem;
      font-weight: 600;
      color:var (--site_color_g);
      box-shadow: 0 1px 6px rgba(87,77,227,0.07);
    }
    #eie_app .container {
    max-width: 100%;
    width: 100%;
}
    #eie_app .nomination_layout_one h3 {
    text-align: left !important;
}
    #eie_app .nomination_layout_one *{ font-family: var(--font-inter) !important;}
    body #eie_app .ei_widescreen section.wrapper {
    max-width: 100%;
    margin: 0;
    padding: 0;
}
    .mv-video-container {
      display: flex;
      justify-content: center;
      margin-bottom: 25px;
    }
    .mv-video-img {
      max-width: 100%;
      height: auto;
      border-radius: 12px;
      box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    }
    .rules-legal-container {
      padding: 30px 20px;
      text-align: center;
    }
  #eie_app .ei-footer .rules-legal-container button {
      padding: 12px 35px;
      background: var(--site_color_g, #574de3);
      color: #fff;
      border: none;
      border-radius: 8px;
      font-size: 16px;
      text-decoration: none;
      font-weight: 700;
      cursor: pointer;
      transition: opacity 0.3s ease;
    }
    .rules-legal-container button:hover {
      opacity: 0.75;
    }

/* ============================================================
   landing/pages/donate.php [block 1]
   ============================================================ */
:root {
            --mv-primary: #574de3;
            --mv-primary-dark: #453bc9;
            --mv-bg: #f8fafc;
            --mv-card-bg: #ffffff;
            --mv-text: #1e293b;
            --mv-text-light: #64748b;
        }

        .mv-donate-page {
            background: var(--mv-bg);
            padding: 60px 0;
            min-height: 80vh;
            font-family: 'Inter', sans-serif;
        }

        .donation-container {
            max-width: 900px;
            margin: 0 auto;
            padding: 0 20px;
        }

        .donation-card {
            background: var(--mv-card-bg);
            border-radius: 24px;
            box-shadow: 0 10px 40px rgba(87, 77, 227, 0.08);
            padding: 40px;
            border: 1px solid rgba(87, 77, 227, 0.1);
        }

        .donation-header {
            text-align: center;
            margin-bottom: 32px;
        }

        .donation-header h1 {
            font-size: 2rem;
            font-weight: 800;
            color: var(--mv-text);
            margin-bottom: 8px;
            letter-spacing: -0.025em;
        }

        .donation-header p {
            color: var(--mv-text-light);
            font-size: 1rem;
        }

        .frequency-tabs {
            display: flex;
            background: #f1f5f9;
            padding: 6px;
            border-radius: 14px;
            margin-bottom: 30px;
        }

        .freq-tab {
            flex: 1;
            padding: 12px;
            text-align: center;
            font-weight: 600;
            font-size: 0.95rem;
            color: var(--mv-text-light);
            cursor: pointer;
            border-radius: 10px;
            transition: all 0.2s ease;
        }

        .freq-tab.active {
            background: #ffffff;
            color: var(--mv-primary);
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
        }

        .amount-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px;
            margin-bottom: 24px;
        }

        .amount-item {
            position: relative;
            border: 2px solid #e2e8f0;
            border-radius: 16px;
            padding: 18px 10px;
            text-align: center;
            cursor: pointer;
            transition: all 0.2s ease;
            font-weight: 700;
            font-size: 1.1rem;
            color: var(--mv-text);
        }

        .amount-item:hover {
            border-color: var(--mv-primary);
            background: rgba(87, 77, 227, 0.02);
        }

        .amount-item.selected {
            border-color: var(--mv-primary);
            background: var(--mv-primary);
            color: #ffffff;
        }

        .amount-item input {
            display: none;
        }

        .custom-amount-wrapper {
            margin-bottom: 30px;
        }

        .custom-amount-input {
            width: 100%;
            padding: 16px 20px;
            border-radius: 14px;
            border: 2px solid #e2e8f0;
            font-size: 1.1rem;
            font-weight: 600;
            transition: all 0.2s ease;
            outline: none;
        }

        .custom-amount-input:focus {
            border-color: var(--mv-primary);
            box-shadow: 0 0 0 4px rgba(87, 77, 227, 0.1);
        }

        #donate-trigger-btn, #donate-submit-btn {
            width: 100%;
            background: linear-gradient(135deg, var(--mv-primary) 0%, var(--mv-primary-dark) 100%);
            color: #ffffff;
            border: none;
            padding: 18px;
            border-radius: 16px;
            font-size: 1.1rem;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            box-shadow: 0 4px 14px rgba(87, 77, 227, 0.3);
        }

        #donate-trigger-btn:hover, #donate-submit-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(87, 77, 227, 0.4);
            filter: brightness(1.1);
        }

        #donate-trigger-btn:active, #donate-submit-btn:active {
            transform: translateY(0);
        }

        #donate-trigger-btn:disabled, #donate-submit-btn:disabled {
            background: #cbd5e1;
            cursor: not-allowed;
            transform: none;
            box-shadow: none;
        }

        .freq-content {
            display: none;
        }

        .freq-content.active {
            display: block;
            animation: fadeIn 0.3s ease;
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(5px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .secure-notice {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            margin-top: 20px;
            color: var(--mv-text-light);
            font-size: 0.85rem;
        }

        /* Top Section Styles */
        .entry-header {
            text-align: center;
            padding-bottom: 30px;
        }

        .entry-title {
    font-size: 2.8rem;
    font-weight: 700;
    color: #253525;
    /* letter-spacing: -0.04em; */
    margin: 0;
    line-height: 1.1;
}
        .main-content {
            margin-bottom: 60px;
            background: #fff;
            padding: 40px;
            border-radius: 24px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.03);
            border: 1px solid rgba(87, 77, 227, 0.05);
        }

        .entry-content {
            font-size: 1.1rem;
            line-height: 1.7;
            color: #475569;
        }

        .entry-content p {
            margin-bottom: 20px;
        }

        .wp-block-image img {
            max-width: 100%;
            height: auto;
            border-radius: 20px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.08);
            margin-bottom: 35px;
            transition: transform 0.3s ease;
        }
        
        .wp-block-image img:hover {
            transform: scale(1.01);
        }

/* ============================================================
   landing/pages/donate.php [block 2]
   ============================================================ */
/* Modal Styles */
        .mv-modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            backdrop-filter: blur(4px);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 9999;
        }

        .mv-modal-content {
            background: #fff;
            width: 100%;
            max-width: 600px;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
            padding: 0;
            overflow: hidden;
            max-height: 90vh;
            display: flex;
            flex-direction: column;
        }

        .modal-header {
            padding: 20px 30px;
            border-bottom: 1px solid #f1f5f9;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .modal-header h2 {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 700;
        }

        .modal-close {
            background: #f1f5f9;
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.25rem;
            cursor: pointer;
            color: #64748b;
            transition: all 0.2s ease;
            line-height: 1;
        }
        
        .modal-close:hover {
            background: #e2e8f0;
            color: #1e293b;
        }

        .modal-body {
            padding: 30px;
            overflow-y: auto;
        }

        .donation-summary {
            background: #f8fafc;
            padding: 15px 20px;
            border-radius: 12px;
            margin-bottom: 25px;
            font-size: 1rem;
        }

        .form-row {
            display: flex;
            gap: 15px;
            margin-bottom: 15px;
        }

        .form-group {
            flex: 1;
            display: flex;
            flex-direction: column;
        }

        .form-group label {
            font-size: 0.85rem;
            font-weight: 600;
            color: #475569;
            margin-bottom: 6px;
        }

        .form-group input, .form-group select {
            padding: 12px 15px;
            border-radius: 10px;
            border: 1px solid #e2e8f0;
            font-size: 0.95rem;
            outline: none;
        }

        .form-group input:focus {
            border-color: var(--mv-primary);
        }

        .form-opt-in {
            margin: 20px 0;
            font-size: 0.9rem;
            color: #64748b;
        }

        .form-opt-in label {
            display: flex;
            gap: 10px;
            cursor: pointer;
        }

/* ============================================================
   v2 partials - the classes that replaced legacy inline style
   attributes (top bar, header nav trigger, footer CTA, feed,
   contact captcha, events heading, gallery, skeletons).
   ============================================================ */
.bt-top-bar { background: var(--tg-secondary-color); padding: 11px 0; }
.bt-top-bar__right { gap: 20px; }
.bt-top-bar .top-bar-links-wrap { gap: 15px; }
.bt-top-bar .top-bar-links-wrap .bt-top-bar__btn { margin: 0; }
.bt-top-bar__link,
.bt-top-bar__link:hover { color: #ffffff; text-decoration: none; font-weight: 500; font-size: 15px; margin: 0; white-space: nowrap; }
.bt-top-bar .auth-nav-list { list-style: none; gap: 20px; align-items: center; }
.bt-macheteverse-search-toggle { background: transparent !important; border: 0; padding: 0; color: #ffffff; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
/* The legacy trigger carried this as an inline style, which beat the
   `.jo-header-nav nav a { display: grid }` rule above; the selector has to
   outrank that rule the same way or the arrow drops under the label. */
.jo-header-nav nav .has-sub-menu > a.bt-nav-trigger { display: inline-flex; align-items: center; gap: 6px; }
.dropdown-arrow { display: inline-flex; align-items: center; }
.bt-footer-cta { background: none !important; }
.bt-footer-cta__btn { padding: 0 31px; }
.bt-download-app { margin: 10px 0; }
.bt-hidden-filter { display: none; }
.bt-load-more-wrap { overflow: hidden; clear: both; }
.bt-load-more { letter-spacing: 3px; }
.bt-captcha .g-recaptcha { height: 100px; }
.bt-captcha__hidden { opacity: 0; height: 1px; width: 1px; position: absolute; }
.bt-events-title { display: flex; align-items: center; }
.bt-events-title .csSvgIco { width: 14px; height: 14px; margin-right: 6px; }
.bt-gallery-title { margin-bottom: 5px; }
.bt-gallery-line { margin: 0 auto 15px; }
/* The gallery lightbox, styled like the legacy lightbox2 overrides: a slate
   backdrop instead of fslightbox's near-black one, and a rounded, shadowed frame
   around the picture. Arrows and toolbar stay white on the dark ground. */
.fslightbox-container { background: rgba(15, 23, 42, 0.92) !important; }
.fslightbox-container .fslightbox-source { border-radius: 12px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); background: #fff; }
.fslightbox-container .fslightbox-slide-btn { background: rgba(255, 255, 255, 0.12); border-radius: 8px; }
.fslightbox-container .fslightbox-slide-btn:hover { background: rgba(255, 255, 255, 0.24); }
.bt-page-empty { color: #667085; border: 1px dashed #d8dbe0; border-radius: 10px; padding: 40px 22px; text-align: center; }
.mv-donate-page .custom-amount-wrapper[hidden] { display: none; }
.skeleton-container { width: 100%; }
.bt-skeleton-card { box-shadow: none !important; background: #fff; }
.bt-skel-w50 { width: 50%; height: 12px; }
.bt-skel-w30 { width: 30%; height: 8px; }
.bt-skel-w80 { width: 80%; height: 14px; }
.bt-skel-w95 { width: 95%; height: 10px; }
.bt-skel-w40 { width: 40%; height: 10px; }

/* ============================================================
   landing/settings_style.php - the static blocks. The legacy header
   included this file; the per-portal blocks live in colors_settings.php.
   ============================================================ */

/* ---- landing/settings_style.php [block 1] ---- */
.jo-inner-service .jo-article__img img {
    aspect-ratio: unset;
}
	.header-top-wrap-three .tt-footer-top__socials a {
    width: 30px;
    font-size: 15px;
    border: 2px solid #fff !important;
}
.header-top-wrap-three .jo-footer-top__socials a::before {
	background: #fff;
}
	.jo-breadcrumb {
    padding: 70px 0;
}
:root {
    --black: #252525;
}
.jo-inner-service {
    height: 100%;
}
.crm_mess_img_cont_wrapper h4 {
    font-size: 15px !important;
    color: #191919 !important;
    margin-bottom: 0;
}
	.crm_mess_img_cont_wrapper h4 span {
    font-size: 12px;
    color: #191919;
    float: right;
}
	.crm_mess_img_wrapper img {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}
	.crm_mess_img_cont_wrapper p {
    max-width: 300px;
    line-height: 16px !important;
}
.crm_mess_all_main_box_wrapper {
    float: left;
    width: 100%;
    text-align: center;
    padding-top: 12px !important;
    padding-bottom: 8px !important;
    padding: 5px;
    border-top: 1px solid #e6e6e6;
    margin-top: 18px;
}
.fix_droppp li a:hover * {
    color: #F820A3 !important;
}
.fix_droppp li a {
    font-size: 15px;
    display: block;
    margin: 0;
    padding: 0 !important;
	color: #252525 !important;
}
.crm_mess_img_cont_wrapper p {
    line-height: 1.1 !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    white-space: normal;
    color: #252525;
    font-size: 14px !important;
    padding-top: 5px !important;
    text-transform: none;
    font-weight: normal;
	margin-bottom: 0;
}
	.crm_mess_main_box_wrapper {
    float: left;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
}
	.crm_mess_img_wrapper {
    float: left;
    width: 50px;
}
	.crm_mess_img_cont_wrapper {
    float: left;
    width: calc(100% - 50px);
    padding-left: 10px;
    padding-top: 9px;
}

	.fix_droppp  ul li:first-child {
    border-bottom: 1px solid #e6e6e6;
    padding-left: 15px;
    height: 50px;
    line-height: 50px;
}
	.fix_droppp .dropdown-menu{
    min-width: 400px;
    right: 0;
    left: auto !important;
}
.logoo {
    height: auto;
    max-width: 350px;
    padding: 0;
}
.header-top-left-two .list-wrap li a {
    font-size: 15px;
}
.jo-header {
    position: relative;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    padding-top: 25px;
    inset: 0;
    border-radius: 0;
	box-shadow: none !important;
}
.jo-header-nav nav a {
    font-size: clamp(16px, 0.833vw, 16px);
}
.mfp-iframe-holder .mfp-close {
    top: -20px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    height: 40px;
    text-align: center;
    margin: 0 auto;
    padding: 0;
    margin: 0;
    background-color: red !important;
    right: -20px;
}
.category-list li {
    margin-right: 15px;
}
.category-list li h4 {
    font-size: 1.4rem
}
.category-list li:last-child {
    margin-right: 0
}
.post-meta .author-date a {
    border: none;
}
.navbar {
    border-radius: 0
}
nav.navbar-findcond .navbar-right li {
    margin-right: 15px;
}
nav.navbar-findcond .navbar-right li:last-child {
    margin-right: 0
}
.trending-activites .thumbnail {
    border: none !important;
}
.trending-activites .thumbnail .caption {
    background: #F7F8FA;
}
.logotext .sub-text {
    font-size: 10px;
}
/*.logotext h1 {
   font-size: 29px;
}*/
.customInput2 {
    font-size: 12px;
}
nav.navbar-findcond .navbar-right>li:last-child {
    max-width: 70px;
    display: block;
}
.header-banner2 {
    background: #E2DEEF;
}
.header-banner2 .registarArea {
    margin: 30px 0
}
.ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.trending-list .btn.active2 {
    background: #0E2D5C;
    color: #fff;
}
.profile_listt .btn-primary {
    display: block;
    color: white !important;
}
.logoo {
    height: auto;
    padding: 10px 0;
}
.v_box {
    position: relative;
}
.play_icon {
    position: absolute;
    top: 50%;
    display: block;
    width: 100%;
    text-align: center;
    transform: translate(0, -50%);
}
.play_icon img {
    width: 50px !important;
    min-height: 0 !important;
}
.trending-activites .thumbnail img {
    object-fit: contain;
}
.nav>li>a {
    padding: 10px 8px;
}
.dropdown-menu .abs_div {
    position: absolute;
    right: 10px;
    color: #000 !IMPORTANT;
    top: 10px;
}
.dropdown-menu .abs_div i {
    color: #000 !important;
    font-size: 20px;
    cursor: pointer !important;
}
nav.navbar-findcond .navbar-right li a {
    font-family: 'Montserrat-SemiBold' !important
}
nav.navbar-findcond .navbar-right {
    margin-top: 35px;
}
.spotlight-slider2 .flexx_boxx {
    align-items: center;
}

@media (min-width: 768px) {
nav.navbar-findcond .navbar-right {
    display: flex;
    align-items: center;
}
.flexx_boxx {
    display: flex;
    flex-flow: row wrap;
}
.mga_dropdown {
    padding: 20px 0;
    width: 550px;
    left: 0 !important;
    z-index: 999999999 !important;
}
.mga_dropdown li {
    float: left;
    width: 180px !important;
    margin-bottom: 10px
}
nav.navbar-findcond ul.mga_dropdown li a:hover {
    color: #480299 !important;
}
.mga_dropdown li a {
    white-space: normal;
    line-height: 1
}
}

@media (max-width: 768px) {
.d-flex {
    flex-flow: row wrap;
}
nav.navbar-findcond .navbar-right .dropdown ul.dropdown-menu {
    position: relative
}
nav.navbar-findcond .navbar-right .form-inline {
    display: flex;
}
nav.navbar-findcond .navbar-right {
    margin-left: 0;
}
nav.navbar-findcond .navbar-right li a {
    font-size: 15px;
}
nav.navbar-findcond .navbar-right>li:last-child {
    max-width: 100%;
}
}

@media (max-width: 767px) {
nav.navbar-findcond .navbar-right .input-group {
    width: 90%;
}
.m_mb_0 {
    padding-bottom: 0 !important;
}
rs-sbg {
    display: none !important;
}
#slider-1-slide-1-layer-5 {
    position: absolute;
    bottom: 0;
}
#slider-1-slide-1-layer-0 {
    height: 100% !important;
}
#Top_bar .top_bar_left {
    margin-top: 0px;
    width: 100% !important;
}
.header-transparent #Top_bar .top_bar_right {
    display: none;
}
#Top_bar #logo img.logo-main {
    display: block;
    width: 100%;
    max-width: 100%;
}
.section_wrapper, .container, .four.columns .widget-area {
    width: 100% !important;
}
.nextBtn {
    width: max-content;
}
nav.navbar-findcond .navbar-right .nextBtn2 {
    margin-right: 15px;
    border-radius: 0;
}
.header-banner h4 {
    font-size: 15px !important;
}
.trending-activites {
    padding-top: 30px;
    padding-bottom: 30px;
}
.featured-business {
    padding-bottom: 0
}
.trending-activites .thumbnail img {
    min-height: 0;
}
}

@media (min-width: 768px) and (max-width: 1200px) {
nav.navbar-findcond .navbar-right li a {
    font-size: 1.4vw;
}
.navbar-findcond .container {
    display: flex;
    flex-flow: column;
    align-items: center;
    width: 100% !important;
}
.navbar-brand {
    padding-bottom: 0
}
nav.navbar-findcond .navbar-right {
    margin-top: 0;
}
}

@media (min-width: 1400px) {
.featured_srvc .flexx_boxx {
    align-items: center;
}
.spotlight-slider2 .thumbnail img.v_thumbnail, .spotlight-slider2 .thumbnail img.img-fluid {
    height: 415px;
    width: auto;
}
}

@media (max-width: 420px) {
.logoo {
    max-width: 230px;
}
.profile_listt .nextBtn {
    font-size: 12px !important;
}
.related_spotlights .jcf-select .jcf-select-text, .profile_listt .jcf-select .jcf-select-text {
    font-size: 15px;
}
}
body .header-banner h4 {
    font-family: Montserrat-SemiBold;
}
.input_inline .label_anchor {
    border: 2px solid #ddd;
    border-radius: 50px;
    padding: 8px 10px;
    line-height: 16px;
    margin: 5px;
    text-align: center;
    display: inline-block;
    text-decoration: none; /* Added */
    font-size: 15px;
    color: black;
}
.input_inline .fa-check {
    display: none;
}
.input_inline {
    display: inline-block;
}
.input_inline .label_anchor.selected .fa-check {
    display: inline-block;
    font-size: 12px;
}
.input_inline .label_anchor:hover, .input_inline .label_anchor.selected {
    background: #1c7ff2;
    color: white !important;
    border-color: #1c7ff2;
    cursor: pointer;
}
#Top_bar .menu>li ul {
    background-color: #fff;
}
#Top_bar .menu li ul li a {
    border-bottom: none;
}
.mga_dropdown li {
    border-left: 1px solid #ccc;
}
.mga_dropdown li:nth-child(2n+1) {
    border-left: none;
}

/* ---- landing/settings_style.php [block 2] ---- */
#Top_bar #logo {
    display: block;
   height: auto !important; 
    line-height: 60px;
    padding: 10px 0;
    max-width: 330px !important;
}
	#Top_bar{position: relative;}
	#Top_bar,
	#Top_bar.is-sticky{background:#fff;
	
	}
#Top_bar .menu>li>a, #Top_bar #menu ul li.submenu .menu-toggle {
    color: #202020;
}
	.mfn-main-slider{background: #fff}
#slider-1-slide-1-layer-1, #slider-1-slide-1-layer-3, #slider-1-slide-1-layer-6, #slider-1-slide-1-layer-9 {
    color: #023EA0 !important;
}
#slider-1-slide-1-layer-9 {
    color: #2A2B2B !important;
}
@media only screen and (max-width: 787px) {
#Top_bar #logo {
    max-width: 240px !important;
}
	}

/* ---- landing/settings_style.php [block 9] ---- */
@media (min-width: 768px) {
	body .jo-header {
		flex-flow: column;
	}
	}

/* ---- landing/settings_style.php [block 15] ---- */
nav.navbar-findcond .navbar-right .dropdown ul.dropdown-menu {
    background: white;
    padding: 15px 10px;
    border: none;
}
nav.navbar-findcond .navbar-right .dropdown .fa {
    color: #000;
    font-weight: 600;
}
nav.navbar-findcond .navbar-right .dropdown ul.dropdown-menu li{margin-bottom:8px}
nav.navbar-findcond .navbar-right .dropdown ul.dropdown-menu li a,
nav.navbar-findcond .navbar-right .dropdown ul.dropdown-menu li a:hover{ border:none !important;}

@media only screen and (min-width: 768px) {
    #Top_bar.is-sticky #logo img.logo-main {
        display: block; 
    }
}

/* ---- landing/settings_style.php [block 16] ---- */
#Side_slide .fa-angle-down{
		display:none !important;
	}
	#Side_slide{
		border-bottom-width: 0 !important;
	}
	#Side_slide .dropdown-menu {
			position: relative;
			float:none ;
	}
	#Side_slide .mga_dropdown li {
	 border-left: 0; 
	}

	@media (max-width: 767px) {

		#Side_slide #menu ul li a{
		font-size: 13px;
	}

		.no_line{
			margin:0  !important;
		}
        .f_line{
            margin:0 auto 10px !important;
        }
		.themecolor_svg{
			width: 120px !important;
		}
	}
	@media (max-width: 768px) {
    .mga_dropdown li {
         float: none; 
        width: 100% !important;
    }
}

/* ---- landing/settings_style.php [block 19] ---- */
@media only screen and (min-width: 768px) {
    #Top_bar.is-sticky #logo, #Top_bar.is-sticky .custom-logo-link {
        height: auto !important;
    }
}
	
	.related_postss .card-header img{    width: 60px;}
	.related_postss .card-header .dropdown{display:none }
	.related_postss .card-body{padding: 0}
	.related_postss .card{border:none}
	.blog-details-section h4{margin-bottom: 15px;}
	.sidebar-widget-area .widget {
    padding: 12px;
}

/* ============================================================
   Front-end edit control (admins only; drawn once by the layout).
   Same rules as the other v2 themes.
   ============================================================ */
.ig-edit-btn { position: fixed; bottom: 24px; right: 24px; z-index: 9999; display: flex; align-items: stretch; font-size: 14px; }
.ig-edit-btn .ig-edit-btn__main { padding: 10px 20px; background: #000; color: #fff; text-decoration: none; border-radius: 5px 0 0 5px; box-shadow: 0 4px 15px rgba(0,0,0,.3); font-weight: 600; font-size: 14px; }
.ig-edit-btn .ig-edit-btn__main:only-child { border-radius: 5px; }
.ig-edit-btn .ig-edit-btn__main:hover { background: #222; color: #fff; }
.ig-edit-btn .ig-edit-btn__toggle { border: 0; background: #000; color: #fff; border-left: 1px solid rgba(255,255,255,.25); border-radius: 0 5px 5px 0; padding: 0 12px; cursor: pointer; box-shadow: 0 4px 15px rgba(0,0,0,.3); font-size: 14px; }
.ig-edit-btn .ig-edit-btn__toggle:hover { background: #222; }
.ig-edit-btn .ig-edit-btn__more { position: absolute; right: 0; bottom: 100%; margin: 0 0 8px; padding: 6px 0; list-style: none; background: #000; border-radius: 5px; box-shadow: 0 4px 15px rgba(0,0,0,.3); min-width: 210px; display: none; }
.ig-edit-btn.is-open .ig-edit-btn__more { display: block; }
.ig-edit-btn .ig-edit-btn__more a { display: block; padding: 8px 16px; color: #fff; text-decoration: none; font-size: 14px; white-space: nowrap; }
.ig-edit-btn .ig-edit-btn__more a:hover { background: #222; color: #fff; }

/* ============================================================
   Section headings: no padding under the title line, theme-wide.
   ============================================================ */
.section-title-wrap { padding-bottom: 0; }

/* ============================================================
   Home hero + featured column.
   The heading row sits above both columns (over the right one), so
   the two sliders start on the same line. The hero card is 590px and
   so is the right column: two 295px slides (285px card + 10px gap),
   each card 215px of covering image and the title under it, with
   small white chevrons laid over the top and bottom of the column.
   ============================================================ */
.bt-hero-area .bt-hero-head .section-title-wrap { margin-bottom: 14px !important; }
.bt-hero-area .ver_right_box { position: relative; height: 590px; }
.bt-hero-area .sidebar-wrap2 { height: 590px; overflow: hidden; }
.bt-hero-area .sidebar-wrap2 .item { height: 295px; padding: 0 0 10px; box-sizing: border-box; }
.bt-hero-area .sidebar-wrap2 .slick-slide { height: 295px !important; }
.bt-hero-area .jo-article2.jo-inner-service2 { height: 285px; display: flex; flex-direction: column; margin: 0; }
.bt-hero-area .jo-inner-service2 .jo-article__img2 { flex: 0 0 215px; height: 215px; width: 100%; display: block; overflow: hidden; }
/* The cover only - a direct child. The play button inside the overlay is
   also an <img>, and the old descendant selector stretched it to the box. */
.bt-hero-area .jo-inner-service2 .jo-article__img2 > img,
.bt-hero-area .jo-article__img2 > .img-fluid { height: 215px !important; min-height: 0 !important; width: 100% !important; max-width: none !important; object-fit: cover !important; display: block; }
.bt-hero-area .jo-article__img2 .play_icon img,
.bt-hero-area .jo-inner-service2 .play_icon img { width: 44px !important; height: auto !important; min-height: 0 !important; object-fit: contain !important; }
.bt-hero-area .jo-inner-service2 .jo-article__txt { position: static !important; background: none !important; padding: 0 !important; margin: 0; flex: 1 1 auto; overflow: hidden; }
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title { margin: 6px 0 0; font-size: 15px; line-height: 1.3; }
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title a { color: var(--black, #252525) !important; }
.bt-hero-area .jo-inner-video-card .jo-video-card__img { object-fit: cover; }
.bt-hero-area .bt-feat-arrow { position: absolute; left: 50%; transform: translateX(-50%); z-index: 8; width: 28px; height: 28px; border: 0; padding: 0; background: none; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; filter: drop-shadow(0 1px 3px rgba(0,0,0,.7)); }
.bt-hero-area .bt-feat-arrow svg { width: 22px; height: 22px; }
.bt-hero-area .bt-feat-arrow:hover { transform: translateX(-50%) scale(1.15); }
.bt-hero-area .bt-feat-arrow--up { top: 4px; }
/* The last card ends with 70px of title and a 10px gap; 84px puts the
   chevron 4px inside the bottom of the second IMAGE, mirroring the top one. */
.bt-hero-area .bt-feat-arrow--down { bottom: 84px; }
@media (max-width: 991px) {
  .bt-hero-area .bt-hero-head .col-md-8 { display: none; }
  .bt-hero-area .ver_right_box { height: auto; margin-top: 24px; }
  .bt-hero-area .sidebar-wrap2 { height: auto; }
  .bt-hero-area .bt-feat-arrow { display: none; }
}
@media (max-width: 767px) {
  .bt-hero-area .jo-inner-video-card .jo-video-card__img { min-height: 260px; height: 260px; }
}/* The card itself was dark (the legacy overlay style) and the site-colour
   rule paints every <button>; both must not reach this column. */
.bt-hero-area .jo-article2.jo-inner-service2 { background: none !important; box-shadow: none; }
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title,
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title a { color: #252525 !important; }
.bt-hero-area .bt-feat-arrow,
html body .bt-hero-area .bt-feat-arrow { background: none !important; border: 0 !important; box-shadow: none !important; }
/* The portal's own custom CSS (edited in the admin, printed inline) paints
   this block dark with !important under body.theme-bt_macheteverse; the same
   scope here outranks it for the hero column alone. */
body.theme-bt_macheteverse .bt-hero-area .jo-inner-service2 .jo-article__txt { background: none !important; }
body.theme-bt_macheteverse .bt-hero-area .jo-inner-service2 .jo-article__txt * { color: #252525 !important; }
/* The sidebar heading: smaller than a section heading, tight to the slider.
   The platform's global CSS sets `body .section-title .title` to 26px with
   !important, so this carries the same weight with more specificity. */
body .bt-hero-area .bt-hero-head .section-title .title { font-size: 20px !important; line-height: 1.25; }
body .bt-hero-area .bt-hero-head .section-title-wrap { margin-bottom: 6px !important; }
body .bt-hero-area .bt-hero-head .section-title-line { margin-top: 6px; }
/* Title band under each featured image: the theme colour, white text. */
body.theme-bt_macheteverse .bt-hero-area .jo-inner-service2 .jo-article__txt,
.bt-hero-area .jo-inner-service2 .jo-article__txt { background: var(--bt-primary, var(--site_color_g, #00acbd)) !important; padding: 8px 12px !important; }
body.theme-bt_macheteverse .bt-hero-area .jo-inner-service2 .jo-article__txt *,
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title,
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title a { color: #fff !important; }
.bt-hero-area .jo-inner-service2 .jo-article__txt .jo-article__title { margin: 0; }
/* Bigger chevrons, rounded corners on both sliders, heading tight to its line. */
.bt-hero-area .bt-feat-arrow { width: 44px; height: 44px; }
.bt-hero-area .bt-feat-arrow svg { width: 36px; height: 36px; }
.bt-hero-area .bt-feat-arrow--up { top: 2px; }
.bt-hero-area .bt-feat-arrow--down { bottom: 82px; }
.bt-hero-area .jo-inner-main-content,
.bt-hero-area .jo-inner-videos-slider2,
.bt-hero-area .jo-inner-video-card { border-radius: 12px; overflow: hidden; }
.bt-hero-area .jo-article2.jo-inner-service2 { border-radius: 10px; overflow: hidden; }
body .bt-hero-area .bt-hero-head .section-title { margin: 0 !important; padding: 0 !important; }
body .bt-hero-area .bt-hero-head .section-title .title { margin: 0 !important; }
body .bt-hero-area .bt-hero-head .section-title-line { margin: 8px 0 0 !important; }
body .bt-hero-area .bt-hero-head .section-title-wrap { margin-bottom: 10px !important; padding: 0 !important; }
/* Heading: 12px above the line and 12px below it. Hero dots: small, wider
   apart, active one in the theme colour. */
body .bt-hero-area .bt-hero-head .section-title-line { margin: 12px 0 0 !important; }
body .bt-hero-area .bt-hero-head .section-title-wrap { margin-bottom: 12px !important; }
.bt-hero-area .slick-dots { gap: 10px; }
.bt-hero-area .slick-dots li { margin: 0; width: auto; height: auto; }
.bt-hero-area .slick-dots li button { width: 11px; height: 11px; padding: 0; background: rgba(255,255,255,.75) !important; }
.bt-hero-area .slick-dots li.slick-active button { background: var(--bt-primary, var(--site_color_g, #00acbd)) !important; }
.bt-hero-area .jo-inner-main-content,
.bt-hero-area .jo-inner-videos-slider2,
.bt-hero-area .jo-inner-video-card,
.bt-hero-area .jo-article2.jo-inner-service2 { border-radius: 6px; }
/* Sidebar heading: 15px between the title and its line (Iftikhar's rule). */
body .bt-hero-area .bt-hero-head .section-title { margin: 0 0 15px !important; }
/* Post detail body copy: larger reading size. */
body .blog-details-wrapper p { font-size: 1.2rem; line-height: 1.7; }
/* Footer top: the subscribe button sits beside the social icons, right-aligned,
   bigger and bold. */
.jo-footer-top .bt-footer-top__right { display: flex; align-items: center; justify-content: flex-end; gap: 22px; flex-wrap: wrap; }
.jo-footer-top .bt-footer-top__right .jo-footer-top__socials { margin: 0; }
.jo-footer-top .bt-footer-top__right .bt-footer-cta__btn { font-size: 18px !important; font-weight: 700 !important; padding: 12px 34px !important; height: auto !important; line-height: 1.3 !important; white-space: nowrap; }
@media (max-width: 767px) {
  .jo-footer-top .bt-footer-top__right { justify-content: flex-start; gap: 14px; }
  .jo-footer-top .bt-footer-top__right .bt-footer-cta__btn { font-size: 16px !important; white-space: normal; }
}
/* Static banner in the hero: takes the slider's cell at the slider's shape,
   or the whole row when there is no featured column. Heading and text sit
   bottom-left on the picture's dark gradient (sister theme's block). */
.bt-hero-area .bt-hero-banner { border-radius: 6px; overflow: hidden; }
.bt-hero-area .bt-hero-banner .banner-post-thumb-three img { height: auto; aspect-ratio: 690/617; }
.bt-hero-area .col-12 > .bt-hero-banner .banner-post-thumb-three img { aspect-ratio: 1410/530; }
.bt-hero-area .bt-hero-banner .banner-post-content-three { text-align: left; left: 30px; right: 30px; bottom: 30px; }
.bt-hero-area .bt-hero-banner .banner-post-content-three .post-title { margin-bottom: 10px; }
.bt-hero-area .bt-hero-banner .bt-hero-banner__text { color: #fff; max-width: 600px; font-size: 1rem; line-height: 1.5; margin: 0; }
.bt-hero-area .bt-hero-banner .full-card-link { position: absolute; inset: 0; z-index: 3; }
@media (max-width: 767px) {
  .bt-hero-area .bt-hero-banner .banner-post-thumb-three img { aspect-ratio: 4/3 !important; }
  .bt-hero-area .bt-hero-banner .banner-post-content-three { left: 16px; right: 16px; bottom: 16px; }
  .bt-hero-area .bt-hero-banner .banner-post-content-three .post-title { font-size: 20px; }
}
/* Top bar: the footer's social icons on the left, small, when switched on. */
.bt-top-bar__socials { gap: 10px; }
.bt-top-bar__socials a { width: 32px; font-size: 14px; border-color: rgba(255, 255, 255, 0.5); }
@media (max-width: 767px) { .bt-top-bar__left { display: none; } }
/* Banner options: text centred on the picture; edge-to-edge width (breaks out
   of the page column; the section's own padding is dropped so it touches the
   header). */
.bt-hero-area .bt-hero-banner--center .banner-post-content-three { text-align: center; left: 40px; right: 40px; bottom: 60px; }
.bt-hero-area .bt-hero-banner--center .bt-hero-banner__text { margin: 0 auto; }
.bt-hero-area .bt-hero-banner-full { width: 100vw; max-width: 100vw; padding: 0; margin-left: calc(50% - 50vw); }
.bt-hero-area .bt-hero-banner-full .bt-hero-banner { border-radius: 0; }
.bt-hero-area .bt-hero-banner-full .banner-post-thumb-three img { aspect-ratio: 1920/600; }
.bt-hero-area.bt-hero-area--full-banner { padding-top: 0 !important; }
@media (max-width: 767px) {
  .bt-hero-area .bt-hero-banner--center .banner-post-content-three { left: 16px; right: 16px; }
}
/* One page width everywhere: 1320px, like .container. The header lost its
   fixed-bar side padding (it sits inside .container now) and the footer's
   .jo-container takes the same width instead of viewport-based margins. */
body .jo-header { padding-left: 0 !important; padding-right: 0 !important; }
.jo-container { max-width: 1320px; margin: 0 auto !important; padding: 0 12px; }
/* Banner height: the picture is cropped to one of three shapes. Beside the
   featured column the cell is near-square whatever is chosen. */
.bt-hero-area .col-12 > .bt-hero-banner--small .banner-post-thumb-three img { aspect-ratio: 1410/380; }
.bt-hero-area .col-12 > .bt-hero-banner--large .banner-post-thumb-three img { aspect-ratio: 1410/700; }
.bt-hero-area .bt-hero-banner-full > .bt-hero-banner--small .banner-post-thumb-three img { aspect-ratio: 1920/420; }
.bt-hero-area .bt-hero-banner-full > .bt-hero-banner--large .banner-post-thumb-three img { aspect-ratio: 1920/820; }
/* The static ad band (ad slot 2 empty): one centred picture with a link. */
.bt-ad-banner .ad-banner-img img { max-width: 100%; height: auto; }
/* A static banner sits straight under the header: no top padding on the hero. */
.bt-hero-area.bt-hero-area--banner { padding-top: 0 !important; }
/* Footer top band: a fixed height on desktop, and the logo may stand taller
   than the band and overflow it (the sister theme's look). */
@media (min-width: 1200px) {
  .jo-footer .jo-footer-top { padding: 0 40px; min-height: 140px; overflow: visible; }
  .jo-footer .jo-footer-top > .row { min-height: 140px; }
  .jo-footer .jo-footer-top .logo { width: auto; max-width: 240px; max-height: 200px; margin: -70px 0 0; position: relative; z-index: 2; }
}
/* Collaborators strip (sister theme's "Explore the Machetes"): the legacy
   view's inline rules. Portraits are shown whole, not cropped. */
.bt-collaborators .overlay-post-four .overlay-post-thumb-three img { background-repeat: no-repeat; background-position: center; }
.bt-collaborators .bt-collaborators__meta { justify-content: flex-start; }
/* Collaborator cards: equal height, left-aligned in the row, rounded, and the
   whole portrait shown on a dark ground. */
.bt-collaborators .trending-post-active { justify-content: flex-start; }
.bt-collaborators .trending-post-active .slick-track { margin-left: 0; }
.bt-collaborators .overlay-post-four { height: 380px; border-radius: 12px; overflow: hidden; }
.bt-collaborators .overlay-post-four .overlay-post-thumb-three { height: 100%; }
.bt-collaborators .overlay-post-four .overlay-post-thumb-three a { display: block; height: 100%; }
.bt-collaborators .overlay-post-four .overlay-post-thumb-three img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
@media (max-width: 767px) { .bt-collaborators .overlay-post-four { height: 380px; } }
/* The card's dark overlay only where the words are; the portrait stays clear. */
.bt-collaborators .overlay-post-four .overlay-post-thumb-three::after { background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.45) 22%, rgba(0, 0, 0, 0) 45%); }
/* Collaborators strip with its own background picture (Collaborators tab):
   the picture replaces the sketch shapes. */
.bt-collaborators--bg { background-image: var(--bt-clbtr-bg); background-size: cover; background-position: center; }
.bt-collaborators--bg .trending-shape-wrap { display: none; }
/* ============================================================
   Media slider ("In Motion"): partials/sections/media_slider.php. Ported
   from theme_includes/macheteverse_motion_slider.php - the block's own
   inline <style>, unchanged. ============================================================ */
/* --- Main Slider Styles --- */
.container222 .slide {
    margin-bottom: 20px;
}

/* Specific targeting from the body to the Magnific Popup container */
body .mfp-bg {
    background: rgba(0, 0, 0, 0.85);
    /* Makes the backdrop darker and cleaner */
}

body .mfp-wrap .mfp-container .mfp-content .mfp-close,
body .mfp-image-holder .mfp-close,
body .mfp-iframe-holder .mfp-close {
    /* Shape & Size */
    width: 35px;
    height: 35px;
    border-radius: 50%;

    /* Background & Border */
    background-color: #000 !important;
    /* Forces a black circle */
    border: 2px solid #FFF;
    color: #FFF !important;

    /* Perfect Centering Logic */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    /* Positioning */
    top: -45px;
    /* Moves it above the video/image */
    right: 0;

    /* Reset Defaults */
    padding: 0 !important;
    margin: 0;
    opacity: 1;
    font-size: 28px;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Hover effect to make it feel interactive */
body .mfp-iframe-holder .mfp-close:hover,
body .mfp-image-holder .mfp-close:hover {
    background-color: #FFF !important;
    color: #000 !important;
    transform: scale(1.1);
}

/* Fix for the iframe container padding */
body .mfp-iframe-holder .mfp-content {
    line-height: 0;
    max-width: 900px;
    /* Standard video width */
}

.container222 .img-wrapper {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    border-radius: 0 !important;
}

.container222 .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 7px;
}

.container222 .play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.container222 .play-btn i {
    font-size: 60px;
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    display: block;
    line-height: 1;
}

.container222 .item-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 20px;
    line-height: 1.1;
    text-transform: capitalize;
    letter-spacing: 0.5px;
}

.container222 .item-title a {
    color: var(--site_font_color_g) !important;
    text-decoration: none;
}

.container222 .item-title a:hover {
    color: var(--site_color_g) !important;
}

.container222 .item-text {
    color: var(--site_font_color_g);
    opacity: 0.8;
    font-size: 18px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 30px;
}

.container222 .btn-read-story {
    color: var(--site_color_g) !important;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
}

.container222 .btn-read-story:hover {
    text-decoration: underline;
}

/* --- Thumbnail Navigation --- */
.slider-nav-container {
    margin-top: 10px;
    padding: 0 50px 0 0;
    /* Align left: 0 padding on the left */
    position: relative;
}

.slider-nav {
    margin: 0;
}

.thumb-item {
    width: 170px;
    /* Base width for thumbnails to align left */
    padding-right: 15px;
    /* Spacing between thumbnails */
    cursor: pointer;
    outline: none;
}

/* 1. Target the active thumbnail container */
body .slider-nav .slick-current .thumb-content {
    position: relative;
    border: none !important;
    /* Removes the border entirely */
    background: #000;
    overflow: hidden;
    display: block;
}

/* 2. Create the Overlay Layer */
body .slider-nav .slick-current .thumb-content::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    /* Overlay Color: Black at 50% transparency */
    background-color: rgba(119, 0, 255, 0.5) !important;

    /* Ensures the overlay doesn't block clicks to the slide */
    pointer-events: none;
    z-index: 2;
    transition: all 0.3s ease;
}

/* 3. Ensure the Image stays behind the overlay */
body .slider-nav .slick-current .thumb-content img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
    filter: grayscale(20%);
    /* Optional: subtle effect to make active stand out */
}

/* 4. Optional: Add a small icon or text on top of the overlay if needed */
/* body .slider-nav .slick-current .thumb-content::before {
    content: "\f00c"; 
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFF;
    z-index: 3;
} */

.thumb-content img {
    width: 100%;
    margin: 0;
    object-fit: cover;
    transition: 0.3s;
    border-radius: 0 !important;
}

.thumb-play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 24px;
    color: #fff;
    pointer-events: none;
    z-index: 5;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

.slider-nav .slick-current .thumb-content {
    border: 2px solid var(--site_color_g);
}

.slider-nav .slick-current .thumb-content img {
    opacity: 1;
}

/* --- ARROWS --- */
.slider-nav-container .slick-prev,
.slider-nav-container .slick-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%) !important;
    width: 40px;
    height: 40px;
    background: transparent;
    color: #000;
    z-index: 10;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border: none;
    transition: 0.3s;
}

.slider-nav-container .slick-prev:hover,
.slider-nav-container .slick-next:hover {
    transform: translateY(-50%) scale(1.2) !important;
}

.slider-nav-container .slick-prev {
    left: -40px;
}

/* Position outside relative to left-aligned thumbs */
.slider-nav-container .slick-next {
    right: auto;
    left: calc(100% + 5px);
}

/* Handle based on container */

/* More standard arrow placement for slick */
.slider-nav-container .slick-prev {
    left: -30px;
}

.slider-nav-container .slick-next {
    right: -30px;
}

.slider-nav-container .slick-prev::before {
    content: "\2039";
    font-family: inherit; font-weight: 700; line-height: 1;
    font-size: 32px;
    color: #000;
}

.slider-nav-container .slick-next::before {
    content: "\203A";
    font-family: inherit; font-weight: 700; line-height: 1;
    font-size: 32px;
    color: #000;
}

@media (max-width: 991px) {
    .container222 .item-title {
        font-size: 24px;
    }

    .container222 .item-text {
        font-size: 15px;
    }

    .slider-nav-container {
        padding: 0 30px;
    }
}
/* Play button on a card: the link is already centred on the picture
   (top/left 50%, translated back by half). The generic .play_icon rule then
   shifted the icon inside it up by another half of its height, so the button
   sat above centre on the featured-stories cards. Inside the centred link the
   icon is a plain block. */
.featured-video-host .featured-video-popup .play_icon { position: static; top: auto; left: auto; width: 56px; transform: none; text-align: center; }
.featured-video-host .featured-video-popup .play_icon img { width: 100% !important; height: auto !important; }

/* ---- "Meet the Machetes" page (the legacy grow.php, drawn through the
   bridge). Two rules from other blocks landed on it: the blanket
   `button { color: #fff !important }` above painted the filter buttons
   white on their own white fill, so every name read as an empty pill. The
   sister stylesheet's intent is restored here - the portal's colour on the
   pill, white once it is chosen. ---- */
.jo-inner-videos-filter-nav button { color: var(--ttRed, var(--site_color_g)) !important; }
.jo-inner-videos-filter-nav button:hover,
.jo-inner-videos-filter-nav button.active { color: var(--white, #fff) !important; }
/* A card outside the home page is as tall as what is in it. The portal's own
   CSS pins the home page cards to 590px, and on this page that cropped the
   second line of every blurb. */
body:not(.ig-screen-landing) .jo-inner-video-card {
  height: auto !important;
  background: #f4f6f9;
  border-radius: 16px;
  overflow: hidden;
}
/* picture and words are one card: no 40px of air between them. */
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__img { margin-bottom: 0; border-radius: 16px 16px 0 0; display: block; }
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__txt { padding: 16px 18px 20px; }
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__title { margin-top: 0; }
/* The name carries the card. */
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__title { font-size: 18px; font-weight: 700; line-height: 1.3; }
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__infos { font-size: 15px; }
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__title { margin-bottom: 4px; }
/* Every card in a row is as tall as the tallest, so the light panels line up
   however long a role reads. */
body:not(.ig-screen-landing) .jo-inner-videos-row > .col { display: flex; }
body:not(.ig-screen-landing) .jo-inner-videos-row > .col > .jo-video-card { width: 100%; display: flex; flex-direction: column; }
body:not(.ig-screen-landing) .jo-inner-video-card .jo-video-card__txt { flex: 1 1 auto; }

/* Lightbox counter: the slide number is a bare <span>, so the theme's body
   text colour made "1" invisible on the dark backdrop while "/ 12" stayed
   light. The whole counter is light, whatever the portal's text colour. */
.fslightbox-container * { box-sizing: border-box; color: #fff !important; }