Overlay 1
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="trafo:{scaleX:1,scaleY:1,originX:'0%',originY:'0%'}" on="trafo:{scaleX:1.1,scaleY:1.1}" starttime="0" style="top:0;left:0;" ][post_thumbnail image_only="true" /][/layer]
[layer start="opacity:0" on="opacity:0.7" starttime="300" style="top:0;left:0;right:0;bottom:0;background:#db7f08;" allow_empty="true"][/layer]
[layer start="opacity:0,top:0" on="opacity:1,top:20" starttime="300" class="banner black"][post_title /][/layer]
[layer start="opacity:0,top:200" on="opacity:1,top:70" starttime="300"][post_content /][/layer]
[layer start="opacity:0,marginLeft:'-50%W'" on="opacity:1" starttime="800" style="left:50%;bottom:20px;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Overlay 2
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="opacity:0,trafo:{originX:'100%',originY:'100%',rotate:3.14}" on="opacity:0.7,trafo:{rotate:0}" starttime="0" startduration="800" style="top:0;left:0;right:0;bottom:0;width:100%;background:#7392b8;" allow_empty="true"][/layer]
[layer start="opacity:0,top:0" on="opacity:1,top:20" starttime="300" class="banner black"][post_title /][/layer]
[layer start="opacity:0,trafo:{originX:'100%',originY:'100%',rotate:3.14}" on="opacity:1,trafo:{rotate:0}" starttime="600" startduration="800" style="top:70px;left:0px;"][post_content /][/layer]
[layer start="opacity:0,marginLeft:'-50%W'" on="opacity:1" starttime="600" style="left:50%;bottom:20px;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Overlay 3
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. ...
Get Source
[layer start="opacity:0,trafo:{moveX:0,moveY:0}" start_left="trafo:{moveX:'-100%'}" start_right="trafo:{moveX:'100%'}" start_top="trafo:{moveY:'-100%'}" start_bottom="trafo:{moveY:'100%'}" on="opacity:0.9,trafo:{moveX:0,moveY:0}" starttime="0" breakanim="true" style="left:0px;top:0px;right:0px;bottom:0px;background:#7392b8;"]
<div style="padding-top:16px;">
[post_title class="light_title" /]
[post_content /]
<div>
[gallery_button /]
[read_more_button /]
[visit_site_button /]
</div>
</div>
[/layer]Overlay 4
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="opacity:0,trafo:{scaleX:2,scaleY:2}" on="opacity:0.7,trafo:{scaleX:1,scaleY:1}" starttime="0" style="top:0;left:0;right:0;bottom:0;background:#7392b8;" allow_empty="true"][/layer]
[layer start="opacity:0,trafo:{scaleX:3,scaleY:3}" on="opacity:1,trafo:{scaleX:1,scaleY:1}" starttime="0" startduration="500" style="top:20px;left:0px;right:0px;text-align:center;"][post_title class="light_title" /][/layer]
[layer start="opacity:0,trafo:{scaleX:3,scaleY:3}" on="opacity:1,trafo:{scaleX:1,scaleY:1}" starttime="0" startduration="500" style="top:60px;"][post_content /][/layer]
[layer start="opacity:0,marginLeft:'-50%W',bottom:0" on="opacity:1,bottom:20" starttime="600" style="left:50%;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Overlay 5
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="opacity:0" on="opacity:0.7" starttime="0" style="left:0;right:0;bottom:0;top:0px;background:#db7f08;" allow_empty="true"][/layer] [layer start="opacity:0,top:0" on="opacity:1,top:20" starttime="500" startduration="700" starteasing="bounce" class="black banner"][post_title /][/layer] [layer start="opacity:0,top:0" on="opacity:1,top:70" starttime="500" startduration="700" starteasing="bounce" ][post_content /][/layer] [layer start="opacity:0,marginLeft:'-50%W'" on="opacity:1" starttime="1000" startduration="700" starteasing="bounce" style="left:50%;bottom:20px;white-space:nowrap;"] [gallery_button /] [read_more_button /] [visit_site_button /] [/layer]
Overlay 6
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="opacity:0,bottom:'100%'" on="opacity:0.7,bottom:'50%'" starttime="0" startduration="600" style="top:0px;width:100%;background:#db7f08;" allow_empty="true"][/layer]
[layer start="opacity:0,top:'100%'" on="opacity:0.7,top:'50%'" starttime="0" startduration="600" style="bottom:0;width:100%;background:#db7f08;" allow_empty="true"][/layer]
[layer start="opacity:0,clip:{top:'50%',bottom:'50%'}" on="opacity:0.8,clip:{top:'auto',bottom:'auto'}" starttime="600" startduration="1000" style="width:100%;left:0px;top:20px;background:#000"]
<div style="padding-top:16px;width:100%;text-align:center">
[post_title /]
[post_content /]
<div>
[gallery_button /]
[read_more_button /]
[visit_site_button /]
</div>
</div>
[/layer]Overlay 7
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis ...
Get Source
[layer start="opacity:0" on="opacity:0.7" starttime="0" style="top:0;left:0;right:0;bottom:0;background:#db7f08;" allow_empty="true"][/layer]
[layer start="opacity:0,trafo:{moveX:0,moveY:0}" start_left="opacity:0,trafo:{moveX:'-100%'}" start_right="opacity:0,trafo:{moveX:'100%'}" start_top="opacity:0,trafo:{moveY:'-100%'}" start_bottom="opacity:0,trafo:{moveY:'100%'}" on="opacity:1,trafo:{moveX:0,moveY:0}" starttime="0" breakanim="true" class="banner black" style="top:20px;"][post_title /][/layer]
[layer start="opacity:0" on="opacity:1" starttime="600" style="top:60px;"][post_content /][/layer]
[layer start="opacity:0,marginLeft:'-50%W'" on="opacity:1" starttime="600" style="left:50%;bottom:20px;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Overlay 8
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. ...
Get Source
[layer start="opacity:0,height:0" on="opacity:0.7,height:80" starttime="500" startduration="500" style="left:0px;right:0px;background:#000;top:50px;" allow_empty="true"][/layer]
[layer start="opacity:0.7" on="opacity:0" starttime="0" style="top:0;left:0;right:0;bottom:0;background:#fff;" allow_empty="true"][/layer]
[layer start="opacity:0,top:0" on="opacity:1,top:20" starttime="0" startduration="500" class="banner black" style="left:0px;right:0px;"][post_title /][/layer]
[layer start="opacity:0,trafo:{scaleX:3,scaleY:3}" on="opacity:1,trafo:{scaleX:1,scaleY:1}" starttime="0" startduration="500"
style="top:60px;"][post_content /][/layer]
[layer start="opacity:0,marginLeft:'-50%W',bottom:0" on="opacity:1,bottom:0" starttime="600" style="left:50%;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Overlay 9
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. ...
Get Source
[layer start="opacity:0,right:'100%',bottom:'100%'" on="opacity:0.7,right:'50%',bottom:'50%'" starttime="0" startduration="400" starttime_bottom="300" starttime_right="300" style="top:0px;left:0px;background:#db7f08;" allow_empty="true"][/layer] [layer start="opacity:0,left:'100%',bottom:'100%'" on="opacity:0.7,left:'50%',bottom:'50%'" starttime="0" startduration="400" starttime_bottom="300" starttime_left="300" style="top:0px;right:0px;background:#db7f08;" allow_empty="true"][/layer] [layer start="opacity:0,right:'100%',top:'100%'" on="opacity:0.7,right:'50%',top:'50%'" starttime="0" startduration="400" starttime_top="300" starttime_right="300" style="bottom:0px;left:0px;background:#db7f08;" allow_empty="true"][/layer] [layer start="opacity:0,left:'100%',top:'100%'" on="opacity:0.7,left:'50%',top:'50%'" starttime="0" startduration="400" starttime_left="300" starttime_top="300" style="bottom:0px;right:0px;background:#db7f08;" allow_empty="true"][/layer] [layer start="opacity:0,top:0" on="opacity:1,top:20" starttime="600" startduration="500" class="black banner"][post_title /][/layer] [layer start="opacity:0,top:0" on="opacity:1,top:70" starttime="600" startduration="500"][post_content /][/layer] [layer start="opacity:0,marginLeft:'-50%W'" on="opacity:1" starttime="600" startduration="500" style="left:50%;bottom:20px;white-space:nowrap;"] [gallery_button /] [read_more_button /] [visit_site_button /] [/layer]
Overlay 10
Maecenas tellus libero
Sed tempor condimentum sem, et laoreet libero ultricies quis. Nam massa dui, imperdiet et aliquam at, ullamcorper eu mauris. Integer tristique tempor dolor eget vulputate. ...
Custom Single Portfolio
Phasellus eu sapien eu sapien porta consectetur id malesuada felis. Nullam vel faucibus odio. Sed justo quam, euismod eget ultrices ac, iaculis sed nulla. Curabitur tempus ...
Morbi blandit elit sit
Sed ut urna id nisl cursus ornare eget eget lorem. Phasellus vulputate tincidunt mi sed mattis. Pellentesque turpis justo, posuere nec dictum sed, semper ac sapien. Morbi dui ...
Get Source
[layer start="top:'100%'" on="top:0" starttime="0" startduration="500" class="banner_full"]
[+layer start="marginTop:'-100%H'" on="marginTop:0" starttime="0" startduration="500" class="title"][post_title /][/+layer]
[+layer start="top:200" on="top:0" starttime="0" startduration="500" class="desc"][post_content /][/+layer]
[/layer]
[layer start="opacity:0,marginLeft:'-50%W',bottom:0" on="opacity:1,bottom:0" starttime="600" style="left:50%;white-space:nowrap;"]
[gallery_button /]
[read_more_button /]
[visit_site_button /]
[/layer]Custom CSS used on this page:
.layer.banner {padding:10px;left:0;right:0;display:inline-block;position:relative;}
.layer.banner.black {background:#222;color:#fff !important;padding:10px;width:100%}
.layer.banner.black h2.post_title {margin:0 !Important;padding:0 !Important;}
.layer.banner.black a {color:#fff !important;}
.layer.banner_full {left:0; right:0; background:#222; bottom:0;}
.layer.banner_full > .title, .layer.banner_full > .desc {position: relative;}
.layer.banner_full > .title {background:#222; color:#fcff04 !Important; padding:7px 0 !Important;}
.layer.banner_full > .desc {color:#f9f9f9 !Important;}
.layer.banner_full .post_title {margin:0 !Important; padding:0 !Important;}
.post_title.light_title a {color:#eee !Important;}