Skip to content

Home Version 32 Page Code ​

Click to preview the Home Version 32 demo. View demo

Preview:

HomeVersion32

Contact Info (HeaderPane) ​

Code:

html
<div style="text-align: center;">
<h3 class="pb-10">Contact Info</h3>

<p>Emial : [email protected]</p>

<p>Phone : (+086) - 2755 -9999</p>

<p>Skype : Dnngo-Linda</p>

<div class="home32-social pt-10"><a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-facebook"></span></a> <a href="#"><span class="fa fa-apple"></span></a></div>
</div>

This section uses the DNNGo LayerGallery Pro module.

Add the slides (images, text, links) manually in the module — see LayerGallery Pro.

THE DNNGO OVERVIEW (BannerPane · 2) ​

Code:

html
<div class="home32-bg pt-60 pb-60">
	<div class="container pt-20 pb-20">
		<div class="row">
			<div class="col-sm-6 animation fadeInLeft"><img alt="" class="img-responsive" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic01.jpg" />
				<div class="pt-30 visible-xs "></div>
			</div>
			<div class="col-sm-6 animation fadeInRight">
				<h3 class="home32-title01"><span>THE DNNGO</span> OVERVIEW</h3>
				<p class="mb-20">Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. </p>
				<p class="mb-20">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulp utate egestas sem, eu cursus ligula ullamcorper non. Curabitur tristique velit eu mauris venenatis egestas. image Phasellus bibendum placerat metus.</p>
				<div>
					<a class="home32-btn" href="#">VIEW MORE <span class="fa fa-angle-right"></span></a>
				</div>
			</div>
		</div>
	</div>
</div>

WEB SETTINGS (TopPane) ​

Code:

html
<div class="animation">
	<div class="row">
		<div class="col-sm-4 animation_item scaleUp delay1">
			<div class="home32-ibox">
				<h3><span class="fa fa-cogs color-1"></span>WEB SETTINGS</h3>
				<p>Mauris at ultricies eros. Morbi vel dui nec arcu suscipiting euismod. Phasellus pellentes untque lectus egetingerieee quammollis lac tellus. </p>
			</div>
		</div>
		<div class="col-sm-4 animation_item scaleUp delay2">
			<div class="home32-ibox">
				<h3><span class="fa fa-volume-down color-2"></span>LOWEST VOICE</h3>
				<p>Nunc ornare adipiscing orci eu consectetur. Ut justo libero, porttitor ac elementum luctus, blandit at dui. Donec sit amet nunc id libero sagittis mattis. </p>
			</div>
		</div>
		<div class="col-sm-4 animation_item scaleUp delay3">
			<div class="home32-ibox">
				<h3><span class="fa fa-send color-3"></span>SEND A MESSAGE</h3>
				<p>Donec non metus enim. Proin vitae tristique lacus. Phasellus vitae metus vitae sapien pharetra vestibulum. Ut lacus mi.</p>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-sm-4 animation_item scaleUp delay4">
			<div class="home32-ibox">
				<h3><span class="fa fa-phone color-4"></span>CALL SERVICES</h3>
				<p>Ut pellentesque scelerisque augue, a faucibus ipsum volutpat congue. Praesent eros mi, mattis pharetra convallis pharetra, hendrerit cursus felis.</p>
			</div>
		</div>
		<div class="col-sm-4 animation_item scaleUp delay5">
			<div class="home32-ibox">
				<h3><span class="fa fa-search color-1"></span>SEO FRIENDLY</h3>
				<p>Etiam id odio at turpis tristique pulvinar. Pellentesque mi felis, vehicula sit amet lacinia at, dapibus non lorem. Fusce erat dolor.</p>
			</div>
		</div>
		<div class="col-sm-4 animation_item scaleUp delay6">
			<div class="home32-ibox">
				<h3><span class="fa fa-comments color-2"></span>CONSULT ONLINE</h3>
				<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Ullamcorper ante.</p>
			</div>
		</div>
	</div>
</div>

THE DNNGO OVERVIEW (Full_Screen_PaneB) ​

Code:

html
<div class="home32-bg02 pt-60 pb-60"> <div class="pt-10"></div> <h3 class="home32-title01 text-center animation scaleUp"><span>THE DNNGO</span> OVERVIEW</h3> <div class="home32-textcenter mb-30 animation scaleUp">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulp utate egestas sem, eu cursus ligulaing.</div> <div class="isotope_grid home32-isotope"> <div class="isotope_group animation scaleUp "> <a class="active" href="#" data-filter="*">ALL</a> <a href="#" data-filter=".websites">WEBSITES</a> <a href="#" data-filter=".logos">LOGOS &amp; BRANDING</a> <a href="#" data-filter=".design">GRAPHIC DESIGN</a> <a href="#" data-filter=".marketing">ONLINE MARKETING</a> <a href="#" data-filter=".image">IMAGE</a> </div> <div class="loading"> <div class="loading-container container1"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> <div class="loading-container container2"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> <div class="loading-container container3"> <div class="circle1"></div> <div class="circle2"></div> <div class="circle3"></div> <div class="circle4"></div> </div> </div> <div class="isotope_main animation scaleUp" data-min-width="390"> <div class="isotope_item websites logos"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic02.jpg" /> <h3>Clean and Simple</h3> </div> </a> </div> </div> <div class="isotope_item logos marketing image"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic03.jpg" /> <h3>Lifestyle</h3> </div> </a> </div> </div> <div class="isotope_item marketing image"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic04.jpg" /> <h3>Inspired</h3> </div> </a> </div> </div> <div class="isotope_item logos marketing"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic05.jpg" /> <h3>Natural</h3> </div> </a> </div> </div> <div data-zoom="2" class="isotope_item websites design marketing"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic06.jpg" /> <h3>Inspired by tradition</h3> </div> </a> </div> </div> <div data-zoom="2" class="isotope_item websites image"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic07.jpg" /> <h3>When you are alone</h3> </div> </a> </div> </div> <div class="isotope_item design"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic08.jpg" /> <h3>Travel</h3> </div> </a> </div> </div> <div class="isotope_item design image"> <div class="photo_box img_zoom"> <a href="#"> <div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic09.jpg" /> <h3>Culture</h3> </div> </a> </div> </div> </div> </div> <div class="pt-40 pb-20 text-center"> <a href="#" class="home32-btn">VIEW MORE <span class="fa fa-angle-right"></span></a> </div> </div><div class="pb-30"></div>

PASSIONATE ABOUT SMART DESIGN (RowFour_Grid6_Pane1) ​

Code:

html
<div class="animation fadeInLeft">
<h3 class="home32-title01"><span>PASSIONATE ABOUT</span> SMART DESIGN</h3>

<p class="pb-10">Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla.</p>

<ul class="home32-list">
 <li><span class="fa fa-upload"></span>
 <p>Nunc ornare adipiscing orci eu consectetur. Ut justo libero, porttitor ac elementum luctus, blandit at dui. </p>
 </li>
 <li><span class="fa fa-user"></span>
 <p>Morbi at mauris eu mauris facilisis sollicitudin. Phasellus consectetur laoreet fringilla. Morbi at mauris eu mauris facilisis sollicitudin. </p>
 </li>
 <li><span class="fa fa-html5"></span>
 <p>Nulla molestie pulvinar aliquet. Donec non metus enim. Proin vitae tristique lacus. Phasellus vitae metus vitae sapien.</p>
 </li>
 <li><span class="fa fa-paper-plane"></span>
 <p>Ut lacus mi, egestas quis viverra a, blandit ut nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices.</p>
 </li>
</ul>
</div>

RowFour_Grid6_Pane2 Section (RowFour_Grid6_Pane2) ​

Code:

html
<div class="text-center animation fadeInRight"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic10.jpg" class="img-responsive" /></div>

PASSIONATE DESIGN READY (Full_Screen_PaneC) ​

Code:

html
<div class="pt-30"></div>
<div class="home32-bg03 pt-60">
	<div class="container">
		<div class="row">
			<div class="col-md-6 col-md-push-6 animation fadeInRight">
				<div class="hidden-md hidden-sm hidden-xs pt-50"></div>
				<h3 class="home32-title01"><span>PASSIONATE</span> DESIGN READY</h3>
				<p class="pb-20 pt-10">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulputate egestas sem, eu cursus liguinge ullamcorper non. consectetur adipiscing elit. Morbi vulputate egestas sem, eu cursus ligula ullameressde ullamcorper non.</p>
				<ul class="home32-list02">
					<li><span class="fa fa-external-link-square"></span>Praesent eros mi, mattis convallis pharetra, hendrerit felis. Etiam id</li>
					<li><span class="fa fa-external-link-square"></span>Odio at turpis tristique. Pellentesque mi felis, vehicula sit amet lacinia at,</li>
					<li><span class="fa fa-external-link-square"></span>Dapibus non lorem. Fusce erat dolor, varius non pretium eget, Proin elit arcu,</li>
					<li><span class="fa fa-external-link-square"></span>Commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec&nbsp;</li>
					<li><span class="fa fa-external-link-square"></span>Mi sit amet mauris. Nam elementum quam ullamcorper ante.</li>
				</ul>
				<div class="pt-40 pb-20">
					<a class="home32-btn02" href="#">LIVE DEMO</a>
					<a class="home32-btn03" href="#">PURCHASE NOW</a>
				</div>
				<div class="visible-md pb-40"></div>
			</div>
			<div class="col-md-6 col-md-pull-6 animation fadeInLeft">
				<div class="home32-leftimg"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic11.png" /></div>
			</div>
		</div>
	</div>
</div>

RECENT BLOGS (ContentPane) ​

Code:

html
<div class="pt-20 pb-30">
	<h3 class="home32-title01 text-center animation scaleUp"><span>RECENT</span> BLOGS</h3>
	<div class="home32-textcenter pb-30 animation scaleUp">Lorem ipsum dolor sit amet, consecteturingere adipiscing elit. Morbi vulputate ingeingeingein egestasee wingeinge sem,cursus liguinge inger ullamcorper noninge.</div>
	<div class="carousel home32-carousel animation scaleUp" data-autoheight="false" data-pagination="false">
		<div class="item">
			<div class="photo_box img_zoom">
				<div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic12.jpg" />
					<div class="shade">&nbsp;</div>
				</div>
				<div class="cont">
					<h3>YOUR BLOG TITLE HERE</h3>
					<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.</p>
				</div>
				<a class="btn" href="#" target="_blank">READ MORE<span class="fa fa-angle-right"></span></a>
			</div>
		</div>
		<div class="item">
			<div class="photo_box img_zoom">
				<div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic13.jpg" />
					<div class="shade">&nbsp;</div>
				</div>
				<div class="cont">
					<h3>YOUR BLOG TITLE HERE</h3>
					<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.</p>
				</div>
				<a class="btn" href="#" target="_blank">READ MORE<span class="fa fa-angle-right"></span></a>
			</div>
		</div>
		<div class="item">
			<div class="photo_box img_zoom">
				<div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic14.jpg" />
					<div class="shade">&nbsp;</div>
				</div>
				<div class="cont">
					<h3>YOUR BLOG TITLE HERE</h3>
					<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.</p>
				</div>
				<a class="btn" href="#" target="_blank">READ MORE<span class="fa fa-angle-right"></span></a>
			</div>
		</div>
		<div class="item">
			<div class="photo_box img_zoom">
				<div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic15.jpg" />
					<div class="shade">&nbsp;</div>
				</div>
				<div class="cont">
					<h3>YOUR BLOG TITLE HERE</h3>
					<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.</p>
				</div>
				<a class="btn" href="#" target="_blank">READ MORE<span class="fa fa-angle-right"></span></a>
			</div>
		</div>
		<div class="item">
			<div class="photo_box img_zoom">
				<div class="pic_box"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic13.jpg" />
					<div class="shade">&nbsp;</div>
				</div>
				<div class="cont">
					<h3>YOUR BLOG TITLE HERE</h3>
					<p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.</p>
				</div>
				<a class="btn" href="#" target="_blank">READ MORE<span class="fa fa-angle-right"></span></a>
			</div>
		</div>
	</div>
</div>

PROJECTS COMPLETED 0 CUMULATIVE PRAISES 0 HAPPY CU (Full_Screen_PaneE) ​

Code:

html
<div class="home32-bg04 pt-60 pb-60">
	<div class="container pt-20 pb-20">
		<div class="home32-number row animation">
			<div class="col-sm-3 animation_item scaleUp delay1"><em class="icon fa fa-check color-1"></em>
				<div class="title">PROJECTS COMPLETED</div> <span class="animation number" data-number="2540">0</span></div>
			<div class="col-sm-3 animation_item scaleUp delay2"><em class="icon fa fa-thumbs-up color-2"></em>
				<div class="title">CUMULATIVE PRAISES</div> <span class="animation number" data-number="7325">0</span></div>
			<div class="col-sm-3 animation_item scaleUp delay3"><em class="icon fa fa-heart color-3"></em>
				<div class="title">HAPPY CUSTOMERS</div> <span class="animation number" data-number="1924">0</span></div>
			<div class="col-sm-3 animation_item scaleUp delay4"><em class="icon fa fa-cog color-4"></em>
				<div class="title">LINES OF CODE</div> <span class="animation number" data-number="2911">0</span></div>
		</div>
	</div>
</div>

WHAT IS THE DNNGO DESIGN (BottomPane) ​

Code:

html
<div class="pt-20 pb-30">
<h3 class="home32-title01 text-center animation scaleUp"><span>WHAT IS THE</span> DNNGO DESIGN</h3>
<div class="home32-textcenter pb-30 animation scaleUp">Praesent eros mi, mattis pharetra convallis pharetra, hendrerit cursus felis. Etiam id odio at turpis tristique pulvinar. Pellentesque mi felis, vehicula sit amet lacinia at, dapibus non lorem. Fusce erat dolor, varius non pretium eget, rutrum commodo, vehicula tempus.</div>
<div class="home32-imginfo animation scaleUp">
	<ul class="img-left hidden-xs hidden-sm">
		<li class="itme-1 active">
			<div class="title">Nice Color Design<span>&nbsp;</span></div>
			<div class="line">&nbsp;</div>
		</li>
		<li class="itme-2">
			<div class="title">All in One<span>&nbsp;</span></div>
			<div class="line">&nbsp;</div>
		</li>
		<li class="itme-3">
			<div class="title">Super Multiple Layouts<span>&nbsp;</span></div>
			<div class="line">&nbsp;</div>
		</li>
	</ul>
	<ul class="img-right hidden-xs hidden-sm">
		<li class="itme-4 ">
			<div class="title"><span>&nbsp;</span>Amazing Store Online</div>
			<div class="line">&nbsp;</div>
		</li>
		<li class="itme-5 active">
			<div class="title"><span>&nbsp;</span>Unique and Creative Design</div>
			<div class="line">&nbsp;</div>
		</li>
		<li class="itme-6">
			<div class="title"><span>&nbsp;</span>Awesome Blog Layout</div>
			<div class="line">&nbsp;</div>
		</li>
	</ul>
	<div class="center-img"><img alt="" class="img-responsive" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic16.png" /></div>
</div>
</div>

HAPPY CLIENTS (Full_Screen_PaneH · 1) ​

Code:

html
<div class="home32-bg05 pt-60 pb-60">
	<div class="container pt-10 pb-20">
		<h3 class="home32-title01 text-center animation scaleUp"><span>HAPPY</span> CLIENTS</h3>
		<div class="home32-textcenter pb-30 animation scaleUp">We are professionals in this field</div>
		<div class="carousel home32-carousel2 animation scaleUp" data-autoheight="false" data-navigation="false">
			<div class="item ">
				<div class="pic"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-portrait01.jpg" /></div>
				<p>Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius. Phasellus ipsum. Nunc tempus lectus.</p>
				<div class="name">David Parker - <span>TECHNICAL DIRECTOR</span></div>
			</div>
			<div class="item">
				<div class="pic"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-portrait02.jpg" /></div>
				<p>Ut pellentesque scelerisque augue, a faucibus ipsum volutpat congue. Praesent eros mi, mattis pharetra convallis pharetra, Tristique pulvinar. Pellentesque mi felis, vehicula sit amet lacinia at, dapibus non lorem</p>
				<div class="name">Monica Wood - <span>PROJECT SUPERVISOR</span></div>
			</div>
			<div class="item">
				<div class="pic"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-portrait03.jpg" /></div>
				<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>
				<div class="name">Ross Williams - <span>PROGRAMMER</span></div>
			</div>
			<div class="item">
				<div class="pic"><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-portrait04.jpg" /></div>
				<p>Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin.</p>
				<div class="name">Laura Nixon - <span>SOFTWARE ENGINEER</span></div>
			</div>
		</div>
	</div>
</div>

OUR SERVICES (Full_Screen_PaneH · 2) ​

Code:

html
<div class="pt-60">
	<div class="container pt-10 pb-20">
		<div class="row">
			<div class="col-sm-6 animation fadeInLeft">
				<h3 class="home32-title01"><span>OUR</span> SERVICES</h3>
				<div class="panel-group home32-accordion" id="home32-accordion">
					<div class="panel panel-default">
						<div class="panel-heading">
							<h4 class="panel-title"><a class="collapsed" data-parent="#home32-accordion" data-toggle="collapse" href="#collapse32-1"><em class="fa fa-bullhorn"></em><span class="icon"></span>Perfect Blog Platform</a></h4> </div>
						<div class="panel-collapse collapse" id="collapse32-1">
							<div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulputate egestas sem, eu cursus ligu Morbi corper non. consectetur adipiscing elit. Morbi vulputategestas sem,inger cursus ligula ullam ullamcorper non.&nbsp;</div>
						</div>
					</div>
					<div class="panel panel-default">
						<div class="panel-heading">
							<h4 class="panel-title"><a data-parent="#home32-accordion" data-toggle="collapse" href="#collapse32-2"><em class="fa fa-laptop"></em><span class="icon"></span>Fully Responsive Wordpress Here</a></h4> </div>
						<div class="panel-collapse collapse in" id="collapse32-2">
							<div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulputate egestas sem, eu cursus ligu Morbi corper non. consectetur adipiscing elit. Morbi vulputategestas sem,inger cursus ligula ullam ullamcorper non.&nbsp;</div>
						</div>
					</div>
					<div class="panel panel-default">
						<div class="panel-heading">
							<h4 class="panel-title"><a class="collapsed" data-parent="#home32-accordion" data-toggle="collapse" href="#collapse32-3"><em class="fa fa-bell"></em><span class="icon"></span>Carefully Crafted Elements</a></h4> </div>
						<div class="panel-collapse collapse" id="collapse32-3">
							<div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vulputate egestas sem, eu cursus ligu Morbi corper non. consectetur adipiscing elit. Morbi vulputategestas sem,inger cursus ligula ullam ullamcorper non.&nbsp;</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-sm-6 animation fadeInRight">
				<h3 class="home32-title01"><span>OUR</span> SKILLS</h3>
				<div class="home32-loaded">
					<p>Photoshop</p>
					<div class="progress">
						<div class="progress-bar animation animationwidth color-1" data-width="96%" style="width: 56%;"><span>56%</span></div>
					</div>
					<p>Branding</p>
					<div class="progress">
						<div class="progress-bar animation animationwidth color-2" data-width="92%" style="width: 92%;"><span>92%</span></div>
					</div>
					<p>Web Development</p>
					<div class="progress">
						<div class="progress-bar animation animationwidth color-3" data-width="93%" style="width: 83%;"><span>83%</span></div>
					</div>
					<p>SEO Marketing</p>
					<div class="progress">
						<div class="progress-bar animation animationwidth color-4" data-width="90%" style="width: 49%;"><span>49%</span></div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

ABOUT US (FootPaneA) ​

Code:

html
<div class="animation fadeInUp"> <p><img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-logo01.png" /></p> <p>Mauris rhoncus pretium porttitor Crasingerss scelerisq Phasell enimin faibusesse egestas scelerisqueinger enimin faibusesse.</p> <p class="pt-10 pb-10"><a class="home32-more" href="#" target="_blank"><em class="fa fa-angle-right"></em> READ MORE</a></p> <div class="home32-mail"><input type="text" placeholder="[email protected]" /> <a href="#"><span class="fa fa-angle-right"></span></a></div> </div>

THE LATEST NEWS (FootPaneB) ​

Code:

html
<div class="animation fadeInUp delay2">
<div class="home32-news clearfix"> <img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic17.jpg" />
<div class="img-right">
<h3>Your Title Biog Here</h3>
<p>Suspendisse consectetur ligula vitae leoingerin faucibus.</p>
<div class="date">21 December, 2017</div>
</div>
</div>
<div class="home32-news clearfix"> <img alt="" src="http://demo8.dnngo.net/Portals/13/Home32-Images/home32-pic18.jpg" />
<div class="img-right">
<h3>Your Title Biog Here</h3>
<p>Suspendisse consectetur ligula vitae leoingerin faucibus. </p>
<div class="date">21 December, 2017</div>
</div>
</div>
</div>

SEND IT NOW (FootPaneC) ​

This section uses the DNNGo PowerForms module — see PowerForms.