:root {
	--ltblue:#d7ece5;
	--whiteish: hsla(162, 10%, 97%,.66);
	--whiteio: hsl(162,10%,97%);
	--white: hsl(162,0%,100%);
	--text:#060606;
	--rose: #fa62a3;
	--darkrose: #7d4773;
	--teal: #388b73;
	--leather: #5c3f3a;
	--brass: hsl(49, 27%, 40%);
	--lightbrown: hsl(10, 48%, 68%);
	--dim: rgba(0,0,0,.33);
	--lessdim: rgba(0,0,0,.16);
	--babyblue:  #D7ECE5;
	--serif: 'Baskervville',serif;
	--sans: 'Libre Franklin',sans-serif;
	--branding: 'ColumbiaTitling',serif;
}

@keyframes slideUp {
	0% {
		transform: translateY(20%);
		opacity: 0;
	}
	100% {
		transform: translateY(0%);
		opacity: 1;
	}
}

body {
	color:var(--text);
	font-size:16px;
	line-height:1.45;
	text-align:center;
	font-family:var(--serif);
	font-weight: 200;
	margin:0;
	padding:0;
	background: url(layout/hummingbirdfade.png) center center repeat fixed var(--whiteio);
	background-size: 33vw auto;
}

#container {
	position:relative;
	top:0;
	left:0;
	width:100%;
	padding:0;
	margin:0;
	text-align: center;
	background: transparent;
}

header {
	width:100vw;
	position:relative;
	top:0;
	left:0;
	font-size:1em;
	height:12em;
	display:block;
	text-align:center;
	margin:0;
	padding:0;
	font-family:var(--branding);
	background:var(--babyblue);
	background-size:cover;
}

.homepage_page header {
	height: 40vw;
}

header .headergraphic {
	position: relative;
	top: 0;
	margin: 0 5vw;
	padding: 0;
	width: 90vw;
	height:calc(100% - 2em);
	background-image: url(layout/humminbird-nobackground.png);
	background-repeat: no-repeat;
	background-color: var(--babyblue);
	background-position: 70% 1em;
	background-attachment: fixed;
	background-size: auto 9em;
}

.homepage_page header .headergraphic {
	background-size: auto 35vw;
	background-position: 90% 2.5vw;
}

header a#site_logo {
	position:fixed;
	top:2em;
	left: 0;
	display:block;
	font-size:2.85em;
	width:92%;
	height:auto;
	font-weight:400;
	line-height:1;
	color:var(--text);
	text-align: center;
	margin:0;
	padding:0;
	letter-spacing:.066em;
}

.homepage_page header a#site_logo {
	top: 22vw;
	font-size:3.33vw;
	width:90%;
}

a#hamburger {
	background:transparent;
}

a#hamburger .hlines {
	background:var(--darkrose);
}

nav {
	position:absolute;
	bottom:0;
	left:0;
	font-size:1rem;
	display:block;
	width:100%;
	margin:0;
	padding:0;
	height:2rem;
	text-align:left;
	font-family: var(--sans);
	letter-spacing:.125em;
	background:var(--text);
	z-index:10;
}

header.fixie nav {
	position:fixed;
	top:0;
	z-index:999;
	background:var(--text);
}

header.fixie nav #homepage_nav {
	display:inline-block;
}

nav ul {
	position:relative;
	width:100%;
	max-width:70rem;
	margin:0 auto;
	padding:0;
	text-align: center;
	background:transparent;
	height:2rem;
}

nav ul li {
	position:relative;
	display: inline-block;
	text-align:left;
	list-style:none;
	margin:0!important;
	padding:0;
	height:2rem;
	width:auto;
	vertical-align:bottom;
}

nav ul li a {
	position:relative;
	display:inline-block;
	color:var(--whiteio);
	font-size:1rem;
	line-height:2rem;
	height:2rem;
	width:auto;
	font-weight:600;
	text-transform: uppercase;
	padding:0 1rem 0 0;
	margin:0;
}

nav ul li a span {
	font-size:1.125em;
	letter-spacing: 0.066em;
}

#social_nav {
	position: absolute;
	top: 1em;
	right: 0;
	width: 4em;
	height: auto;
	background: var(--text);
	border-radius: .25em 0 0 .25em;
}

.homepage_page #social_nav {
	top: 40vh;
}

#social_nav a {
	float: left;
	font-size: 1rem;
	line-height: 1;
	padding: 0;
	margin: .5em;
	width: 1em;
	height: 1em;
	color: var(--ltblue);
}

#social_nav a.icontiktok {
	background: url(layout/tiktok.svg) center bottom no-repeat transparent;
	background-size: 1em auto;
}

nav ul li a:hover,nav ul li.lit a {
	color:var(--rose);
}

nav ul li ul.drop {
	position:absolute;
	top:2rem;
	left:-1em;
	font-size: .75em;
	display:none;
	min-width:30em;
	width:auto;
	height:auto;
	text-align: left;
	z-index:9999;
}

nav ul li ul.drop li {
	font-size:.75rem;
	display:block;
	float:none;
	clear:both;
	width:100%;
	padding:0;
	margin:0;
	height:auto;
	text-align:left;
	line-height:1.25;
	overflow:hidden;
}

nav ul li ul.drop li a {
	height: auto;
	font-size: 1rem;
	line-height: 1.2;
	padding:.5em .66em;
	display:block;
	color:var(--whiteio);
	background:var(--text);
}

nav ul li ul.drop li a span {
	font-size: 1em;
}

nav ul li ul.drop li a:hover {
	color: var(--text);
	background:var(--whiteio);
}

nav ul li:hover ul.drop {
	display:block!important;
}

#main {
	position:relative;
	width: calc(100% - 2em);
	max-width:70rem;
	display:block;
	height:auto;
	min-height: 100vh;
	background:var(--white);
	margin:0 auto;
	padding:2em;
	text-align:left;
	z-index:0;
}

.slab_signup_form {
	position: relative;
	top: 3em;
	min-height: 10em;
	padding-bottom: 4em;
	animation: slideUp;
	animation-timeline: view();
	animation-range: 0% 50%;
}

#main .story,
#latestnewstitle {
	animation: slideUp;
	animation-timeline: view();
	animation-range: 0% 50%;
}

#main p {
	color:#3b4246;
	font-size:1em;
	line-height:1.45;
	margin-bottom:1em;
}

.songs_page #main p {
	margin-bottom: .125em;
}

#mainbox,#menubox,.fullbox #mainbox,.fullbox #menubox {
	width: calc(100% - 2em);
	max-width: 70rem;
	margin: 0 auto;
	font-size:1em;
	font-weight:400;
}

#mainbox .storyp {
	margin:0 0 3em;
}

#searchbox {
	display:none;
}

#mainbox ul {
	font-size:1em;
	margin:0;
	padding:0;
}

#main h1,#main h2,#main h3,#main h4 {
	color:var(--darkrose);
	font-size:2em;
	font-weight:600;
	font-family:var(--sans);
	letter-spacing:0;
	margin-bottom:.5em;
}

#main h2 {
	font-size: 1.75em;
}

#main h2.category {
	color:var(--darkrose);
}

#main h3 {
	font-size:1.5em;
	color:var(--leather);
}

#main h3.thedate {
	font-size: 1.125em;
	color: var(--brass);
}

#main h4 {
	font-size:1.25em;
	color:var(--teal);
}

#main h4#latestnewstitle {
	position: relative;
	top: 0;
	left: 0;
	font-family: var(--branding);
}

.featured_box .featured_thumb {
	background-position: center top;
}

.product_page h1.category {
	display:none;
}

.product_page #mainbox h4.purchasefrom {
	margin:.5em 0 .25em 0;
	color: var(--darkrose);
	font-size: .9em;
	text-transform: uppercase;
}

.multilinks img {
	display:none;
}

.product_page.intro .introentry a.thumb { 
	background-position: center center; 
	background-repeat: no-repeat; 
	background-color: transparent;
	background-size: contain;
}

.product_page #mainbox ul.multilinks {
	display: block;
	margin:0 0 2em 0;
	padding:0;
	width:100%;
	text-align: center;
}

.product_page #mainbox ul.multilinks li {
	display: inline-block;
	padding:0;
	width:calc(33.33% - 2em);
	height: auto;
	margin: .5em 1em;
}

.product_page #mainbox ul.multilinks li a {
	display:block;
	width:calc(100% - 2.125em);
	height:auto;
	line-height: 1.25;
	color:var(--white);
	background:var(--brass);
	border: .125em solid var(--brass);
	margin:0;
	padding:.5em 1em;
	font-size:1em;
	font-weight:600;
	text-align:center;
	font-family: var(--sans);
}

.product_page #mainbox ul.multilinks li a:hover {
	color:var(--brass);
	background:var(--white);
}

#main a {
	color:var(--brass);
	font-weight:600;
	text-decoration:none;
}

#main a:hover {
	color:var(--rose);
	font-weight:600;
	text-decoration:none;
}

#main a.specialbutton,
a.specialbutton,
button.specialbutton {
	color: #eee;
	background: var(--teal);
	display: inline-block;
	padding: .25em 1em;
	border: none;
	outline: none;
}

#main a.specialbutton:hover,
a.specialbutton:hover,
button.specialbutton:hover {
	background: var(--whiteish);
	color: var(--darkrose);
}

#menubox h4 {
	font-size:1em;
}

#menubox h4 a {
	display:block;
	background:var(--rose);
	padding:.5em;
	color:var(--white);
	font-size:1.125em;
	text-transform:uppercase;
	font-weight:400;
	margin:0;
}

#menubox h4 a:hover {
	background:var(--whiteish);
	color:var(--darkrose);
	font-weight:400;
}

#menubox h4.lit,#menubox h4 a.lit {
	color:var(--darkrose);
	background:var(--whiteish);
}

#menubox ul {
	padding:.25em .5em .5em;
}

#menubox ul li a {
	font-family: var(--serif);
	font-size:1em;
}

.contact_page #menubox {
	display:none;
}

blockquote {
	font-size:1em;
	font-style:oblique;
}

.product_page .mainimg {
	margin-right:1em;
}

.product_embed_env {
	float:none;
	clear:both;
}

.stack .image_link { 
	width: 100%; 
	height: 0; 
	padding: 100% 0 0 0; 
	background-position: center center; 
	background-repeat: no-repeat; 
	background-color: var(--whiteish); 
	background-size: contain;}

.stage_image {
	position:relative;
}

.stage_image iframe {
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
}

.prevNextSlideButtons {
	position:fixed;
	top:50vh;
	left:0;
	width:100%;
	height:2em;
	margin:-1em 0 0;
	z-index:-1;
}

.prevNextSlideButtons a.imgPrev {
	float:left;
	clear:none;
}

.prevNextSlideButtons a.imgNext {
	float:right;
	clear:none;
}

#mainbox ul.multilinks li {
	background:url(#) transparent;
}

.image_stage,
.image_stage .stage_image {
	height: auto;
	min-height: 0;
}

.image_stage .prevnext {
	position:absolute;
	top:33%;
	left:0;
	width:calc(100% + 8em);
	margin:0 -4em;
}

.featured_box {
	position:relative;
	animation: slideUp;
	animation-timeline: view();
	animation-range: 0% 50%;
}



#main .featured_box h4 {
	padding:.33em .66em;
	margin:2em 0 .125em;
	width: calc(100% - 1.33em);
	font-size:1.25em;
	color: var(--white);
	background:var(--rose);
}

#main .featured_box h4 a,
#main .featured_box h4 a:hover {
	padding:0;
	margin:0;
	background:transparent;
	color:var(--white);
}

#main .featured_box h4 a:hover {
	color:var(--whiteish);
}

#featured_calendar__box ul li {
	margin:0;
	padding:.125em 0;
}

#featured_calendar__box ul li a {
	margin:0;
	padding:0;
}

#featured_calendar__box ul li:hover {
	background:#af9a47;
}

#featured_calendar__box ul li:hover a span {
	color:var(--whiteish);
}

#featured_calendar__box ul li a span.menutitlefull {
	margin:0;
	padding:0;
}

.calendar_page #mainbox #lineview ul.days li span.citystate { width: 100%; }

.featured_gigdate,.featured_gigvenue,.featured_gigvenue,.featured_gigloc,.featured_gigname {
	font-size:1.125em;
	display:inline-block;
	margin:0 .25em;
}

.featured_gigvenue {
	color:#1d3443;
}

.featured_gigname {
	color:#af9a47;
}

.menutitle,.menutitlefull {
	font-weight:400;
}

#main .featured_box a.raquo {
	display: none;
}

#main .featured_box ul {
	padding:.5em 0 0;
	margin:.5em 0 0;
}

.bigday,.calendar_page #mainbox #lineview ul.months > li,.calendar_page #mainbox #lineview ul.years > li {
	font-family: var(--serif);
	font-weight: 400;
}

.calendar_page #mainbox #lineview ul.months > li,.calendar_page #lineview ul.years > li {
	display:inline-block;
	float:left;
	vertical-align:bottom;
	font-size:2em;
	width:auto;
}

.calendar_page #mainbox #lineview ul.years > li {
	margin-right:.5em;
}

.calendar_page #mainbox #lineview ul.months > li {
	clear:right;
}

.newsletters_page #mainbox {
	background-color: #2f415b;
	color: #eee;
	text-align: center;
}

.newsletters_page.send_section #mainbox {
	background-color: #eee;
	color: #242424;
} 

.newsletters_page #automatic_includes,
.newsletters_page #newsletter_form {
	background-color: #eee;
	color: #242424;
	text-align: left;
}

.newsletterentry {
	max-width: calc(600px - 2em);
	text-align: left;
	margin: 0 auto;
	background: url(/layout/newsletter-header-2021.jpg) center top no-repeat #e9ede9;
	background-size: contain;
	padding: 14em 1em 1em 1em;
	
}

#main .newsletterentry * {
	font-family: Ariel, sans-serif;
	letter-spacing: 0;
}

#main .newsletterentry a {
	color: #3e0f19;
}

#main .newsletterentry h1,#main .newsletterentry h2,#main .newsletterentry h3,#main .newsletterentry h4,#main .newsletterentry h5 { 
	color:#2f415b;
	margin-top:16px;
	margin-bottom:8px;
	font-size: 2em;
	font-weight: 600;
	font-family: var(--sans);
}

#main .newsletterentry h2 {
	font-size: 1.5em;
}

#main .newsletterentry h3 {
	font-size: 1.17em;
}

#main .newsletterentry h4 {
	font-size: 1em;
}

#main .newsletterentry h5 {
	font-size: .83em;
}

#main .newsletterentry p {
	font-size: 1em;
	font-weight: 400;
	color: #242424;
	margin-bottom: 8px;
}

#main .bit-widget.bit-layout-desktop .bit-titleWrapper .bit-venue { margin: 0 auto 0 1em; }
#main .bit-widget a.bit-offers,#main .bit-widget a.bit-play-my-city-button { color: var(--whiteish); }

#main .slabform button.specialbutton,#main button.specialbutton {
	background: #570a17;
	color: #dfdfdf;
	outline: none;
	border: none;
}

#main .slabform button.specialbutton:hover,#main button.specialbutton:hover {
	background: #dfdfdf;
	color: #570a17;
	outline: none;
	border: none;
}

/* landing page */

body.landing_page {
	background: url(layout/IllMeetYouHereCover.jpg) center center no-repeat fixed #1a3139;
	background-size: cover;
}

.landing_page #container {
	min-height: 100vh;
}

.landing_page #main {
	position: absolute;
	top: auto;
	bottom: 0;
	margin: 1em 1em 0 1em;
	width: calc(100vw - 6em);
	max-width: calc(100vw - 6em);
	padding: 2em;
	min-height: 0;
	height: auto;
	background: transparent;
}

.landing_page #main,.landing_page #main h1,.landing_page #main h2,.landing_page #main h3,.landing_page #main h4,.landing_page #main p,.landing_page #main a {
	color: #dfdfdf;
}

.landingbuttons {
	padding-top: 2em;
}

#landingmessage {
	padding-bottom:2em;
}

.caption {
	text-align: center;
	font-size: .88rem;
}

#entry685 .storyp {
	font-size: .7rem;
}

#entry685 .storyp p {
	margin-bottom: .25em;
	margin-block-start: 0;
	margin-block-end: 0;
	line-height: 1.45;
}

footer {
	position: relative;
	font-size:1em;
	width:calc(100vw - 2rem);
	height:auto;
	padding:2rem 1rem;
	margin:0;
	clear:both;
	float:none;
	color:var(--text);
	background-color:var(--ltblue);
	text-align:center;
	z-index: 9;
	border-top: .06em solid var(--text);
}

#footer_main {
	position: relative;
	width: 100%;
	max-width: 70em;
	text-align: right;
	margin: 0 auto;
	display: block;
}

footer a {
	color:var(--darkrose);
}

@media(min-width: 64em) and (max-width: 80em){
	header .headergraphic,
	.homepage_page header .headergraphic {
		background-position: 80% .5em;
	}
}

@media(min-width: 51.25em) and (max-width: 64em){
	header .headergraphic,
	.homepage_page header .headergraphic {
		background-position: 90% .5em;
	}
}

@media(max-width: 51.25em){
	
	#container {
		position: absolute;
		top:0;
		left: 0;
		transition: left .5s;
	}
	
	#container.slid {
		left: -66vw;
	}
	
	header,
	.homepage_page header {
		height: 12em;
	}
	
	header .headergraphic,
	.homepage_page header .headergraphic {
		height: 100%;
		background-position: 90% .5em;
		background-size: auto 11em;
	}
	
	header a#site_logo,
	.homepage_page header a#site_logo {
		top: 7rem;
		left: 2em;
		font-size:1.25em;
		width:calc(90% - 2em);
		text-align: left;
		transition: left .5s;
	}
	
	#container.slid header a#site_logo,
	.homepage_page #container.slid header a#site_logo {
		left: -66vw;
	}
	
	header nav.mobi {
		background-color: var(--brass);
	}
	
	
	header nav.mobi.lit ul li {
		margin-bottom: 1em;
		min-height: 1em;
	}
	
	header nav.mobi.lit ul li ul.drop {
		display: none!important;
	}
	
	#social_nav {
		position: absolute;
		bottom: auto;
		top: 12em;
		width: 2em;
		border-radius: .25em 0 0 .25em;
		z-index: 12;
	}
	
	#social_nav a {
		float: none;
		clear: both;
		margin: .25em;
	}
	
	#main {
		padding:2em 1em;
	}
	
	.product_page #mainbox ul.multilinks li {
		display: block;
		padding: 0;
		width: 100%;
		height: auto;
		margin: .5em 0;
	}
	
}