body {
    background: #00517e;
    color: #ddd;
}

.bg-dark {
  --bs-bg-opacity: 1;
  background-color: none !important;
}

.hero-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.bg-dark {
  --bs-bg-opacity: 1;
  background-color: #0824ef !important;
}

.hero-slide {
    height: 70vh; /* or 700px if you prefer */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    display: flex;
    align-items: center;
}
.hero-slide .overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1;
}
.hero-content {
    position: relative;
    z-index: 2;
}

.hero-content h1,
.hero-content p {
    color: #fff;
}
.hero-slider .owl-nav {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 40px;
    pointer-events: none;
    z-index: 10;
}

.hero-slider .owl-nav button {
    pointer-events: all;
    width: 55px;
    height: 55px;
    border-radius: 50% !important;
    background: rgba(255,255,255,.2) !important;
    color: #fff !important;
    backdrop-filter: blur(5px);
    transition: .3s;
}

.hero-slider .owl-nav button:hover {
    background: rgba(255,255,255,.4) !important;
}

.hero-slider .owl-dots {
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.hero-slider .owl-dot span {
    width: 12px;
    height: 12px;
    margin: 5px;
    background: rgba(255,255,255,.4) !important;
    transition: .3s;
}

.hero-slider .owl-dot.active span {
    background: #fff !important;
    transform: scale(1.2);
}

.hero-content {
    padding: 120px 0;
}

.hero-content h1 {
    margin-bottom: 1rem;
}

.hero-content p {
    font-size: 1.25rem;
    max-width: 700px;
    margin: 0 auto;
}

.hero {
    background: #1a1a1a;
    min-height: 40vh;
    display: flex;
    align-items: center;
}

.card {
    transition: transform .25s ease;
    background: #0f3c54;
    color: white;
}

.card:hover {
    transform: translateY(-4px);
}

.card-img-sq {
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    width: 101%;
    height: 12rem;
    object-fit: cover;
}

.card-img-top {
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    width: 100%;
    height: 270px;
    object-fit: cover;
}

.card-img-full {
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.square-nav-image {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
}

.nav-card {
    max-width: 15rem;
}
.filter {
  position: relative;
  -webkit-filter: brightness(105%) hue-rotate(350deg);
  filter: brightness(105%) hue-rotate(350deg);
}
.filter::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  pointer-events: none;
  mix-blend-mode: darken;
  background: -webkit-linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0));
  background: linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0));
}

.navbar-brand img {
    max-height: 90px;
    width: auto;
}

.table {
    color: white;
}

.az-index {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    padding: 10px 0;
}

.music-links {
    display: flex;
    gap: 15px;          /* spacing between icons */
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}

.music-links li {
    margin: 0;
}

.spotifylink a:link {color:#1DB954; text-decoration:none; font-size: 1.5rem;} /* unvisited link */
.spotifylink a:visited {color:#1DB954; text-decoration:none; }  /* visited link */
.spotifylink a:hover {color:#84c1f0; text-decoration:none; }  /* mouse over link */
.spotifylink a:active {color:#1DB954; text-decoration:none; }  /* selected link */ 

.applelink a:link {color:#FF4E6B; text-decoration:none; font-size: 1.8rem;} /* unvisited link */
.applelink a:visited {color:#FF4E6B; text-decoration:none; }  /* visited link */
.applelink a:hover {color:#84c1f0; text-decoration:none; }  /* mouse over link */
.applelink a:active {color:#FF4E6B; text-decoration:none; }  /* selected link */ 

.bandcamplink a:link {color:#1da0c3; text-decoration:none; font-size: 1.8rem;} /* unvisited link */
.bandcamplink a:visited {color:#1da0c3; text-decoration:none; }  /* visited link */
.bandcamplink a:hover {color:#84c1f0; text-decoration:none; }  /* mouse over link */
.bandcamplink a:active {color:#1da0c3; text-decoration:none; }  /* selected link */ 


.nav-search input {
    width: 0;
    opacity: 0;
    padding: 0;
    border: none;
    transition: all .3s ease;
}

.nav-search.active input {
    width: 220px;
    opacity: 1;
    padding: .375rem .75rem;
    border: 1px solid #ccc;
}

.nav-search button {
    background: none;
    border: 0;
    cursor: pointer;
    color:red;
}

.hero-footer {

    min-height: 21vh;
    display: flex;
    align-items: center;
     background-image: url('../img/channels4_banner.jpg');
  background-repeat: no-repeat;
  background-size:contain;
  background-position: center center;
  background-attachment: scale;
  position: relative;
}

.upperfooter {
     /*min-height: 100vh;*/
  background-image: url('../img/channels4_banner.jpg');
  background-repeat: no-repeat;
  /*background-size:contain;*/
  background-position: bottom center;
  background-attachment: fixed;
  position: relative;



}

footer {
    margin-top: 0px;
}