body, #wrapper{
  background-color: #000;
}

ol{
  padding-left:15px;
}

.content-wrap{
  padding-top:0;
}

/* ----------------
GLOBAL
---------------- */

::-moz-selection { 
  color: #FFF;
  background: #F68A39;
}

::selection {
  color: #FFF;
  background: #F68A39;
}

#music-player{
  float: right;
}

.icon-links{
    list-style: none;
}

.icon-links a:link, .icon-links a:visited, .icon-links a:hover, .icon-links a:active {
    color:rgba(256,256,256,.6);
}

.icon-links.black a:link, .icon-links.black a:visited, .icon-links.black a:hover, .icon-links.black a:active {
  color:rgba(0,0,0,.6);
}

.icon-links li{
    display:inline;
    margin-right:10px;
}

.page-section{
  padding-top:20px;
}

footer .icon-links{
  font-size: 1.5rem;
  padding-top:10px;
}

#footer h5{
  margin-bottom:0px;
}

#footer a:link,
#footer a:visited,
#footer a:hover,
#footer a:active {
  color: #F68A39
}

#primary-menu.style-3 > ul > li.current > a {
  background-color: rgba(256,256,256,.05);
}

#header #logo img{
  opacity: 100;
}

#header.sticky-header #logo img{
  opacity: 1;
  max-height: 40px;
}

.flex-control-nav li a{
  border:1px solid #000;
}

@media only screen and (max-width: 991px) {
  #header #logo img{
    opacity: 1;
    height:80px;
    margin-top:10px;
  }
}

  #about .photo-carousel{
    display:none;
  }

/* ----------------
HOME
---------------- */

#home-slider .icon-links{
  padding-top:20px;
  font-size: 2rem;
}

#home-slider h2{
  border-bottom: 1px solid #FFF;
  margin-bottom: 60px;
}

#home-slider h2 img{
  margin-bottom:-10%;
}

#slide-new-album{
  text-align: right;
  text-shadow: 1px 1px 1px rgb(0 0 0 / 15%);
  max-width:100%;
  width:100%;
}

#slide-new-album a, #slide-new-album a:visited{
  color:#FFF;
}

#slide-new-album a.text, #slide-new-album a.text:visited{
  background-color: rgba(246, 138, 57, 0.8);
  padding: 3px
}

#slide-new-album a:hover, #slide-new-album a:active{
  background-color: #F68A39;
}

#slide-new-album .promo-line{
  font-weight: bold;
}

#slide-new-album .homepage-album{
  box-shadow: 1px 1px 1px rgb(0 0 0 / 15%);
}

#slide-new-album .slider-caption {
  width:100%;
}

/* Red Brick Hill slider */
  #slide-rbh-album-mobile {
    display: none;
  }

  #slide-rbh-album {
    padding-top: 100px;
    width: 100%;
    display: flex;
    flex-wrap: wrap; /* Ensure items don't overflow */
    align-items: center; /* Vertically center the items */
}

#slide-rbh-album .homepage-album-container {
    flex: 0 0 50%; /* Make sure it takes up 50% of the width */
    max-width: 50%; /* Ensure it doesn't grow beyond 50% */
    padding-right: 40px;
}

#slide-rbh-album .homepage-album {
    box-shadow: 1px 1px 1px rgb(0 0 0 / 15%);
    width: 100%; /* Ensure the image uses up the full width of its container */
}

#slide-rbh-album .slider-caption {
    width: 100%;
    font-size: 1.5rem;
    padding-left: 40px;
    margin-left: 50%;
    flex: 0 0 50%; /* Make sure it takes up 50% of the width */
    max-width: 50%; /* Ensure it doesn't grow beyond 50% */
    display: flex;
    justify-content: center; /* Center the text vertically */
}

#slide-rbh-album .promo-line {
    width:100%;
    margin-top:70px;
}

#slide-rbh-album .promo-line .cta{
  font-size: 1.2rem;
  font-weight: bold;
}

#slide-rbh-album .promo-line .story{
    font-weight: thin;
    font-size:18px;
}

@media only screen and (max-width: 991px) {
  .header-banner {
    display:none;
  }

  #slide-rbh-album{
    display:none;
  }

  #slide-rbh-album-mobile .homepage-album-container {
    padding: 20px;
}

#slide-rbh-album-mobile .homepage-album {
  box-shadow: 1px 1px 1px rgb(0 0 0 / 15%);
  width: 75%;
}

#slide-rbh-album-mobile .promo-line .story{
  font-size:1rem;
  font-style:thin;
}

#slide-rbh-album-mobile .promo-line .cta {
  padding: 0 10px;
}

  #slide-rbh-album-mobile {
    padding-top: 150px;
    display: block;
  }

  #slide-rbh-album-mobile .slider-caption-mobile {
    font-size: 1.5rem;
  }

  #slide-rbh-album-mobile .homepage-album-container {
    width:100%;
    text-align:center;
  }

  #slide-rbh-album-mobile .homepage-album-container img {
    width:200px;
  }
  
}

.swiper-slide{
  background-position:center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size:contain;
}

.carrot{
  position: absolute;
  bottom:20px;
  left:50%;
  margin-left:-8px;
}

/* Red Brick hill text story */
#rbh-story {
  background-color: #E4E4DF;
  padding:20px;
  overflow: auto;
  width:100%;
  text-align: center;
}

#rbh-story img{
  max-width:430px;
}

#rbh-story-text  {
  text-align: left;
  width: 600px;
  margin:0 auto;
  color: #8B2520;
  font-size: 30px;
}

#rbh-story-text div{
  margin-bottom:20px
}

#rbh-story-text div.last{
  padding-top:20px;
  margin-bottom:0px;
}

@media only screen and (max-width: 991px) {

  #rbh-story {
    background-color: #E4E4DF;
    padding:20px;
    overflow: auto;
  }

  #rbh-story img{
    max-width:100%;
  }
  
  #rbh-story-text  {
    text-align: left;
    width: 600px;
    margin:0 auto;
    color: #8B2520;
    font-size: 18px;
  }
  
  #rbh-story-text div{
    margin-bottom:10px
  }
  
  #rbh-story-text div.last{
    padding-top:20px;
    margin-bottom:0px;
  }


  #home-slider {
    text-align: center;
  }

  #slide-new-album{
    text-align: center;
    left:50%;
    margin-left:-40%;
    width:80%;
  }

  #home-slider .icon-links{
    padding-top:0;
    margin-top:0;
    font-size: 2rem;
  }  

  #home-slider h2{
    display:none;
  }

  .swiper-slide{
    background-attachment: scroll;
  }

}

/*
Airplay 
*/
.airplay-card {
  float:left;
  margin-right:30px;
  max-width:230px;
  min-height:300px;
  margin-bottom:10px;
  padding:5px;
  box-shadow: 2px 2px 5px;
}

/* ----------------
PRESS
---------------- */

.news-headlines {
  margin-bottom: 80px;
}

.headline {
  margin-bottom:20px;
}

.news-headlines h3{
  font-size: 1.5rem;
  font-weight: bold;
  color: #0649A6;
  margin-bottom:0;
}

.news-headlines .date{
  font-size: .75rem;
  color:#CCC;
  margin-bottom:0;
}


/* ----------------
ABOUT
---------------- */
  #about .image-col{
      position: relative;
  }

  #about .photo-gallery{
    position: relative;
    list-style: none;
    margin-top:-170px;
  }

  
  #about .photo-gallery li img {
    position: absolute;
    box-shadow: 2px 2px 5px rgba(0,0,0,.4);
  }
  
  #about .photo-gallery li.first-image img{
    top:50px;
    left:0;
    z-index: 5;
  }
  
  #about .photo-gallery li.second-image img{
    top:420px;
    right:-100px;
    z-index: 10;
  }
  
  #about .photo-gallery li.third-image img{
    top:750px;
    left:10px;
    z-index: 20;
  }

  #clarinet-banner{
    background-color:#000;
    height:300px;
    background-image:url('/images/clarinet-keys.jpg');
    background-size:contain;
    background-attachment:fixed;
    background-repeat:no-repeat
  }

  @media only screen and (max-width: 600px) {
    #clarinet-banner{
      height:100px;
      background-image:url('/images/clarinet-keys-360.jpg');
      background-size:cover;
      background-attachment: initial;
    }
    
    #about .photo-gallery{
      display:none;
    }

    #about .photo-carousel{
      display:block;
      min-height: 500px;
    }
  }

/* ----------------
MUSIC
---------------- */  

  .musicians{
    list-style: none;
  }

  #music  h4{
    margin-bottom: 10px;
    font-weight: normal;
  }

  #music .icon-links{
    font-size: 1.75rem;
  }

  @media only screen and (max-width: 600px) {
    #music .album-header{
      display:none;
    }
  }

  .album-selector{
    list-style:none;
  }

  .album-selector li{
    display:inline-block;
    margin:0 10px 20px 0;
    overflow: visible;
  }

  .album-selector li img { 
    transition: all .2s ease-in-out; 
    }
    
    .album-selector li img:hover { 
    transform: scale(1.1); 
    }

    .buy-now-btn{
      background-color: #F68A39;
    color: #FFF;
    padding: 10px 5px;
    margin: 10px 0;
    display: block;
    text-align: center;
    font-size: 18px;
    }

    .buy-now-btn:hover{
      color: #FFF;
      font-weight: bold;
    }

    /* Default background image for larger screens */
.swiper-slide-rbh {
  background-image: url('/images/homepage-slider/red-brick-hill.png');
  background-size: cover;
  background-position: center;
}

/* Media query for mobile devices */
@media (max-width: 768px) {
  .swiper-slide-rbh {
      background-image: url('/images/homepage-slider/red-brick-hill-mobile.png');
  }
}

/* ----------------
EVENTS
---------------- */

#events{
  background-color: #F68A39;
}

#events, #events h1, #events a, #events a:link, #events a:visited,  #events a:hover, #events a:active {
  color:#FFF;
}

#quotes, #quotes h1, #quotes a, #quotes a:link, #quotes a:visited,  #quotes a:hover, #quotes a:active {
  color:#FFF;
}

.flexslider .slide-wrap {
  zoom: 1;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
}

/* ----------------
QUOTES
---------------- */
#quotes{
  background-color: #0B9AC5;
}

#quotes .testimonial .flex-control-nav li a{
  background-color: #FFF;  
}

#reviews figure, #reviews article{
  margin-bottom:50px;
  padding-bottom:25px;
  border-bottom:1px dashed #CCC
}

figure blockquote{
  margin-bottom:10px;
}

article h2{
  font-size: 1.2rem;
  margin-bottom: 0;
}

.section > .testimonial .testi-content{
  font-size: 25px;
}

.testi-meta span{
  color:#FFF;
}

.subpage h2{
  margin-bottom: 30px;
  color: red
}

/* ----------------
SLIDER NAVIGATION
---------------- */

/* Navigation Arrows */
.slider-arrow-left,
.slider-arrow-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(10px);
  border-radius: 50%;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
  font-size: 18px;
}

.slider-arrow-left:hover,
.slider-arrow-right:hover {
  background: rgba(0, 0, 0, 0.5);
  transform: translateY(-50%) scale(1.1);
}

.slider-arrow-left {
  left: 20px;
}

.slider-arrow-right {
  right: 20px;
}

/* Navigation Dots */
.swiper-pagination {
  position: absolute !important;
  bottom: 60px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  display: flex;
  gap: 12px;
  z-index: 10;
}

.swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  background: rgba(255, 255, 255, 0.5) !important;
  border-radius: 50% !important;
  opacity: 1 !important;
  cursor: pointer;
  transition: all 0.3s ease !important;
}

.swiper-pagination-bullet-active {
  background: #F68A39 !important;
  transform: scale(1.25) !important;
}

.swiper-pagination-bullet:hover {
  background: rgba(255, 255, 255, 0.8) !important;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  .slider-arrow-left,
  .slider-arrow-right {
    width: 40px;
    height: 40px;
    font-size: 14px;
  }
  
  .slider-arrow-left {
    left: 10px;
  }
  
  .slider-arrow-right {
    right: 10px;
  }
  
  .swiper-pagination {
    bottom: 50px !important;
  }
  
  .swiper-pagination-bullet {
    width: 10px !important;
    height: 10px !important;
  }
}