Sections
Provide contextual feedback messages for typical user actions with the handful
of available and flexible alert messages.
Light Content
This section has an additional .text-white and .bg-dark classes.
Background Gray
This section has an additional .bg-gray class.
Primary Color
This section has an additional .text-white and .bg-primary classes.
Custom Color
This section has an additional .text-white and style="background-color: #00cbce" classes.
Background Image
Simply provide a background-image for your section. Don't forget to check our overlays.
Fixed Background Image
This section has an additional .bg-fixed class.
Gradient Overlay
Include an .overlay element as a child of your section and style it as you want. It'll be a layer between your content and section background.
Gradient Background
This section has an additional .text-white class and style="background-image: linear-gradient(135deg, #8a9ef7 0%, #6831a0 100%);" attribute.
You can get access to a list of gradient background samples at webgradients.com
Parallax Image
Add a data-parallax="path/to/img.jpg" to your section.
Parallax Video
Include a data-video="mp4:path/to/video.mp4" attribute. You can use data-speed to set parallax speed. It should be a number between -1.0 and 2.0.
YouTube Video Background
Include data-video attribute with link to your YouTube video. You can use data-speed="0.5" to have a parallax video background. You can use any other number between -1.0 and 2.0.
Vimeo Video Background
Include data-video attribute with link to your Vimeo video. You can use data-speed="0.5" to have a parallax video background as we have for this section. You can use any other number between -1.0 and 2.0.
Overflow Content
Stream of images
Add .flex-nowrap to a .row with column larger than 12 in sum. So it only displays the first 12 columns.
