Get started
Assets
Components
- Content Section
  - Pre-Defined Background Color
  - Gradient Background
  - Custom Background Color
  - Background Image
  - Parallax Background
  - Video Background
  - Transparent Overlay
  - White Content
  - Full-Screen Section
  - Vertically Center Content
  - Scroll Next
- Centered
- Section Intro
- Hero Banner
- Hero Slider
- Hero Format
- Equal Height
- No Gutter
- All Inline
- Vertical Center
  - Vcenter
  - Vmiddle
- Stack
  - MD Stack
  - Never Stack
- Shift Col
- Buttons
  - Plain Links
  - Call to Action
  - Color 1
  - Color 2
  - Theme
  - Dark
  - Heading
  - Header
  - White
  - Gradients
    - Gradient 1
    - Gradient 2
    - Gradient 3
    - Gradient 4
    - Gradient 5
    - Gradient 6
    - Gradient 7
    - Gradient 8
    - Gradient 9
    - Gradient 10
    - Gradient 11
    - Gradient 12
- Icons
- Social Icons
  - Follow Me
  - Custom Module
- Tabs
  - Custom Module
  - Drag and Drop
- Slider
  - Basic
  - Advanced
- Accordion
- Advanced Gallery
- Tooltips
- Video Background
- RSS Cards
- Change Image
  - Custom Module
  - Drag and Drop
- List Type Buttons
- List Type Tabs
- List Type Dropdown
- List Type Inline
- List Type Tags
- Sticky
- Reveal
- Animation
- Popups
  - Image
  - Iframe (video)
  - Content
- Image Box
- Listing
  - Flexible Listing
  - Advanced Listing
- Mega Menu
- Scroll to Top
Breakpoints
Utility classes
- Visibility
- Alignment
- Space
- Width
- Text size
- White content
- Links
- Paragraphs
- Headings
Templates

Shift Col

The columns on the left side in a row are always above those on the right on mobile. However, you can rearange columns position in Act2 so they appear inverted on desktop, but still stack naturally on mobile.

You can achieve this by adding the shift-col class to the columns direct parent group. Please keep in mind this only works with two columns, not three or more: