body {
     background-color: #f08400 !important;
     background-image: url('../images/OrangeBG.jpg');
     margin: 0;
}


* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

header {
  background-image: url('../images/header-bg-desktop.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.site-header {
  align-items: center;
  text-align: center;
  padding: 60px;
  background-color: #aa2119;
  color: #fff;
  font-family: sans-serif;
}

.header-border {
  background-image: url('../images/Border_Up.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 30px;
  margin-top: -30px;
}


header h1 {
  font-size: 48px;
  color: #fff;
  margin-top:-15px ;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
}


header h2 {
  font-size: 45px;
  color: #fbe814;
  margin-top: -30px;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}


.hero-container {
  position: relative;
  width: 100%;
  height: 100vh; /* Full viewport height */
  overflow: hidden;
  display: flex;
  align-items: center;
  margin-top: -5px;
  justify-content: center;
}

.bg-video-desktop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1; /* Pushes the video behind the content */
}

.bg-video-mobile {
 display: none; /* Hide mobile video by default */
}


.hero-container .content {
  position: relative;
  z-index: 1; /* Ensures text stays above the video */
  color: #ffffff;
  text-align: center;
}

.CriticsPick-logo
{
  max-width: 150px; 
  width: 100%; 
  height: auto;
  margin-top:-50px;  
   margin-left:150px;  
}

.bvsc-logo {
  max-width: 450px; 
  width: 100%; 
  height: auto;
  margin-left:700px;
}


.bvsc-credits-logo {
   
  width: 100%; 
  max-width: 650px;
  height: auto;
  margin-left:700px;
  margin-top:50px;
}


.winner-section {
  background-image: url('../images/RedBG.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.winner-section {
  align-items: center;
  text-align: center;
  padding: 20px;
  background-color: #aa2119;
  color: #fff;
  font-family: sans-serif;
}

.winner-border {
  background-image: url('../images/Border_Down.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 30px;
  margin-top: 0px;
}

.winner-section h1 {
  font-size: 60px;
  color: #fbe814;
  margin: 0 ;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}

.winner-text {
  color: #fff;
}


.winner-section h2 {
  font-size: 41px;
  color: #fff;
  margin-top:-10px;
  margin-bottom: 10px;
  text-transform: uppercase;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
  line-height: 1; /* Adjust line height for better spacing */
}

.event-section {
 
  margin: 0px auto;
  text-align: center;
  padding: 40px;
}


.event-section h2 {
  font-size: 50px;
  font-family: sans-serif;
  color: #fff;
  margin-top: -10px;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  margin-bottom: 5px; /* Add some spacing below the h1 */
}

.event-section .content_left
{
  max-width: 450px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/CTA_boxBG_left.png');
  
}

.event-section .content_left h2
{
 font-size: 45px;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  color: #fbe814;
  margin: 0 ;
  text-transform: uppercase;
   margin-top: 0px;
  margin-bottom: 10px; 
  
}

.event-section .content_left h3
{
 font-size: 35px;
  font-family: sans-serif;
  color: #fff;
  margin: 0 ;
  font-family: "manofa-condensed", sans-serif;
font-weight: 700;
line-height:1.1;
font-style: normal;
  text-transform: uppercase;
   margin-top: -30px;
  margin-bottom: 5px;
  
}

.ticket-button
{
  display: inline-block;
  padding: 10px 10px;
  background-image: url('../images/gettickets_bg.png');
  text-decoration: none;
  margin-top: 20px;
  max-width: 300px;
  width: 100%;
  margin-bottom: 20px;
}

.ticket-button a
{
  font-size: 32px;
  color:#931421; 
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "manofa-condensed", sans-serif;
font-weight: 700;
font-style: normal;
}

.ticket-button:hover
{
  display: inline-block;
  padding: 10px 10px;
  background-image: url('../images/gettickets_bg_hover.png');
  text-decoration: none;
  margin-top: 20px;
  max-width: 300px;
  width: 100%;
  margin-bottom: 20px;
}

.ticket-button a:hover
{
  font-size: 32px;
  color:#000; 
  font-family: "manofa-condensed", sans-serif;
font-weight: 700;
font-style: normal;
  text-transform: uppercase;
  text-decoration: none;
}

.event-section .content_right
{
  max-width: 450px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/CTA_boxBG_right.png');
  
}

.event-section .content_right h2
{
 font-size: 34px;
 font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  color: #fbe814;
  margin: 0 ;
  font-weight: bold;
  text-transform: uppercase;
   margin-top: 0px;
  margin-bottom: 10px; 
  
}

.event-section .content_right h3
{
 font-size: 38px;
  font-family: sans-serif;
  color: #fff;
  margin: 0 ;
  font-family: "manofa-condensed", sans-serif;
font-weight: 700;
line-height:1.1;
font-style: normal;
  text-transform: uppercase;
   margin-top: -40px;
  margin-bottom: 5px;
  
}


.nameplate
{
  max-width: 620px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/nameplate_bg.png');

  
}

.nameplate h1
{
color:#931421; 
font-size: 50px;
padding: 0px;
margin-bottom:20px; 
font-family: "manofa-condensed", sans-serif;
font-weight: 700;
font-style: normal;

}

.quote-border {
  background-image: url('../images/Border_Up.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 30px;
  margin-top: -30px;
}


.quote-section {
  background-image: url('../images/RedBG.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.quote-section {
  align-items: center;
  text-align: center;
  padding: 20px;
  background-color: #aa2119;
  font-family: sans-serif;
}


.quote-section h1 {
  font-size: 70px;
  color: #fff;
  margin-top: -20px ;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}


.quote-section h2 {
  font-size: 75px;
  color: #fbe814;
  margin-top: 30px ;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}

.quote-section h3 {
 font-size: 50px;
  color: #fbe814;
  margin-top:-20px;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}

.quote-section .quote-text {
  font-size: 21px;
  color: #fff;
  margin-top:-20px;
  padding: 20px;
  font-style: italic;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}


.responsive-container {
  display: flex;
  flex-direction: row; 
  gap: 0px;         
  width: 100%;
  max-width: 1400px;
}


.column {
  flex: 1;          
  padding: 20px;
}

.guitar-image {
 width:100%;
 max-width:800px; 
 margin-top:-100px; 
 margin-left:-100px; 
}

.column p {
  color: #fff;
  font-size: 18px;
  text-align: justify;
  line-height: 1.5;
  text-align-last: center;
  padding:10px; 
  max-width: 520px;
  font-family: "futura-pt", sans-serif;
font-weight: 400;
font-style: normal;

}

.column hr {
  width:60%;
  background-color: #fbe814; 
 
}

.credit-2 {
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-align: left;
  font-family: "futura-pt", sans-serif;
font-weight: 400;
font-style: normal;
margin-bottom:-80px; 
margin-left:-60px; 

}

.spotify-section {
  background-image: url('../images/RedBG_.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #aa2119;
  font-family: sans-serif;
}

.spotify-section-content {
  align-items: center;
  text-align: center;
  padding: 20px;
  width:100%;
  margin:0px auto;
  max-width: 1000px;  
}

.spotify-section h2 {
  font-size: 48px;
  color: #fbe814;
  margin-top: 40px;
  margin-bottom: 40px;
  font-weight: bold;
  line-height: 1.2;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.musicians_footer img
{
  width:100%;
  max-width: 1400px;
  margin-bottom:-5px; 
}


.embed-height
{
  height: 450px; 
}

.divider-image
{
  width: 100%;
  max-width: 300px !important;
  margin: 0 auto;
  margin-left:-150px; 
}

.video-section
{
width: 100%;
max-width: 1000px;
margin-bottom:40px; 
margin:0px auto;
text-align: center;
}

.video-section img 
{
width: 100%;
max-width:500px; 
margin-bottom:40px; 
}

.video-section h2 {
  font-size: 30px;
  color: #931421;
  margin-top: 10px ;
  margin-bottom: 10px ;
  font-weight: bold;
  font-family: "manofa-condensed", sans-serif;
  font-weight: 300;
  text-transform: none;
}

.flowers-image-desktop
{
  float:right; 
  width: 100%;
  max-width: 300px; 
  margin-top:-100px;
  margin-right:-20px;
}

.flowers-image-mobile
{
  display:none; 
}

.Quotes_Motif
{
  width:100%;
  max-width: 80px;
  padding:10px; 
  margin-bottom:-10px; 
}


.Quotes_Motif2
{
  width:100%;
  max-width: 120px;
  padding:10px; 
  margin-bottom:-10px; 
}

.BottomCTA_Motif_Top
{
  width:100%;
  max-width: 180px !important;
  margin-bottom:0px !important; 
}

.BottomCTA_Motif_Bottom
{
  width:100%;
  width:100%;
  max-width: 150px !important;
  margin-top:-10px !important; 
}

.bg-img-mobile-only
{
  display:none; 
}

/* Targets smartphones and smaller screens */
@media screen and (max-width: 768px) {

.bg-img-mobile
{
   background-image: url('../videos/bg-img-mobile.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
 width:100%;
 height: 100%;
 min-height: 500px;
}
  .bg-video-desktop-only
  {
    display:none !important; 
  }

  .ticket-button a
{
  font-size: 20px;
  color:#931421; 
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "manofa-condensed", sans-serif;
font-weight: 300;
font-style: normal;
}

  .CTA_Motif
  {
    display:none; 
  }
  .Quotes_Motif2
{
  width:100%;
  max-width: 60px;
  padding:10px; 
  margin-bottom:-5px; 
}

  .Quotes_Motif
{
  width:100%;
  max-width: 50px;
  padding:10px; 
  margin-bottom:-5px; 
}

.BottomCTA_Motif_Top
{
  width:100%;
  max-width: 180px !important;
  margin-bottom:10px !important; 
}

.BottomCTA_Motif_Bottom
{
  width:100%;
  width:100%;
  max-width: 150px !important;
  margin-top:0px !important; 
}

header {
  background-image: url('../images/header-bg-mobile.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.site-header {
  align-items: center;
  text-align: center;
  padding: 40px;
  background-color: #aa2119;
  color: #fff;
  font-family: sans-serif;
}

.header-border {
  background-image: url('../images/Border_Up-mobile.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 15px;
  margin-top: -15px;
}


header h1 {
  font-size: 26px;
  color: #fff;
  margin-top: 5px;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}


header h2 {
  font-size: 13px;
  color: #fbe814;
  margin: -10px;
  font-weight: bold;
  text-transform: uppercase;

}


.hero-container {
  position: relative;
  width: 100%;
  height: 100vh; /* Full viewport height */
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bg-video-desktop {
 display: none; /* Hide desktop video on mobile */
}

.bg-video-mobile {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1; /* Pushes the video behind the content */
}


.hero-container .content {
  position: relative;
  z-index: 1; /* Ensures text stays above the video */
  color: #ffffff;
  text-align: center;
}

.CriticsPick-logo
{
  max-width: 130px; 
  width: 100%; 
  height: auto;
  margin-left:280px;  
  margin-top:100px;  
  margin-bottom:130px; 
}

.bvsc-logo {
  max-width: 350px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
}


.bvsc-credits-logo {
   
  width: 100%; 
  max-width: 400px;
  height: auto;
  margin:0px auto;
  text-align: center;
  margin-top:20px;
}

.credit-2 {
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-align: center;
  font-family: "futura-pt", sans-serif;
font-weight: 400;
font-style: normal;
margin-bottom:0px; 
margin-top:20px; 
margin-left:0px; 

}

.winner-border {
  background-image: url('../images/Border_down-mobile.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 30px;
  margin-top: -20px;
}

.winner-section h1 {
  font-size: 18px;
  color: #fbe814;
  margin-top: 10px;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 10px; /* Add some spacing below the h1 */
}

.winner-text {
   color: #fbe814;
}


.winner-section h2 {
  font-size: 29px;
  color: #fff;
  margin-bottom: 25px;
  font-weight: bold;
  text-transform: uppercase;
  line-height: .9; /* Adjust line height for better spacing */
}



.event-section {
 
  margin: 0px auto;
  text-align: center;
  padding: 40px;
}


.event-section h2 {
  font-size: 25px;
  font-family: sans-serif;
  color: #fff;
  margin: 0 ;
  font-family: "manofa-condensed", sans-serif;
font-weight: 300;
font-style: normal;
  text-transform: uppercase;
  margin-bottom: -15px; /* Add some spacing below the h1 */
}

.event-section .content_left h2
{
 font-size: 40px;
  font-family: "cubano", sans-serif;
font-weight: 400;
  color: #fbe814;
  margin: 0 ;
  font-weight: bold;
  text-transform: uppercase;
   margin-top: -15px;
  margin-bottom: 10px; 
  
}



.event-section .content_left h3
{
 font-size: 22px;
 
  color: #fff;
  margin: 0 ;
   font-family: "manofa-condensed", sans-serif;
font-weight: 300;
  text-transform: uppercase;
   margin-top: 20px;
  margin-bottom: 5px;
  
}

.event-section .content_left
{
  max-width: 400px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/CTA_boxBG_left-mobile.png');
  
}

.event-section .content_right
{
  max-width: 420px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/CTA_boxBG_right-mobile.png');
  
}

.event-section .content_right h2
{
 font-size: 30px;
  font-family: "cubano", sans-serif;
font-weight: 400;
  color: #fbe814;
  margin: 0 ;
  font-weight: bold;
  text-transform: uppercase;
   margin-top: 0px;
  margin-bottom: 20px; 
  
}

.event-section .content_right h3
{
 font-size: 20px;
  color: #fff;
  margin: 0 ;
   font-family: "manofa-condensed", sans-serif;
font-weight: 300;
  text-transform: uppercase;
   margin-top: 20px;
  margin-bottom: -10px;
  
}



.nameplate
{
  max-width: 400px; 
  width: 100%; 
  height: auto;
  margin:0px auto;
  text-align: center;
  background-image: url('../images/nameplate_bg_mobile.png');
  
}

.nameplate h1
{
color:#931421; 
font-size: 33px;
 padding: 0px;
font-family: "manofa-condensed", sans-serif;
font-weight: 700;
font-style: normal;
margin-bottom:10px; 
}

.quote-border {
  background-image: url('../images/Border_Up-mobile.png');
  background-repeat: repeat-x;
  background-position: bottom center; 
  height: 30px;
  margin-top: -30px;
}


.quote-section {
  align-items: center;
  text-align: center;
  padding: 20px;
  background-color: #aa2119;
  font-family: sans-serif;
}


.quote-section h1 {
  font-size: 50px;
  color: #fff;
  margin-top: -10px ;
  font-family: "cubano", sans-serif;
font-weight: 400;
font-style: normal;
  text-transform: uppercase;
}


.quote-section h2 {
  font-size: 40px;
  color: #fbe814;
  margin-top: 30px ;
  font-weight: bold;
  text-transform: uppercase;
}

.quote-section h3 {
 font-size: 28px;
  color: #fbe814;
  margin-top:-5px;
  font-weight: bold;
  text-transform: uppercase;
}

.quote-section .quote-text {
  font-size: 16px;
  color: #fff;
  margin-top: -10px;
  padding: 5px;
  font-style: italic;
  font-weight: 100;
  text-transform: uppercase;
  margin-bottom:30px; 
}

  .responsive-container {
    flex-direction: column; /* Stacks elements: one on top, one at the bottom */
  }
  

.spotify-section {
  background-image: url('../images/RedBG_.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #aa2119;
  font-family: sans-serif;
}

.spotify-section-content {
  align-items: center;
  text-align: center;
  padding: 20px;
  width:100%;
  margin:0px auto;
  max-width: 800px;  
}

.spotify-section h2 {
  font-size: 30px;
  color: #fbe814;
  margin-top: 20px ;
  font-weight: bold;
  text-transform: uppercase;
}

.musicians_footer img
{
margin-left:-20px; 
margin-bottom:-5px; 
}

.embed-height
{
  height: 460px !important; 
}

.divider-image
{
  width: 100%;
  max-width: 300px !important;
  margin: 0 auto;
}

.guitar-image {
 width:100%;
 max-width:600px; 
 margin-top:-100px; 
 margin-bottom: -30px;
 margin-left:0px;

}

.video-section
{
width: 100%;
max-width: 1000px;
margin-bottom:40px !important; 
margin:0px auto;
text-align: center;
}

.video-section img 
{
width: 100%;
max-width:500px; 
margin-bottom:0px; 
}

.video-section h2 {
  font-size: 20px;
  color: #931421;
  margin-top: 0px ;
  margin-bottom: 10px ;
   font-family: "manofa-condensed", sans-serif;
font-weight: 300;
  text-transform: none;
}


.flowers-image-desktop
{
  display:none; 
}

.flowers-image-mobile
{
   display:block; 
  width: 100%;
  max-width: 200px; 
  margin:0px auto; 
  margin-top:-80px;
  margin-bottom:-10px;
}

.column p {
    color: #fff;
    font-size: 18px;
    text-align: justify;
    line-height: 1.5;
    text-align-last: center;
    padding: 10px;
    max-width: 520px;
    font-family: "futura-pt", sans-serif;
    font-weight: 400;
    font-style: normal;
}

}



/* Styling for the trigger image */
.video-trigger {
  cursor: pointer;
  border-radius: 8px;
  transition: opacity 0.3s;
}
.video-trigger:hover {
  opacity: 0.8;
}

/* Modal Overlay backdrop (hidden by default) */
.video-modal {
  display: none; 
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85);
  z-index: 1000;
  justify-content: center;
  align-items: center;
}

/* Modal Content Box */
.modal-content {
  position: relative;
  width: 90%;
  max-width: 800px;
}

/* Close Button styling */
.close-btn {
  position: absolute;
  top: -40px;
  right: 0;
  color: #fff;
  font-size: 35px;
  cursor: pointer;
}

/* Aspect ratio maintainer for responsive 16:9 video */
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}