/*!
Theme Name: Matchbox Twenty
Theme URI: http://underscores.me/
Author: Phill Mamula
Author URI: http://underscores.me/
Description: 2021 Theme for Matchbox Twenty (Re-Platformed)
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: matchboxtwenty
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Matchbox Twenty is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400&family=Inter:wght@300;400;600&display=swap');

@font-face {
    font-family: 'Gotham Light';
    src: url('fonts/Gotham-Light.woff2') format('woff2'),
         url('fonts/Gotham-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham Book';
    src: url('fonts/Gotham-Book.woff2') format('woff2'),
         url('fonts/Gotham-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* =Global
-------------------------------------------------------------- */
html,body {
  	margin: 0; padding: 0;
  	min-height: 100%;
}
body {
	background: #fcefcc;
    font-family: 'Inter', sans-serif;
	color: #24201f;
    font-weight: 300;
	font-size: 18px;
	line-height: 1.8em;
}

/* Type */
h1,h2,h3,h4 {
    font-family: 'Gotham Light', sans-serif;
    line-height: 1.1em;
    letter-spacing: 0.06em;
    font-weight: normal;
    text-transform: uppercase;
    margin: 10px auto;
}
h1 { font-size: 2.5em; line-height: 0.9em; }
h2 { font-size: 2em; }
h3 { font-size: 1.75em; }
h4 { font-size: 1.5em; }

strong { font-weight: 600; }
.sm-text { font-size: 0.8em; line-height: 1.2em; }

img { width: 100%; height: auto; margin: 0 0 -9px; }
p { margin: 0 0 15px; }

a, a:link, a:visited { 
    color: inherit;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out; 
}
a:hover { color: #772d2e; }

button { cursor: pointer; }
video:focus,
input:focus,
button:focus {outline:0; cursor: pointer;}
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}
ul, li { margin: 0; padding: 0; list-style: none; }

/* CTA Buttons */
a.large-cta,
.large-cta {
	font-size: 0.85em;
    line-height: 1.1em;
    font-family: 'Gotham Book', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 1px solid;
    text-align: center;
    text-decoration: none;
    padding: 15px 50px;
}
a.large-cta:hover {
    background: #772d2e;
    border-color: #772d2e;
    color: #feddb4;
}

/* Structure */
.post, .page, .page-content, 
.entry-content, .entry-summary { margin: 0; }

#section {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
	padding: 50px 0;
}

.flex { display: flex; flex-wrap: wrap; align-items: center; }
.flex>* { flex: 1; }
.flex .half { flex: 1 0 50%; width: 50%; }
.flex .two-third { flex: 2; }
.flex .third { flex: 1 0 33.3%; width: 33.3%; }

.container {
    width: 90vw;
    max-width: 1200px;
    position: relative;
    margin: 0 auto;
}
.container.small { max-width: 900px; }


/* Owl Carousel - Auto Height Plugin */
.owl-height {
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}
.owl-carousel {
    margin: 0 auto;
    -webkit-tap-highlight-color: transparent;
    /* position relative and z-index fix webkit rendering fonts issue */
    position: relative;
    z-index: 1;
}
.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
}
.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.owl-carousel .owl-stage-outer {
    overflow: hidden;
}
.owl-carousel .owl-stage-outer {
    z-index: 999;
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-nav .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-dot {
  color: inherit;
  cursor: pointer;
  cursor: hand;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel.owl-loaded {
  display: block;
}
.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}
.owl-carousel.owl-hidden {
  opacity: 0;
}
.owl-carousel .owl-refresh .owl-item {
  display: none;
}
.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel .owl-item img {
  display: block;
  width: 100%;
  -webkit-transform-style: preserve-3d;
}
.owl-carousel.owl-text-select-on .owl-item {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
}
.owl-carousel .owl-grab {
  cursor: move;
  cursor: -webkit-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}
.owl-carousel.owl-rtl {
  direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
  float: right;
}
.owl-carousel {
    display: none; 
}
.owl-carousel.owl-loaded {
    display: block;
}

.owl-nav { width: 100%; height: 100%; position: absolute; top: 0;left: 0; }
.owl-nav button { 
    opacity: 0.5;
    color: #96875f;
    background: transparent;
    border: 1px solid #96875f;
    display: inline-block;
    width: 50px;
    height: 50px;
    padding: 0 0 3px 0;
    font-size: 1.25em;
    line-height: 0;
    margin-right: 8px;
    border-radius: 50%;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;  
}
.owl-nav button:hover {
    opacity: 1;
    background: #772d2e;
    color: #fcefcc;
    border-color: #772d2e;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;  
}
.owl-nav>* {
    position: absolute;
    top: calc(50% - 25px);
    z-index: 999;
}
.owl-nav .owl-next { right: 3vw; }
.owl-nav .owl-prev { left: 3vw; }
.owl-nav.disabled { display: none !important; }


/* Embed Resposively */
.embed-container { 
    position: relative; 
    padding-bottom: 56.25%; 
    height: 0; 
    overflow: hidden; 
    max-width: 100%; 
} 
.embed-container iframe, 
.embed-container object, 
.embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/* Video Hero */
.iframe-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -3;
  pointer-events: none;
  overflow: hidden;
}
.iframe-wrapper video {
  width: 100vw;
  height: 56.25vh; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
  min-height: 120vh;
  min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
  position: absolute;
  top: 50%; 
  left: 50%;
  transform: translate(-50%, -50%);
}


/* =Header
-------------------------------------------------------------- */
header#masthead { 
	padding: 35px 0;
    position: relative;
    z-index: 9;
}
header#masthead .container.flex { justify-content: space-between; }
header#masthead .container.flex>* { flex: initial; }

header#masthead h1.site-title {
    font-family: 'Gotham Book', sans-serif;
    font-size: 1.6em;
    letter-spacing: 0.08em;
    margin: 0;
}
header#masthead h1.site-title a {
    text-decoration: none;
}

/* Quick Menu */
ul#menu-quick {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 100px;
    margin-top: -5px;
}
ul#menu-quick li { margin-left: 3vw; }

ul#menu-quick li a {
    font-family: 'Gotham Book', sans-serif;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.8em;
    line-height: 1em;
    display: block;
    letter-spacing: 0.06em;
    padding: 5px;
}

/* Overlay Navigation */
button.menu-toggle {
    display: block;
    background: transparent;
    border-radius: 0;
    padding: 0;
    border: none;
    width:  40px;
    height: 40px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .15s ease-in-out;
    -moz-transition: .15s ease-in-out;
    -o-transition: .15s ease-in-out;
    transition: .15s ease-in-out;
    position: absolute;
    top: -18px;
    right: 0;
}
button.menu-toggle span {
    display: block;
    position: absolute;
    height: 2px;
    width: 40px;
    background: #24201f;
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
button.menu-toggle span:nth-child(1) { top: 15px;}
button.menu-toggle span:nth-child(2),
button.menu-toggle span:nth-child(3) { top: 28px;}
button.menu-toggle span:nth-child(4) { top: 40px;} 
.toggled button.menu-toggle {
    top: 13px;
    right: calc(50% - 600px);
}   
.main-navigation.toggled button.menu-toggle span { background: #c22600; }   
.main-navigation.toggled button.menu-toggle span:nth-child(1) {
    top: 20px;
    width: 0%;
    left: 50%;
}
.main-navigation.toggled button.menu-toggle  span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.main-navigation.toggled button.menu-toggle span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.main-navigation.toggled button.menu-toggle span:nth-child(4) {
    top: 20px;
    width: 0%;
    left: 50%;
}
.main-navigation .menu-main-navigation-container { display: none; } 
.main-navigation.toggled .menu-main-navigation-container {
    display: flex;
    align-items: center;
    margin-top: 15px;
}

/* Overlay */
header#masthead nav.main-navigation.toggled {
    position: fixed;
    top: 0;
    left: 0;
    background: rgb(30 17 17 / 92%);
    padding: 5vw;
    height: 100%;
    z-index: 999;
}
header#masthead nav.main-navigation ul {
    width: 90vw;
    max-width: 1200px;
    margin: 0 auto;
}
header#masthead nav.main-navigation li {
    flex: 1 0 100%;
    text-align: right;
}
header#masthead nav.main-navigation li a {
    color: #fcefcc;
    font-family: 'Gotham Light', sans-serif;
    font-size: 2em;
    line-height: 1em;
    letter-spacing: 0.1em;
    padding: 15px 0;
    text-transform: uppercase;
}
header#masthead nav.main-navigation li.current-menu-item a,
header#masthead nav.main-navigation li a:hover {
    color: #ca5e60;
}



/* =Homepage
-------------------------------------------------------------- */
#section.home-album {
    padding: 0;
}
#section.home-album .fullscreen-gallery .owl-item { 
    width: 100%; 
    height: 700px;
}
#section.home-album .fullscreen-gallery .owl-item img {
    width: 100%; 
    height: 700px;
    object-fit: cover;
    object-position: center;
}

#section.home-album .album-title {
    margin: 15px auto 50px;
}

#section.home-album .album-title h3 {
    display: flex;
    font-size: 2.25em;
    letter-spacing: 0.06em;
    justify-content: space-between;
    margin: 0 0 10px;
}
#section.home-album .album-title .album-details {
    color: #685e5c;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.8em; 
    line-height: 1.75em; 
    text-transform: uppercase;
    text-align: right;
    padding: 0;
}

/* Purchases */
#section.home-purchase {
    padding: 150px 0;
    text-align: center;
    position: relative;
}
#section.home-purchase:before,
#section.home-purchase:after {
    content: '';
    width: 1px;
    height: 125px;
    background: #dad0b3;
    position: absolute;
    left: 50%;
    top: 0;
}
#section.home-purchase:after { top: auto; bottom: 0; }

#section.home-purchase .purchase { margin: 25px auto; }

#section.home-purchase .purchase ul {
    margin: 50px auto;
    display: flex;
    align-items: inherit;
    justify-content: space-between;
}
#section.home-purchase .purchase ul li {
    flex: 1;
    text-transform: uppercase;
    padding: 15px;
    border-right: 1px dotted #e3d9be;
}
#section.home-purchase .purchase ul li img.icon {
    width: auto;
    max-height: 32px;
    margin: 0 auto 3px;
    -webkit-transition: .15s ease-in-out;
    -moz-transition: .15s ease-in-out;
    -o-transition: .15s ease-in-out;
    transition: .15s ease-in-out;
}
#section.home-purchase .purchase ul li:last-of-type { border: none; }
#section.home-purchase .purchase ul li a { text-decoration: none; }
#section.home-purchase .purchase ul li:hover img { 
    transform: scale(1.1); 
}
#section.home-purchase .purchase ul li span {
    color: #b1a37e;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.7em;
    letter-spacing: 0.06em;
    line-height: 1em;
    display: block;
    margin: 10px auto;
}
#section.home-purchase a.large-cta { 
    display: table;
    margin: 0 auto;
}

/* Video */
#section.home-video { 
    position: relative;
    padding: 50px 0 0; 
}
#section.home-video:before {
    content: '';
    width: 1px;
    height: 30px;
    background: #dad0b3;
    position: absolute;
    left: 50%;
    top: 0;
}
#section.home-video:after { top: auto; bottom: 0; }
#section.home-video h4 {
    margin: 5px auto 50px;
}
#section.home-video a.large-cta {
    display: table;
    margin: 25px auto;
}

body.home footer.site-footer { margin-top: 100px; }


/* =Releases
-------------------------------------------------------------- */
#section.releases { display: block; }
body.post-type-archive-releases, body.single-releases { background: #fff7e1; }

/* FW Carousel */
.releases-grid-item img,
.album-image img { border: 1px solid #dcd0b3; }
.releases-listing .owl-item { 
    filter: saturate(20%) blur(5px); 
    opacity: 0.25; 
    transform: scale(0.9);
    transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out; 
}
.releases-listing .owl-item.center {
    filter: saturate(1) blur(0);
    opacity: 1;
    transform: scale(1);
}
.releases-listing .album-title { padding: 10px 0; }

/* Details */
.releases-detail.flex { align-items: inherit;}
.releases-detail.flex>* { padding: 0 25px; }
.releases-detail .releases-details {
    text-align: center;
}
.releases-detail .releases-details .album-title {
    text-align: center;
    position: relative;
    padding: 0 0 50px;
    margin-bottom: 15px;
}
.releases-detail .releases-details .album-title h2 { margin: 0 auto 5px; }
.releases-detail .releases-details .album-title:after {
    content: '';
    width: 1px;
    height: 50px;
    background: #dad0b3;
    position: absolute;
    left: 50%;
    bottom: 0;
}

.releases-grid-item h4.album-name { font-size: 1.25em; margin: 10px auto 0; text-align: center; }
.releases-grid-item h4.album-name a { text-decoration: none; }
.releases-grid-item .album-year { text-align: center; }
.album-year {
    opacity: 0.6;
    color: #685e5c;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.8em;
    text-transform: uppercase;
    display: block;
}

/* Tracklisting */
.disc { padding: 5px 0; }
.disc-title {
    font-family: 'Gotham Light', sans-serif;
    padding: 5px 0;
    text-transform: uppercase;
    font-size: 1.3em;
}
.tracklist { margin: 5px 0 20px; }

.album-download {
    display: block;
    margin-top: 5px;
}
.album-download a.large-cta { display: block; }
.album-download .stream {
    margin: 25px auto;
    text-align: center;
}
.album-download .stream a { 
    font-size: 1.5em;
    padding: 5px 15px;
}

/* (Accordion) */
.accordion-item { border-bottom: 1px solid rgba(0,0,0,0.1);}
.accordion-item:last-of-type { border: none; }
.accordion-panel {  display: none; }
.accordion-item:first-of-type .accordion-panel { display: block; }


/* =Events
-------------------------------------------------------------- */
/* Events Hero */
body.page-template-page-events { background: #eadfd5; }

#section.events-hero {
    /* background:linear-gradient(to right, #e1d8f9, #e1d8f9 50%, #f3d4da 50%); */
    display: block;
    text-align: center;
    padding: 0;
    margin-top: -125px;
    margin-bottom: -125px;
    position: relative;
    -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 45%);
    mask-image:         linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 45%);
}
.hero-content {
    padding: 100px 0 250px;
    overflow: hidden;
    background-position: top 205px center !important;
    position: relative;
}
.hero-content img.title-png {
    width: 100%;
    max-width: 450px;
    margin: 25px auto 300px;
}

/* Listing Top */
.events-top.flex { justify-content: space-between; }
.events-top.flex>* { flex: inherit; }
.events-top .bandsintown { text-align: right; }
.events-top .bandsintown iframe { width: 120px !important; float: right; }
.bandsintown { padding: 15px 0; }
.bit-widget-container { 
    margin: 25px auto 0;
}
.bit-widget .bit-event {
    border-top: 1px solid rgb(228 217 201);
    color: #000000;
}

/* Event Listing */
.event-list-item {
    border-bottom: 1px solid #DDDDDD;
    font-size: 0.9em;
    line-height: 1.4em;
    font-weight: 400;
	padding: 25px 0;
}
.event-details.flex>* { flex: 1; }
.event-details.flex .event-location { flex: 2; }
.event-list-item a { text-decoration: none; }
.event-list-item .event-location { font-weight: 300; }
.event-list-item .event-date { 
    font-family: 'Gotham Book', sans-serif;
    text-transform: uppercase;
}
.event-list-item .event-location span {
    display: block;
    opacity: 0.6;
    color: #3d3a39;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.8em;
    text-transform: uppercase;
}

.event-purchase .large-cta { 
    padding: 15px;
    font-weight: 600;
}
.event-purchase .large-cta:nth-child(2) { border-left: none; }
.event-purchase .large-cta.status { opacity: 0.15; }

.event-listing .disclaimer {
    color: #3d3a39;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.8em;
    line-height: 1.4em;
    text-transform: uppercase;
    margin: 15px 0 5px;
    display: block;
}


/* =News
-------------------------------------------------------------- */
/* Listing */
#section.archive-listing {
    padding: 25px 0 100px;
}
.archive-listing article {
    padding: 70px 0;
    text-align: center;
    position: relative;
}
.archive-listing article:before,
.archive-listing article:after {
    content: '';
    width: 1px;
    height: 55px;
    background: #dad0b3;
    position: absolute;
    left: 50%;
    top: 0;
}
.archive-listing article:after { top: auto; bottom: 0; }
.archive-listing article:first-of-type:before { display: none;}
.archive-listing article:first-of-type { padding-top: 0; }
.archive-listing article:last-of-type:after { display: none;}
.archive-listing article:last-of-type { padding-bottom: 0; }

.archive-listing article .post-thumbnail img {
    height: auto;
    width: 100%;
    max-width: 560px;
    margin: 25px auto;
    border: 1px solid rgba(0,0,0,0.1);
}
article .entry-date {
    color: #685e5c;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.85em;
    line-height: 1.4em;
    text-transform: uppercase;
}
.archive-listing article h2.entry-title { padding: 0 25px; }
.archive-listing article h2.entry-title { margin: 15px auto 10px; }
.archive-listing article h2.entry-title a { text-decoration: none; }
.archive-listing article .article-list-excerpt { max-width: 700px; margin: 0 auto; }
.archive-listing article .article-list-excerpt a.large-cta { margin: 25px auto; display: table; }

/* Single */
body.single-post h1.entry-title { font-size: 2.25em; margin: 25px auto 15px; }
body.single-post article .post-thumbnail,
body.single-post article .post-thumbnail img {
    height: auto;
    width: 100%;
    max-width: 640px;
    margin: 0 auto 15px;
}
body.single-post article .article-list-header {
    margin: 0 auto 25px;
    padding: 15px 0;
    text-align:  center;
}
body.single-post .view-all a.large-cta {
    margin: 75px auto 0;
    width: 100%;
}

/* Pagination */
.paginate .wp-paginate { 
    width: 100%;
    padding: 5px 0;
    text-align: center;
    margin: 0 auto 50px;
}
.paginate .wp-paginate .current {
    color: #fcefcc;
    background: #732d2d;
    border: 1px solid #732d2d;
    margin-right: 5px;
    padding: 5px 10px;
    font-size: 0.8em;
}
.paginate .wp-paginate a {
    background: transparent;
    border: 1px solid #fcefcc;
    color: #fcefcc;
    margin: 0 5px;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    font-size: 0.8em;
    opacity: 0.25;
}
.paginate .wp-paginate a:hover {
    opacity: 1;
    color: #fcefcc;
    background: #732d2d;
    border: 1px solid #732d2d;
}

/* =Media
-------------------------------------------------------------- */
.media-listing .page-header { text-align: center; padding: 25px 0; }
.media-listing .page-header h1.page-title { font-size: 2em; letter-spacing: 0.08em; }
.media-listing .archive-grid.flex {
    align-items: inherit;
}
.media-listing .archive-grid.flex>* {
    flex: 1 0 33.3%;
    width: 33.3%;
    max-width: 33.3%;
    padding: 5px;
    margin-bottom: 15px;
}
.media-listing .archive-grid article .post-thumbnail,
.media-listing .archive-grid article .post-thumbnail img { 
    width: 100%; 
    height: 250px;
    overflow: hidden;
}
.media-listing article .post-thumbnail img { 
    object-fit: cover; 
    object-position: center;
    border: 1px solid #252525;
}
.media-listing .archive-grid article h4 {
    font-size: 1em;
    margin: 10px auto 20px;
}

/* Videos */
article.single-video .media-title { margin: 25px auto; }
article.single-video .media-title .entry-content { text-align: center; padding: 0 5vw; color: #928679; }
article.single-video .media-title .entry-content span.edit-link { display: block; }

body.page-media,
body.single-videos, body.post-type-archive-videos,
body.single-photos, body.post-type-archive-photos {
    background: #131210;
    color: #fcefcc;
}
body.page-media button.menu-toggle span,
body.single-videos button.menu-toggle span,
body.single-photos button.menu-toggle span,
body.post-type-archive-videos button.menu-toggle span,
body.post-type-archive-photos button.menu-toggle span { background: #a98f4a; }
#section.featured-video { padding: 0 0 50px; }
.more-media {
    padding: 50px 0;
    border-top: 1px solid #433b2f;
}

body.page-media .menu-quick-container li a,
body.single-videos .menu-quick-container li a,
body.single-photos .menu-quick-container li a,
body.post-type-archive-videos .menu-quick-container li a,
body.post-type-archive-photos .menu-quick-container li a { color: #807c72; }
body.page-media .menu-quick-container li a:hover,
body.single-videos .menu-quick-container li a:hover,
body.single-photos .menu-quick-container li a:hover,
body.post-type-archive-videos .menu-quick-container li a:hover,
body.post-type-archive-photos .menu-quick-container li a:hover { color: #fcefcc; }

/* Media Listing */
article .post-thumbnail,
article .post-thumbnail img { 
    width: 100%; 
    height: 280px;
    overflow: hidden;
}
article .post-thumbnail img { 
    object-fit: cover; 
    object-position: center;
}
.media-title { text-align: center; margin-bottom: 10px; }
.media-title h4 {
    font-size: 1.25em;
    line-height: 1.2em;
    margin: 0 auto;
}
.media-title h4 a {
    text-decoration: none;
}

.media-title h1.entry-title { font-size: 2em; margin: 0 auto 10px; }
.media-carousel .media-title { 
    margin: 10px auto;
    padding: 0 15px;
    text-align: center;
}


.media-title .media-type {
    opacity: 0.8;
    color: #685e5c;
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.8em;
    line-height: 1.4em;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
body.single-photos article .media-type,
body.post-type-archive-videos article .media-type { display: none; }

/* Photos */
body.single-photos .media-title h1.entry-title {
    margin: 15px auto 50px;
}
.photo-gallery .view-all { margin-top: 50px; }
.photo-gallery .photo-grid {
    display: flex;
    flex-wrap: wrap;
}
.photo-gallery .photo-grid .gallery-item { 
    flex: 1 0 25%; 
    width: 25%; 
    max-width: 25%; 
    height: 225px; 
    padding: 5px; 
    margin-bottom: 10px;
}
.photo-gallery .photo-grid .gallery-item img { object-fit: cover; height: 225px; }

body.page-media a.large-cta,
body.single-videos a.large-cta,
body.single-photos a.large-cta,
body.post-type-archive-videos a.large-cta,
body.post-type-archive-photos a.large-cta {
    color: #807c72;
}
body.page-media a.large-cta:hover,
body.single-videos a.large-cta:hover,
body.single-photos a.large-cta:hover,
body.post-type-archive-videos a.large-cta:hover,
body.post-type-archive-photos a.large-cta:hover {
    color: #fcefcc;
}

/* View All */
.view-all { display: block; margin: 0 auto 100px; text-align: center; }
.view-all .large-cta { display: table; margin: 25px auto; }
.view-all.flex { padding: 25px 0; margin: 5px auto; }
.view-all.flex .large-cta { display: inline-block; margin: 0; }


/* About  */
body.page-about footer.site-footer{
    background: #fcefcc url('images/MB20_2023-about-bg.jpg') no-repeat top center / cover;
    padding: 50vw 0 20px;
    margin-top: -40vw;
}
body.page-media footer.site-footer a,
body.single-videos footer.site-footer a,
body.single-photos footer.site-footer a,
body.post-type-archive-videos footer.site-footer a,
body.post-type-archive-photos footer.site-footer a,
body.page-about footer.site-footer a { color: #fcefcc; }

body.page-media footer.site-footer .site-info,
body.single-videos footer.site-footer .site-info,
body.single-photos footer.site-footer .site-info,
body.post-type-archive-videos footer.site-footer .site-info,
body.post-type-archive-photos footer.site-footer .site-info,
body.page-about footer.site-footer .site-info {
    color: #928679;
}
body.page-media footer.site-footer .site-info a,
body.single-videos footer.site-footer .site-info a,
body.single-photos footer.site-footer .site-info a,
body.post-type-archive-videos footer.site-footer .site-info a,
body.post-type-archive-photos footer.site-footer .site-info a,
body.page-about footer.site-footer .site-info a { color: #c6ba9b; }

body.page-media footer.site-footer .please-co img,
body.single-videos footer.site-footer .please-co img,
body.single-photos footer.site-footer .please-co img,
body.post-type-archive-videos footer.site-footer .please-co img,
body.post-type-archive-photos footer.site-footer .please-co img,
body.page-about footer.site-footer .please-co img {
    filter: invert(1);
}


/* =Single (Splash)
-------------------------------------------------------------- */
header#masthead.splash {
    padding: 30px 0;
}
header#masthead.splash h1 {
    margin: 0 auto;
    text-align: center;
}
header#masthead.splash ul#menu-quick { margin: 0; }
header#masthead.splash ul#menu-quick li a { font-size: 0.9em; }

#section.home-album.single {
    padding: 25px 0 50px;
}
#section.home-album.single .album-title h3 {
    font-size: 1.5em;
}

#section.home-album.single .album-title a.large-cta {
    font-size: 1em;
    padding: 20px 15px;
    display: block;
    margin: 50px auto 0;
}

body.page-template-page-splash .event-listing h4 {
    margin: 0 auto 25px;
    text-align: center;
}
body.page-template-page-splash .event-list-item {
    font-size: 0.85em;
    padding: 20px 0;
    border-bottom: 1px solid #d8c9a2;
}

/* =Footer
-------------------------------------------------------------- */
footer.site-footer { 
    padding: 25px 0 75px;
}
footer.site-footer .footer-socials {
    width: 100%;
    max-width: 400px;
    font-size: 1.25em;
    margin: 0 auto 10px;
}
footer.site-footer .footer-socials .socials.flex { justify-content: space-between; }
footer.site-footer .footer-socials .socials.flex>* { flex: inherit; padding: 3px; }

/* Navigation */
footer.site-footer .footer-navigation { margin: 0 auto 25px; }
footer.site-footer .footer-navigation ul {
    display: flex; 
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
footer.site-footer .footer-navigation ul li { flex: inherit; padding: 10px; }
footer.site-footer .footer-navigation ul li a {
    font-family: 'Gotham Book', sans-serif;
    text-transform: uppercase;
    text-decoration: none;
}


/* Fixed Home Navigation */
.fixed-navigation {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99;
    width: 100%;
}
.fixed-navigation button{
    font-family: 'Gotham Light', sans-serif;
    background: #1b1001;
    color: #fcefcc;
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-align: center;
    display: block;
    padding: 18px 25px;
    cursor: pointer;
    width: 100%;
    border: none;
    border-radius: 0;
}
.fixed-navigation button:hover{
    background: #391a1c;
    color: #fcefcc;
}

/* Footer Pop Up */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 99; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
}
.modal-content {
    background: #1d1616;
    color: #fcefcc;
    margin: 0 auto;
    top: calc(50% - 275px);
    padding: 50px 50px 25px;
    overflow: hidden;
    min-height: 580px;
    text-align: center;
    width: 90vw;
    max-width: 750px;
    position: relative;
}
.modal-content h4 {
    margin: 0 auto 25px;
    text-align: center;
}

/* The Close Button */
.close {
    color: #665939;
    float: right;
    font-size: 2em;
    position: absolute;
    top: 20px;
    right: 25px;
    z-index: 9;
}
.close:hover,
.close:focus {
    color: #772d2e;
    text-decoration: none;
    cursor: pointer;
}

/* Copyright */
footer.site-footer .site-info { 
    font-family: 'IBM Plex Mono', sans-serif;
    font-size: 0.75em; 
    line-height: 1.4em; 
    text-align: center;
}
footer.site-footer .site-info ul { margin: 0 0 5px; }
footer.site-footer .site-info ul li { display: inline-block; margin-right: 10px; }

footer.site-footer .copyright.flex { padding: 10px 0; }
footer.site-footer .copyright.flex>* { flex: inherit; }
footer.site-footer .please-co { margin: 15px auto; }
footer.site-footer .please-co img { max-width: 60px; opacity: 0.15;
    transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;  }
footer.site-footer .please-co img:hover { opacity: 1; }



/* =Mobile (Media Queries)
-------------------------------------------------------------- */
@-ms-viewport {
  width: device-width;
}
@viewport {
  width: device-width;
}

@media only screen and (max-width: 1120px) {
    /* Events */
    .container.hero-content { 
        padding: 100px 0 250px;
        width: 100%; 
        background-position: bottom center !important;
    }
    .hero-content img.title-png { max-width: 400px; }

    /* Media */
    .media-listing .archive-grid article .post-thumbnail,
    .media-listing .archive-grid article .post-thumbnail img { height: 200px; }
}
@media only screen and (max-width: 980px) {
    header#masthead.splash { padding: 20px 0 15px; }
    header#masthead.splash .container.flex { flex-direction: column; }
    header#masthead.splash h1.site-title  { font-size: 2em; margin: 0 auto 5px; }
    header#masthead.splash .menu-quick-container { margin: 10px auto; }

    /* Events */
    .event-list-item { padding: 30px 0; }
    .event-list-item .event-date  { 
        flex: 1 0 100%;
        font-family: 'Gotham Book', sans-serif;}

    /* Home */
    #section.home-album .fullscreen-gallery .owl-item,
    #section.home-album .fullscreen-gallery .owl-item img { height: 500px; }
    #section.home-album .album-title h3 { font-size: 2em; }

    #section.home-purchase .purchase ul li { flex: 1 0 25%; width: 25%;  max-width: 25%; }

    /* Releases */
    .releases-detail.flex { flex-direction: column; }
    .album-image { text-align: center; }
    .album-image img { max-width: 520px; margin: 0 auto; }


    /* Events */
    #section.events-hero {
        -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 35%);
        mask-image:         linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 35%);
    }
    .container.hero-content { 
        padding: 100px 0 200px;
        width: 100%; 
    }
    .hero-content img.title-png { max-width: 360px; margin: 50px auto 250px;}

    /* Media */
    .media-listing .archive-grid.flex>* { flex: 1 0 50%; width: 50%; max-width: 50%; }
    .media-listing .archive-grid article .post-thumbnail,
    .media-listing .archive-grid article .post-thumbnail img { height: 220px; }

    /* News */
    .archive-listing article .post-thumbnail,
    .archive-listing article .post-thumbnail img {
        height: auto;
        width: 100%;
        max-width: 560px;
    }

    /* Footer */
    footer.site-footer .footer-logo img { max-width: 190px; margin-bottom: 5px; }
    footer.site-footer .container.flex { flex-direction: column; }
    footer.site-footer .container.flex .footer-copyright { order: 3; margin: 0 auto; padding: 0; }

    /* Events */
    .event-details.flex .event-purchase { flex: 1; }

}   
@media only screen and (max-width: 720px) {
    button.menu-toggle { right: 0; }
    .menu-quick-container { display: none; }
    header#masthead .toggled button.menu-toggle {
        top: 15px;
        right: calc(15px + 3vw);
    }
    .main-navigation.toggled .menu-main-navigation-container { margin-top: 80px; padding: 0 5px; }
    header#masthead nav.main-navigation li a { padding: 15px 0; font-size: 2em; }

    /* Home */
    #section.home-purchase h4 { font-size: 1.5em; }
    #section.home-purchase .purchase ul { justify-content: center; }
    #section.home-purchase .purchase ul li { flex: 1 0 33.3%; width: 33.3%;  max-width: 33.3%; padding: 20px 15px; border: none; }

    /* Releases */
    .photo-gallery .photo-grid .gallery-item,
    .releases-listing.flex>*,
    .archive-listing.flex>* {
        flex: 1 0 50%;
        width: 50%;
        max-width: 50%;
        padding: 5px 5px 15px;
    }
    .photo-gallery .photo-grid .gallery-item,
    .photo-gallery .photo-grid .gallery-item img { height: 225px; }
    .releases-detail.flex>* { padding: 5px 10px; }
    .releases-detail h2 { width: 100%; font-size: 2.5em; }
    .disc-title { font-size: 1.4em; }
    .owl-nav button { width: 40px; height: 40px; margin: 0; }

    /* Events */
    .event-list-item .event-date  { 
        font-family: inherit;
        font-weight: 600;
        font-size: 1.25em;
        margin: 5px auto;
        text-align: left;
    }
    .event-details.flex { align-items: inherit; }
    .event-details.flex .event-location { flex: 1; text-align: right; }
    .event-details.flex .event-city,
    .event-details.flex .event-location { font-size: 1.15em; }
    .event-details.flex .event-purchase {
        flex:  1 0 100%;
        width: 100%;
        margin: 15px auto 0;
        font-size: 1.2em;
    }

    /* Releases */
    .releases-detail .releases-details .album-title h2 { font-size: 1.75em; }

    /* Splash */
    #section.home-album.single .album-title h3 { font-size: 1.25em; }
    body.page-template-page-splash #section.event-listing { border-top: 1px solid #d8cdb0; padding-top: 50px; }
    body.page-template-page-splash .event-listing h4 { font-size: 1.5em; }

    /* Media */
    article .post-thumbnail, article .post-thumbnail img { height: 220px; }
    .media-listing .archive-grid.flex>* { flex: 1 0 50%; width: 50%; max-width: 50%; }
    .media-listing .archive-grid article .post-thumbnail,
    .media-listing .archive-grid article .post-thumbnail img { height: 250px; }
    .media-title h1.entry-title { font-size: 1.5em; line-height: 1.2em; }

    /* About */
    body.page-about #section.main-page{
        background: #fcefcc url('images/MB20_2023-about-bg.jpg') repeat-x bottom center / 140% auto;
        padding: 0 0 400px;
    }
    body.page-about footer.site-footer { background: #000; padding: 30px 0 60px; margin: 0 auto; }
    body.page-about footer.site-footer .site-info {
        color: #999999;
    }
    body.page-about footer.site-footer a { color: #fcefcc; }
    body.page-about footer.site-footer .please-co img {
        opacity: 0.5;
        filter: invert(1);
    }

}
@media only screen and (max-width: 640px) {
    body { font-size: 16px; line-height: 1.6em; }
    h1 { font-size: 3em; }
    h2 { font-size: 2.5em; }
    h3, h4 { font-size: 2em; }
    header.page-header h2.entry-title { font-size: 1.75em; text-align: center; margin: 25px auto; }
    .large-cta, a.large-cta { font-size: 0.85em; }

    #section { padding: 25px 0; }

    header#masthead nav.main-navigation li a { padding: 10px 0; }

    /* Home */
    #section.home-album .fullscreen-gallery .owl-item,
    #section.home-album .fullscreen-gallery .owl-item img { height: 450px; }
    #section.home-album .album-title h3 { font-size: 1.5em; }
    #section.home-album .album-title { margin: 15px auto 30px; }
    #section.home-album .album-title .album-details { 
        text-align: center; 
        font-size: 0.9em; 
        line-height: 1.45em; 
        margin: 20px auto; 
    }
    #section.home-purchase .purchase ul { margin: 30px auto  15px; }
    #section.home-purchase a.large-cta { padding: 15px; line-height: 1.2em; }

    /* Releases */
    #section.releases { padding: 0 0 50px; }
    .releases-detail.flex { flex-direction: column; }
    .releases-detail.flex>* { padding: 0 0 25px; }


    /* Events */
    #section.events-hero {
        margin-bottom: -75px;
        -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 35%);
        mask-image:         linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 35%);
    }
    .container.hero-content { 
        background-image: url('images/MB20-Mobile-BG.jpg') !important;
        padding: 90px 0 150px;
        width: 100%; 
        background-size: contain !important;
    }
    .hero-content img.title-png { max-width: 300px; }


    /* Media */
    .media-listing.flex>* {
        flex: 1 0 100%;
        width: 100%;
        max-width: 100%;
        padding: 5px 0 15px;
    }
    .media-listing article .post-thumbnail,
    .media-listing article .post-thumbnail img { height: 225px; }
    .media-listing article h3 { margin: 8px auto 15px; }

    .view-all.flex { margin: 25px auto 0; padding: 0; }
    .view-all.flex .large-cta { margin: 0 auto 5px; width: 100%; max-width: 400px; }

    .photo-gallery { padding-top: 0; }
    .photo-gallery .photo-grid .gallery-item,
    .photo-gallery .photo-grid .gallery-item img { height: 160px; }

    /* News */
    .archive-listing article h2.entry-title { font-size: 1.75em; }
    body.single-post article .article-list-header { padding: 10px 15px 0; }
    body.single-post article .article-list-header h1 { font-size: 2em; }

    /* Splash */
    #section.home-album.single { padding: 0 0 40px; }
    #section.home-album.single .album-title h3 { font-size: 1.1em; letter-spacing: 0; text-align: right; margin-bottom: 50px; }
    #section.home-album.single .album-title h3 span { text-align: left; }


    /* Footer */
    .fixed-navigation button { font-size: 0.9em; }
    footer.site-footer { padding: 15px 0 60px; }
    footer.site-footer .footer-navigation { display: none; }
    footer.site-footer .footer-socials {
        max-width:  300px;
        margin: 0 auto 25px;
    }
    footer.site-footer .footer-socials .socials.flex>* {
        font-size: 1.25em;
        text-align: center;
        padding: 5px;
        flex:  1 0 25%;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 520px) {
    header#masthead h1.site-title { font-size: 1.4em; }
    h1 { font-size: 2.5em; }
    h2 { font-size: 2em; }
    h3, h4 { font-size: 1.75em; }

    .modal-content { top: 0; width: 100%; height: 100dvh; padding: 10dvh 6vw 50px; }

    /* Events */
    .event-details.flex { align-items: center; flex-direction: column; }
    .event-details.flex>* { flex: 1 !important; }
    .event-details.flex .event-city {
        font-family: 'Gotham Book', sans-serif;
        font-size: 1.4em;
        line-height: 1.5em;
        text-transform: uppercase;
        text-align: center;
        margin: 5px auto;
    }
    .event-details.flex .event-location { text-align: center; }
    .event-details.flex .event-location span { padding: 5px 0; }
    .event-details.flex .event-purchase { margin-top: 25px; }

    /* Media */
    .media-listing .archive-grid.flex>* { flex: 1 0 100%; width: 100%; max-width: 100%; padding: 0; margin-bottom: 30px; }
    .media-listing .archive-grid article .post-thumbnail,
    .media-listing .archive-grid article .post-thumbnail img { height: 220px; }
    .media-listing .archive-grid article h4 { font-size: 1.2em; margin: 10px auto 0; }

    /* Home */
    #section.home-album .fullscreen-gallery .owl-item,
    #section.home-album .fullscreen-gallery .owl-item img { height: 280px; }
    #section.home-purchase { padding: 100px 0; }
    #section.home-purchase:before, #section.home-purchase:after { height: 75px; }
    #section.home-purchase .purchase ul li { flex: 1 0 50%; width: 50%; max-width: 50%; padding: 3vw 20px; }
    #section.home-video h4 { font-size: 1.5em; margin: 5px auto 25px; text-align: center; }

    /* Releases */
    .releases-listing.flex>* {
        flex: 1 0 100%;
        width: 100%;
        max-width: 100%;
        padding: 5px 0 15px;
    }
}