/* 
___  ___  __  __ ___    ___ ___ ___ _____ ___
/ __|/ _ \|  \/  | __|  / __|_ _| __|_   _/ __|
\__ \ (_) | |\/| | _|  | (_ || || _|  | | \__ \
|___/\___/|_|  |_|___|  \___|___|_|   |_| |___/

2026 refresh

#faf7f0 off-white 
#000 black 
#fff2a5 yellow 
#586074 gray/blue 
#fb763a orange 

*/

 html {
     scroll-padding-top: 100px;
}

body {
    margin: 0px;
    background: #000;
    color: #faf7f0;
    font-family: "Gothic A1", sans-serif;
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/band-cats-1600-screened.jpg) no-repeat center center fixed; background-color: #000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow-x: hidden;     
}

/* fixed-top */

body {
    padding-top: 5.5rem;
}

.btn
{   
    text-transform: uppercase;
}

.navbar {
    background: #000;
    border-bottom:1px solid #faf7f0;
    --bs-navbar-brand-color: #faf7f0;
    --bs-navbar-brand-hover-color: #fff2a5;
    --bs-navbar-color: #faf7f0;
    --bs-navbar-hover-color: #fff2a5;
    --bs-navbar-active-color: #fff2a5;
}

.navbar-brand {
    font-family: "Monofett", monospace;
    font-weight: 400;
    font-style: normal;
    font-size: 2.25rem;
    letter-spacing:2px;
    color: #faf7f0;    
}

.nav-link {
    color: #faf7f0;
    margin-top:7px;
}

.nav-link:hover {
    color: #fff2a5;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(250, 247, 240, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

 .navbar-toggler {
	border-color: rgba(250, 247, 240, 0.5);
}

/* bootstrap overrides */

 h1,h2 {
    text-transform: uppercase;

}
 h3 {
    line-height:1rem;
 }



/* index page hero area */

.card {
    background: rgba(88, 96, 116, 0.5);
}

 .card-title a {
    color: #faf7f0;
    text-decoration: none;
    font-size: 1rem;
}
 .card-title a:hover,
 .card-title a:focus-visible {
    color: #fff2a5;
}
 .section-header {
    border-top: 3px solid #faf7f0;
    border-bottom: 1px solid #faf7f0;
    padding-top: 1rem;
    padding-bottom: .3rem;
}
 .showlisting {
    border-bottom: 1px solid #586074;
}



 footer {
    margin-top: 2rem;
     background: #000;
     border-top: 2px solid #586074;
    font-size: 1rem;
}
 footer h2 {

     text-transform: uppercase;
    margin-top: 2rem;
}
 footer .btn {
    margin-top: 1rem;
    margin-bottom: 1rem; 
    margin-right: .2rem;
    font-size: .8rem;
}
 #band {
    background: #586074;
}

/* album pages */

.album-page-header {
	margin-bottom: 1rem;
}
#album-hero h1 {
     text-decoration:none;
     border: none;
     font-size: 2.25rem;
     margin: 0;
     padding: 0;
     margin-top: .5rem;
}
.service-listing {
	border-bottom: 2px solid #000; background:#faf7f0;
}

.streaming-links li + li {
    border-top: 1px solid #586074;
}
.streaming-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 0;
    text-decoration: none;
}
/* images carry width/height attributes (to reserve space while loading); let CSS widths scale them */
img[height] {
    height: auto;
}
.streaming-link img {
    max-width: 150px;
    height: auto;
}
.streaming-link:hover .btn,
.streaming-link:focus-visible .btn {
    color: #fff2a5;
    border-color: #fff2a5;
}

/* media queries */

.btn-primary {
    --bs-btn-bg: #2f5fd0;
    --bs-btn-border-color: #2f5fd0;
    --bs-btn-hover-bg: #264fae;
    --bs-btn-hover-border-color: #264fae;
    --bs-btn-active-bg: #264fae;
    --bs-btn-active-border-color: #264fae;
    --bs-btn-focus-shadow-rgb: 47, 95, 208;
}

.btn-secondary {
    --bs-btn-bg: transparent;
    --bs-btn-color: #faf7f0;
    --bs-btn-border-color: #586074;
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-color: #fff2a5;
    --bs-btn-hover-border-color: #fff2a5;
    --bs-btn-active-bg: transparent;
    --bs-btn-active-color: #fff2a5;
    --bs-btn-active-border-color: #fff2a5;
    --bs-btn-focus-shadow-rgb: 255, 242, 165;
}



 @media (min-width: 992px) {

#hero h2 {
    font-size:4rem;

}

}
/* dated content (shows, release cards, hero) is hidden with the hidden attribute; beat Bootstrap's d-flex */
[hidden] {
    display: none !important;
}