<!doctype html>
<!--[if IE 7 ]>    <html lang="en-gb" class="isie ie7 oldie no-js"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en-gb" class="isie ie8 oldie no-js"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en-gb" class="isie ie9 no-js"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en-gb" class="no-js"> <!--<![endif]-->

<head>
	<title>PORTFOLIO CATEGORY - TWO COLUMN | KALLYAS Template</title>

	<meta charset="utf-8">
	<meta name="keywords" content="premium html template, unique premium template, multipurpose" />
	<meta name="description" content="Welcome to KALLYAS Template, a wonderful and premium product for multipurpose websites" />

	<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
	<link rel="stylesheet" href="addons/superfish_responsive/superfish.css" type="text/css" />
	<link rel="stylesheet" href="css/template.css" type="text/css" />
	<link rel="stylesheet" href="css/updates.css" type="text/css" />
	<link rel="stylesheet" href="css/custom.css" type="text/css" />

	
	<!-- This stylesheet only adds some repairs on idevices  -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<link rel="stylesheet" href="css/responsive-devices.css" type="text/css" />
	
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Lato:300,400,700,900&amp;v1&mp;subset=latin,latin-ext" type="text/css" media="screen" id="google_font" />
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700&amp;v1&mp;subset=latin,latin-ext" type="text/css" media="screen" id="google_font_body" />
	
	<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
	<script>window.jQuery || document.write('<script src="js/jquery-1.8.2.min.js">\x3C/script>')</script>
	<script src="js/jquery.noconflict.js" type="text/javascript"></script>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.1/modernizr.min.js" type="text/javascript"></script>
	
	<link rel="shortcut icon" href="images/favicons/favicon.png">
	<link rel="apple-touch-icon" href="images/favicons/apple-touch-icon-57x57.png">
	<link rel="apple-touch-icon" sizes="72x72" href="images/favicons/apple-touch-icon-72x72.png">
	<link rel="apple-touch-icon" sizes="114x114" href="images/favicons/apple-touch-icon-114x114.png">
	
	<!--[if lte IE 9]>
		<link rel="stylesheet" type="text/css" href="css/fixes.css" />
	<![endif]-->

	<!--[if lte IE 8]>
		<script src="js/respond.js"></script>
		<script type="text/javascript"> 
		var $buoop = {vs:{i:8,f:6,o:10.6,s:4,n:9}} 
		$buoop.ol = window.onload; 
		window.onload=function(){ 
		 try {if ($buoop.ol) $buoop.ol();}catch (e) {} 
		 var e = document.createElement("script"); 
		 e.setAttribute("type", "text/javascript"); 
		 e.setAttribute("src", "http://browser-update.org/update.js"); 
		 document.body.appendChild(e); 
		} 
		</script> 
	<![endif]-->
	
	<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
	  <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->
	
	<!-- Facebook OpenGraph Tags - Replace with your own -->
	<meta property="og:title" content="KALLYAS Template HTML"/>
	<meta property="og:type" content="website"/>
	<meta property="og:url" content="http://www.hogash.com/demo/kalypso_html/"/>
	<meta property="og:image" content="http://www.hogash.com/demo/kalypso_html/images/logo.png"/>
	<meta property="og:site_name" content="Kallyas"/>
	<meta property="fb:app_id" content=""/> <!-- PUT HERE YOUR OWN APP ID - you could get errors if you don't use this one -->
	<meta property="og:description" content="Welcome to KALLYAS Template, a wonderful and premium product for multipurpose websites"/>
	<!-- END Facebook OpenGraph Tags -->
	
	<!-- THIS IS THE DARK THEME STYLESEET // REMOVE COMMENTS TO ENABLE -->
	<!-- <link rel="stylesheet" href="css/dark-theme.css" type="text/css" /> -->
	<!-- END DARK THEME -->

</head>

<body>
	<!-- ADD AN APPLICATION ID !!
	If you want to know how to find out your app id, either search on google for: facebook appid, either go to http://rieglerova.net/how-to-get-a-facebook-app-id/ -->
	<div id="fb-root"></div>
	<script>(function(d, s, id) {
	var js, fjs = d.getElementsByTagName(s)[0];
	if (d.getElementById(id)) return;
	js = d.createElement(s); js.id = id;
	js.src = "http://connect.facebook.net/en_US/all.js#xfbml=1&appId="; // addyour appId here
	fjs.parentNode.insertBefore(js, fjs);
	}(document, 'script', 'facebook-jssdk'));</script>

	<div class="support_panel" id="sliding_panel">
		<div class="container">
			<div class="row">
				<div class="span9">
					<h4 class="m_title">HOW TO SHOP</h4>
					<div class="m_content how_to_shop">
						<div class="row">
							<div class="span3">
								<span class="number">1</span> Login or create new account.
							</div>
							<div class="span3">
								<span class="number">2</span> Review your order.
							</div>
							<div class="span3">
								<span class="number">3</span> Payment &amp; <strong>FREE</strong> shipment
							</div>
						</div>
						<p>If you still have problems, please let us know, by sending an email to support@website.com . Thank you!</p>
					</div><!-- end how to shop steps -->
				</div>
				<div class="span3">
					<h4 class="m_title">SHOWROOM HOURS</h4>
					<div class="m_content">
					Mon-Fri 9:00AM - 6:00AM<br>
					Sat - 9:00AM-5:00PM<br>
					Sundays by appointment only!
					</div>
				</div>
			</div>
		</div>
	</div><!-- end support panel -->
    
	<div class="login_register_stuff hide"><!-- Login/Register Modal forms - hidded by default to be opened through modal -->
		<div id="login_panel">
			<div class="inner-container login-panel">
				<h3 class="m_title">SIGN IN YOUR ACCOUNT TO HAVE ACCESS TO DIFFERENT FEATURES</h3>
				<form id="login_form" name="login_form" method="post">
					<a href="#" class="create_account" onClick="ppOpen('#register_panel', '280');">CREATE ACCOUNT</a>
					<input type="text" id="username" name="username" class="inputbox" placeholder="Username">
					<input type="password" id="password" name="password" class="inputbox" placeholder="Password">
					<input type="submit" id="login" name="submit" value="LOG IN">
					<a href="#" class="login_facebook">login with facebook</a>
				</form>
				<div class="links"><a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR USERNAME?</a> / <a href="#" onClick="ppOpen('#forgot_panel', '350');">FORGOT YOUR PASSWORD?</a></div>
			</div>
		</div><!-- end login panel -->

		<div id="register_panel">
			<div class="inner-container register-panel">
				<h3 class="m_title">CREATE ACCOUNT</h3>
				<form id="register_form" name="register_form" method="post">
					<p>
						<input type="text" id="reg-username" name="username" class="inputbox" placeholder="Username">
					</p>
					<p>
						<input type="text" id="fullname" name="fullname" class="inputbox" placeholder="Your full name">
					</p>
					<p>
						<input type="text" id="reg-email" name="email" class="inputbox" placeholder="Your email">
					</p>
                    <p>
						<input type="password" id="reg-password" name="password" class="inputbox" placeholder="Desired password">
					</p>
					<p>
						<input type="password" id="confirm_password" name="confirm_password" class="inputbox" placeholder="Confirm password">
					</p>
					<p>
						<input type="submit" id="signup" name="submit" value="CREATE MY ACCOUNT">
					</p>
				</form>
				<div class="links"><a href="#" onClick="ppOpen('#login_panel', '800');">ALREADY HAVE AN ACCOUNT?</a></div>
			</div>
		</div><!-- end register panel -->

		<div id="forgot_panel">
			<div class="inner-container forgot-panel">
				<h3 class="m_title">FORGOT YOUR DETAILS?</h3>
				<form id="forgot_form" name="forgot_form" method="post">
					<p>
						<input type="text" id="forgot-email" name="email" class="inputbox" placeholder="Email Address">
					</p>
					<p>
						<input type="submit" id="recover" name="submit" value="SEND MY DETAILS!">
					</p>
				</form>
				<div class="links"><a href="#" onClick="ppOpen('#login_panel', '800');">AAH, WAIT, I REMEMBER NOW!</a></div>
			</div>
		</div><!-- end register panel -->
	</div><!-- end login register stuff -->
    
	<div id="page_wrapper">

		<header id="header" class="style2">
			<div class="container">

				<!-- logo -->
				<h1 id="logo"><a href="index.html"><img src="images/logo.png" alt="Kallyas HTML Template"></a></h1>

				<ul class="topnav navRight">
					<li><a href="#" id="open_sliding_panel">
							<span class="icon-remove-circle icon-white"></span> SUPPORT
						</a>
					</li>
					<li><a href="#login_panel" data-rel="prettyPhoto[login_panel]">LOGIN</a></li>
				</ul><!-- end topnav // right aligned -->

				<ul class="topnav navLeft">
					<li class="drop"><a href="#">MY CART</a>
						<div class="pPanel">
							<div class="inner">
								<span class="cart_details">3 items, Total of <strong>$599 USD</strong> <a href="#" class="checkout">Checkout <span class="icon-chevron-right"></span></a></span>
							</div>
						</div>
					</li>
					<li class="languages drop"><a href="#"><span class="icon-globe icon-white"></span> LANGUAGES</a>
						<div class="pPanel">
							<ul class="inner">
								<li class="active"><a href="#">English <span class="icon-ok"></span></a></li>
								<li><a href="#">French</a></li>
								<li><a href="#">German</a></li>
							</ul>
						</div>
					</li>
				</ul><!-- end topnav // left aligned -->

				<!-- search -->
				<div id="search">
					<a href="#" class="searchBtn"><span class="icon-search icon-white"></span></a>
					<div class="search">
						<form action="http://www.google.com/search" method="get" onSubmit="Gsitesearch(this)" target="_blank">
							<input name="q" type="hidden" />
							<input name="qfront" maxlength="20" class="inputbox" type="text" size="20" value="SEARCH ..." onblur="if (this.value=='') this.value='SEARCH ...';" onfocus="if (this.value=='SEARCH ...') this.value='';" />
							<input type="submit" value="go" class="button icon-search"/>
						</form>
					</div>
				</div><!-- end search -->
                
<script type="text/javascript">
// THIS SCRIPT DETECTS THE ACTIVE ELEMENT AND ADDS ACTIVE CLASS
(function($){ 
	$(document).ready(function(){
		var pathname = window.location.pathname,
			page = pathname.split(/[/ ]+/).pop(),
			menuItems = $('#main_menu a');
		menuItems.each(function(){
			var mi = $(this),
				miHrefs = mi.attr("href"),
				miParents = mi.parents('li');
			if(page == miHrefs) {
				miParents.addClass("active").siblings().removeClass('active');
			}
		});
	});
})(jQuery);
</script>
				<nav id="main_menu">
					<ul class="sf-menu clearfix">
						<li class="active"><a href="index.html">HOME</a>
							<ul>
								<li><a href="homepage2.html">Homepage 2</a></li>
								<li><a href="homepage3.html">Homepage 3</a></li>
								<li><a href="homepage4.html">Homepage 4</a></li>
								<li><a href="homepage5.html">Homepage 5</a></li>
								<li><a href="homepage6.html">Homepage 6</a></li>
								<li><a href="homepage-all.html">Homepage All</a></li>
							</ul>
						</li>
						<li><a href="#">SLIDERS</a>
							<ul>
								<li><a href="#">Main Slider</a>
									<ul>
										<li><a href="index.html">Default Style</a></li>
										<li><a href="slider-main-with-thumbs.html">With Thumbs</a></li>
										<li><a href="slider-main-faded.html">Faded</a></li>
										<li><a href="slider-main-fixed.html">Fixed Width Slider</a></li>
										<li><a href="slider-main-fixed-position.html">Fixed Position (Scroll)</a></li>
									</ul>
								</li>
								<li><a href="slider-fixed-flexslider.html">Fixed Slider</a>
									<ul>
										<li><a href="slider-fixed-flexslider.html">Style 1 (Flex Slider)</a>
											<ul>
												<li><a href="slider-fixed-flexslider.html">Default</a></li>
												<li><a href="slider-fixed-flexslider-thumbnails.html">With thumbnails</a></li>
											</ul>
										</li>
										<li><a href="slider-fixed-nivoslider.html">Style 2 (Nivo Slider)</a></li>
										<li><a href="slider-fixed-wowslider-blast.html">Style 3 (Wow Slider)</a>
											<ul>
												<li><a href="slider-fixed-wowslider-blast.html">Blast Effect</a></li>
												<li><a href="slider-fixed-wowslider-blinds.html">Blinds Effect</a></li>
												<li><a href="slider-fixed-wowslider-fly.html">Fly Effect</a></li>
												<li><a href="slider-fixed-wowslider-blur.html">Blur Effect</a></li>
											</ul>
										</li>
									</ul>
								</li>
								<li><a href="slider-3dslider.html">3D Cute Slider</a></li>
								<li><a href="slider-fancy.html">Fancy Slider</a></li>
								<li><a href="slider-creative.html">Creative Slider</a></li>
								<li><a href="slider-circularcontent-default.html">Circular Content</a>
									<ul>
										<li><a href="slider-circularcontent-default.html">Default Style</a></li>
										<li><a href="slider-circularcontent-alternative.html">Alternative Style</a></li>
									</ul>
								</li>
								<li><a href="slider-static-content-default.html">Static Content</a>
									<ul>
										<li><a href="slider-static-content-default.html">Style 1</a></li>
										<li><a href="slider-static-content-boxes.html">Style 2 / Boxes</a></li>
										<li><a href="slider-static-content-video.html">Style 3 / Video</a></li>
										<li><a href="slider-static-content-maps.html">Style 4 / Maps</a></li>
										<li><a href="slider-static-content-textpop.html">Style 5 / Text pop</a></li>
										<li><a href="slider-static-content-zoom.html">Style 6 / Product Loupe</a></li>
										<li><a href="slider-static-content-event-countdown.html">Style 7 / Event countdown</a></li>
										<li><a href="slider-static-content-videobg.html">Style 8 / Video background</a></li><!-- http://www.teehanlax.com/ -->
										<li><a href="slider-static-content-text-login.html">Style 9 / Text &amp; Login</a></li>
										<li><a href="slider-static-content-simple.html">Style 10 / Simple text</a></li>
									</ul>
								</li>
								<li><a href="slider-portfolio-devices.html">Portfolio Slider Devices</a></li>
								<li><a href="slider-portfolio-frames.html">Portfolio Slider Frames</a>
									<ul>
										<li><a href="slider-portfolio-frames.html">Sliding Vertically</a></li>
										<li><a href="slider-portfolio-frames-horizontal.html">Sliding Horizontally</a></li>
									</ul>
								</li>
								<li><a href="slider-laptop.html">Laptop Slider</a></li>
								<li><a href="slider-icarousel.html">iCarousel</a></li>
								<li><a href="slider-css3panels.html">CSS3 Panels</a></li>
							</ul>
						</li>
						<li><a href="about-us.html">ABOUT US</a></li>
						<li><a href="#">FEATURES</a>
							<ul>
								<li><a href="features-blog.html">Blog</a></li>
								<li><a href="#">Portfolio</a>
									<ul>
										<li><a href="features-portfolio-cat-onecol.html">Category Layout</a>
											<ul>
												<li><a href="features-portfolio-cat-onecol.html">One Column</a></li>
												<li><a href="features-portfolio-cat-twocol.html">Two Columns</a></li>
												<li><a href="features-portfolio-cat-threecol.html">Three Columns</a></li>
												<li><a href="features-portfolio-cat-fourcol.html">Four Columns</a></li>
											</ul>
										</li>
										<li><a href="features-portfolio-sortable.html">Sortable Layout</a></li>
										<li><a href="features-portfolio-carousels.html">Carousels Layout</a></li>
									</ul>
								</li>
								<li><a href="features-photo-gallery.php">Photo Gallery</a></li>
								<li><a href="#">Lightbox (Prettyphoto)</a>
									<ul>
										<li><a href="http://themeforest.net/user/hogash/?iframe=true&amp;width=800&amp;height=450" data-rel="prettyPhoto">PrettyPhoto (iFrame)</a></li>
										<li><a href="images/super_cool_ad.jpg" data-rel="prettyPhoto">PrettyPhoto (Image)</a></li>
										<li><a href="http://www.youtube.com/watch?v=G-1HNnxb0WE" data-rel="prettyPhoto">PrettyPhoto (Youtube)</a></li>
										<li><a href="features-lightbox-autopop.html">Auto Pop-up</a></li>
										<li><a href="#transparent_panel" class="prettyPhoto_transparent">Transparent modal</a></li>
									</ul>
								</li>
								<li><a href="features-grid-positions.html">Grid Positions</a></li>
								<li><a href="features-sitemap.html">Sitemap</a></li>
								<li><a href="#">Holiday Slides</a>
									<ul>
										<li><a href="features-holiday-christmas.html">Christmas</a></li>
										<li><a href="features-holiday-easter.html">Easter</a></li>
									</ul>
								</li>
								<li><a href="features-page-preloader.html">Page Preloader</a></li>
								<li><a href="features-animated-header.html">Animated Header</a></li>
							</ul>
						</li>
						<li><a href="shop.html">SHOP</a></li>
						<li><a href="#">PAGES</a>
							<ul>
								<li><a href="pages-faq.html">FAQ</a></li>
								<li><a href="pages-process.html">Process</a></li>
								<li><a href="pages-contact.html">Contact us</a>
									<ul>
										<li><a href="pages-contact.html">Normal page</a></li>
										<li><a href="pages-contact-modal.html?iframe=true&amp;height=430" class="prettyPhoto_transparent">Via modal</a></li>
									</ul>
								</li>
								<li><a href="pages-fullwidth.html">Full width</a></li>
								<li><a href="pages-leftsidebar.html">Left sidebar</a></li>
								<li><a href="pages-rightsidebar.html">Right sidebar</a></li>
								<li><a href="pages-offline.html">Offline / Coming soon</a></li>
								<li><a href="pages-historic.html">Historic / Timeline</a></li>
								<li><a href="pages-testimonials.html">Testimonials</a></li>
								<li><a href="pages-404.html">404 Error</a></li>
								<li><a href="pages-team.html">Team</a></li>
								<li><a href="pages-portfolioitem.html">Portfolio Item</a></li>
								<li><a href="pages-blogitem.html">Blog Item</a></li> 
								<li><a href="pages-productitem.html">Product page</a></li>
								<li><a href="pages-product-list.html">Products List/Category</a></li>
								<li><a href="pages-services.html">Services</a></li>
								<li><a href="pages-careers.html">Careers</a></li>
								<li><a href="pages-passprotected.html">Password Protected</a></li>
							</ul>
						</li>
						<li><a href="#">STYLES</a>
							<ul>
								<li><a href="styles-typography.html">Typography</a></li>
								<li><a href="styles-tables.html">Table designs</a></li>
								<li><a href="styles-buttons.html">Button designs</a></li>
								<li><a href="styles-pricingtables.html">Pricing tables</a></li>
								<li><a href="styles-forms.html">Form styles</a></li>
								<li><a href="styles-tabs.html">Tabs designs</a></li>
								<li><a href="styles-accordion.html">Accordion Toogles</a></li>
							</ul>
						</li>
					</ul>
				</nav><!-- end main_menu -->

			</div>
		</header>
        
        <div id="page_header" class="gradient bottom-shadow">
			<div class="bgback bg3"></div>
			
			<div class="container">
				<div class="row">
					<div class="span6">
						<ul class="breadcrumbs fixclear">
							<li><a href="#">HOME</a></li>
							<li>FEATURES</li>
							<li>PORTFOLIO</li>
							<li>PORTFOLIO TWO COLUMNS</li>
						</ul>
						<span id="current-date"></span>
					</div>
					<div class="span6">
						<div class="header-titles">
							<h2>PORTFOLIO CATEGORY LAYOUT</h2>
							<h4>These are some of our works</h4>
						</div>
					</div>
				</div><!-- end row -->
			</div>
			
			<div class="shadowUP"></div>
        </div><!-- end page_header -->
        
		<section id="content">
			<div class="container">
				
				<div id="mainbody">
					
					<div class="row hg-portfolio">
						<div class="span12">
							<h1 class="page-title">Portfolio - Category layout</h1>
							<p>Sed rhoncus leo sodales metus tincidunt eleifend. Phasellus enim eros, faucibus eget convallis eu, egestas a libero. Proin porttitor congue dolor a accumsan. Vivamus mattis pharetra tellus sed placerat. Duis magna purus, elementum eu sollicitudin vitae, sodales in odio. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus cursus hendrerit convallis.</p>
							
							<div class="row">
								<div class="span6">
									<div class="img-intro">
										<a href="images/img1.jpg" data-rel="prettyPhoto"  data-type="image" class="hoverLink" >
											<img src="php_helpers/timthumb.php?src=images/portfolio_images/ptf1.jpg&amp;w=570" alt="Sollicitudin vitae, sodales in odio"  />
										</a>
									</div><!-- img intro -->
									<h4 class="title">
										<a href="images/img1.jpg" data-rel="prettyPhoto" >Sollicitudin vitae, sodales in odio</a>
									</h4>
									<div class="pt-cat-desc">
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum.</p>
										<p><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. <strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Vestibulum lacinia arcu eget nulla.</p>
									</div><!-- pt cat desc -->
								</div>
								<div class="span6">
									<div class="img-intro">
										<a href="pages-portfolioitem.html" data-type="link" class="hoverLink" >
											<img src="php_helpers/timthumb.php?src=images/portfolio_images/ptf2.jpg&amp;w=570" alt=" Duis magna purus elementum"  />
										</a>
									</div><!-- img intro -->
									<h4 class="title">
										<a href="pages-portfolioitem.html" data-rel="prettyPhoto" >Duis magna purus elementum</a>
									</h4>
									<div class="pt-cat-desc">
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum.</p>
										<p><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. <strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Vestibulum lacinia arcu eget nulla.</p>
									</div><!-- pt cat desc -->
								</div>
								<div class="span12">
									<hr class="bs-docs-separator">
								</div>
							</div><!-- END ROW -->
							
							<div class="row">
								<div class="span6">
									<div class="img-intro">
										<a href="http://www.youtube.com/watch?v=g8evyE9TuYk" data-rel="prettyPhoto" data-type="video" class="hoverLink" >
											<img src="php_helpers/timthumb.php?src=images/portfolio_images/ptf3.jpg&amp;w=570" alt="Vivamus mattis pharetra tellus"  />
										</a>
									</div><!-- img intro -->
									<h4 class="title">
										<a href="http://www.youtube.com/watch?v=g8evyE9TuYk" data-rel="prettyPhoto" >Vivamus mattis pharetra tellus</a>
									</h4>
									<div class="pt-cat-desc">
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum.</p>
										<p><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. <strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Vestibulum lacinia arcu eget nulla.</p>
									</div><!-- pt cat desc -->
								</div>
								<div class="span6">
									<div class="img-intro">
										<a href="http://www.google.com" target="_blank" data-type="extlink" class="hoverLink" >
											<img src="php_helpers/timthumb.php?src=images/portfolio_images/ptf4.jpg&amp;w=570" alt="Dolor sit amet consectetur adipiscing"  />
										</a>
									</div><!-- img intro -->
									<h4 class="title">
										<a href="http://www.google.com" target="_blank" >Dolor sit amet consectetur adipiscing</a>
									</h4>
									<div class="pt-cat-desc">
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum.</p>
										<p><strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. <strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit</strong>. Vestibulum lacinia arcu eget nulla.</p>
									</div><!-- pt cat desc -->
								</div>
								<div class="span12">
									<hr class="bs-docs-separator">
								</div>
							</div><!-- END ROW -->
							
							
						</div>
					</div><!-- end row -->
					
				</div><!-- end mainbody -->
				
			</div><!-- end container -->
		</section><!-- end #content -->
        
<footer id="footer">
	<div class="container">
		<div class="row">
			<div class="span5">
				<h3 class="m_title">FOOTER MENU</h3>
				<ul class="menu">
					<li><a href="#">Curabitur iaculis</a></li>
					<li><a href="#">Parturient montes</a></li>
					<li><a href="#">Vulputate magna</a></li>
					<li><a href="#">Cum sociis natoque</a></li>
					<li><a href="#">Nulla varius commodo</a></li>
					<li><a href="#">Parturient montes</a></li>
					<li><a href="#">Vulputate magna</a></li>
					<li><a href="#">Cum sociis natoque</a></li>
					<li><a href="#">Nulla varius commodo</a></li>
				</ul><!-- end footer menu -->
			</div>
			<div class="span4">
				<div class="newsletter-signup">
					<h3 class="m_title">NEWSLETTER SIGNUP</h3>
					<p>By subscribing to our mailing list you will always be update with the latest news from us.</p>
					<form method="post" id="newsletter_subscribe" name="newsletter_form">
						<input type="text" name="nl-email" id="nl-email" value="" placeholder="your.address@email.com" />
						<input type="submit" name="submit" id="nl-submit" value="JOIN US" />
					</form>
					<span id="result">* it really works! Mailchimp Integration.</span>
					<p><small>We never spam!</small></p>
				</div><!-- end newsletter-signup -->
			</div>
			<div class="span3">
				<div class="contact-details">
					<h3 class="m_title">GET IN TOUCH</h3>
					<p><strong>T (212) 555 55 00</strong><br />
					Email: <a href="#">sales@yourwebsite.com</a></p>
					<p>Your Company LTD<br />
					Street nr 100, 4536534, Chicago, US</p>
					<p><a href="http://goo.gl/maps/1OhOu" target="_blank" class="map-link"><span class="icon-map-marker icon-white"></span> Open in Google Maps</a></p>
				</div><!-- end contact-details -->
			</div>
		</div><!-- end row -->
		
		<div class="row">
			<div class="span6">
				<div class="twitter-feed">
				
					<!-- twitter feeds -->
					<div class="tweets" id="twitterFeed"><small>Please wait whilst our latest tweets load</small></div>
					<a href="https://twitter.com/hogash" class="twitter-follow-button" data-show-count="false">Follow @hogash</a><!-- follow button -->
					

				</div><!-- end twitter-feed -->
			</div>
			<div class="span6">
				<ul class="social-share fixclear">
					<li class="sc-facebook">
						
						<div class="fb-like" data-href="http://facebook.com/hogash.themeforest" data-send="false" data-layout="button_count" data-width="120" data-show-faces="false" data-font="lucida grande"></div>
					</li><!-- facebook like -->
					<li class="sc-twitter">
						<a href="https://twitter.com/share" class="twitter-share-button" data-text="Check out this awesome template KALLYAS" data-via="hogash" data-hashtags="template">Tweet</a>
					</li><!-- tweet button -->
					<li class="sc-gplus">
						<script type="text/javascript">
						(function() {
						var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
						po.src = 'https://apis.google.com/js/plusone.js';
						var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
						})();
						</script>
						<div class="g-plusone" data-size="medium"></div>
					</li><!-- Gogle Plus Button -->
					<li class="sc-pinterest">
						<a href="http://pinterest.com/pin/create/button/?url=http%3A%2F%2Fhogash.com%2Fdemo%2Fkalypso_html%2F&amp;media=http%3A%2F%2Fhogash.com%2Fdemo%2Fkalypso_html%2Fimages%2Fsite_images%2Fscr-carousel%2Fimg2.jpg&amp;description=Kallyas%20Template" class="pin-it-button" count-layout="horizontal"><img src="http://assets.pinterest.com/images/PinExt.png" title="Pin It" alt="Pin It" /></a>
						<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>
						<!-- generate yours at: http://pinterest.com/about/goodies/ -->
					</li><!-- Pin IT Button -->
				</ul>
				<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="http://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script><!-- twitter script -->
			</div>
		</div><!-- end row -->
		
		<div class="row">
			<div class="span12">
				<div class="bottom fixclear">
					<ul class="social-icons fixclear">
						<li class="title">GET SOCIAL</li>
						<li class="social-twitter"><a href="#">Twitter</a></li>
						<li class="social-dribbble"><a href="#">Dribbble</a></li>
						<li class="social-facebook"><a href="#">Facebook</a></li>
						<li class="social-envato"><a href="#">Envato</a></li>
					</ul><!-- end social-icons -->
					<div class="copyright">
						<a href="index.html"><img src="images/logo2.png" alt="" /></a>
						<p>&copy; 2012 <strong>KALLYAS Template</strong>. All Rights Reserved. Click <a href="#">here</a> to buy it.<br />
						Designed by <a href="http://www.hogash.com/" target="_blank">HOGASH</a></p>
					</div><!-- end copyright -->
				</div><!-- end bottom -->
			</div>
		</div><!-- end row -->
		
	</div>
</footer>
        
    </div><!-- end page_wrapper -->
	
    <a href="#" id="totop">TOP</a>

<!--////////////////// Load JS Files -->




<!-- JavaScript at the bottom for fast page loading -->

<script type="text/javascript" src="js/bootstrap.min.js"></script><!-- Bootstrap Framework -->
<script type="text/javascript" src="js/plugins.js"></script><!-- jQuery Plugins -->
<script type="text/javascript" src="addons/superfish_responsive/superfish_menu.js"></script><!-- Superfish Menu -->


<script type="text/javascript" src="js/kalypso_script.js"></script><!-- custom scripts file -->

<!-- prettyphoto scripts & styles -->
<link rel="stylesheet" href="addons/prettyphoto/prettyPhoto.css" type="text/css" />
<script type="text/javascript" src="addons/prettyphoto/jquery.prettyPhoto.js"></script>
<script type="text/javascript">

	function ppOpen(panel, width){
		jQuery.prettyPhoto.close();
		setTimeout(function() {
			jQuery.fn.prettyPhoto({social_tools: false, deeplinking: false, show_title: false, default_width: width, theme:'pp_kalypso'});
			jQuery.prettyPhoto.open(panel);
		}, 300);
	} // function to open different panel within the panel
	
	jQuery(document).ready(function($) {
		jQuery("a[data-rel^='prettyPhoto'], .prettyphoto_link").prettyPhoto({theme:'pp_kalypso',social_tools:false, deeplinking:false});
		jQuery("a[rel^='prettyPhoto']").prettyPhoto({theme:'pp_kalypso'});
		jQuery("a[data-rel^='prettyPhoto[login_panel]']").prettyPhoto({theme:'pp_kalypso', default_width:800, social_tools:false, deeplinking:false});
		
		jQuery(".prettyPhoto_transparent").click(function(e){
			e.preventDefault();
			jQuery.fn.prettyPhoto({social_tools: false, deeplinking: false, show_title: false, default_width: 980, theme:'pp_kalypso transparent', opacity: 0.95});
			jQuery.prettyPhoto.open($(this).attr('href'),'','');
		});
		
	});

</script>
<!--end prettyphoto -->

<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
	<script>
		var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];
		(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;
		g.src=("https:"==location.protocol?"//ssl":"//www")+".google-analytics.com/ga.js";
		s.parentNode.insertBefore(g,s)}(document,"script"));
	</script>
	
<div class="hide">
	<div id="transparent_panel" class="transparent_content">
		<p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.</p>
		<p>I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.</p>
		<p>When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage of my trees, and but a few stray gleams steal into the inner sanctuary, I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me: when I hear the buzz of the little world among the stalks, and grow familiar with the countless indescribable forms of the insects and flies, then I feel the presence of the Almighty, who formed us in his own image.</p>
		<p>Duis dictum tristique lacus, id placerat dolor lobortis sed. In nulla lorem, accumsan sed mollis eu, dapibus non sapien. Curabitur eu adipiscing ipsum. Mauris ut dui turpis, vel iaculis est. Morbi molestie fermentum sem quis ultricies. Mauris ac lacinia sapien. Fusce ut enim libero, vitae venenatis arcu. Cras viverra, libero a fringilla gravida, dolor enim cursus turpis, id sodales sem justo sit amet lectus. Fusce ut arcu eu metus lacinia commodo. Proin cursus ornare turpis, et faucibus ipsum egestas ut. Maecenas aliquam suscipit ante non consectetur. Etiam quis metus a dolor vehicula scelerisque.</p>
		<p>Nam elementum consequat bibendum. Suspendisse id semper odio. Sed nec leo vel ligula cursus aliquet a nec nulla. Sed eu nulla quam. Etiam quis est ut sapien volutpat vulputate. Cras in purus quis sapien aliquam viverra et volutpat ligula. Vestibulum condimentum ultricies pharetra. Etiam dapibus cursus ligula quis iaculis. Mauris pellentesque dui quis mi fermentum elementum sodales libero consequat. Duis eu elit et dui varius bibendum. Sed interdum nisl in ante sollicitudin id facilisis tortor ullamcorper. Etiam scelerisque leo vel elit venenatis nec condimentum ipsum molestie. In hac habitasse platea dictumst. Sed quis nulla et nibh aliquam cursus vitae quis enim. Maecenas eget risus turpis.</p>
	</div>
</div><!-- end transparent panel -->


</body>
</html>