header.hero-slider { height:100vh; min-height:800px; > .container > .row { height:100vh; min-height:800px; } .overlay { background: rgba(0,0,0, 1); opacity:0.5; } .swiper-slide { > img + .content { position:absolute; z-index:2; top:0; left:0; width:100%; height:100%; >.container, > .container-fluid { position: relative; z-index: 2; > div { position: relative; height: 100%; min-height:960px; display: flex; justify-content: center; align-items: center; } } } .overlay { z-index:1; } h1, h2, h3, h4 { color: var(--bs-light); } } }