Home Version 25 Page Code
Click to preview the Home Version 25 demo. View demo
Preview:
CreatePerfect (BannerPane)
Code:
html
<ul class="full_screen_pic home25-bannerbg">
<li>
<div class="container ">
<div class="content">
<h2 class="Tit01 animation rotateInDownLeft">CreatePerfect</h2>
<h3 class="Tit02 animation rotateInDownRight">Solution</h3>
<h4 class="Tit03 animation rotateInUpLeft"><a href="#">buy now</a></h4>
</div>
</div>
<div id="home25-nextPage"></div>
</li>
</ul>Manage File (Full_Screen_PaneA · 1)
Code:
html
<div class="container">
<div class="row home25-ibox pb-60 animation">
<div class="col-sm-6 col-md-3 animation_item scaleUp">
<div class="ibox"><span class="lnr lnr-folder"></span></div>
<h5 class="pt-30 pb-10">Manage File </h5>
<p>Nam sapien eros enatis at dapibus facilisis, lacin ia sagittis purus. Ut tuismod aliquet enim, nec eleme dolor quis viverra. </p>
<div class="visible-sm visible-xs pb-50"></div>
</div>
<div class="col-sm-6 col-md-3 animation_item scaleUp delay1">
<div class="ibox"><span class="lnr lnr-paper-plane"></span></div>
<h5 class="pt-30 pb-10">Paper Plane</h5>
<p>Nam sapien eros enatis at dapibus facilisis, lacin ia sagittis purus. Ut tuismod aliquet enim, nec elementum dolor quis viverra.</p>
<div class="visible-sm visible-xs pb-50"></div>
</div>
<div class="col-sm-6 col-md-3 animation_item scaleUp delay2">
<div class="ibox"><span class="lnr lnr-archive2"></span></div>
<h5 class="pt-30 pb-10">Machine</h5>
<p>Nam sapien eros enatis at dapibus facilisis, lacin ia sagittis purus. Ut tuismod aliquet enim, nec elementum dolor quis viverra.</p>
<div class="visible-xs pb-50"></div>
</div>
<div class="col-sm-6 col-md-3 animation_item scaleUp delay3">
<div class="ibox"><span class="lnr lnr-calendar-empty"></span></div>
<h5 class="pt-30 pb-10">Calendar</h5>
<p>Nam sapien eros enatis at dapibus facilisis, lacin ia sagittis purus. Ut tuismod aliquet enim, nec elementum dolor quis viverra.</p>
</div>
</div>
</div>Latest Projects (Full_Screen_PaneA · 2)
Code:
html
<div class="home25-bg01 text-center pt-60"> <div class="container pt-10"> <div class="home25-title01"> <h3>Latest Projects</h3> <div class="title-line"><span class="lnr lnr-picture"></span></div> </div> <div class="pr10 pl10">Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos. Sed ut perspiciatis unde omnis iste natus error sit voluptatem.</div> </div> <div class="home25-img-box mt-40 clearfix"> <div class="home25-img-con animation zoomInDown "> <div class="photo_box ico_LeftAndRight_enter content_bottom_push_in"> <div class="pic_box"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg" /> </a> <div class="ico"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg"><span class="lnr lnr-picture"></span> </a></div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg"> </a> <div class="content"> <h3><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg">Unlimited Colors</a></h3> <p><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg">April 12th, 2014</a></p> </div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img01.jpg"> <span class="shade"></span> </a></div> </div> </div> <div class="home25-img-con animation zoomInLeft"> <div class="photo_box ico_LeftAndRight_enter content_bottom_push_in"> <div class="pic_box"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg" /> </a> <div class="ico"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg"><span class="lnr lnr-picture"></span> </a></div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg"> </a> <div class="content"> <h3><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg">Unlimited Colors</a></h3> <p><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg">April 12th, 2014</a></p> </div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img02.jpg"> <span class="shade"></span> </a></div> </div> </div> <div class="home25-img-con animation zoomInRight"> <div class="photo_box ico_LeftAndRight_enter content_bottom_push_in"> <div class="pic_box"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg" /> </a> <div class="ico"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg"><span class="lnr lnr-picture"></span> </a></div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg"> </a> <div class="content"> <h3><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg">Unlimited Colors</a></h3> <p><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg">April 12th, 2014</a></p> </div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img03.jpg"> <span class="shade"></span> </a></div> </div> </div> <div class="home25-img-con animation zoomInUp"> <div class="photo_box ico_LeftAndRight_enter content_bottom_push_in"> <div class="pic_box"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg" /> </a> <div class="ico"><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg"><span class="lnr lnr-picture"></span> </a></div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg"> </a> <div class="content"> <h3><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg">Unlimited Colors</a></h3> <p><a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg">April 12th, 2014</a></p> </div> <a class="LightBox_image_gallery1" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img04.jpg"> <span class="shade"></span> </a></div> </div> </div> </div> </div>Aim to make your business web compelling and satis (Full_Screen_PaneA · 3)
Code:
html
<div class="home25-bg02 pt-60 pb-60"> <div class="container animation fadeIn pt-10 pb-10"> <div class="home25-ibox02"> <span>Aim to make your business web compelling and satisfying</span> We provide interactive and engaging website development, which will definitely improve satisfaction of your business. </div> <div class="home25-btn"> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">Purchase Theme</a></div> </div> </div>Why Choose Us (Full_Screen_PaneA · 4)
Code:
html
<div class="container pt-60">
<div class="row home25-img-bottom pt-10">
<div class="col-sm-12 col-md-6 Img_bottom animation fadeInLeft"><img alt="" class="img-responsive no-img" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img05.png" /></div>
<div class="col-sm-12 col-md-6 pb-60 animation fadeInRight">
<div class="pb-20">
<div class="home25-title02">
<h2>Why Choose Us</h2> </div>
<div>Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos omnis iste natus error sit voluptatem.</div>
<div class="pt-10 pb-20 home25-list clearfix">
<ul>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Cutting-edge CSS3 Animation </a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Boxed & Wide Layout</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Responsive Full Width Slider Banner</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Different Responsive Grid Layout</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Matching Containers</a>
</li>
</ul>
<ul>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Unlimited Skins/Styles/Colors</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Ultra Responsive Design</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Hundreds of Google Fonts</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">470 Font Icons</a>
</li>
<li><span class="fa fa-check-circle"></span>
<a href="#" target="_blank">Compatible With Most Browsers</a>
</li>
</ul>
</div>
<a class="home25-btn02" href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">More Features</a>
</div>
</div>
</div>
</div>0 Likes 0 Supports 0 Messages 0 Comments (Full_Screen_PaneA · 5)
Code:
html
<div class="home25-bg03 pt-60 pb-60"> <div class="container pt-10 pb-10"> <div class="row home25-number "> <div class="col-sm-6 col-md-3 animation rotateInDownLeft"> <div class="color-1"> <em class="lnr lnr-hearts"> </em> <span class="animation number" data-number="2930">0</span> <p>Likes</p> </div> </div> <div class="col-sm-6 col-md-3 animation rotateInDownRight"> <div class="color-2"> <em class="lnr lnr-thumbs-up"> </em> <span class="animation number" data-number="17000">0</span> <p>Supports</p> </div> </div> <div class="col-sm-6 col-md-3 animation rotateInUpLeft "> <div class="color-3"> <em class="lnr lnr-envelope"> </em> <span class="animation number" data-number="41800">0</span> <p>Messages</p> </div> </div> <div class="col-sm-6 col-md-3 animation rotateInUpRight"> <div class="color-4"> <em class="lnr lnr-bubbles"> </em> <span class="animation number" data-number="56000">0</span> <p>Comments</p> </div> </div> </div> </div> </div>Amazing Theme (Full_Screen_PaneA · 6)
Code:
html
<div class="container pt-60 pb-60">
<div class="row pt-10 pb-20">
<div class="col-sm-12 col-md-6 animation fadeInLeft ">
<div class="home25-title02">
<h2>Amazing Theme</h2> </div>
<p class="pb-10">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci.</p> Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos omnis iste natus error sit voluptatem.
<p> </p>
<a class="home25-btn02" href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">More Features</a>
</div>
<div class="col-sm-12 col-md-6 animation fadeInRight "> <img alt="" class="img-responsive" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img06.png" /> </div>
</div>
</div>DNN Modules (Full_Screen_PaneA · 7)
Code:
html
<div class="home25-bg01 pt-60 pb-30">
<div class="container clearfix animation pt-20">
<div class="row ">
<div class="col-sm-4 animation_item scaleUp delay1 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-cube"></span>
<h5>DNN Modules</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay2 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-paint-roller"></span>
<h5>Paint Brush</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay3 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-briefcase"></span>
<h5>New Products</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
</div>
<div class="row ">
<div class="col-sm-4 animation_item scaleUp delay4 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-thumbs-up"></span>
<h5>High Praises </h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay5 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-color-sampler"></span>
<h5>Unlimited Colors</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay6 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-rocket"></span>
<h5>Featured Skins </h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
</div>
<div class="row ">
<div class="col-sm-4 animation_item scaleUp delay7 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-trophy2"></span>
<h5>Top Sellers</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay8 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-desktop"></span>
<h5>Responsive</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
<div class="col-sm-4 animation_item scaleUp delay9 mb-40">
<div class="home25-services-box">
<div class="home25-services-con"><span class="lnr-volume-high"></span>
<h5>Volume Control</h5> Sed ut unde omnis iste natus sitium totam rem aperiam, eaque ipsa quae ab beatae ipsa quae vitae dicta sunt explicabo.</div>
</div>
</div>
</div>
</div>
</div>Experienced developers and skillful designers We a (Full_Screen_PaneA · 8)
Code:
html
<div class="home25-bg04 pt-60 pb-60"> <div class="container clearfix animation zoomIn pt-10 pb-10"> <div class="home25-ibox02"> <span>Experienced developers and skillful designers</span>We are a team comprised of reliable developers and designers whose aim is to provide you with skins and modules </div> <div class="home25-btn"> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" target="_blank">Learn More</a></div> </div> </div>Our Teams (Full_Screen_PaneA · 9)
Code:
html
<div class="container pt-60 pb-60"> <div class="home25-title01 pt-10"> <h3>Our Teams</h3> <div class="title-line"><span class="lnr-user"></span></div> </div> <div class="pr10 pl10 text-center">Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos. Sed ut perspiciatis unde omnis iste natus error sit voluptatem. </div> <div class="row home25-team animation fadeIn"> <div class="col-sm-4 pt-40"> <div class="photo_box ico_right_enter "> <a href="#home25-popup" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img07.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span>Frank Miller</span>WEB DESIGNER</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> <div class="col-sm-4 pt-40 "> <div class="photo_box ico_right_enter "> <a href="#home25-popup02" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img08.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span> Micheal Cyrus</span>WEB DESIGNER</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> <div class="col-sm-4 pt-40"> <div class="photo_box ico_right_enter "> <a href="#home25-popup03" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img09.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span> Harra Halloy</span>SKIN DEVELOPER</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> </div> <div class="row home25-team animation fadeIn pb-10"> <div class="col-sm-4 pt-40 "> <div class="photo_box ico_right_enter "> <a href="#home25-popup04" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img10.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span>Jack Sanche</span>WEB DESIGNER</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> <div class="col-sm-4 pt-40 "> <div class="photo_box ico_right_enter "> <a href="#home25-popup05" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img11.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span> Steven Doe</span>JQUERY</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> <div class="col-sm-4 pt-40 "> <div class="photo_box ico_right_enter "> <a href="#home25-popup06" class="LightBox_Box"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img12.jpg" /> <span class="ico"> <span class="lnr lnr-zoom-in"></span> </span> <span class="shade"></span> </span> </a> <div class="home25-team-info clearfix"> <h2><span>Karen Ryan</span>HTML & CSS</h2> <div class="home25-social"> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-google-plus"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> </div> </div> </div> </div> </div> <div id="home25-popup" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="fa fa-paint-brush"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img01.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Frank Miller</h3> <span>Web Designer</span> <div class="line"></div> <p>Nunc ornare adipiscing orci eu consectetur. Ut justo libero, porttitor ac elementum luctus, blandit at dui. Morbi at mauris eu mauris facilisis sollicitudin.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="80" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Photoshop</h6> </div> <div class="col-sm-4"> <div data-percent="90" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Illustrator</h6> </div> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Coredraw</h6> </div> </div> </div> </div> </div> <div id="home25-popup02" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="fa fa-paint-brush"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img02.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Micheal Cyrus</h3> <span>Web Designer</span> <div class="line"></div> <p>Phasellus consectetur laoreet fringilla. Nulla molestie pulvinar aliquet. Donec non metus enim. Proin vitae tristique lacus.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Photoshop</h6> </div> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Illustrator</h6> </div> <div class="col-sm-4"> <div data-percent="80" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Coredraw</h6> </div> </div> </div> </div> </div> <div id="home25-popup03" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="color-2 fa fa-tachometer"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img03.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Harra Halloy</h3> <span>Skin Developer</span> <div class="line"></div> <p> Phasellus vitae metus vitae sapien pharetra vestibulum. Ut lacus mi, egestas quis viverra a, blandit ut nisi. Vestibulum ante ipsum primis in faucibus orci.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="80" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Dreamweaver</h6> </div> <div class="col-sm-4"> <div data-percent="90" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Html5</h6> </div> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>CSS3</h6> </div> </div> </div> </div> </div> <div id="home25-popup04" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="color-2 fa fa-tachometer"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img04.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Jack Sanche</h3> <span>Skin Developer</span> <div class="line"></div> <p> Ut lacus mi, egestas quis viverra a, blandit ut nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curaeipsum volutpat congue.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="82" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Dreamweaver</h6> </div> <div class="col-sm-4"> <div data-percent="88" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Html5</h6> </div> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>CSS3</h6> </div> </div> </div> </div> </div> <div id="home25-popup05" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="color-3 fa fa-keyboard-o"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img05.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Steven Doe</h3> <span>Customer service</span> <div class="line"></div> <p>Praesent eros mi, mattis pharetra convallis pharetra, hend cursus felis. Etiam id odio at turpis tristique pulvinar. Tesque mi felis varius non.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="82" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Reading</h6> </div> <div class="col-sm-4"> <div data-percent="88" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Speaking</h6> </div> <div class="col-sm-4"> <div data-percent="85" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Translating</h6> </div> </div> </div> </div> </div> <div id="home25-popup06" class="white-popup mfp-with-anim mfp-hide"> <div class="clearfix"> <div class="home25-lightbox-l"><span class="color-4 fa fa-keyboard-o"></span> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25lightbox-img06.jpg" /> </div> <div class="home25-lightbox-r"> <h3>Karen Ryan</h3> <span>Programmer</span> <div class="line"></div> <p> Praesent eros mi, mattis pharetra convallis pharetra, hend cursus felis. Etiam id odio at turpis tristique pulvinar. Tesque mi felis varius non.</p> <h4>Proficiency:</h4> <div class="home25-char row"> <div class="col-sm-4"> <div data-percent="86" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>Python</h6> </div> <div class="col-sm-4"> <div data-percent="89" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>DNN</h6> </div> <div class="col-sm-4"> <div data-percent="90" class="home25-percentage"> <div class="percentage_inner"><span>0</span>%</div> </div> <h6>PHP</h6> </div> </div> </div> </div> </div> </div>Testimonials & Clients (Full_Screen_PaneA · 10)
Code:
html
<div class="home25-bg05 pt-60 pb-60">
<div class="container pt-20 pb-20">
<div class="home25-title01">
<h3>Testimonials & Clients</h3>
<div class="title-line"><span class="lnr-bubble"></span></div>
</div>
<div class="pr10 pl10 pb-40 text-center">Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos. Sed ut perspiciatis unde omnis iste natus error sit voluptatem. </div>
<div class="row">
<div class="col-md-6 animation fadeInLeft ">
<div class="home25-Testimonials">
<ul class=" Testimonials_tab " data-position="fade" data-display-arrows="false" data-autoheight="false" data-autoplay="3000">
<li>
<div class="pic"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img19.jpg" /></div>
<blockquote><small class="a_t_c">David Parker<span>dnngo buyer</span></small>
<p>“Ut pellentesque scelerisque augue, a faucibus ipsum volutpat congue. Praesent eros mi, mattis pharetra convallis pharetra, hendrerit cursus felis. Etiam id odio at turpis tristique pulvinar. ”</p>
</blockquote>
</li>
<li>
<div class="pic"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img20.jpg" /></div>
<blockquote> <small class="a_t_c">Laura Nixon<span>dnngo buyer</span></small>
<p>“Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. ”</p>
</blockquote>
</li>
<li>
<div class="pic"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img21.jpg" /></div>
<blockquote><small class="a_t_c">Necoye Bela<span>Form Mass Impressions </span></small>
<p>“ Nemo enim ipsam voluptatem quia voluptas sit aspernat uraut odit aut fugit, sed quia consequuntur magni dolores nec semper mi posuere nec lor nam nunc est quis fauc ibus iaculis quam est. ”</p>
</blockquote>
</li>
</ul>
</div>
</div>
<div class="col-md-6 animation fadeInRight home25-logoimg text-center">
<div class="row">
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img13.png" /></a>
</div>
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img14.png" /></a>
</div>
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img15.png" /></a>
</div>
</div>
<div class="row">
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img16.png" /></a>
</div>
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img17.png" /></a>
</div>
<div class="col-md-4 col-xs-4">
<a href="#" target="_blank"><img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img18.png" /></a>
</div>
</div>
</div>
</div>
</div>
</div>Pricing Tables (Full_Screen_PaneA · 11)
Code:
html
<div class="container pt-60 pb-60"> <div class="home25-title01 pt-10"> <h3>Pricing Tables</h3> <div class="title-line"><span class="lnr-files"></span></div> </div> <div class="pl10 pr10 pb-30 text-center">Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos. Sed ut perspiciatis unde omnis iste natus error sit voluptatem. </div> <div class="price-table home25-pricetable row animation mb-10"> <div class="col-md-3 col-sm-6 animation_item scaleUp delay1"> <div class="price_border"> <div class="price_title"> <h2>BASIC</h2> </div> <div class="price_holder"> <div class="price_box"><span class="sup">$</span><span class="price">100</span><span class="unit">Per Month</span></div> <ul> <li><span class="fa fa-check-square-o"></span>10GB disk space</li> <li><span class="fa fa-check-square-o"></span>100GB bandwidth</li> <li><span class="fa fa-check-square-o"></span>umlimited colors</li> <li><span class="fa fa-check-square-o"></span>DNN free skin</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn " target="_blank">Buy It Now</a> </div> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay2"> <div class="price_border"> <div class="price_title"> <h2>Professional</h2> </div> <div class="price_holder"> <div class="price_box"><span class="sup">$</span><span class="price">200</span><span class="unit">Per Month</span></div> <ul> <li><span class="fa fa-check-square-o"></span>20GB disk space</li> <li><span class="fa fa-check-square-o"></span>200GB bandwidth</li> <li><span class="fa fa-check-square-o"></span>umlimited colors</li> <li><span class="fa fa-check-square-o"></span>DNN free skin</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn " target="_blank">Buy It Now</a> </div> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay3"> <div class="price_border"> <div class="price_title"> <h2>Maxium</h2> </div> <div class="price_holder"> <div class="price_box"><span class="sup">$</span><span class="price">300</span><span class="unit">Per Month</span></div> <ul> <li><span class="fa fa-check-square-o"></span>30GB disk space</li> <li><span class="fa fa-check-square-o"></span>300GB bandwidth</li> <li><span class="fa fa-check-square-o"></span>umlimited colors</li> <li><span class="fa fa-check-square-o"></span>DNN free skin</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn " target="_blank">Buy It Now</a> </div> </div> </div> <div class="col-md-3 col-sm-6 animation_item scaleUp delay4"> <div class="price_border"> <div class="price_title"> <h2>Extreme</h2> </div> <div class="price_holder"> <div class="price_box"><span class="sup">$</span><span class="price">400</span><span class="unit">Per Month</span></div> <ul> <li><span class="fa fa-check-square-o"></span>40GB disk space</li> <li><span class="fa fa-check-square-o"></span>400GB bandwidth</li> <li><span class="fa fa-check-square-o"></span>umlimited colors</li> <li><span class="fa fa-check-square-o"></span>DNN free skin</li> </ul> <a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="btn " target="_blank">Buy It Now</a> </div> </div> </div> </div> </div>Powerful Contact Section (Full_Screen_PaneA · 12)
Code:
html
<div class="home25-bg06 pt-20 pb-20"> <div class="container animation fadeInDown pt-60 pb-60"> <h2> Powerful Contact Section</h2> <span>You can send message to us for the customized services and you can follow us from the contact page. </span> <a href="http://dnngo.net" class="home25-btn03" target="_blank">Get In Touch</a><a href="http://store.dnnsoftware.com/home/product-details/PackageID/36589/r/cd57d7207c9d4266bc34" class="home25-btn03" target="_blank">Follow DNNGo</a> </div> </div>Contact Us (TopPane · 1)
Code:
html
<div class="home25-title01 pt-30"> <h3>Contact Us</h3> <div class="title-line"><span class="lnr-envelope-open"></span></div> </div> <div class="pl10 pr10 pb-30 text-center">Doren orciac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Class aptent taciti sociosqu ad litora torquent per conub nostra, per inceptos himenaeos. Sed ut perspiciatis unde omnis iste natus error sit voluptatem.</div>Form Section (TopPane)
This section uses the DNNGo PowerForms module — see PowerForms.
About Us (FootPaneD)
Code:
html
<div class="animation fadeInLeft">
<p>Lorem ipsu dolor sit amet, consectetur elit. dictum felis eu pedeLorem ipsudol orsit amet, consectetur adipisicing elit Lorem ipsu dolor sit amet elit.</p>
<p class="pt-10">Ut wiseni ad minim veniam, quis nostru exerci tation suscipit lobort is nisl ut aliquip commodo.</p>
<div class="home25-footer-social clearfix ">
<li>
<a href="#" class="facebook fa fa-facebook "></a>
</li>
<li>
<a href="#" class="twitterl fa fa-twitter"></a>
</li>
<li>
<a href="#" class="in fa fa-linkedin"></a>
</li>
</div>
</div>Categories (FootPaneE)
Code:
html
<div class="home25-footer-list animation fadeInUp ">
<ul>
<li><a href="#" target="_blank"><span class="fa fa-align-justify"></span>Module Development</a></li>
<li><a href="#" target="_blank"><span class="fa fa-align-justify"></span>Responsive Web</a></li>
<li><a href="#" target="_blank"><span class="fa fa-align-justify"></span>DNN XBlog Module</a></li>
<li><a href="#" target="_blank"><span class="fa fa-align-justify"></span>Unlimited-Color Skin</a></li>
<li><a href="#" target="_blank"><span class="fa fa-align-justify"></span>Create New Website</a></li>
</ul>
</div>Photo Gallery (FootPaneF · 1)
Code:
html
<ul class="home25-footer-img animation fadeInDown">
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img22-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img22.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img23-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img23.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img24-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img24.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img25-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img25.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img26-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img26.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img27-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img27.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img28-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img28.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img29-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img29.jpg" /> <span class="shade"></span></span> </a></div>
</li>
<li>
<div class="photo_box shade_zoom "> <a title="Image Gallery" class="LightBox_image_gallery5" href="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img30-big.jpg"> <span class="pic_box"> <img alt="" src="http://demo8.dnngo.net/portals/13/Home25-Images/home25-img30.jpg" /> <span class="shade"></span></span> </a></div>
</li>
</ul>FootPaneF Section (FootPaneF · 2)
Code:
html
Get In Touch (FootPaneG)
Code:
html
<div class="animation fadeInRight">
<p>Nam sapien eros enatis at dapibus facie lisis, lacinia sagittis purus. Ut tuismod aliquet enim, nec semper mi posuere nec lor nam nunc est, faucibus iaculis placerat quis felis.</p>
<ul class="home25-footerd">
<li>Phone : (+88) - 1234 - 5678</li>
<li>Skype : dnngo-linda</li>
<li>Email : [email protected]</li>
<li>Address : XinAn Street, TaiShan Hotel</li>
</ul>
</div>