[ux_banner height="540px" bg="8950" bg_size="original" bg_overlay__sm="rgba(0, 0, 0, 0.3)" bg_pos="35% 23%" parallax="3"]

[text_box width="41" width__sm="80" animate="fadeInLeft" position_x="95" position_x__sm="50" position_y__sm="50"]

<h3 class="alt-font">Fancy Top Title</h3>
<h3 class="uppercase"><strong>This is a simple banner</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
[button text="Shop Now" color="white" radius="99" link="shop"]


[/text_box]

[/ux_banner]
[ux_banner height="540px" bg="8957" bg_color="rgb(113, 117, 186)" bg_pos="60% 16%" parallax="3"]

[text_box width="41" width__sm="82" position_x="10" position_x__sm="50" position_y__sm="50"]

<h3 class="uppercase"><strong>Create amazing Parallax effects</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
[button text="Shop Now" color="white" radius="99" link="shop"]


[/text_box]

[/ux_banner]
[row style="collapse" width="full-width"]

[col span="6" span__sm="12"]

[ux_banner height="470px" bg="8956" bg_color="rgb(164, 113, 186)" parallax="1"]

[text_box width="58" width__sm="85" parallax="2"]

<h3 class="uppercase"><strong>This is a simple banner</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
[button text="Shop Now" radius="99" link="shop"]


[/text_box]

[/ux_banner]

[/col]
[col span="6" span__sm="12"]

[ux_banner height="470px" bg="8102" bg_color="rgb(218, 218, 218)" parallax="1"]

[text_box width="34" width__sm="74" position_x="10" text_align="left" text_color="dark"]

<h3 class="uppercase"><strong>This is a simple banner</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
<h2><strong>299$</strong></h2>
[button text="Shop Now" radius="99" link="shop"]


[/text_box]

[/ux_banner]

[/col]

[/row]
[ux_banner height="500px" bg="6799" bg_size="medium" bg_overlay="rgba(0, 185, 179, 0.91)"]

[text_box width__sm="79" parallax="2"]

<h3 class="uppercase"><strong>SUMMER SALE END SOON</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
[ux_countdown bg_color="rgba(0, 0, 0, 0.06)"]

[button text="Shop Now" color="white" radius="99"]


[/text_box]

[/ux_banner]
[row style="collapse" width="full-width" v_align="middle"]

[col span="6" span__sm="14"]

[ux_banner height="94%" bg="8341" bg_pos="20% 60%" parallax="2"]

[text_box width="31" width__sm="61" scale__sm="64" position_x="90" position_y="90" text_align="right" text_color="dark"]

<h3 class="uppercase"><strong>Add Hotspots to BAnners</strong></h3>
<p class="lead">Hotspots can be added to banners and dragged around. You can have Hotspots that goes to a Product Lightbox or just a simple Tooltip.</p>

[/text_box]
[ux_hotspot type="product" prod_id="416" text="Add product hotspots on banners" bg_color="rgb(47, 166, 162)" position_x="55" position_y="25"]

[ux_hotspot text="Cool Camera :)" size="large" bg_color="#4DB7B3" position_x="10" position_y="80"]


[/ux_banner]

[/col]
[col span="6" span__sm="17" padding="0px 10% 0px 10%"]

[title style="center" text="Add a Title here" size="undefined"]

[ux_products style="overlay" slider_nav_style="circle" slider_nav_position="outside" columns="2" columns__sm="2" animate="fadeInLeft" image_height="166%" image_size="medium" image_hover="overlay-add"]


[/col]

[/row]
[ux_banner height="450px" bg="8894" bg_overlay="rgba(0, 0, 0, 0.63)" parallax="3"]

[text_box width__sm="93" parallax="2"]

<h3 class="uppercase"><strong>Join Our Newsletter</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
[contact-form-7 id="7042"]


[/text_box]

[/ux_banner]
[row style="collapse" width="full-width" v_align="equal"]

[col span="6" span__sm="17" padding="10% 10% 0px 10%" bg_color="rgb(240, 240, 240)"]

[title style="center" text="Featured" size="undefined"]

[ux_products style="overlay" slider_nav_style="circle" slider_nav_position="outside" columns="2" columns__sm="2" animate="fadeInLeft" show="featured" image_height="166%" image_size="medium" image_hover="overlay-add"]


[/col]
[col span="6" span__sm="15"]

[ux_banner height="99%" bg="8343" bg_pos="56% 22%" parallax="2"]

[text_box width="37" position_x="10" text_align="left" text_color="dark"]

<h3 class="uppercase"><strong>This is a simple banner</strong></h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
<h2><strong>29$</strong></h2>

[/text_box]
[ux_hotspot position_x="55" position_y="15"]


[/ux_banner]

[/col]

[/row]
[ux_instagram_feed username="topshop" type="slider" slider_nav_style="simple" slider_nav_color="light" width="full-width" columns="7"]