a{
    text-decoration:none
    }
.btn2 {
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
    --bs-btn-font-family: ;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 0.5px;
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
    background-color: var(--bs-btn-bg);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.offcanvas{
    opacity: 0.90;    
    }
    .service-inner{
        z-index: -9999;
    }
/*-- FLIP CARDS --*/    
.card {
  width: 300px;
  height: 300px;
  margin: 1rem auto;
  perspective: 1000px;
  cursor: pointer;
  border-width: medium;
}

.card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.card:hover .card-inner {
  transform: rotateY(180deg);
}

.card-front,
.card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-back{
  flex-direction: column;
}

.card-front {
  background: transparent;
  border: none;
}

.card-back {
  background: var(--bs-secondary-bg);
  color: var(--bs-body);
  transform: rotateY(180deg);
}
/* Apply hover rotation only on hover-capable devices */
@media (hover: hover) {
  .rotating-element:hover {
    transform: rotate(10deg);
    transition: transform 2s ease-in-out;
  }
}
#us-map{
  display: block;
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
path:hover, circle:hover {
  stroke: #002868 !important;
  stroke-width:2px;
  stroke-linejoin: round;
  fill: #002868 !important;
  cursor: pointer;
}
#path67 {
  fill: none !important;
  stroke: #A9A9A9 !important;
  cursor: default;
}
#info-box {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  border: 2px solid #BF0A30;
  border-radius: 5px;
  padding: 5px;
  font-family: arial;
}
/*--------Radio Station Search--------*/
.station-card { transition: transform 0.2s; }
        .station-card:hover { transform: translateY(-5px); }
        .hidden { display: none !important; }
/* Styling for the toggle to make it look like a cohesive switch */
    #viewToggle {
        background-color: var(--bs-body-bg);
        padding: 5px;
        border-radius: 50px;
        border: none;
    }
    #viewToggle .nav-link {
        border-radius: 50px;
        color: #c3c3c3;
        font-weight: 500;
        transition: all 0.3s ease;
    }
    #viewToggle .nav-link.active {
        background-color: #0d6efd;
        color: white;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    }
    /* Smooth transition between views */
    .tab-pane.fade {
        transition: opacity 0.15s linear;
    }
/* Consistent Radio Finder artwork, including externally hosted images. */
#grid-view .card-front > img {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
}

#list-view .station-item .flex-shrink-0 > img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    object-position: center;
}

/* Inline List playback */
#stationList .station-list-details { min-width: 0; overflow-wrap: anywhere; }
#stationList .station-list-player { flex: 0 0 280px; margin-left: 16px; }
#stationList .station-list-player > div { margin-bottom: 0 !important; }
@media (max-width: 767px) {
  #stationList .station-item { flex-wrap: wrap; gap: 12px; }
  #stationList .station-item .flex-shrink-0 { width: 64px !important; margin-right: 0 !important; }
  #stationList .station-list-details { flex-basis: calc(100% - 80px); }
  #stationList .station-list-player { flex: 1 1 100%; margin-left: 0; }
  #stationList .spm-station-controls { width: 100%; }
}