/*  Small screens */
@media only screen {

/*************** HEADER **********************/

#slider-row {position: relative; }
.header-slideshow-image {filter: grayscale(100%); z-index: -1;}
.header-slideshow-image:after {opacity: .4;}
#title-row {position: absolute; text-align: center; width: 100%; }
/*************** Content **********************/
.gradient-left {margin-left: 20px;}
.gradient-right {margin-right: 20px;}
.black-bg .block-single-inner, .grey-bg .block-single-inner {padding: 38px; }
.img-block img, .more-blocks img {width: 100%; object-fit: cover;height: 100%;}
.home-blocks .grey-bg .block-single-inner p{padding: 28px 19px; margin-bottom: 0;}
.home-blocks .grey-bg .block-single-inner p:has(img) {padding: 0;}
.home-blocks .grey-bg .block-single-inner {padding: 0;}
.home-blocks .grey-bg img {width: 100%;}
.home-blocks .black-bg .block-single-inner {display: flex; flex-direction: column;}
.home-blocks .black-bg .block-single-inner h3 {flex-grow: 1;}
.home-blocks p:has(img), .more-blocks p:has(img){display: flex; width: 100%; height: 100%;}
.grey-bg .block-single-inner p:last-of-type, .black-bg .block-single-inner p:last-of-type{margin-bottom: 0;}
.transparent-bg.xtra-pad-col h2 {margin-bottom: 2rem;}
.transparent-bg.xtra-pad-col {padding-top: 50px; padding-bottom: 50px;}
.home1 .button {margin-top: 30px;}
.home5 h3 span {font-weight: bold;}

blockquote, blockquote p {font-family: "spirits-sharp", serif;color: #fff;line-height: 1.3; font-size: 1.75rem;}
blockquote span, blockquote p span   {color: #DE2301;}
cite {color: #fff;font-family: "Work Sans", sans-serif;font-weight: bold;text-transform: uppercase;font-size: 1rem; font-style: normal; text-align: right; margin-top: 30px;}

.quote-row p span{font-family: "Work Sans", sans-serif;font-weight: bold;text-transform: uppercase;font-size: 12px; color: #A2A2A2;}
.discography-row p {line-height: 1.6;}
.photo-row .social-media {display: inline-block; font-size: 24px;}
.xtra-pad-col.tour-col {padding: 1rem;}
.video-blocks .column {padding: .5rem;}
/*************** Mosaic grid **********************/
.container{display: grid;grid-template-columns: repeat(12, 1fr);grid-gap: 1rem;}

.tile img{width: 100%;height: 100%;object-fit: cover;}

.tile:nth-child(15n+1){grid-column: span 6;grid-row: span 2;}

.tile:nth-child(15n+2),
.tile:nth-child(15n+3){grid-column: span 3;}
.tile:nth-child(15n+4){grid-column: span 6;}
.tile:nth-child(15n+5),
.tile:nth-child(15n+6),
.tile:nth-child(15n+7){grid-column: span 4;   }
.tile:nth-child(15n+8){grid-column: span 7;grid-row: span 2;}
.tile:nth-child(15n+9),
.tile:nth-child(15n+10){grid-column: span 5;}
.tile:nth-child(15n+11){grid-column: span 5;}
.tile:nth-child(15n+12){grid-column: span 7;   }
.tile:nth-child(15n+13){grid-column: span 3;}
.tile:nth-child(15n+14){grid-column: span 6;}
.tile:nth-child(15n+15){grid-column: span 3;}


/*************** Blog **********************/
.main-blog-row .post:nth-of-type(3n+1) {
    margin-left: 10%;
}

.main-blog-row .post:nth-of-type(3n+3) {
    margin-left: 20%;
}
.blog .card-divider {background: #DE2301; justify-content: center; padding: 1.25rem;}
.blog .card-divider .blog-title a {color: #fff; font-family: "Work Sans", sans-serif;font-weight: bold;text-transform: uppercase;}
.blog-title a {font-size: 1.25rem;}

.menu .active>a {background: #DE2301; color: #fff;}
.menu a {color: #fff;}
#tertiary li{
    padding: 10px;
    text-transform: uppercase;
    background: #1F1F1F;
    margin-bottom: 10px;
    font-size: 1rem;
    transition: all ease .5s;
    color: #fff;
}
#tertiary {background: #000; padding: 1.5rem; text-align: center;}
#tertiary a {color: #fff;}

} /* Define mobile styles */

@media only screen and (max-width: 40em) {
.small-only-float-left {float: left !important;}	
.small-only-float-right {float: right !important;}
.small-only-float-center {display: block; margin-right: auto; margin-left: auto;}
.text-center-small {text-align: center;}
.small-align-center {-ms-flex-pack: center; justify-content: center;}
.widget-container, #top-row, .tagline{text-align: center;}
img.alignright, img.alignleft{float: none !important;display: block;margin: 0 auto;	}
#middle-row {background: #1F1F1F;}
.overlay:after {opacity: .7;}
.text-right-small {text-align: right;}
.blog-title a {font-size: 1rem;}
.tagline h1 {font-size: 3.4rem;}
.home-blocks .black-bg .block-single-inner h3 {font-size: 1.5rem;}
.xtra-pad-col h2 {font-size: 1.5rem;}
} /* max-width 640px, mobile-only styles, use when QAing mobile issues */

/*  Medium screens */
@media only screen and (min-width: 40.063em) {

.entry-title {font-size: 4rem;}
.tagline{position: absolute; right: 50px;   bottom: 50px; z-index: 1; text-align: right;}

 } /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 63.938em) {
.medium-float-left {float: left !important;}	
.medium-float-right {float: right !important;}
.text-center-medium {text-align: center;}
.medium-align-center {-ms-flex-pack: center; justify-content: center;}
#middle-row {background: #1F1F1F;}
.tagline {bottom: 0;}
.tagline h1 {font-size: 3.4rem;}
.overlay:after {opacity: .7;}
.home-blocks .black-bg .block-single-inner h3 {font-size: 1.6rem;}
.home-blocks .grey-bg img {width: 100%;}
.home-blocks .black-bg {display: flex;}
.text-right-medium {text-align: right;}
} /* min-width 641px and max-width 1023px, use when QAing tablet-only issues */

/* Large screens */
@media only screen and (min-width: 64.000em) {
.wrapper {padding: 1.875em 0;}
.align-middle-large{-webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
.header-slideshow-image { margin-top: -191px;}
.gradient-left {margin-left: auto;}
.gradient-right {margin-right: auto;}
.transparent-bg {background: rgba(0, 0, 0, 0.5);}
.home2.overlay:after {opacity: .5;}
.transparent-bg.xtra-pad-col {padding-top: 150px; padding-bottom: 150px;}
#title-row {bottom: 30px;}
.xtra-pad-col {padding: 3rem;}

} /* min-width 1024px, large screens */

@media only screen and (min-width: 64.000em) and (max-width: 90em) {
.large-float-left {float: left !important;}	
.large-float-right {float: right !important;}
.text-center-large {text-align: center;}
.large-align-right {-ms-flex-pack: end; justify-content: flex-end;}
.overlay {padding-left: 1rem; padding-right: 1rem;}


} /* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */

/*  XLarge screens */
@media only screen and (min-width: 90.063em) { 
body {background-size: contain;}
} /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) {
.xlarge-float-left {float: left !important;}	
.xlarge-float-right {float: right !important;}
.text-center-xlarge {text-align: center;}
} /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

/*  XXLarge screens */
@media only screen and (min-width: 120.063em) {
.xxlarge-float-left {float: left !important;}	
.xxlarge-float-right {float: right !important;}
.text-center-xxlarge {text-align: center;}
} /* min-width 1921px, xxlarge screens */

/*  Tablet Portrait screens */
@media only screen and (min-width: 37.500em) and (max-width: 56.250em) and (orientation: portrait) {
.hide-tablet-portrait {display: none !important;}
.show-tablet-portrait {display: inherit !important;}
 } /* tablet-only issues min-600px max-900px */
 @media only screen and (min-width: 49.900em) and (max-width: 85.250em) and (orientation: portrait) {
 } /* tablet-only issues min-800px max-1200px */