@import url("https://fonts.googleapis.com/css2?family=Rajdhani:wght@600;700&family=Roboto+Condensed:wght@400&display=swap");

.theme-062 {
  --bio-font-heading: "Rajdhani", sans-serif;
  --bio-font-body: "Roboto Condensed", sans-serif;
  --bio-page-bg: #111111;
  --bio-card-bg: #1c1c1c;
  --bio-text-primary: #ffffff;
  --bio-text-secondary: #cccccc;
  --bio-text-muted: #666666;
  --bio-card-shadow: 0px 0px 0px 1px #2a2a2a;
  --bio-avatar-shadow: none;
  --bio-btn-bg: #ffffff;
  --bio-btn-text: #111111;
  --bio-btn-shadow: none;
  --bio-input-bg: #1a1a1a;
  --bio-input-border: #333333;
  --bio-input-text: #ffffff;
  --bio-input-placeholder: #555555;
  --bio-icon-social: #ffffff;
  --bio-link-icon-bg: #ffffff;
  --bio-link-icon-stroke: #111111;
  --bio-appt-icon-bg: #222222;
  --bio-appt-icon-stroke: #ffffff;
  --bio-tagline-text: #888888;
  --bio-tagline-border: #ffffff;
  --bio-icon-secondary: #ffffff;
  --bio-rupa-text: #444444;
  --bio-radius-card: 0px;
  --bio-radius-input: 0px;
  --bio-radius-btn: 0px;
  --bio-radius-avatar: 0px;
  --bio-radius-thumbnail: 0px;
  --bio-stripe-bg: #1a1a1a;
  --bio-stripe-border: #333333;
  --bio-stripe-text: #ffffff;
  background-image: linear-gradient(
    130deg,
    #111111 0%,
    #252530 25%,
    #111111 50%,
    #1a1a28 75%,
    #2a2a2a 100%
  );
  background-size: 200% 200%;
  background-position: 0% 0%;
  animation: none;
}

@supports (animation-timeline: scroll()) {
  .theme-062 {
    animation: theme062-scroll 1s linear both;
    animation-timeline: scroll();
    animation-range: 0% 100%;
  }

  .theme-062 .bio-scroll-container {
    animation-timeline: scroll(self) !important;
  }

  @keyframes theme062-scroll {
    from {
      background-position: 0% 0%;
    }
    to {
      background-position: 100% 100%;
    }
  }
}