/* Global Styles CSS for Webflow */

h1,
h2,
h3 {
  text-wrap: balance;
}

/* Set color style to inherit */
.inherit-color * {
  color: inherit;
}

/* Focus state style for keyboard navigation for the focusable elements */
*[tabindex]:focus-visible,
input[type="file"]:focus-visible {
  outline: 0.125rem solid #4d65ff;
  outline-offset: 0.125rem;
}

/* Get rid of top margin on first element in any rich text element */
.w-richtext > :not(div):first-child,
.w-richtext > div:first-child > :first-child {
  margin-top: 0 !important;
}

/* Get rid of bottom margin on last element in any rich text element */
.w-richtext > :last-child,
.w-richtext ol li:last-child,
.w-richtext ul li:last-child {
  margin-bottom: 0 !important;
}

/* Prevent all click and hover interaction with an element */
.pointer-events-off {
  pointer-events: none;
}

/* Enables all click and hover interaction with an element */
.pointer-events-on {
  pointer-events: auto;
}

/* Create a class of .div-square which maintains a 1:1 dimension of a div */
.div-square::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

/* Make sure containers never lose their center alignment */
.container-medium,
.container-small,
.container-large {
  margin-right: auto !important;
  margin-left: auto !important;
}

.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-dropdown-link {
  color: inherit;
  text-decoration: inherit;
  font-size: inherit;
}

/* Apply "..." after 3 lines of text */
.text-style-3lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* Apply "..." after 2 lines of text */
.text-style-2lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* Adds inline flex display */
.display-inlineflex {
  display: inline-flex;
}

/* These classes are never overwritten */
.hide {
  display: none !important;
}

@media screen and (max-width: 991px) {
  .hide,
  .hide-tablet {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .hide-mobile-landscape {
    display: none !important;
  }
}
@media screen and (max-width: 479px) {
  .hide-mobile {
    display: none !important;
  }
}

.margin-0 {
  margin: 0rem !important;
}

.padding-0 {
  padding: 0rem !important;
}

.spacing-clean {
  padding: 0rem !important;
  margin: 0rem !important;
}

.margin-top {
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}

.padding-top {
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}

.margin-right {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}

.padding-right {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}

.margin-bottom {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}

.padding-bottom {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}

.margin-left {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
}

.padding-left {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
}

.margin-horizontal {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}

.padding-horizontal {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}

.margin-vertical {
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}

.padding-vertical {
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}

/* Apply "..." at 100% width */
.truncate-width {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Removes native scrollbar */
.no-scrollbar {
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}


/* footer logos and store links */

.grp-logo-w-store-link{
  display: flex;
    justify-content: space-around;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 9rem;
}



/* Custom button & link styles */

.link {
  cursor: pointer;
  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  transition-duration: 400ms;
  transition-property: color;
}

.link:focus:after,
.link:hover:after {
  width: 100%;
  left: 0%;
}

.link:after {
  content: "";
  pointer-events: none;
  bottom: -2px;
  left: 50%;
  position: absolute;
  width: 0%;
  height: 2px;
  background-color: var(--link--link-hover);
  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  transition-duration: 400ms;
  transition-property: width, left;
}

.footer_link {
  cursor: pointer;
  position: relative;
  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  transition-duration: 400ms;
  transition-property: color;
}

.footer_link:focus:after,
.footer_link:hover:after {
  width: 100%;
  left: 0%;
}

.footer_link:after {
  content: "";
  pointer-events: none;
  bottom: -2px;
  left: 50%;
  position: absolute;
  width: 0%;
  height: 2px;
  background-color: var(--footer--footer-link-hover);
  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  transition-duration: 400ms;
  transition-property: width, left;
}

/* Custom reveal animations */
§ .reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* Custom grid styles */

.content-wrapper {
  --gap: clamp(1rem, var(--_size---side-margin), 2rem);
  --full: minmax(var(--gap), 1fr);
  --content: min(var(--_size---container-large), 100% - var(--gap) * 2);
  --half-content: calc(var(--content) / 2);

  display: grid;
  grid-template-columns:
    [full-start] var(--full)
    [content-start] var(--half-content) [content-middle] var(--half-content) [content-end]
    var(--full) [full-end];
}

.grid-item-full-start-at-content {
  grid-column: content-start / content-middle;
}

.grid-item-full-start-at-middle {
  grid-column: content-middle / full-end;
}

.grid-item-full-start-at-full {
  grid-column: full-start / content-middle;
}

.grid-item-full-end-at-content {
  grid-column: content-middle / content-end;
}

/* Responsive Design */
@media (max-width: 768px) {
  .content-wrapper {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .grid-item-full-start-at-content,
  .grid-item-full-start-at-middle,
  .grid-item-full-start-at-full,
  .grid-item-full-end-at-content {
    grid-column: 1 / -1;
  }

  .grid-item-full-start-at-content,
  .grid-item-full-end-at-content {
    padding: var(--gap);
  }

  .grid-item-full-start-at-full {
    order: 1; /* Move the full-start-at-full items to the beginning */
  }

  .grid-item-full-start-at-content,
  .grid-item-full-end-at-content,
  .grid-item-full-start-at-middle,
  .grid-item-full-start-at-full {
    display: flex;
    flex-direction: column;
  }
}

.navbar_link.w--current {
  color: var(--brand--secondary);
}

@media (min-width: 768px) {
  .benefits_list .benefits_component:nth-child(even) {
    display: flex;
    flex-direction: row-reverse;
  }
}

/* Timeline */

.timeline-item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: var(--_timeline---marker-size);
  left: calc(
    var(--_timeline---timeline-padding-left) * -1 +
      (var(--_timeline---marker-size) - var(--_timeline---timeline-width)) / 2
  );
  width: var(--_timeline---timeline-width);
  background-color: var(--brand--primary);
  height: calc(
    100% + var(--_timeline---item-spacing) - var(--_timeline---marker-size)
  );
  z-index: 0;
}

/* Legal Pages */

.legal_rich-text {
  overflow: hidden;
}

.legal-categories_item:nth-of-type(2) {
  grid-column: 2 / 4;
}

.legal-categories_item:nth-of-type(3) {
  grid-column: 1 / 3;
}

@media (max-width: 992px) {
  .legal-categories_item:nth-of-type(2),
  .legal-categories_item:nth-of-type(3) {
    grid-column: 1;
  }
}

.legal_post-list a.w--current {
  color: var(--brand--secondary);
}

.legal_post-list li:hover,
.legal_post-list li:hover a {
  color: var(--element--link--link-hover);
}

.w-richtext figure {
  max-width: 100%;
}

.wp-block-table {
  overflow: auto;
  width: 100%;
}

.wp-block-heading {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 2em;
}

table {
  border: 1px solid #dededf;
  height: 100%;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 1px;
  text-align: left;
  width: 100%;
}

caption {
  caption-side: top;
  text-align: left;
}

th {
  border: 1px solid #dededf;
  background-color: #000000;
  color: #ffffff;
  padding: 5px;
}

td {
  border: 1px solid #dededf;
  background-color: #ffffff;
  color: #000000;
  padding: 5px;
}

.grid-item-content h2 {
  margin-bottom: 1rem;
  font-size: 1.5rem;
  font-weight: 600;
}

.TabButtons {
  border: 1px solid #0b61ac12;
  padding: 2px;
}

.TabButtons button {
  font-size: 0.75rem;
  line-height: 2.5rem;
}

/* Hero Screens */

/* Hero Globus Animation */
@keyframes rotateZ {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(360deg);
  }
}

.globus_home-hero-animation {
  animation: rotateZ 30s linear infinite;
}




/* hero-banner */
.header-banner {
  background-color: #000000;
  width: 100%;
  padding-left: 5vw;
  padding-right: 5vw;

  /* start collapsed */
  max-height: 0;
  overflow: hidden;

  /* animate open */
  animation: expandBanner 5s ease-out forwards;
}

.header-banner-inner {
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 5vw;
  padding-right: 5vw;
  width: 100%;
  max-width: var(--_size---container-large);
}


/* closing animation */
.header-banner.closing {
  animation: collapseBanner 2s ease-out forwards;
}
/* animation */
@keyframes expandBanner {
  from {
    max-height: 0;
    opacity: 0;
  }
  to {
    max-height: 300px; /* set to a value bigger than actual banner height */
    opacity: 1;
  }
}

@keyframes collapseBanner {
  from {
    max-height: 300px;
    opacity: 1;
  }
  to {
    max-height: 0;
    opacity: 0;
  }
}


/* Hero Marquee */

:root {
  --size: clamp(15rem, 1rem + 40vmin, 30rem);
  --gap: calc(var(--size) / 7);
  --duration: 60s;
  --scroll-start: 0;
  --scroll-end: calc(-100% - var(--gap));
}

/* .hero-marquee_content-right {
  mask-image: linear-gradient(
    var(--mask-direction, to right),
    hsl(0 0% 0% / 0),
    hsl(0 0% 0% / 1) 20%,
    hsl(0 0% 0% / 1) 80%,
    hsl(0 0% 0% / 0)
  );
}

.hero-marquee_content-right.is-marquee-vertical {
  mask-image: linear-gradient(
    var(--mask-direction, to bottom),
    hsl(0 0% 0% / 0),
    hsl(0 0% 0% / 1) 20%,
    hsl(0 0% 0% / 1) 80%,
    hsl(0 0% 0% / 0)
  );
} */

.marquee--reverse .marquee__group {
  animation-direction: reverse;
}

.marquee--vertical {
  --mask-direction: to bottom;
}

.marquee--vertical,
.marquee--vertical .marquee__group {
  flex-direction: column;
}

.marquee--vertical .marquee__group {
  animation-name: scroll-y;
}

.marquee--vertical .hero-marquee_image-wrapper {
  aspect-ratio: 3 / 2;
}

@keyframes scroll-y {
  from {
    transform: translateY(var(--scroll-start));
  }
  to {
    transform: translateY(var(--scroll-end));
  }
}

@keyframes scroll-x {
  from {
    transform: translateX(var(--scroll-start));
  }
  to {
    transform: translateX(var(--scroll-end));
  }
}

@media (prefers-reduced-motion: reduce) {
  .marquee__group {
    animation-play-state: paused;
  }
}

@media screen and (max-width: 991px) {
    .footer_top-wrapper {
        grid-row-gap: 3rem;
        grid-template-columns: 1fr 1fr !important;
    }
.grp-logo-w-store-link{
      display: flex;
    justify-content: space-around;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 2rem;
    gap: 2rem;

      
    }
}



/* for the accordion icon */
.fl_accordion_icon {
  transition: transform 300ms ease;
  transform-origin: center;
}

[fl-accordion-header][aria-expanded="true"] .fl_accordion_icon {
  transform: rotate(180deg);
}



.register-acc-gworkcard{
      display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px;
        justify-content: center;
}

.register-acc-gworkcard-card{
  box-shadow: 0px 4px 15px 0px #00000026;
  background-color: white;
  padding: 25px ;
  width: 100%;
  max-width: 448px;

}

.img-logo-register-acc-gworkcard{
  text-align: center;
}

.heading-register-acc-gworkcard{
  margin-top: 50px;
  margin-bottom: 25px;
  font-family: Poppins;
font-weight: 500;
font-style: Medium;
font-size: 29px;
leading-trim: NONE;
line-height: 125%;
letter-spacing: 0.15px;
vertical-align: middle;
color:  #545454;
}

.p-register-acc-gworkcard{
  font-family: Poppins;
font-weight: 400;
font-style: Regular;
font-size: 12px;
leading-trim: NONE;
line-height: 150%;
letter-spacing: 0.15px;
vertical-align: middle;
color: #545454;
}

.grp-button-register-acc-gworkcard{
margin-top: 100.26px;
margin-bottom: 25px;
    display: flex;
    flex-direction: column;
    align-items: center;

}
.button-register-acc-gworkcard,.button-register-acc-gworkcard-dark{
  padding: 7px;
  width: 100%;
  text-align: center;
}
.button-register-acc-gworkcard-dark{
  background-color: black;
  color: white;
  font-family: Poppins;
font-weight: 400;
font-style: Regular;
font-size: 16px;
leading-trim: NONE;
line-height: 160%;
letter-spacing: 0%;

}

.button-register-acc-gworkcard-outline{
font-family: Poppins;
font-weight: 400;
font-style: Regular;
font-size: 14px;
leading-trim: NONE;
line-height: 140%;
letter-spacing: 0%;
text-decoration: underline;
text-decoration-style: solid;
text-decoration-offset: 0%;
text-decoration-thickness: 0%;

}

@media screen and (max-width: 1100px) {
  .img-register-acc-gworkcard{
    max-width: 552px;
  }
  .register-acc-gworkcard-card{
    max-width: 552px;
  }
}
@media screen and (max-width: 420px) {
  .heading-register-acc-gworkcard{
        font-size: 24px;
  }
}

@media screen and (max-width: 380px) {
  .heading-register-acc-gworkcard{
        font-size: 17px;
  }
}


.disclaimer-grp{
  margin-top: -3rem;
  margin-bottom: 3rem;
}