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 height= »600″ depth= »1″]

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

[ux_banner bg= »6177″ bg_pos= »64% 30% » border_color= »rgba(0, 0, 0, 0.05) »]

[text_box width= »70″]

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= »6177″ bg_pos= »51% 56% » border_color= »rgba(0, 0, 0, 0.08) »]

[text_box width= »69″ width__sm= »60″ 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= »6177″ bg_size= »medium » bg_overlay= »rgba(255, 255, 255, 0.15) » bg_pos= »51% 30% » border_color= »rgba(0, 0, 0, 0.08) »]

[text_box text_color= »dark » width= »42″ position_x= »10″ 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= »6177″ bg_color= »rgb(0, 0, 0) » bg_overlay= »rgba(0, 0, 0, 0.3) » bg_pos= »71% 19% » border_color= »rgba(0, 0, 0, 0.07) »]

[text_box width= »70″ width__sm= »60″]

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= »6175″ depth= »3″]

[/col]

[/row]
[section bg= »6177″ 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= »6177″ bg_pos= »32% 58% » hover= »zoom »]

[text_box width= »65″ width__sm= »90″ scale= »102″ animate= »fadeInLeft » position_x= »10″ 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= »6177″ bg_size= »medium » bg_overlay= »rgba(0, 0, 0, 0.16) » bg_pos= »47% 55% » hover= »zoom »]

[text_box width= »74″]

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= »6177″ bg_size= »medium » bg_pos= »66% 22% » hover= »zoom »]

[text_box text_color= »dark » width= »80″ width__sm= »60″ animate= »fadeInLeft » 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= »6177″ bg_size= »medium » 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= »6177″ bg_size= »medium » bg_overlay= »rgba(0, 0, 0, 0.09) » bg_pos= »61% 30% » hover= »zoom »]

[text_box width= »79″ 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= »6177″ 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= »6177″ bg_overlay= »rgba(0, 0, 0, 0.19) » bg_pos= »53% 69% » hover= »zoom »]

[text_box width= »30″ animate= »fadeInLeft » position_x= »90″ 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= »6177″ bg_size= »medium » bg_overlay= »rgba(0, 0, 0, 0.21) » hover= »zoom »]

[text_box]

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= »6177″ bg_size= »medium » bg_overlay= »rgba(0, 0, 0, 0.15) » bg_pos= »34% 46% » hover= »zoom »]

[text_box hover= »fade-out » position_y= »95″]

This is a simple banner

A Website for Acme Company

[/text_box]
[text_box hover= »zoom-in »]

[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= »6177″ 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= »6177″ bg_overlay= »rgba(0, 0, 0, 0.06) » border_style= »dashed » border_radius= »undefined » border_color= »rgba(0, 0, 0, 0.12) »]

[text_box width__sm= »80″]

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= »6177″ bg_overlay= »rgba(0, 0, 0, 0.06) » bg_pos= »64% 34% » border_style= »dashed » border_radius= »undefined » border_color= »rgba(0, 0, 0, 0.12) »]

[text_box width= »54″ width__sm= »80″ position_x= »85″ 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= »6177″ bg_overlay= »rgba(0, 0, 0, 0.06) » border_style= »dashed » border_radius= »undefined » border_color= »rgba(0, 0, 0, 0.12) »]

[text_box width__sm= »80″]

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= »6177″ bg_size= »medium » bg_overlay= »rgba(0, 0, 0, 0.13) » bg_pos= »47% 55% » hover= »zoom »]

[text_box width= »87″]

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= »6177″ bg_size= »thumbnail » bg_overlay= »rgba(0, 0, 0, 0.17) » bg_pos= »47% 55% » hover= »zoom »]

[text_box width= »87″]

SUMMER SALE

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

[/text_box]

[/ux_banner]

[/col_grid]

[/ux_banner_grid]