:root {
--black: #000000;
--white: #FFFFFF;
--cream: #e09e50;
--charcoal: #3C3934;
--yellowwhite: #F7DFC1;
--orange: #CC4D16;
--yellow: #FFC756;
--red: #d62022;
--domine: "Domine";
--font2: "Cabin";
}
		
.clear {
clear:both;
}

img,
img a {
border:none;
max-width:100%;
height:auto;
}

ul {
list-style:none;
margin:0;padding:0;
}

a, a:hover {
-webkit-transition: color 0.2s linear;
   -moz-transition: color 0.2s linear;
					-o-transition: color 0.2s linear;
								transition: color 0.2s linear;
text-decoration:none;
}

* {
margin:0;
padding:0;
}

body, html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: none;
-webkit-font-smoothing: antialiased !important;
font-family:"Cabin", Arial;
background:url(images/bg-music.jpg) bottom center;
background-size:cover;
background-attachment:fixed;
}

#main {
height:100vh;
background:url(images/bg-main.jpg?v=1.01) center center;
background-size:cover;
padding-top:20px;
overflow:hidden;
}

@media all and (max-width:1100px) {
#main {
background:url(images/bg-main.jpg?v=1.01) center center;
}
}

#menu {
border:3px solid;
border-color:var(--cream);
max-width:90%;
border-radius:0px;
margin:0 auto;
padding:14px 30px;
position:relative;
backdrop-filter: blur(3px);
}

#menu a {
color:var(--white);
}

#menu a:hover {
opacity:.8;
transition: opacity 0.2s ease-in-out; 
}

#menu #logo {
float:left;
}

#menu #logo img {
max-height:50px;
display:block;
z-index:999;
position:relative;
}



#menu nav {
position:absolute;
left:0;
right:0;
text-align:center;
font-family:var(--domine);
line-height:50px;
font-weight:700;
text-transform:uppercase;
font-size:23px;
z-index:1;
max-width:auto;
}

#menu nav li {
display:inline-block;
margin:0 10px;
}

@media all and (max-width:1000px) {
#menu {
padding:18px 0 36px 0;
}

#menu #logo {
float:none;
margin:0 auto 20px auto;
}

#menu #logo img {
margin:0 auto;
}

#menu nav {
line-height:100%;
font-size:18px;
}
}

#head-socials {
float:right;
line-height:50px;
}

#head-socials li {
float:left;
color:#FFF;
margin:0 0 0 14px;
font-size:18px;
z-index:999;
position:relative;
}

@media all and (min-width:1000px) {
#head-mobile-socials {
display:none;
}
}

@media all and (max-width:1000px) {
#head-socials {
display:none;
}
}

#head-mobile-socials {
position:absolute;
bottom:40px;
left:0;
right:0;
text-align:center;
z-index:999;
}

#head-mobile-socials ul {
margin:0 auto;
display:inline-block;
text-align:center;
padding:15px 40px;
background:url(images/bg-blue.jpg?v-1.00) bottom center;
border-radius:20px;
}

#head-mobile-socials li {
display:inline-block;
margin:0 6px;
font-size:20px;
}

@media all and (max-width:1000px) {
#head-mobile-socials li {
margin:0 3px;
font-size:18px;
}
}

#head-mobile-socials li a {
color:var(--yellowwhite);
}

#head-mobile-socials li a:hover {
color:#FFF;
}

#main-container {
position:relative;
width:80%;
margin:0 auto;
height:100vh;
}

#main-promo {
position: absolute;
top: 31%;
transform: translateY(-31%);
right:4%;
border:5px solid;
border-color: var(--cream);
border-radius:30px;
padding:10px 50px 20px 50px;
backdrop-filter: blur(3px);
text-align:center;
}

#main-promo #title {
font-size:60px;
font-family:var(--domine);
font-weight:700;
color:var(--white);
text-transform:uppercase;
}

#main-promo #copy {
font-size:21px;
color:var(--white);
text-transform:uppercase;
margin:0 0 15px 0;
font-weight:700;
}

#main-promo #cta a {
background-color:var(--red);
padding:12px 22px;
font-family:var(--domine);
color:#FFF;
text-transform:uppercase;
text-align:center;
font-size:22px;
-webkit-transition: background-color .2s ease;
			-moz-transition: background-color .2s ease;
				-ms-transition: background-color .2s ease;
					-o-transition: background-color .2s ease;
    				transition: background-color .2s ease;
								display:inline-flex;
								align-items:center;
}

#main-promo #cta a:before {
font: var(--fa-font-regular);
content: '\f04b';
padding-right:10px;
font-size:12px;
-webkit-transition: all .2s ease;
			-moz-transition: all .2s ease;
				-ms-transition: all .2s ease;
					-o-transition: all .2s ease;
    				transition: all .2s ease;
}

#main-promo #cta a:hover:before {
padding-right:16px;
color:var(--black);
}

#main-promo #cta a:hover {
background-color:var(--cream);
color:var(--black);
}

@media all and (max-width:1000px) {
#main-promo {
top:42%;
right:0;
left:0;
width:100%;
padding:20px 0 40px 0 !important;
}

#main-promo #title {
font-size:44px;
margin:0 0 8px 0;
}

#main-promo #copy {
font-size:18px;
}
}


/** Tool box **/
#container {
width:80%;
margin:0 auto;
z-index:999;
position:relative;
}

#container.narrow {
width:1100px;
z-index:999;
position:relative;
}

#music,
#tour,
#about {
padding:80px 0;
}

#section-head {
margin:0 auto 30px auto;
BUborder:5px solid;
BUborder-color: var(--yellowwhite);
color:var(--white);
font-family:var(--domine);
font-weight:700;
text-transform:uppercase;
border-radius:20px;
font-size:34px;
line-height:100%;
text-align:center;
display:inline-block;
BUpadding:10px 30px !important;
}


/** Music **/
#music {
position:relative;
}

#music::before {
content: "";
position: absolute;
top: 0; 
left: 0;
width: 100%; 
height: 100%;  
background:url(images/bg-music.jpg?v=1.01) top center repeat;
background-attachment:fixed;
z-index:1;
}

#music #head {
font-family:var(--domine);
font-weight:700;
color:var(--red);
text-transform:uppercase;
text-shadow: 3px 3px 0px var(--black);
font-size:60px;
line-height:60px;
display:inline-block;
padding-right:20px;
}

#music span.outnow {
color:var(--black);
font-size:20px;
font-weight:500;
line-height:80px;
vertfical-align:bottom;
text-transform:uppercase;
display:inline-block;
font-weight:700;
}

#music-items {
display:grid;
grid-template-columns: 1.4fr 2.2fr;
grid-gap:30px;

}

#music #music-img {
margin:0 0 15px 0;
display: flex;
height:500px;
}

#music video {
max-width:100%;
}

#music #music-img img,
#music #music-img video {
display:block;
object-fit:cover;
}

#music-items #cta a {
background-color:var(--white);
padding:12px 22px;
font-family:var(--font2);
font-weight:700;
color:var(--black);
text-transform:uppercase;
text-align:center;
font-size:18px;
-webkit-transition: background-color .2s ease;
			-moz-transition: background-color .2s ease;
				-ms-transition: background-color .2s ease;
					-o-transition: background-color .2s ease;
    				transition: background-color .2s ease;
								display:inline-flex;
								align-items:center;
}

#music-items #cta a:before {
font: var(--fa-font-regular);
content: '\f04b';
padding-right:10px;
font-size:12px;
-webkit-transition: all .2s ease;
			-moz-transition: all .2s ease;
				-ms-transition: all .2s ease;
					-o-transition: all .2s ease;
    				transition: all .2s ease;
}

#music-items #cta a:hover:before {
padding-right:16px;
}

#music-items #cta a:hover {
background-color:var(--black);
color:var(--white);
}










section#music .music-list {
margin:50px 0 0 0;
BUmargin:50px 18% 0 18%;
justify-content:center;
vertical-align:middle;
}

section#music #music-list-video {
float:left;
max-width:30%;
margin-right:4%;
}

@media all and (max-width:1100px) {
section#music .music-list {
margin:50px 0 0 0;
}
}

section#music .music-list ul {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding-left: 0;
  margin: 0;
		padding-top:10%;
		font-weight:700;
text-transform:uppercase;
}

@media all and (max-width:1500px) {
section#music .music-list ul {
padding-top:0%;
}
}

section#music .music-list ul li a {
  text-decoration: none;
  display: grid;
  grid-template-columns: 2vw auto 10vw;
  gap: 4rem;
  padding: 1.2rem 0;
  position: relative;
		font-size:1.3rem;
		
}
@media (max-width: 48em) {
  section#music .music-list ul li a {
    font-size: 1rem;
    grid-template-columns: 5vw auto 12vw;
    gap: 1.3rem;
  }
}
section#music .music-list ul li a span.listen-now {
  transition: all 300ms;
		text-align:right;
}

section#music .music-list ul li a span.listen-now:before {
font: var(--fa-font-regular);
content: '\f04b';
padding-right:10px;
font-size:0.7rem;
vertical-align:middle;
padding-bottom:4px;
-webkit-transition: all .2s ease;
			-moz-transition: all .2s ease;
				-ms-transition: all .2s ease;
					-o-transition: all .2s ease;
    				transition: all .2s ease;
}

section#music .music-list ul li a:hover span.listen-now:before {
padding-right:16px;
color:var(--black);
}

@media (max-width: 1100px) {
  section#music .music-list ul li a span .now {
    display: none;
  }
		
		section#music #music-list-video {
		display:none;
		}
		
		section#music .music-list ul {
		padding-top:0;
		}
		
		
}
section#music .music-list ul li a,
section#music .music-list ul li a span.album-title {
color:var(--white);
}
section#music .music-list ul li a span.title {
color:var(--white);
}
section#music .music-list ul li a:hover {
color:var(--black);
}
section#music .music-list ul li a:hover span {
color:var(--black);
}






















/** Tour **/
#tour {
position:relative;
background:url(images/bg-cream.jpg) top left repeat fixed;
}

#tour #container {
text-align:center;
position:relative;
z-index:999;
}

@media all and (max-width:1000px) {
#tour #container {
max-height:500px;
padding-right:15px;
overflow:auto;
}
}

#tour #dates {
text-align:left;
}

.seated-event-row {
border-top:1px solid;
border-bottom:1px solid !important;
border-color: var(--white) !important;
padding:20px 20px 10px 20px !important;
line-height:100% !important;
background:rgb(0,0,0,.2) !important;
color:var(--white) !important;
font-family:var(--font2);
}

.seated-event-row:hover {
background:rgb(0,0,0,.2) !important;
}

.seated-event-date-cell,
.seated-event-venue-name,
.seated-event-venue-location {
font-size:18px;
line-height:140%;
}

.seated-event-date-cell {
font-weight:700;
}

.seated-event-details-cell {
padding:0 0 20px 0;
}

.seated-event-venue-name {
padding:0 0 6px 0;
font-weight:700;
}

.seated-event-venue-location {
font-weight:700;
}

.seated-event-link-cells {
}

.seated-event-details-cell {
opacity:1 !important;
display:inline-block !important;
color:#e2d9bf;
font-size:15px;
}

.seated-event-link-cell {
margin:0 auto !important;
}

.seated-event-link1, .seated-event-link1:visited, 
.seated-event-link2, .seated-event-link2:visited {
color: var(--cream) !important;
border:0 none !important;
background:0 none !important;
border-radius:0 !important;
display: block !important;
font-size: 23px !important;
margin:0 auto !important;
overflow:visible !important;
padding:0 !important;
width:100% !important;
min-width:10px !important;
font-weight:700;
}

.seated-event-link:hover {
color: var(--white) !important;
}

.seated-follow-box,
.seated-events-table > div:last-child {
display:none !important;
}




/** Videos **/
#videos {
background:url(images/bg-blue.jpg) top left repeat fixed;
position:relative;
padding:80px 0;
}

#videos #section-head {
margin:0 auto 50px auto;
BUborder:5px solid;
BUborder-color: var(--white);
color:var(--white);
}

#videos #container {
text-align:center;
}

.slider {
float:right;
width: 95%;
}

@media all and (max-width:1000px) {
.slider {
width:100%;
float:none;
}
}

.slick-slide {
margin: 0px 20px;
}

.slick-slide video {
max-width:100%;
margin-bottom:7px;
}

.slick-slide img {
width: 100%;
display:block;
margin:0 0 15px 0;
}
				
.slick-slide .title {
float:left;
color:var(--cream);
font-family:var(--domine);
font-size:14px;
font-weight:700;
text-transform:uppercase;
}

.slick-slide .title a {
color:var(--yellowwhite);
}

.slick-slide .title a:hover {
color:var(--yellow);
}

.slick-slide .btn {
float:right;
color:var(--cream);
font-family:var(--domine);
font-size:14px;
line-height:100%;
text-transform:uppercase;
}

.slick-slide .btn a {
color:var(--yellowwhite);
display:inline-flex;
align-items:center;
}

.slick-slide .btn a:before {
font: var(--fa-font-regular);
content: '\f04b';
padding-right:10px;
font-size:10px;
-webkit-transition: all .2s ease;
			-moz-transition: all .2s ease;
				-ms-transition: all .2s ease;
					-o-transition: all .2s ease;
    				transition: all .2s ease;
}

.slick-slide .btn a:hover:before {
padding-right:16px;
color:var(--yellow);
}

.slick-slide .btn a:hover {
color:var(--yellow);
}

.slick-prev:before,
.slick-next:before {
color: black;
}

.slick-slide {
transition: all ease-in-out .3s;
opacity: .2;
}
    
.slick-active {
opacity: 1;
}
				


/** About **/
#about {
position:relative;
}

#about::before {
content: "";
position: absolute;
top: 0; 
left: 0;
width: 100%; 
height: 100%;  
background:url(images/bg-music.jpg?v=1.01) top center repeat;
background-attachment:fixed;
z-index:1;
}

#about #section-head {
margin:0 auto 30px auto;
BUborder:5px solid;
BUborder-color: #b12630;
color:var(--white);
z-index:999;
position:relative;
}

#about #col-1 {
float:left;
width:40%;
z-index:999;
position:relative;
}

#about #col-2 {
float:right;
width:55%;
padding-top:10px;
z-index:999;
position:relative;
}

#about #bio {
font-size:17px;
line-height:170%;
color:var(--white);
}


/** Footer **/
footer {
padding:60px 0;
position:relative;
background:url(images/bg-blue.jpg) top left repeat fixed;
}

#email-signup {
width:100%;
margin:0 auto 50px auto;
}

#email-signup #head {
font-family:var(--domine);
font-size:34px;
font-weight:700;
margin:0 0 30px 0;
color:var(--cream);
text-transform:uppercase;
z-index:999;
position:relative;
text-align:center;
}



#footer-socials {
margin:0 auto 30px auto;
text-align:center;
z-index:999;
position:relative;
}

#footer-socials li {
display:inline-block;
margin:0 5px;
font-size:17px;
}

#footer-socials a {
color:var(--cream);
}

#footer-socials a:hover {
color:var(--white);
}

#copyright {
text-align:center;
color:var(--white);
font-size:14px;
z-index:999;
position:relative;
}









.come-in {
  /*transform: translateY(100px);*/
  transform: translate3d(0, 100px, 0);
  animation: come-in 0.8s ease forwards;
		animation-delay:.2s;
}
.come-in:nth-child(odd) {
  animation-duration: 0.6s;
}
.already-visible {
  /*transform: translateY(0);*/
  transform: translate3d(0, 0, 0);
  animation: none;
}

@keyframes come-in {
  to { transform: translate3d(0, 0, 0); }
}




@media all and (min-width:1000px) {
#about-photo {
display:none;
margin:0;
}
}





@media all and (max-width:1110px) {
#container,
#container.narrow {
width:80%;
margin:0 10%;
}
}

@media all and (max-width:1000px) {
.seated-event-row {
background:rgb(0,0,0,.4) !important;
}

#music-items {
display:grid;
grid-template-columns: 1fr;
grid-gap:30px;
}

#music #music-img {
margin:0 0 10px 0;
display: block;
height:auto;
}

#music #music-img img {
display:block;
}

#music-items #cta a {
display:block;
}

.slick-prev,
.slick-next {
position: absolute;
top: 40%;
}

#about #col-2 {
width:100%;
float:none;
padding:0;
}

#about-photo {
margin:0 0 20px 0;
}

#about #col-1 {
display:none;
}

#about #bio {
font-size:16px;
}
}