Banner Grids

[section bg_color=”rgb(237, 239, 241)” border=”1px 0px 1px 0px” border_color=”rgba(0, 0, 0, 0.13)”]

[title style=”center” text=”Banner Grid Element” size=”120″]

[ux_banner_grid depth=”1″]

[col_grid span=”4″ span__sm=”12″]

[ux_banner bg=”509″ bg_size=”original” bg_pos=”64% 30%”]

[text_box width=”70″ position_x=”50″ position_y=”50″]

A Cute Title

This is a simple headline

A Small text

[button text=”Click me!” style=”outline” size=”xlarge”]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”3″ span__sm=”12″]

[ux_banner bg=”510″ bg_size=”original” bg_pos=”51% 56%”]

[text_box width=”69″ width__sm=”60″ position_x=”50″ position_y=”5″]

This is a simple headline

[button text=”Shop now” style=”outline” size=”larger”]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”5″ span__sm=”14″ height=”1-3″]

[ux_banner bg=”511″ bg_size=”original” bg_overlay=”rgba(255, 255, 255, 0.15)” bg_pos=”51% 30%”]

[text_box text_color=”dark” width=”42″ position_x=”10″ position_y=”50″ text_align=”left”]

This is a simple headline

[button text=”Shop now” style=”outline” size=”larger”]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”5″ span__sm=”12″ height=”2-3″]

[ux_banner bg=”512″ bg_size=”original” bg_color=”rgb(0, 0, 0)” bg_overlay=”rgba(0, 0, 0, 0.3)” bg_pos=”61% 29%”]

[text_box width=”70″ width__sm=”60″ position_x=”50″ position_y=”50″]

SALE ENDS SOON

[/text_box]

[/ux_banner]

[/col_grid]

[/ux_banner_grid]

[/section]
[row v_align=”middle”]

[col span=”5″ span__sm=”12″]

DRAG AND DROP EDITING

Creating amazing Banner Grids is incredible easy with the new UX Builder

[/col]
[col span=”7″ span__sm=”12″]

[ux_image id=”675″ image_size=”original” depth=”3″]

[/col]

[/row]
[section bg=”13″ bg_color=”rgb(28, 28, 28)” bg_overlay=”rgba(0, 0, 0, 0.72)” parallax=”2″ dark=”true”]

[title style=”center” text=”Banner Grid With A Background” size=”undefined”]

[ux_banner_grid height=”666″ depth=”1″]

[col_grid span=”4″ span__sm=”13″ height=”1-2″]

[ux_banner height=”500px” bg=”581″ bg_size=”original” bg_pos=”32% 58%” hover=”zoom”]

[text_box width=”65″ width__sm=”90″ scale=”102″ animate=”fadeInLeft” position_x=”10″ position_y=”50″ text_align=”left”]

Featured Vendor

This Week Featured Vendor

Change this to anything. Consectetuer adipiscing elit.

[button text=”Go To Shop” style=”outline” radius=”99″]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”4″ span__sm=”13″ height=”2-3″]

[ux_banner height=”500px” bg=”644″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.16)” bg_pos=”48% 81%” hover=”zoom”]

[text_box width=”74″ position_x=”50″ position_y=”50″]

This is a simple banner

[button text=”Shop now” style=”outline” size=”large” radius=”99″]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”4″ span__sm=”15″ height=”2-3″]

[ux_banner height=”500px” bg=”422″ bg_size=”original” bg_pos=”66% 22%” hover=”zoom”]

[text_box text_color=”dark” width=”80″ width__sm=”60″ animate=”fadeInLeft” position_x=”50″ position_y=”85″ text_align=”left”]

Featured Vendor

Woo Vendor Shop

[button text=”Shop now” style=”outline” size=”larger” radius=”99″]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”4″ span__sm=”13″ height=”1-2″]

[ux_banner height=”500px” bg=”506″ bg_size=”original” hover=”zoom”]

[text_box width=”80″ position_x=”10″ position_y=”85″ text_align=”left”]

This is a simple banner

Change this text to anything

[button text=”Shop now” style=”outline” size=”larger” radius=”99″]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”8″ span__sm=”15″ height=”1-3″]

[ux_banner height=”500px” bg=”511″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.09)” bg_pos=”63% 31%” hover=”zoom”]

[text_box width=”79″ position_x=”50″ position_y=”85″ text_align=”left”]

This is a simple headline

[button text=”Shop now” style=”outline” size=”large” radius=”99″]

[/text_box]

[/ux_banner]

[/col_grid]

[/ux_banner_grid]

[/section]
[title style=”center” text=”Use Banner Grids to Create Portfolio Grids” margin_top=”31px” size=”undefined”]

[ux_banner_grid spacing=”collapse” height=”885″ width=”full-width”]

[col_grid span=”6″ span__sm=”13″ height=”2-3″]

[ux_banner height=”500px” bg=”652″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.2)” bg_pos=”53% 69%” hover=”zoom”]

[text_box width=”37″ animate=”fadeInRight” position_x=”10″ position_y=”80″ text_align=”left”]

This is a simple banner

A Website for Acme Company

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”6″ span__sm=”15″ height=”1-2″]

[ux_banner height=”500px” bg=”534″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.19)” bg_pos=”53% 69%” hover=”zoom”]

[text_box width=”30″ animate=”fadeInLeft” position_x=”90″ position_y=”50″ text_align=”right”]

This is a simple banner

A Website for Acme Company

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”3″ span__sm=”14″ height=”1-2″]

[ux_banner height=”500px” bg=”649″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.21)” bg_pos=”55% 0%” hover=”zoom”]

[text_box position_x=”50″ position_y=”50″]

This is a simple banner

A Website for Acme Company

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”3″ span__sm=”14″ height=”1-2″]

[ux_banner height=”500px” bg=”551″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.15)” bg_pos=”22% 34%” hover=”zoom”]

[text_box hover=”fade-out” position_x=”50″ position_y=”95″]

This is a simple banner

A Website for Acme Company

[/text_box]
[text_box hover=”zoom-in” position_x=”50″ position_y=”50″]

[video_button size=”178″]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”6″ span__sm=”15″ height=”1-3″]

[ux_banner height=”500px” bg=”539″ bg_size=”original” hover=”zoom”]

[text_box text_color=”dark” width=”39″ position_x=”5″ position_y=”85″ text_align=”left”]

This is a simple banner

A Website for Acme Company

[/text_box]

[/ux_banner]

[/col_grid]

[/ux_banner_grid]
[title style=”center” text=”Add Slider to Banner Grids” margin_top=”28px” size=”undefined”]

[ux_banner_grid]

[col_grid span=”9″ span__sm=”12″]

[ux_slider]

[ux_banner height=”500px” bg=”502″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.06)”]

[text_box width__sm=”80″ position_x=”50″ position_y=”50″]

A cool Top header

Five Key Elements for your Living room

[divider]

[button text=”Browse Now” size=”large”]

[/text_box]

[/ux_banner]
[ux_banner height=”500px” bg=”503″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.06)” bg_pos=”64% 34%”]

[text_box width=”54″ width__sm=”80″ position_x=”85″ position_y=”50″ text_align=”right”]

A cool Top header

Latest Fashion News for AutumN

[divider]

[button text=”Browse Now” size=”large”]

[/text_box]

[/ux_banner]
[ux_banner height=”500px” bg=”501″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.06)”]

[text_box width__sm=”80″ position_x=”50″ position_y=”50″]

A cool Top header

Five Key Elements for your Living room

[divider]

[button text=”Browse Now” size=”large”]

[/text_box]

[/ux_banner]

[/ux_slider]

[/col_grid]
[col_grid span=”3″ span__sm=”12″ height=”2-3″]

[ux_banner height=”160px” bg=”506″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.13)” bg_pos=”56% 27%” hover=”zoom”]

[text_box width=”87″ position_x=”50″ position_y=”50″]

Don’t Miss

Sale ends soon

[button text=”Browse Now” size=”larger”]

[/text_box]

[/ux_banner]

[/col_grid]
[col_grid span=”3″ span__sm=”12″ height=”1-3″]

[ux_banner height=”160px” bg=”550″ bg_size=”original” bg_overlay=”rgba(0, 0, 0, 0.17)” bg_pos=”47% 55%” hover=”zoom”]

[text_box width=”87″ position_x=”50″ position_y=”50″]

SUMMER SALE

[button text=”Browse Now” size=”larger”]

[/text_box]

[/ux_banner]

[/col_grid]

[/ux_banner_grid]