﻿.parallax-section {
  position: relative;
  /*min-height: 100vh;  Full viewport height minimum, expands if content is longer */
  overflow: hidden;
  color: #fff; /* White text for visibility on dark backgrounds; adjust as needed */
  text-shadow: 2px 2px 2px rgba(0,0,0, 1);
  text-align: center; /* Optional: centers content */
}

.parallax-layer {
  position: absolute;
  top: 10%; /* Extra space for parallax movement without clipping */
  left: 0;
  width: 100%;
  height: 150%; /* Extra height for smooth scrolling */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  will-change: transform; /* Performance optimization */
  z-index: -1; /* Behind content */
}

.parallax-background {
  background-image: url('../images/hoempage21BW.jpg');
  z-index: -2; /* Below overlay */
  opacity: 0.95; /* Adjust: 1.0 = fully opaque, 0.0 = invisible */
}

.parallax-overlay {
  background-image: url('../images/dirtBW.png');
  background-blend-mode: multiply; /* Optional: blends dirt for a dusty effect; remove if not wanted */
  opacity: 0.8; /* Dirt layer more transparent for subtle effect */
  top: 0%;   /* Give it more room to move down from higher up */
  width:125%;
}

.parallax-content {
  position: relative;
  z-index: 1; /* Above backgrounds */
   /*padding: 10vh 10% 10vh; Vertical padding to center content; adjust for your needs */
   padding:10% 5%;
  max-width: 1200px; /* Optional: constrains content width for readability */
  margin: 0 auto;
}

/* Media query for smaller devices */
@media (max-width: 768px) {
  .parallax-content {
    /*padding: 15vh 5% 10vh;*/
     padding:10% 5%;
  }
}