#container { display: flex; position: relative; flex-grow: 1; height: 100%; .background-container { top: 0; left: 0; display: block; width: 100%; height: 100%; position: fixed; z-index: -1; .preset { background-image: url('/assets/preset-light.png'); background-size: cover; background-position: center center; background-repeat: no-repeat; width: 100%; height: 100%; position: absolute; z-index: 2; } .noise { position: absolute; width: 100%; height: 100%; background: url('/assets/noise.png'); z-index: 2; } } >div { display: flex; flex-wrap: nowrap; position: relative; flex: 1 1 0%; >.content { position: relative; flex-grow: 1; flex-shrink: 0; display: flex; >div { display: flex; flex: 1 1 0%; flex-direction: column; >.title { background-color: rgba(0, 0, 0, 0.15); &>div { position: relative; color: rgb(255, 255, 255); height: 48px; display: flex; align-items: center; font-family: "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; font-size: 15px; text-transform: uppercase; padding: 0px 24px; overflow: hidden; cursor: default; user-select: none; } } >.content { display: flex; flex: 1 1 0%; flex-direction: column; height: 500px; // background-image: url("/assets/christian-holzinger-755549-unsplash.jpg"); // background-size: cover; } } } } }