[ux_slider]
[ux_banner height=\”700px\” bg=\”2053\” bg_overlay=\”rgba(0, 0, 0, 0.25)\”]
[text_box width=\”51\” animate=\”fadeInLeft\” text_depth=\”1\”]
Create Amazing Banners with Drag and Drop
[divider]
[button text=\”A button\” color=\”success\” depth=\”3\”]
[/text_box]
[/ux_banner]
[ux_banner height=\”700px\” bg=\”2053\”]
[text_box width=\”46\” animate=\”fadeInRight\” parallax=\”1\” position_x=\”5\”]
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat….
[button text=\”Buy now\” color=\”white\”]
[button text=\”Learn more\” color=\”white\” style=\”outline\”]
[/text_box]
[/ux_banner]
[/ux_slider]
[row v_align=\”middle\”]
[col span=\”7\”]
[ux_banner height=\”600px\” bg=\”2053\” bg_pos=\”44% 39%\”]
[text_box width=\”63\” width__sm=\”78\” padding=\”39px\” position_x=\”5\” position_x__sm=\”50\” text_color=\”dark\” bg=\”rgba(255, 255, 255, 0.85)\” depth=\”2\”]
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat….
[button text=\”Simple Link\” style=\”link\” icon=\”icon-play\”]
[button text=\”Simple Button\”]
[/text_box]
[/ux_banner]
[/col]
[col span=\”5\” span__sm=\”12\” align=\”center\”]
Drag And Drop Banner System
Flatsome Banners is the heart of Flatsome. Our Banner System let you create beautiful responsive banners with drag and drop.
[ux_image id=\”2052\”]
[/col]
[col span=\”14\”]
[ux_banner height=\”56.25%\” height__sm=\”50%\” bg=\”2053\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”glow\”]
[text_box width=\”36\” position_x=\”90\”]
Small Title
You can place a text box wherever you want on a Banner
[button text=\”Click me!\”]
[/text_box]
[/ux_banner]
[/col]
[col span=\”6\” span__sm=\”12\” align=\”center\”]
Banner Focus Point™
Set a focus point on the banner and the image will adjust to mobile a tablet screens. Perfect for resposnive Websites.
[/col]
[col span=\”6\” span__sm=\”12\”]
[ux_image id=\”2052\” image_size=\”original\”]
[/col]
[/row]
[title style=\”center\” text=\”Banner Hover effects\”]
[row]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”glow\”]
[text_box width=\”36\”]
Glow
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”zoom\”]
[text_box width=\”36\”]
Zoom
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”zoom-fade\”]
[text_box width=\”36\”]
Zoom Fade
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”blur\”]
[text_box width=\”36\”]
Blur
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”fade-in\”]
[text_box width=\”36\”]
Fade In
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”fade-out\”]
[text_box width=\”36\”]
Fade Out
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”color\”]
[text_box width=\”36\”]
Add Color
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”grayscale\”]
[text_box width=\”36\”]
Grayscale
[/text_box]
[/ux_banner]
[/col]
[col span=\”4\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”overlay-add\”]
[text_box width=\”51\”]
Add Overlay
Overlay can be any color
[/text_box]
[/ux_banner]
[/col]
[/row]
[row]
[col span__sm=\”12\”]
You can also combine hover effects to create amazing hover effects
[/col]
[/row]
[row]
[col span=\”6\” span__sm=\”12\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”overlay-add\” border=\”3px 3px 3px 3px\” border_margin=\”10px 10px 10px 10px\” border_hover=\”zoom\”]
[text_box width=\”51\”]
Add animated borders
[/text_box]
[/ux_banner]
[/col]
[col span=\”6\” span__sm=\”12\”]
[ux_banner height=\”200px\” bg=\”2053\” bg_size=\”medium\” bg_overlay=\”rgba(22, 20, 16, 0.18)\” hover=\”overlay-add\”]
[text_box width=\”51\”]
Add Overlay
Overlay can be any color
[/text_box]
[/ux_banner]
[/col]
[/row]
[ux_banner height=\”500px\” bg=\”2053\” parallax=\”2\”]
[text_box width=\”41\”]
BACKGROUND VIDEO
[/text_box]
[/ux_banner]