Rows are the primary containers. Rows are used to create horizontal groups of columns. Rows contents can be full-width or limited width (from your Theme Options). Row height can be based on the contents’ height or can be set. You have all the options you need to create a given row container by using any combination of common or advanced patterns you wish. Row settings are organized in convenient tabs divided for functionalities.

Aspect

In this section you can define the fundamental aspects of the structure of the layout, such as width, height, and padding:

• Container width: Select the width of the container (full width or limited), screenshot.
• Content width: Select the width of the content area (full width or limited).
• Height: Use the slider bar to set the row height with a percent value. The set value includes top and bottom padding, screenshot.
• Minimum height: Enter the minimum row minimum height in pixels.
• Custom padding: Activate this button to set and save custom paddings presets, screenshot.

Style

In this section you can define fundamental aspects of the style including background color, background image, parallax effect, and overlay properties:

• Background color: Use this option to specify a background color for the row.
• Background media: Use this option to specify a media from the media library, screenshot.
• Background CSS: Use this option to specify the main CSS properties for the background media.
• Parallax: Activate this option if you want to incorporate a background parallax effect (automatic use the background size "cover"), screenshot.
• Ken Burns: Activate this option if you want to incorporate a background Ken Burns effect.
• Zoom Out: Activate this option if you want to incorporate a background Zoom Out effect.
• Overlay color: Use this option to specify an overlay color for the background.
• Overlay opacity: Use this option to set the transparency for the overlay.

Columns

In this section you can define the basic behavior of the interior columns as equal height and columns gap:

• Columns equal height: Set to YES if you want equally tall columns, matching the height of the tallest column, screenshot.
• Columns gap: This option sets the columns gap (space between columns).
• Content Width: Set this value if you want to constrain the column width.

Custom

In this section you can define the CSS overrides, screenshot :

• CSS: Use this option to specify custom overrides for margins, borders, and padding.
• Lateral Border Mobile: By default, columns are stack on mobile, and lateral borders are hidden. Use this option to preserve custom lateral Borders on mobile.
• Border color: Use this option to specify a border color.
• Border style: Use this option to specify a border style.

Responsive

In this section you can define the fundamental responsive aspects, screenshot :

• Desktop: Select this option to establish an element’s visibility in desktop layout mode (960px >).
• Tablet: Select this option to establish an element’s visibility in tablet layout mode (570px > < 960px).
• Mobile: Select this option to establish an element’s visibility in mobile layout mode (< 570px).

Off-grid

In this section you can define effects “out of the grid”. Note: These are advanced features:

• Shift y-axis: Use this option to set the amount an element has to shift in the Y axis.
• Shift y-axis fixed: This option deactivates shift-y responsiveness.

Extra

In this section you can define added functionality and apply custom CSS classes:

• Sticky: Activate this to stick the element when scrolling.
• Extra class: If you wish to style a particular content element differently, you can use this field to add a class name, and then refer to it in your CSS file.
• Element ID: If you wish to style a particular content element differently, you can use this field to add an ID name, and then refer to it in your CSS file.
• Section name: A name must be assigned for the onepage scroll function; this option enables you to input that name.