/*
Theme Name: Sound Expeditions
Author: 2nd Street Creative
Author URI: https://www.2ndst.com
Description: A custom WordPress theme for Sound Expeditions.
Version: 1.0
*/

@font-face {
	font-family: 'Supply';
	src: url('css/fonts/Supply-Medium.woff2') format('woff2'),
		url('css/fonts/Supply-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Supply';
	src: url('css/fonts/Supply-Light.woff2') format('woff2'),
		url('css/fonts/Supply-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Alliance';
	src: url('css/fonts/AllianceNo2-Regular.woff2') format('woff2'),
		url('css/fonts/AllianceNo2-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Alliance Light';
	src: url('css/fonts/AllianceNo2-Light.woff2') format('woff2'),
		url('css/fonts/AllianceNo2-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@keyframes bounce {
	0%   { transform: translateY(0); }
	50%  { transform: translateY(-10px); }
	100% { transform: translateY(0); }
}
@keyframes fade {
	0%   { opacity: 0.35; }
	50%  { opacity: 1; }
	100% { opacity: 0.35; }
}


/* =Reset
-------------------------------------------------------------- */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
html {
	background: #232827;
	font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
	overflow-y: scroll; /* Keeps page centred in all browsers regardless of content height */
	-webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
	-ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
	scroll-behavior: smooth;
}
body {
	background: #232827;
	font-family: 'Raleway', sans-serif;
	font-weight: 300;
	width: auto;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	overflow: hidden;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
nav,
section {
	display: block;
}
ol, ul {
	list-style: none;
}
table { /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a:focus {
	outline: thin dotted;
}
a:hover,
a:active { /* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */
	outline: 0;
}
a img {
	border: 0;
}




/* =Global
----------------------------------------------- */
body,
button,
input,
select,
textarea {
	color: #232827;
	font-family: sans-serif;
	font-size: 16px;
	line-height: 1.5;
}

/* Headings */
h1,h2,h3,h4,h5,h6 {
	clear: both;
}
hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

/* Text elements */
ul, ol {
	margin: 0 0 1.5em 3em;
}
ul {
	list-style: disc;
}
ol {
	list-style: decimal;
}
li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}
ol li, ul li {
	font-family: 'Alliance';
	font-weight: normal;
	font-size: 1em;
	color: #232827;
}
dt {
	font-weight: bold;
}
dd {
	margin: 0 1.5em 1.5em;
}
b, strong {
	font-weight: bold;
}
dfn, cite, em, i {
	font-style: italic;
}
blockquote {
	margin: 0 1.5em;
}
address {
	margin: 0 0 1.5em;
}
pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	padding: 1.6em;
	overflow: auto;
	max-width: 100%;
}
code, kbd, tt, var {
	font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}
mark, ins {
	background: #fff9c0;
	text-decoration: none;
}
sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	bottom: 1ex;
}
sub {
	top: .5ex;
}
small {
	font-size: 75%;
}
big {
	font-size: 125%;
}
figure {
	margin: 0;
}
table {
	margin: 0 0 1.5em;
	width: 100%;
}
th {
	font-weight: bold;
}
img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
	height: auto;
	vertical-align: middle;
}
img,
object,
embed {
  max-width: 100%;
}
button,
input,
select,
textarea {
	font-size: 100%; /* Corrects font size not being inherited in all browsers */
	margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
	vertical-align: baseline; /* Improves appearance and consistency in all browsers */
	*vertical-align: middle; /* Improves appearance and consistency in all browsers */
}
button,
input {
	line-height: normal; /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	display: inline-block;
	font-family: 'Supply';
	font-weight: 500;
	font-size: 1em;
	color: #fff;
	background: #e8612d;
	border-radius: 6px;
	padding: 0.5em 1.25em;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	outline: none;
	border: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
button:hover,
html input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	outline: none;
	color: #232827;
	background: #939598;
}
button:focus,
html input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
html input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border: none;
	box-shadow: none;
}
input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box; /* Addresses box sizing set to content-box in IE8/9 */
	padding: 0; /* Addresses excess padding in IE8/9 */
}
input[type="search"] {
	-webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
	-webkit-box-sizing: content-box; /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
	-moz-box-sizing:    content-box;
	box-sizing:         content-box;
}
input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
	-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
	border: 0;
	padding: 0;
}
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea {
	font-family: 'Alliance';
	font-weight: normal;
	font-size: 1em;
	color: #a7a9ac;
	background: transparent;
	border: none;
	border-bottom: 1px solid #232827;
	box-shadow: none;
}
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	color: #232827;
	outline: none;
}
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="search"] {
	padding: 12px 0 !important;
	
}
textarea {
	overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
	padding-left: 0 !important;
	vertical-align: top; /* Improves readability and alignment in all browsers */
	width: 98%;
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}

/* Clearing */
/* .clear:before,
.clear:after,
[class*="content"]:before,
[class*="content"]:after,
[class*="site"]:before,
[class*="site"]:after {
	content: '';
	display: table;
} */

.clear:after,
[class*="content"]:after,
[class*="site"]:after {
	clear: both;
}



/*********************************
	Global Styles
*********************************/
p {
	font-family: 'Alliance';
	font-weight: normal;
	font-size: 1em;
	color: #232827;
	line-height: 1.5;
	margin-bottom: 1.5em;
}
a, a:visited {
	color: #232827;
	outline: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
a:hover, a:focus, a:active {
	outline: none;
	text-decoration: none;
}
a.button {
	display: inline-block;
	font-family: 'Supply';
	font-weight: 500;
	font-size: 1em;
	color: #fff;
	background: #e8612d;
	border-radius: 6px;
	padding: 0.5em 1.25em;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	outline: none;
	border: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
a.button.black-button {
	color: #edece8;
	background: #232827;
}
a.button:hover, a.button:focus, a.button:active,
a.button.black-button:hover, a.button.black-button:focus, a.button.black-button:active {
	color: #232827;
	background: #939598;
	outline: none;
}
a.text-link {
	display: block;
	font-family: 'Supply', mono;
	font-weight: 500;
	font-size: 1em;
	color: #232827;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	padding-left: 2em;
	background: url('img/link-arrow-right.png') no-repeat left center;
	background-size: 12px;
}
a.text-link:hover, a.text-link:focus, a.text-link:active {
	padding-left: 2.5em;
	background: url('img/link-arrow-right.png') no-repeat 0.5em center;
	background-size: 12px;
}
a.anchor-link {
	position: relative;
	display: block;
	font-family: 'Supply', mono;
	font-weight: 500;
	font-size: 1em;
	color: #e8612d;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	padding-left: 2em;
	/*animation-name: bounce;
	animation-timing-function: ease;
	transform-origin: bottom;
	animation-duration: 2s;
	animation-iteration-count: infinite;*/
}
a.anchor-link:before {
	content: '';
	position: absolute;
	left: 0;
	top: 1;
	width: 20px;
	height: 20px; 
	background: url('img/link-arrow-orange.png') no-repeat left center;
	background-size: 10px;
	animation-name: fade;
	animation-timing-function: ease;
	animation-duration: 2s;
	animation-iteration-count: infinite;
}
a.anchor-link:hover, a.anchor-link:focus, a.anchor-link:active {
	padding-top: 0.5em;
	background: url('img/link-arrow-orange.png') no-repeat left 0.75em;
	background-size: 10px;
}
h1, span.h1 {
	font-family: 'Alliance Light';
	font-weight: 300;
	font-size: 6em;
	color: #232827;
	line-height: 1;
	margin-bottom: 0.25em;
}
h2, span.h2 {
	font-family: 'Alliance';
	font-weight: 300;
	font-size: 3.25em;
	color: #232827;
	line-height: 1;
	margin-bottom: 0.25em;
}
h3, span.h3 {
	font-family: 'Alliance';
	font-weight: 300;
	font-size: 2.15em;
	color: #232827;
	line-height: 1;
	margin-bottom: 0.25em;
}
h4, span.h4 {
	font-family: 'Alliance';
	font-weight: 300;
	font-size: 1.375em;
	color: #232827;
	line-height: 1;
	margin-bottom: 0.25em;
}
h5, span.h5 {
	font-family: 'Supply';
	font-weight: 500;
	font-size: 1em;
	color: #232827;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 0.5em;
}
h6, span.h6 {
	font-family: poppins, sans-serif;
	font-weight: 700;
	font-size: 0.875em;
	color: #232827;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 0.5em;
}
h1 a, span.h1 a, h2 a, span.h2 a, h3 a, span.h3 a, h4 a, span.h4 a, h5 a, span.h5 a, h6 a, span.h6 a {
	text-decoration: none;
	color: #232827;
}
h1 a:hover, span.h1 a:hover, h2 a:hover, span.h2 a:hover, h3 a:hover, span.h3 a:hover,
h4 a:hover, span.h4 a:hover, h5 a:hover, span.h5 a:hover, h6 a:hover, span.h6 a:hover {
	opacity: 0.6;
}
.two-column {
	-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}
.three-column {
	-webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}
.index-wrap {
	position: relative;
	z-index: 3;
}
.flex-wrap {
	display: flex;
	flex-wrap: wrap;
}
.gap {
	gap: 28px;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}
.light {
	font-weight: 300;
}
.reverse {
	direction: rtl;
}
.tiny {
	font-size: 0.65em;
}
.darkBG {
	background: #171919;
}
.black {
	color: #232827;
}
.blackBG {
	background: #232827;
}
.gray {
	color: #a7a9ac !important;
}
.grayBG {
	background: #f7f7f5;
}
.tanBG {
	background: #edece8;
}
.white {
	color: #fff !important;
}
.whiteBG {
	background: #fff;
}
.orange {
	color: #e8612d !important;
}
.orangeBG {
	background: #e8612d;
}

	
/*********************************
	Header Styles
*********************************/
.mobile-menu {
	position: fixed;
	top: 0;
	right: -100%;
	height: 100vh;
	width: 33.33%;
	z-index: 99;
	padding: 4em;
	border-left: 1px solid #939598;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.mobile-menu.active {
	right: 0;
}
.close {
	position: absolute;
	top: 3.25em;
	right: 3em;
	width: 20px;
	height: 20px;
	cursor: pointer;
}
.close .left, .close .right {
	position: absolute;
	top: 0;
	width: 20px;
	height: 2px;
	background: #e8612d;
	border-radius: 4px;
	z-index: 999;
}
.close .left {
	left: 0;
	transform: rotate(45deg);
}
.close .right {
	right: 0;
	transform: rotate(-45deg);
}
.mobile-menu nav.main ul {
	margin: 0;
}
.mobile-menu nav.main ul li {
	position: relative;
	list-style: none;
	display: block;
	border-bottom: 1px solid #939598;
	padding: 0.25em 0;
}
.mobile-menu nav.main ul li a {
	font-family: 'Alliance';
	font-weight: 300;
	font-size: 3em;
	color: #232827;
	text-decoration: none;
}
.mobile-menu nav.main ul li a:hover, .mobile-menu nav.main ul li.current-menu-item a {
	opacity: 0.6;
}
.mobile-menu .logo {
	position: absolute;
	bottom: 4em;
	left: 4em;
	width: 40px;
}
.site-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 2em;
	z-index: 98;
	border-bottom: 1px solid #939598;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.home .site-header {
	border: none;
}
.site-header.active {
	border-bottom: 1px solid #939598;
	padding: 1em 2em; 
}
.site-header .logo {
	width: 200px;
}
.nav-button {
	position: absolute;
	top: 50%;
	right: 2em;
	cursor: pointer;
	padding: 0.35em 1em 0.5em;
	background: #fff;
	border-radius: 6px;
	transform: translate(0,-50%);
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.nav-button span {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-family: 'Supply', mono;
	font-weight: 500;
	font-size: 0.75em;
	color: #e8612d;
	line-height: 1;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding-right: 1em;
	margin-right: 1em;
	border-right: 1px solid #232827;
}
.nav-button .indicator {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: 18px;
	height: 12px;
}
.nav-button .first, .nav-button .second, .nav-button .third,
.nav-button .fifth, .nav-button .fourth, .nav-button .sixth {
	position: absolute;
	width: 4px;
	height: 4px;
	background: #e8612d;
	border-radius: 50%;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.nav-button .first {
	top: 0;
	left: 0;
}
.nav-button .second {
	top: 0;
	left: calc(50% - 2px);
}
.nav-button .third {
	top: 0;
	right: 0;
}
.nav-button .fourth {
	bottom: 0;
	left: 0;
}
.nav-button .fifth {
	bottom: 0;
	right: calc(50% - 2px);
}
.nav-button .sixth {
	bottom: 0;
	right: 0;
}


/*********************************
	Content Styles
*********************************/
.site-main {
	margin-top: 100px;
}
.artist-content {
	position: relative;
	padding: 6em 0;
}
.song-map {
	position: relative;
	width: 50%;
	min-height: calc(100vh - 60px);
	min-height: 100%;
	z-index: 1;
}
.song-map a.button {
	position: absolute;
	top: 2em;
	left: 2em;
	z-index: 2;
}
.mapboxgl-marker {
	background: url('img/single-song-marker.png') no-repeat center center;
	background-size: 100%;
	width: 30px;
	height: 30px;
}
.mapboxgl-marker svg {
	opacity: 0;
}
.song-deets {
	position: relative;
	width: 50%;
	padding: 3em;
	border-left: 1px solid #939598;
	z-index: 2;
}
.song-deets .song-image {
	display: block;
	padding-bottom: 60%;
}
.song-deets span.h6.orange {
	font-size: 1.5em;
}
.fixed-song {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 1.5em 2em 1em;
	z-index: 3;
}
.fixed-song audio {
	width: 100%;
}
.error-content {
	position: relative;
	padding: 6em 2em;
}
.song-deets h2 {
	margin: 0;
}
.song-deets ul.song-details {
	margin: 0;
}
.song-deets ul.song-details li {
	position: relative;
	list-style: none;
	display: block;
}
.song-deets ul.song-details li p {
	margin: 0;
}
.expandable-text {
	cursor: pointer;
	content-visibility: hidden;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.expandable-text-link {
	cursor: pointer;
	font-family: poppins, sans-serif;
	font-weight: 700;
	font-size: 0.875em;
	color: #232827;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: underline;
	text-underline-offset: 4px;
}
.expandable-text.open {
	content-visibility: visible;
}

/*********************************
	Map Styles
**********************************/
.map-wrap {
	position: relative;
	overflow: hidden;
}
#map { 
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
}
.map-container {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	z-index: 96;
}
.map-sidebar {
	position: absolute;
	top: 0;
	right: -100%;
	width: 33.33%;
	height: 100%;
	background: #fff;
	z-index: 97;
	border-left: 1px solid #939598;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.map-wrap.opened .map-sidebar {
	right: 0;
}
.map-sidebar .close {
	top: 1em;
	right: 0.5em;
}
.sidebar {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	overflow: scroll;
	background: #fff;
	opacity: 0;
	z-index: 0;
	padding: 2em 2em 6em;
}
.sidebar.active {
	opacity: 1;
	z-index: 95;
}
.song-image {
	position: relative;
	display: block;
	padding-bottom: 60%;
	border-radius: 6px;
	margin-bottom: 2em;
	overflow: hidden;
}
.sidebar h2 {
	margin: 0;
}
.sidebar h6 {
	margin-bottom: 2em;
}
.sidebar p {
	margin-bottom: 2em;
}
.sidebar .track-number {
	font-size: 1.5em;
}
span.h6.coord {
	position: relative;
	border-radius: 6px;
	padding: 0.25em 0.5em;
	display: inline-block;
	margin: 0 0 2em;
	font-size: 0.65em;
}
.coord span {
	display: inline-block;
}
.map-song-bar {
	position: fixed;
	bottom: -100%;
	left: 0;
	width: 100%;
	height: 100px;
	z-index: 97;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
.map-wrap.opened .map-song-bar {
	bottom: 0;
}
.song-bar {
	position: fixed;
	bottom: 0;
	display: none;
	width: 100%;
	padding: 1.5em 2em;
	z-index: 97;
}
.song-bar.close {
	display: none;
}
.song-bar .artist, .song-bar .title {
	display: inline-block;
	vertical-align: middle;
	width: calc(20% - 3px);
}
.song-bar span.h5 {
	font-size: 0.75em;
}
.song-bar h6 {
	margin: 0;
}
.song-bar audio {
	display: inline-block;
	vertical-align: middle;
	width: calc(60% - 3px);
}
.mapboxgl-ctrl-group {
	border-radius: 6px;
}
.mapboxgl-ctrl-group button {
	border-radius: 0;
}

/*********************************
	Module Styles
*********************************/
.module.blackBG h1, .module.blackBG span.h1, .module.blackBG h2, .module.blackBG span.h2, .module.blackBG h3, .module.blackBG span.h3,
.module.blackBG h4, .module.blackBG span.h4, .module.blackBG h5, .module.blackBG span.h5, .module.blackBG h6, .module.blackBG span.h6,
.module.blackBG p, .module.blackBG ul li, .module.blackBG ol li, .module.blackBG a {
	color: #fff;
}
.module.blackBG input { 
	border-color: #a7a9ac !important;
}
.module {
	scroll-margin-top: 100px;
}
.basic-content, .content-sidebar, .content-image {
	position: relative;
	padding: 6em 0;
}
.content-sidebar.sidebar-left, .content-image.img-right {
	direction: rtl;
}
.content-sidebar .flex-wrap {
	gap: 100px;
}
.content-sidebar .content-content {
	width: calc(72.5% - 50px);
	direction: ltr;
}
.content-sidebar .sidebar-sidebar {
	width: calc(27.5% - 50px);
	padding-top: 2em;
	direction: ltr;
}
.content-image .flex-wrap {
	gap: 100px;
	align-items: flex-start;
}
.content-image .content-content {
	width: calc(50% - 50px);
	direction: ltr;
	padding: 6em 0;
}
.content-image .image-image {
	position: relative;
	display: block;
	padding-bottom: 52.5%;
	width: calc(50% - 50px);
	border-radius: 6px;
	overflow: hidden;
}
.image-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 3em 1em 1em;
	background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.5));
}
.image-caption p {
	margin: 0;
}
.listings {
	border-bottom: 1px solid #939598;
}
.view-bar {
	border-top: 1px solid #939598;
	border-bottom: 1px solid #939598;
	padding: 1.5em 2em;
}
.view-button {
	color: #939598 !important;
	background: #f7f7f5;
	border-radius: 6px;
	padding: 0.5em 1.25em 0.75em;
	margin-left: 0.5em;
	cursor: pointer;
}
.view-button.active {
	background: #232827;
}
.view-button img {
	max-height: 15px;
	display: inline-block;
	vertical-align: middle;
}
.view-button span {
	display: inline-block;
	vertical-align: middle;
	font-size: 70%;
}
.line {
	position: relative;
	width: 100%;
	height: 1px;
	background: #bcbec0;
}
/*.tabs-wrap {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
	align-content: start
}
.tab {
	grid-column: 1 / span 1;
	grid-row: 1 / span 1;
	opacity: 0;
	z-index: 0;
}*/
.tab {
	display: none;
	opacity: 0;
}
.tab.active {
	display: block;
	opacity: 1;
}
.grid-wrap {
	position: relative;
	padding: 6em 0;
}
ul.songs {
	margin: 0;
	justify-content: center;
}
ul.songs li.song {
	position: relative;
	list-style: none;
	width: calc(25% - 21px);
	border-radius: 0 0 6px 6px;
}
ul.songs li.song .song-image {
	position: relative;
	display: block;
	padding-bottom: 100%;
	margin: 0;
	border-radius: 0;
	-webkit-transition: 0.2s ease;
	-moz-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
}
ul.songs li.song .song-image:hover {
	background-color: #f05722 !important;
	background-blend-mode: multiply;
}
ul.songs li.song span.track-number.h6 {
	position: absolute;
	top: 0.5em;
	left: 0.5em;
	border-radius: 6px;
	padding: 0.65em 0.5em 0.5em;
	background: #fff;
	letter-spacing: 0;
	margin: 0;
	line-height: 1;
}
ul.songs li.song .song-info {
	padding: 2em 2em 1.5em;
}
ul.songs li.song .song-info h4 {
	display: block;
	margin-bottom: 0.75em;
}
ul.songs li.song .song-info h6 {
	margin: 0;
	color: #e8612d;
}
ul.songs li.song .song-info h6 a {
	color: #e8612d;
}
.list-wrap {
	position: relative;
	padding: 6em 0;
}
ul.songs-list {
	margin: 0;
	border-top: 1px solid #939598;
}
ul.songs-list li.song {
	position: relative;
	list-style: none;
	display: block;
	border-bottom: 1px solid #939598;
	padding: 1em 4em;
}
ul.songs-list li.song span.h6.track-number {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0,-50%);
	border-radius: 6px;
	padding: 0.65em 0.5em 0.5em;
	letter-spacing: 0;
	margin: 0;
	line-height: 1;
}
ul.songs-list li.song h3 {
	display: inline-block;
	vertical-align: middle;
	width: calc(70% - 5px);
	margin: 0;
	line-height: 1;
}
ul.songs-list li.song h6.artist {
	display: inline-block;
	vertical-align: middle;
	width: calc(30% - 5px);
	color: #e8612d;
	margin: 0;
	line-height: 1;
}
ul.songs-list li.song h5.more {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0,-50%);
	margin: 0;
	color: #bcbec0;
}
ul.songs-list li.song h5.more a {
	color: #bcbec0;
	text-decoration: underline;
}
.accordion {
	position: relative;
	padding: 3.25em 0 6em;
}
.accordion .module-title {
	text-align: center;
	margin-bottom: 2.75em;
}
.accordion ul.accordion-items {
	margin: 0;
	padding: 3em 4em;
	border: 1px solid #939598; 
	border-radius: 6px;
}
.accordion ul.accordion-items li.accordion-item {
	position: relative;
	list-style: none;
	display: block;
	border-bottom: 1px solid #939598; 
	padding: 1.5em 0;
}
.accordion ul.accordion-items li.accordion-item:last-child {
	border: none;
}
.accordion ul.accordion-items li.accordion-item .accordion-title {
	position: relative;
	padding-right: 60px;
	margin: 0;
}
.accordion ul.accordion-items li.accordion-item .accordion-title span.indicator {
	position: absolute;
	top: 0;
	right: 0;
	height: 20px;
	width: 20px;
	cursor: pointer;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.accordion ul.accordion-items li.accordion-item .accordion-title span.indicator span.first {
	position: absolute;
	top: 50%;
	left: 50%;
	height: 16px;
	width: 1px;
	background: #fff;
	transform: translate(-50%,-50%);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.accordion ul.accordion-items li.accordion-item .accordion-title span.indicator span.second {
	position: absolute;
	top: 50%;
	left: 50%;
	height: 1px;
	width: 16px;
	background: #fff;
	transform: translate(-50%,-50%);
}
.accordion ul.accordion-items li.accordion-item .accordion-title.active span.indicator span.first {
	transform: translate(-50%,-50%) rotate(-90deg);
}
.accordion ul.accordion-items li.accordion-item .accordion-hide {
	display: none;
	padding-top: 2em;
}
.accordion h1, .accordion h2, .accordion h3, .accordion h4, .accordion h5, .accordion h6, .accordion p, .accordion ul li, .accordion ol li, .accordion a {
	color: #fff;
}
.featured-artist {
	position: relative;
	padding: 2em;
}
.featured-artist .artist-info {
	width: 50%;
	padding: 14em 4em;
}
.featured-artist .artist-info .artist-link {
	font-family: 'Supply';
	font-weight: 500;
	font-size: 0.75em;
	color: #232827;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
}
.featured-artist .artist-info .artist-link:hover {
	opacity: 0.6;
}
.featured-artist .artist-info h6.module-title {
	position: absolute;
	top: 2em;
	left: 2em;
}
.featured-artist .artist-info .module-button {
	position: absolute;
	bottom: 2em;
	left: 2em;
}
.featured-artist .artist-images {
	position: relative;
	width: 50%;
}
.featured-artist .artist-images .background-image {
	position: absolute;
	top: 0;
	right: 0;
	width: 80%;
	height: 100%;
	border-radius: 6px;
	z-index: 1;
	overflow: hidden;
}
.featured-artist .artist-images .main-image {
	position: absolute;
	top: 25%;
	left: 0;
	width: 50%;
	height: 50%;
	border-radius: 6px;
	z-index: 2;
	overflow: hidden;
}



/*********************************
	Footer Styles
*********************************/
.business-desc {
	width: 33.33%;
	padding: 3em;
}
.business-desc img {
	width: 84px;
	margin-bottom: 20em;
}
.business-desc p {
	font-size: 0.875em;
	margin: 0;
	max-width: 275px;
}
.footer-sections {
	width: 66.66%;
	border-left: 1px solid #939598;
}
.sec {
	width: 33.33%;
	padding: 3em;
}
.sec .heading {
	margin-bottom: 10em;
}
.sec p, .sec h1, .sec h2, .sec h3, .sec h4, .sec h5, .sec h6, .sec a {
	color: #fff;
}
.sec h5 {
	font-weight: 300;
	font-size: 0.875em;
}
.sec form {
	margin-top: 2em;
	border-bottom: 1px solid #939598;
}
.links nav.main ul, ul.links {
	margin: 0;
}
.links nav.main ul li, ul.links li {
	display: block;
	margin-bottom: 0.5em;
}
.links nav.main ul li a,  ul.links li a {
	font-family: 'Supply';
	font-weight: 300;
	font-size: 0.875em;
	color: #fff;
	line-height: 1.25;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
}
.links nav.main ul li a:hover,  ul.links li a:hover {
	opacity: 0.6;
}
.gform_wrapper.gravity-theme #field_submit .gform_image_button, .gform_wrapper.gravity-theme .gform_footer .gform_image_button {
	max-width: 15px !important;
}
.site-footer .gform_wrapper.gravity-theme input {
	border: none !important;
}
.site-footer .gform_wrapper.gravity-theme #field_submit input, .site-footer .gform_wrapper.gravity-theme .gform_footer input {
	align-self: center !important;
}
.site-footer .gform_wrapper.gravity-theme .gform_footer, .site-footer .gform_wrapper.gravity-theme .gform_page_footer {
	margin: 0 !important;
	padding: 0 !important;
}



/***************************************************************************************************
									Responsive Styles
***************************************************************************************************/
@media all and (max-width: 1385px) {
	.grid-wrap, .list-wrap { padding-left: 2em !important; padding-right: 2em !important; }
}
@media all and (max-width: 1205px) {
	.map-container { padding-bottom: 75%; unset}
	.content-wrap { padding-left: 2em !important; padding-right: 2em !important; }
}
@media all and (max-width: 1050px) {
	.links, .social { display: none !important; }
	ul.songs li.song { width: calc(33.33% - 18.66px); }
	.map-sidebar { display: none; }
	.mobile-menu { width: 75%; }
	.business-desc, .footer-sections { width: 50%; }
	.newsletter { width: 100%; }
	.business-desc img { margin-bottom: 8em; }
	.song-content .flex-wrap { display: block; }
	.song-map, .song-deets { width: 100%; }
	.song-map { padding-bottom: 100%; height: auto; }
	
	.three-column { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
	.small-content-wrap { padding-left: 2em !important; padding-right: 2em !important; }
}
@media all and (max-width: 925px) {
	.content-sidebar .content-content, .content-sidebar .sidebar-sidebar { width: 100%; }
	.content-sidebar .flex-wrap { gap: 0; }
	.basic-content, .content-sidebar, .content-image { padding: 4em 0; }
	.grid-wrap, .list-wrap { padding: 4em 2em; }
	.accordion { padding-bottom: 3em; }
	.accordion ul.accordion-items { padding: 0; }
	.accordion ul.accordion-items li.accordion-item { padding: 1em; }
	
	h1, span.h1 { font-size: 5em; }
	.tiny-content-wrap { padding-left: 2em !important; padding-right: 2em !important; }
}
@media all and (max-width: 800px) {
	.song-bar { text-align: center; }
	.song-bar .artist, .song-bar .title { display: block; width: 100%; margin-bottom: 0.5em; }
	.song-bar audio { display: block; width: 100%; }
	.map-container { padding-bottom: 100%; }
}
@media all and (max-width: 768px) {
	.featured-artist .background-image { display: none !important; }
	ul.songs li.song { width: calc(50% - 14px); }
	.mobile-menu { width: 100%; }
	ul.songs-list li.song { text-align: center; }
	ul.songs-list li.song span.h6.track-number { position: relative; background: none; }
	ul.songs-list li.song h3, ul.songs-list li.song h6.artist, ul.songs-list li.song h5.more { position: relative; display: block; width: 100%; margin: 0.5em 0; top: auto; right: auto; transform: none; }
	.content-image .flex-wrap, .featured-artist .flex-wrap { display: block; gap: 0; }
	.content-image .image-image, .featured-artist .artist-images .main-image { position: relative; display: block; width: 100%; padding-bottom: 60%; }
	.content-image .content-content { width: 100%; padding: 2em 0 0; }
	.featured-artist .artist-info, .featured-artist .artist-images { width: 100%; }
	.featured-artist .artist-info { position: relative; padding: 4em 0 8em; }
	.featured-artist .artist-info h6.module-title { left: 0; top: 0; }
	.featured-artist .artist-info .module-button { left: 0; bottom: 2em; }
	.mobile-menu nav.main ul li a { font-size: 2em; }
	
	h1, span.h1 { font-size: 4em; }
	.two-column { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
}
@media all and (max-width: 525px) {
	.view-bar { text-align: center; }
	.view-button { display: block; width: 100%; text-align: center; margin: 0 0 5px; }
	ul.songs li.song { width: calc(100% - 14px); }
	.business-desc, .footer-sections { width: 100%; border: none; } 
	
	
	h1, span.h1 { font-size: 2.5em; }
	h2, span.h2 { font-size: 2.25em; }
}