@import url('https://fonts.googleapis.com/css2?family=MonteCarlo&family=Special+Elite&family=Teko:wght@300..700&display=swap');
:root {
    --color0: #121820;
    --color1: #e4c06e;
    --color2: #c98b34;
}
body {
    background-color: var(--color0);
    color: lightgray;
}
a {
    color: var(--color1);
    text-decoration: none;
}
a:hover {
    color: white;
}
.bg-black {
    background-image: url('../images/background.jpg');
    background-size: cover;
}
.teko-regular {
    font-family: "Teko", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
.montecarlo-regular {
    font-family: "MonteCarlo", cursive;
    font-weight: 400;
    font-style: normal;
}
.special-elite-regular {
    font-family: "Special Elite", system-ui;
    font-weight: 400;
    font-style: normal;
}
.btn-gradient {
    background-image: linear-gradient(to right, var(--color1), var(--color2));
}
.heading {
    font-family: "MonteCarlo", cursive;
    font-weight: 500;
    font-style: normal;
    font-size: 54px;
    color: var(--color1);
}
.lyrics {
    font-family: "Special Elite", system-ui;
    font-weight: 400;
    font-style: normal;
    /*column-count: 2;*/
    letter-spacing: 1px;
    line-height: 1;
}
/*@media screen and (max-width: 767px) {
    .lyrics {
        column-count: 1;
    }
}*/
.lyrics h3 {
    line-height: 1.5em;
    font-weight: 600;
    font-size: 1.1em;
}
.lyrics p {
    margin-bottom: .5em;
}
.sb-title h1 {
    width: 100%;
    height: 0;
    background-image: url('../images/sb-logo.png');
    background-repeat: no-repeat;
    background-size: 100%;
    padding-top: 37%;
    overflow: hidden;
}
.sb-sub-title {
    font-family: "Teko", sans-serif;
    font-weight: 400;
    font-size: 42px;
    text-transform: uppercase;
    margin: 0;
    line-height: 1;
    color: white;
}
@media screen and (max-width: 767px) {
    .sb-sub-title {
        font-size: 36px;
    }
}
/*.sb-header-credits {
    font-family: "Teko", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 1.3em;
    line-height: 1em;
}*/
.sb-header-lyrics {
    font-family: "Special Elite", system-ui;
    font-weight: 400;
    font-style: normal;
    font-size: 2em;
    line-height: 1em;
    color: var(--color2);
}
.sb-header-lyrics p:nth-child(1) {
    color: var(--color1);
}
.sb-header {
    background-image: url('../images/photo1.jpg');
    background-size: cover;
    background-position: left bottom;
    height: 50vh;
}
@media screen and (max-width: 999px) {
    .sb-header {
        height: 30vh;
    }
}
.sb-spacer {
    background-image: url('../images/photo2b.jpg');
    background-size: cover;
    background-position: center;
    height: 60vh;
}
@media screen and (max-width: 999px) {
    .sb-spacer {
        height: 30vh;
    }
}
.sb-footer {
    background-image: url('../images/photo3.jpg');
    background-size: cover;
    background-position: right bottom;
    height: 40vh;
}
@media screen and (max-width: 999px) {
    .sb-footer {
        height: 30vh;
    }
}

.curb-logo {
    display: inline-block;
    width: 120px;
}
.curb-logo a {
    display: block;
    overflow: hidden;
    height: 0;
    width: 100%;
    padding-top: 90%;
    background-image: url('../images/curb-logo.png');
    background-size: 100%;
    background-repeat: no-repeat;
}
.sb-copyright {
    font-family: "Teko", sans-serif;
    font-size: 15pt;
    font-weight: 300;
    letter-spacing: 1px;
}
.btn-audio {
    font-family: "Teko", sans-serif;
    background-color: #000;
    color: #fff;
    border: 1px solid #121820;
    text-transform: uppercase;
    border-radius: 0;
}
.btn-audio:hover {
    background-color: #222;
}