/*
You can type here custom CSS code, which will be loaded both on your admin and front-end pages. Please make sure to not override layout properties (positions and sizes), as they can interfere with the sliders built-in responsive functionality. Here are few example targets to help you get started:
*/

.ls-container { /* Slider container */

}

.ls-layers { /* Layers wrapper */ 

}

.ls-3d-box div { /* Sides of 3D transition objects */ 

}
.q_slider .ls-bg-video-overlay {
  background-image: url('https://rhonegroupstg.wpenginepowered.com/wp-content/uploads/2026/08/hero-gradient-scaled.png') !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.q_slider .rg-hero-content { width: 100%; white-space: normal; text-align: left; color: #fff; }

.q_slider .rg-hero-title {
  font-family: 'Graphik', sans-serif !important; font-weight: 400 !important;
  font-size: 18px !important; line-height: 26px !important; letter-spacing: 0;
  color: #fff; margin: 0 0 15px;
}
.q_slider .rg-hero-sep { width: 100%; height: 1px; background: rgba(255,255,255,.75); margin: 0 0 15px; }
.q_slider .rg-hero-text {
  font-family: 'Gilda Display', serif !important; font-weight: 400 !important;
  font-size: 32px !important; line-height: 120% !important; letter-spacing: 0;
  color: #fff; margin: 0;
}

@media (min-width: 768px) and (max-width: 1399px) {
  .q_slider .rg-hero-title { font-size: 20px !important; }
  .q_slider .rg-hero-text  { font-size: 42px !important; }
}
@media (min-width: 1400px) {
  .q_slider .rg-hero-title { font-size: 24px !important; }
  .q_slider .rg-hero-text  { font-size: 56px !important; }
}