A full-screen image with centered panel over the top
Panel position can be controlled with modifier classes on the 'full-screen-image-bg-section' element:
.content-align-top
.content-align-bottom
Nunc risus massa, sagittis eu dui ac, varius venenatis risus. Donec quis augue eget dolor rhoncus maximus. Sed id nibh convallis, sodales orci at, maximus turpis. Nulla neque dolor, vestibulum eu pulvinar non, vulputate in ex.
50/50 sections with image backgrounds and panels aligned to outer edges.
Nunc risus massa, sagittis eu dui ac, varius venenatis risus. Donec quis augue eget dolor rhoncus maximus. Sed id nibh convallis, sodales orci at, maximus turpis. Nulla neque dolor, vestibulum eu pulvinar non, vulputate in ex.
Quisque convallis lectus vel urna placerat, sit amet hendrerit turpis mattis. Aliquam quis efficitur tortor. Fusce bibendum tristique mollis.
Background 16:9 image, overlapping panel
Nunc risus massa, sagittis eu dui ac, varius venenatis risus. Donec quis augue eget dolor rhoncus maximus. Sed id nibh convallis, sodales orci at, maximus turpis. Nulla neque dolor, vestibulum eu pulvinar non, vulputate in ex.
Quisque convallis lectus vel urna placerat, sit amet hendrerit turpis mattis. Aliquam quis efficitur tortor. Fusce bibendum tristique mollis.