:root {
  --primary-color: #646cff;
  --highlight-color: rgba(255, 255, 255, 0.08);
  --background-color: #000;
  --text-color: rgba(255, 255, 255, 0.87);
  --border-color: rgba(255, 255, 255, 0.05);
  --transition-duration: 0.4s;
  --transition-timing: cubic-bezier(0.4, 0, 0.2, 1);
  --tabs-gap: 0.5rem;
  --tab-padding: 0.75rem 1.25rem;
  --tab-border-radius: 8px;
  --tab-font-size: 1rem;
  --tab-font-weight: 500;
  --tabs-nav-padding: 0.375rem;
}
a.select_loc {
    background: #6a2875;
    color: #fff !important;
    border-radius: 2px;
    padding: 5px;
}
a.select_loc:hover {
    background: #039855;
    color: #fff;
    border-radius: 2px;
    padding: 5px;
}
.tabs { width: 100%;}
.tabs-nav {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: var(--tabs-gap);
  background: rgb(3 152 85);
  padding: var(--tabs-nav-padding);
  border-radius: var(--tab-border-radius);
  margin-bottom: 2rem;
  isolation: isolate;
}
.tab-button {
  flex: 1;
  all: unset;
  position: relative;
  padding: var(--tab-padding);
  font-size: var(--tab-font-size);
  font-weight: var(--tab-font-weight);
  color: var(--text-color);
  border-radius: var(--tab-border-radius);
  cursor: pointer;
  transition: color var(--transition-duration) var(--transition-timing);
  text-align: center;
  white-space: nowrap;
  z-index: 1;
}
.tab-button:hover {color: #fff;}
.tab-button[aria-selected="true"] {color: #000;}
.tabs-indicator {
  position: absolute;
  top: var(--tabs-nav-padding);
  bottom: var(--tabs-nav-padding);
  left: 0;
  border-radius: calc(var(--tab-border-radius) - 2px);
  background: #fff;
  transition: 
    transform var(--transition-duration) var(--transition-timing),
    width var(--transition-duration) var(--transition-timing);
  pointer-events: none;
  z-index: 0;
  box-shadow: 
    0 0 0 1px var(--border-color),
    0 4px 12px rgba(0, 0, 0, 0.1);
  will-change: transform, width;
}
.tab-panel {
  padding: 2rem;
  background: #fff;
  border-radius: var(--tab-border-radius);
  display: none;
  transform-origin: top;
  animation: slideIn var(--transition-duration) var(--transition-timing);
  box-shadow: 
   0 0 0 1px rgb(255 255 255 / 0%), 0 4px 12px rgb(231 227 227 / 35%);
}
.tab-panel[aria-hidden="false"] {display: block;}
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.tab-button:focus-visible {
  outline: 2px solid var(--primary-color);
  outline-offset: 2px;
}
.heading_tab {
  margin-bottom: 1rem;
  font-size: 40px;
  color: #6a2875;
  font-weight: 600;
}
.tab-panel p a{
  line-height: 1.6;
  opacity: 0.9;
  color: #262424;
  text-decoration: none;
  font-size: 18px;
}
.card-div h4 {
    font-size: 22px !important;
    font-weight: 600;
    color: #6c256f !important;
}
@media all and (max-width: 768px) {
    .title-heading h3 { font-size: 26px;}
}
@media all and (max-width: 767px) {
    .tab-button {
        padding: 10px;
    }
    .tab-panel p a{
      font-size: 16px;
    }
}
@media all and (max-width: 575px) {
    .tab-button {
        padding: 10px;
        letter-spacing: -2px;
        font-size: 12px;
    }
    .justify_left {justify-content: left !important;}
}