blog-default.html

<!DOCTYPE html>
<html lang="en" >
<head>
	<meta charset="utf-8">	
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

	<!-- Meta -->
	<meta name="description" content="SmartOn is a complete responsive, retina-ready and multipurpose theme." />
	<meta name="keywords" content="boostrap, responsive, html5, css3, jquery, theme, multicolor, parallax, retina, business" />
	<meta name="author" content="FourGrafx">
	<meta name="robots" content="index, follow" />
	<meta name="revisit-after" content="3 days" />
	<title>Avendor - Premium Multipurpose HTML5/CSS3 Theme - FourGrafx</title>

    <!-- Styles -->
           
		<!-- Bootstrap core CSS -->
  		<link rel="stylesheet" href="css/bootstrap.css">        

		<!-- Bootstrap RTL 
  		<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-rtl/3.2.0-rc2/css/bootstrap-rtl.css"> -->

		<!-- Font Awesome 4.1.0 -->
		<link href="http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

		<!-- Avendor Icons Font -->
		<link href="css/avendor-font-styles.css" rel="stylesheet">

		<!-- SLIDER REVOLUTION 4.x CSS SETTINGS -->
		<link rel="stylesheet" type="text/css" href="css/revolutionslider/settings.css" media="screen" />
    	
    	<!-- Animate CSS -->       
    	<link href="css/themecss/animate.css" rel="stylesheet">

    	<!-- Lightbox CSS -->       
    	<link href="css/themecss/lightbox.css" rel="stylesheet">
              
    	<!-- OWL Carousel -->       
    	<link href="css/owl-carousel/owl.carousel.css" rel="stylesheet">
        <link href="css/owl-carousel/owl.transitions.css" rel="stylesheet">

		<!-- Theme CSS -->
  		<link href="css/avendor-dark.css" rel="stylesheet">
        
		<!-- Color CSS -->
		<link href="css/colors/color-default.css" rel="stylesheet" title="style1">
   
	    <!-- Google Fonts -->
	    <link href='http://fonts.googleapis.com/css?family=Raleway:400,200,300,100,500,600,700,800,900' rel='stylesheet' type='text/css'>
        <link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>

	    <!-- Fav and touch icons -->
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
	    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
    	<link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
    	<link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
    	<link rel="shortcut icon" href="ico/favicon.png">
    
</head>

<body class="bg-pattern1" data-spy="scroll" data-target=".navbar">
<div id="preloader"></div>
    
	<!-- Page Main Wrapper -->
	<div class="page-wrapper" id="page-top">

		<!-- Header Container -->
		<div class="header-wrapper">

			<!-- Header Top Container -->
   			<div class="header-top">

                <!-- Container -->
                <div class="container">
                    
                    	<div class="row">
                        	
                            <!-- Left -->
                        	<div class="col-md-6 col-sm-6 columns">
                            	<div class="header-top-left">
                            	<ul class="social-top">
                                	<li><a href="" class="ToolTip" title="Facebook"><span class="fa fa-facebook"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Twitter"><span class="fa fa-twitter"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Google+"><span class="fa fa-google-plus"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Linkedin"><span class="fa fa-linkedin"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Pinterest"><span class="fa fa-pinterest"></span></a></li>
                                </ul>
                                </div>
                            </div>
                            <!-- /Left -->
                            
                            <!-- Right -->
                            <div class="col-md-6 col-sm-6 columns">
                            	<div class="header-top-right">
								<!-- Right Menu -->
									<ul class="top-menu">
										<li><a href="#"><i class="fa fa-shopping-cart"></i>0 item(s) - $0.00</a></li>
										<li>
											<div class="dropdown">
												<a href="#" data-toggle="dropdown" class="dropdown-toggle"><i class="fa fa-globe"></i>English <b class="caret"></b></a>
												<ul class="dropdown-menu dropdown-menu-right">
													<li class="active"><a href="#">English</a></li>
													<li><a href="#">French</a></li>
													<li><a href="#">German</a></li>
												</ul>
											</div>
										</li>
									</ul>
								<!-- /Right Menu -->
                                </div>
                            </div>
                            <!-- /right -->
                        
                        </div>
                
                </div>
				<!-- /Container -->
   
		    </div>   
			<!-- /Header Top Container -->

			<!-- Header Main Container -->
   			<div class="header-main">

                <!-- Container -->
                <div class="container">
                    
                	<!-- Main Navigation & Logo -->                    
					<div class="main-navigation">
                    
                    	<div class="row">
                            
                            <!-- Main Navigation -->
                            <div class="col-md-12 columns">

								<nav class="navbar navbar-default gfx-mega nav-left" role="navigation">
									
                                    	
										<!-- Brand and toggle get grouped for better mobile display -->
										<div class="navbar-header">
											<a class="navbar-toggle" data-toggle="collapse" data-target="#gfx-collapse"></a>
                            				<div class="logo">
                           	    				<a href="index.html"><img src="img/theme/logo.png" alt="Logo"></a>
                                			</div>
										</div>

										<!-- Collect the nav links, forms, and other content for toggling -->
										<div class="collapse navbar-collapse" id="gfx-collapse">
											<ul class="nav navbar-nav gfx-nav">
												<li class="dropdown">
													<a href="#" class="dropdown-toggle" data-toggle="dropdown">Home <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li><a href="index.html">Home Default</a></li>
														<li><a href="shop-front.html">Home Shop</a></li>
                                                        <li><a href="index-style1.html">Home Style 1</a></li>
														<li><a href="index-style2.html">Home Style 2</a></li>
                                                        <li><a href="index-style3.html">Home Style 3</a></li>
													</ul>
												</li>
												<li class="dropdown gfx-mega-fw"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Pages <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li>
															<div class="gfx-mega-content">
																<div class="row">
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
                                                                            <li><a href="about-us.html">About Us Default</a></li>
																			<li><a href="about-us-alt.html">About Us Alt</a></li>
																			<li><a href="about-us-alt2.html">About Us Alt 2</a></li>
                                                                            <li><a href="services.html">Services Default</a></li>
                                                                            <li><a href="services-alt.html">Services Alt</a></li>
																			<li><a href="services-alt2.html">Services Alt 2</a></li>
																		</ul>
                                                                    </div>                                                          	
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
																			<li><a href="our-team.html">Our Team</a></li>
																			<li><a href="our-team-alt.html">Our Team Alt</a></li>
																			<li><a href="process.html">Our Process</a></li>
																			<li><a href="process-alt.html">Our Process Alt</a></li>
                                                                            <li><a href="contact-alt.html">Contact Alt</a></li>
																			<li><a href="contact-alt2.html">Contact Alt 2</a></li>
																		</ul>
                                                                    </div>
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
																			<li><a href="landing.html">Landing Page</a></li>
																			<li><a href="parallax-presentation.html">Parallax Presentation</a></li>
																			<li><a href="404.html">Page 404</a></li>
																			<li><a href="testimonials.html">Testimonials</a></li>
                                                                            <li><a href="pricing.html">Pricing</a></li>
                                                                        	<li><a href="custom-footer.html#custom-footer">Custom Footer</a></li>
																		</ul>
                                                                    </div>
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
                                                                            <li><a href="under.html">Under Construction</a></li>
                                                                            <li><a href="faq.html">F.A.Q.</a></li>
                                                                            <li><a href="search.html">Search Results</a></li>
                                                                            <li><a href="full-width.html">Full Width</a></li>
                                                                            <li><a href="sidebar-left.html">Sidebar Left</a></li>
                                                                            <li><a href="sidebar-right.html">Sidebar Right</a></li>
																		</ul>
                                                                    </div>
																</div>
															</div>
														</li>
													</ul>
												</li>
												<li class="dropdown gfx-mega-fw"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Features <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li>
															<div class="gfx-mega-content">
																<div class="row">
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
                                                                        	<li class="title-header">Infographics &amp; Icons</li>
                                                                            <li><a href="font-avendor-icons.html">Avendor Custom Icons</a></li>
																			<li><a href="font-awesome.html">Font Awesome Icons</a></li>
																			<li><a href="animated-icons.html">Animated Icons / LivIcons</a></li>
                                                                            <li><a href="icon-boxes.html">Icon Boxes</a></li>
                                                                            <li><a href="icon-lists.html">Icon Lists</a></li>
																			<li><a href="counters.html">Counters</a></li>
																			<li><a href="progress-bars.html">Progress Bars</a></li>
																			<li><a href="pie-charts.html">Pie Charts</a></li>
																		</ul>
                                                                    </div>                                                          	
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
                                                                        	<li class="title-header">Interactive Elements</li>
																			<li><a href="members.html">Team Member Blocks</a></li>
																			<li><a href="parallax.html">Parallax</a></li>
                                                                            <li><a href="carousel-sliders.html">Carousel &amp; Sliders</a></li>
                                                                            <li><a href="lightbox.html">Lightbox &amp; Images</a></li>
																			<li><a href="image-effects.html">Hover Image Effects</a></li>
																			<li><a href="tooltips.html">Tooltips</a></li>
																			<li><a href="creative-links.html">Creative Links</a></li>
																			<li><a href="animation.html">Animation On View</a></li>
																		</ul>
                                                                    </div>
																	<div class="col-lg-3 col-sm-3">
                                                                    	<ul class="mega-menu-list">
                                                                        	<li class="title-header">Default Elements</li>
                                                                            <li><a href="typography.html">Typography</a></li>
                                                                            <li><a href="buttons.html">Buttons</a></li>
                                                                            <li><a href="lists.html">Lists</a></li>
																			<li><a href="alerts.html">Alerts</a></li>
																			<li><a href="tabs.html">Tabs</a></li>
																			<li><a href="pricing-tables.html">Pricing Tables</a></li>
																			<li><a href="accordions.html">Accordions &amp; Toggles</a></li>
                                                                            <li><a href="dividers.html">Dividers</a></li>
																		</ul>
                                                                    </div>                                                                     
																	<div class="col-lg-3 col-sm-3">
                                                                    	<h4>AVENDOR Features</h4>
                                                                        <img src="img/demo/content/features.jpg" class="img-responsive" alt="AVENDOR Features">
                                                                    	<p>You can view all the shortcodes and features just by clicking the button bellow!</p>
                                                                        <a href="font-avendor-icons.html" class="btn btn-default btn-xs btn-alt">View All Features</a>
                                                                    </div> 
																</div>
															</div>
														</li>
													</ul>
												</li>
												<li class="dropdown">
													<a href="#" class="dropdown-toggle" data-toggle="dropdown">Shop <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li><a href="shop-front.html">Front Shop Page</a></li>
                                                        <li><a href="shop-page.html">Shop Page - Sidebar</a></li>
														<li><a href="shop-page-full.html">Shop Page - Full Width</a></li>
                                                        <li><a href="shop-product.html">Single Product Page</a></li>
													</ul>
												</li>
												<li class="dropdown">
													<a href="#" class="dropdown-toggle" data-toggle="dropdown">Projects <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li><a href="projects-grid-full.html">Grid Ful Width</a></li>
                                                        <li><a href="projects-grid-boxed.html">Grid Boxed</a></li>
														<li><a href="projects-grid-expand.html">Grid Expand</a></li>
                                                        <li><a href="projects-grid-mix.html">Grid Mixed</a></li>
                                                        <li><a href="projects-classic-2.html">Classic 2 Columns</a></li>
														<li><a href="projects-classic-3.html">Classic 3 Columns</a></li>
														<li><a href="projects-classic-4.html">Classic 4 Columns</a></li>
                                                        <li><a href="projects-classic-expand.html">Classic Expand</a></li>
                                                        <li><a href="projects-item-style.html">Classic Item Alt Style</a></li>
														<li><a href="projects-single.html">Single Project Page</a></li>
													</ul>
												</li>
												<li class="dropdown active">
													<a href="blog-default.html" class="dropdown-toggle" data-toggle="dropdown">Blog <b class="caret"></b></a>
													<ul class="dropdown-menu">
														<li class="active"><a href="blog-default.html">Blog Classic</a></li>
                                                        <li><a href="blog-full.html">Blog Full Width</a></li>
														<li><a href="blog-masonry.html">Blog Masonry</a></li>
                                                        <li><a href="blog-single-post.html">Blog Single Post</a></li>
                                                        <li><a href="blog-single-post-full.html">Blog Single Full Width</a></li>
													</ul>
												</li>
                                                <li><a href="contact.html">Contact</a></li>
											</ul>
										</div><!-- /.navbar-collapse -->
									
								</nav>

                            </div>
                            <!-- /Main Navigation -->
                        
                        </div>              
                    
					</div>
                    <!-- /Main Navigation & Logo -->
                
                </div>
				<!-- /Container -->
   
		    </div>   
			<!-- /Header Main Container -->

		</div>
		<!-- /Header Container -->
        
		<!-- Main Wrapper Header -->
        <div class="main-wrapper-header fancy-header dark-header parallax parallax-blog" data-stellar-background-ratio="0.4">
			
            <div class="bg-overlay bg-overlay-dark"></div>

 			<div class="container">
            
				<div class="row">
                	<div class="col-sm-12 columns">
                		<div class="page-title">
                    		<h2>Our Blog</h2>                    
                    	</div>
                    	<div class="breadcrumbs-wrapper">               
							<ol class="breadcrumb">
  								<li><a href="#">Home</a></li>
								<li class="active">Our Blog</li>
							</ol>
                		</div>
					</div>
				</div>
                
			</div>
 
        </div>       
		<!-- /Main Wrapper Header -->        

		<!-- Main Container -->
		<div class="main-wrapper">

        	<!-- Container -->
            <div class="container content-with-sidebar">
            
            	<div class="row">

					<div class="col-sm-8 col-md-9 columns">                    
                    	<div class="white-space space-big"></div>
                        
                    	<!-- /Blog Content -->
                        <div class="row">                        
                            <div class="col-sm-12">

								<!-- blog post -->
								<div class="blog-post post-format-gallery">
                                
									<div class="blog-post-side">
                                    	<div class="blog-post-date">
                                        	<p class="date-day">25</p>
                                            <p class="date-month">Jul</p>
                                        </div>
                                        
                                    	<div class="post-format"></div>                                        
                                    </div>  
                                    
                                    <div class="blog-post-content">
										<div class="post-media">
                                            <!-- Post Slider -->
											<div class="carousel-box animation flipInY">
												<div class="carousel" data-carousel-autoplay="6000" data-carousel-nav="true" data-carousel-pagination="false" data-carousel-single="true" data-carousel-transition="goDown">
													<div class="carousel-item "><img src="img/demo/blog/blog-slider1.jpg" width="1225" height="550" alt="Blog One"></div>
                                                    <div class="carousel-item "><img src="img/demo/blog/blog-slider2.jpg" width="1225" height="550" alt="Blog One"></div>			
												</div>
											</div>
											<!-- /Post Slider -->  
                                        </div>
										<div class="post-info">
											<h3 class="post-title"><a href="blog-single-post.html">Simple Slideshow media post</a></h3>
                    						<ul class="list-inline post-meta-info">
												<li class="meta-author"><a href="">By: webmaster</a></li>
												<li class="meta-comments"><a href="">16</a></li>
                        						<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
											</ul>
										</div>  
										<div class="post-content">
											<p>Sed volutpat nisl id massa tempor, eu fermentum mi interdum. Donec sit amet gravida nulla. Proin ac neque sem. In gravida egestas odio. In purus eros, venenatis sit amet nibh quis, scelerisque molestie nunc. <strong>Vestibulum vehicula</strong> libero elementum sapien mollis, eget adipiscing ipsum pharetra. Quisque lacinia magna quis lobortis viverra.</p>
										</div>
                                        <a class="btn btn-primary btn-sm" href="blog-single-post.html">Read More<i class="fa iconright fa-arrow-circle-right"></i></a>
                                    </div> 
                                                        
                				</div>
								<!-- /blog post -->

								<!-- blog post -->
								<div class="blog-post post-format-image">
                                
									<div class="blog-post-side">
                                    	<div class="blog-post-date">
                                        	<p class="date-day">18</p>
                                            <p class="date-month">Jul</p>
                                        </div>
                                        
                                    	<div class="post-format"></div>                                        
                                    </div>  
                                    
                                    <div class="blog-post-content">
										<div class="post-media">
									    	<img src="img/demo/blog/blog3.jpg" width="1225" height="550" alt="Blog One">
                                        </div>
										<div class="post-info">
											<h3 class="post-title"><a href="blog-single-post.html">Image post format</a></h3>
                    						<ul class="list-inline post-meta-info">
												<li class="meta-author"><a href="">By: webmaster</a></li>
												<li class="meta-comments"><a href="">12</a></li>
                        						<li class="meta-tags"><a href="">news</a>, <a href="">photography</a></li>
											</ul>
										</div>  
										<div class="post-content">
											<p>Nulla sapien lorem, <strong>lobortis non dui vitae</strong>, gravida imperdiet velit. Vivamus nec bibendum odio. Smart at adipiscing leo, eget sodales purus. Nullam ante tellus, tempus vitae est ut, smart rhoncus ligula. Donec molestie arcu in nisl luctus volutpat. Nullam porttitor metus sapien, sit amet suscipit massa laoreet eu.</p>
										</div>
                                        <a class="btn btn-primary btn-sm" href="blog-single-post.html">Read More<i class="fa iconright fa-arrow-circle-right"></i></a>
                                    </div>
                                                        
                				</div>
								<!-- /blog post -->

								<!-- blog post -->
								<div class="blog-post post-format-video">
                                
									<div class="blog-post-side">
                                    	<div class="blog-post-date">
                                        	<p class="date-day">11</p>
                                            <p class="date-month">Jul</p>
                                        </div>
                                        
                                    	<div class="post-format"></div>                                        
                                    </div>  
                                    
                                    <div class="blog-post-content">
										<div class="post-media">
									    	<div class="flex-video vimeo">
            									<iframe src="http://player.vimeo.com/video/23237102?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff" width="1280" height="720" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
            								</div>
                                        </div>
										<div class="post-info">
											<h3 class="post-title"><a href="blog-single-post.html">Video post format</a></h3>
                    						<ul class="list-inline post-meta-info">
												<li class="meta-author"><a href="">By: webmaster</a></li>
												<li class="meta-comments"><a href="">15</a></li>
                        						<li class="meta-tags"><a href="">video</a>, <a href="">exterior design</a></li>
											</ul>
										</div>  
										<div class="post-content">
											<p>Vivamus tortor purus, volutpat eu imperdiet et, aliquet vel lectus. <strong>Quisque ut convalli</strong>s massa. Donec tempus urna id felis gravida rutrum ut non ipsum. Duis luctus eget ante a fringilla. Aliquam egestas arcu <a href="#">luctus felis</a> luctus feugiat. Maecenas aliquam pharetra lectus, non adipiscing mauris. Cras eleifend hendrerit ipsum, et laoreet sem scelerisque sit amet.</p>
										</div>
                                        <a class="btn btn-primary btn-sm" href="blog-single-post.html">Read More<i class="fa iconright fa-arrow-circle-right"></i></a>
                                    </div>
                                                        
                				</div>
								<!-- /blog post -->

								<!-- blog post -->
								<div class="blog-post post-format-music">
                                
									<div class="blog-post-side">
                                    	<div class="blog-post-date">
                                        	<p class="date-day">3</p>
                                            <p class="date-month">Jul</p>
                                        </div>
                                        
                                    	<div class="post-format"></div>                                        
                                    </div>  
                                    
                                    <div class="blog-post-content">
										<div class="post-media">
											<iframe width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/139648457&amp;color=f7505a&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false"></iframe>
                                        </div>
										<div class="post-info">
											<h3 class="post-title"><a href="blog-single-post.html">Soundcloud Post</a></h3>
                    						<ul class="list-inline post-meta-info">
												<li class="meta-author"><a href="">By: webmaster</a></li>
												<li class="meta-comments"><a href="">34</a></li>
                        						<li class="meta-tags"><a href="">music</a>, <a href="">soundtrack</a></li>
											</ul>
										</div>  
										<div class="post-content">
											<p>Aliquam non arcu convallis, tristique magna sit amet, facilisis turpis. In tincidunt quis tellus vitae lacinia. Phasellus ut elit egestas, facilisis nibh quis, porttitor lacus. Sed eleifend eros sed magna varius, ac rutrum turpis ultrices. Vivamus ligula dictum diam, ac sodales ante enim sit amet diam. </p>
										</div>
                                        <a class="btn btn-primary btn-sm" href="blog-single-post.html">Read More<i class="fa iconright fa-arrow-circle-right"></i></a>
                                    </div>
                    
                				</div>
								<!-- /blog post -->

								<!-- blog post -->
								<div class="blog-post post-format-standard">
                                
									<div class="blog-post-side">
                                    	<div class="blog-post-date">
                                        	<p class="date-day">23</p>
                                            <p class="date-month">Jun</p>
                                        </div>
                                        
                                    	<div class="post-format"></div>                                        
                                    </div>  
                                    
                                    <div class="blog-post-content">
										<div class="post-info">
											<h3 class="post-title"><a href="blog-single-post.html">This is a standard simple post</a></h3>
                    						<ul class="list-inline post-meta-info">
												<li class="meta-author"><a href="">By: webmaster</a></li>
												<li class="meta-comments"><a href="">16</a></li>
                        						<li class="meta-tags"><a href="">news</a>
											</ul>
										</div>  
										<div class="post-content">
											<p>Aliquam non arcu convallis, tristique magna sit amet, facilisis turpis. In tincidunt quis tellus vitae lacinia. Phasellus ut elit egestas, facilisis nibh quis, porttitor lacus. Sed eleifend eros sed magna varius, ac rutrum turpis ultrices. Vivamus ligula dictum diam, ac sodales ante enim sit amet diam. </p>
										</div>
                                        <a class="btn btn-primary btn-sm" href="blog-single-post.html">Read More<i class="fa iconright fa-arrow-circle-right"></i></a>
                                    </div>
                    
                				</div>
								<!-- /blog post -->                                
                           
                            </div>
                        </div>
                    	<!-- /Blog Content -->
                        
                    	<!-- Pagination -->
                        <div class="row">                        
                            <div class="col-sm-12">
                            	<div class="text-center">
			                		<ul class="pagination">
										<li><a href="#"><i class="fa fa-angle-left"></i></a></li>
										<li class="active"><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#"><i class="fa fa-angle-right"></i></a></li>
									</ul>
                                </div>
                            </div>                                                  
                        </div>
                    	<!-- /Pagination -->
						
                        <div class="white-space space-big"></div>
                    </div>

                    
                    <!-- Sidebar -->
                    <div class="col-sm-4 col-md-3 columns sidebar sidebar-right">
                    	<div class="white-space space-big"></div>
                        
                        	<div class="sidebar-content">
                            								
								<div class="sidebar-widget">
									<!-- Search Form -->
									<form class="form-inline" role="form">
										<div class="form-group">
											<div class="input-group">
												<span class="input-group-btn">
													<button class="btn btn-primary" type="button"><span class="fa fa-search"></span></button>
												</span>
												<input class="form-control" type="search" placeholder="Search">
											</div>
										</div>
									</form>
									<!-- Search Form -->                                
								</div>

								<div class="sidebar-widget">
                                	<h4 class="title-widget fancy-title"><span>Categories</span></h4>
                                	<ul class="fa-ul widget-list">
                                    	<li><a href=""><span class="fa-li fa  fa-angle-right"></span>Web Design</a></li>
                                        <li><a href=""><span class="fa-li fa  fa-angle-right"></span>Web Development</a></li>		
                                        <li><a href=""><span class="fa-li fa  fa-angle-right"></span>Photography</a></li>
                                    	<li><a href=""><span class="fa-li fa  fa-angle-right"></span>UI Design </a></li>
                                    	<li><a href=""><span class="fa-li fa  fa-angle-right"></span>Resources</a></li>
                                        <li><a href=""><span class="fa-li fa  fa-angle-right"></span>Latest News</a></li>	
                                    </ul>
                                </div>

								<div class="sidebar-widget">
                                	<h4 class="title-widget fancy-title"><span>Popular Videos</span></h4>
									<div class="flex-video vimeo">
            							<iframe src="http://player.vimeo.com/video/78472610?title=0&amp;byline=0&amp;portrait=0&amp;color=c9ff23" width="1280" height="720" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
            						</div>
                                </div>

								<div class="sidebar-widget">
                                	<h4 class="title-widget fancy-title"><span><i class="fa fa-twitter"></i> Latest Twettes</span></h4>
                                	<div class="twitter"></div>
                                </div>
 
								<div class="sidebar-widget">
                                	<h4 class="title-widget fancy-title"><span>Tabbed Widget</span></h4>
									<div class="tabbed-widget">
      									<!-- tabs justified -->
										<div class="tabs">
											<ul class="nav nav-tabs nav-justified">
												<li class="active"><a href="#tab-content-1" data-toggle="tab">Popular</a></li>
												<li><a href="#tab-content-2" data-toggle="tab">Recent</a></li>
												<li><a href="#tab-content-3" data-toggle="tab">Comments</a></li>
											</ul>
											<div class="tab-content">
												<div id="tab-content-1" class="tab-pane fade active in">
                                					<div class="posts-list">
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb1.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Aliquam ut dui posuere metus</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">July 25, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb2.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Nulla vitae libero, a pharetra.</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">May 16, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb3.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Pellentesque dapibus</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">February 8, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>                                        
													</div>
                                				</div>
												<div id="tab-content-2" class="tab-pane fade">
                                					<div class="posts-list">
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb4.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Sed id posuere nunc</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">July 24, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb5.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Nulla sed euismod neque</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">July 17, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>
                                						<div class="post-item">
                                        					<div class="post-image">
                                       	   						<img src="img/demo/blog/blog-thumb6.jpg" width="80" height="80" alt="Post One">
                                           					</div>
                                            				<a href="#" class="post-item-title">Maecenas a est molestie</a>
                         									<ul class="list-inline post-meta-info">
                                            					<li class="meta-date"><a href="http://smarton.weblusive.com/2014/04/04/">July 10, 2014</a></li>
                        										<li class="meta-tags"><a href="">news</a>, <a href="">design</a></li>
															</ul>
                                        				</div>                                        
													</div>
												</div>
												<div id="tab-content-3" class="tab-pane fade">
													<ul class="comments-list">
                                                    	<li><a href="#" class="comment-user">Brian Iorgsten</a><a class="comment-link" href="#">Class aptent taciti sociosqu ad litora</a></li>
                                                        <li><a href="#" class="comment-user">Carolyne</a><a class="comment-link" href="#">Donec ut porta metus, ut viverra dui.</a></li>
                                                        <li><a href="#" class="comment-user">Admin</a><a class="comment-link" href="#">Etiam in feugiat ante, vel interdum leo. Vest ares ibulum orci dui</a></li>
                                                        <li><a href="#" class="comment-user">Lance Dorgan</a><a class="comment-link" href="#">Mauris nec hen drerit purus. Etiam tempor orci id</a></li>
                                                    </ul>
												</div>
											</div>
										</div> 
      									<!-- /tabs -->                                    
                                    </div>
                                </div> 
                                
                                
                    		</div>
                            
                        <div class="white-space space-big"></div>
                    </div>
                    <!-- /Sidebar -->
                
                </div>          
            	
            </div>
			<!-- /Container -->
                                   
		</div>
		<!-- /Main Container -->      

		<!-- Footer Container -->
		<div class="footer-wrapper">

			<!-- Footer Top Container -->
    		<div class="footer-top">            
                 
                <!-- Google Map -->      	
				<a class="gmap-button">Locate us on map</a>
                <div class="gmap-wrapper">
                	<div id="google-map-footer"></div>
                </div>
				<!-- /Google Map --> 
                
			</div>
			<!-- /Footer Top Container -->

			<!-- Footer Bottom Container -->
			<div class="footer-bottom">

                <!-- Container -->
                <div class="container">
                
                	<div class="row">
                        <!-- Footer Menu -->
  						<div class="col-md-12 col-sm-12 columns">
                        	<div class="menu-footer">
                            	<ul class="list-inline">
                                	<li><a href="">Home</a></li>
                                    <li><a href="">About Us</a></li>
                                    <li><a href="">Shop</a></li>
                                    <li><a href="">Blog</a></li>
                                    <li><a href="">Portfolio</a></li>                                                                        
                                    <li><a href="">Contact</a></li>
                                </ul>
                            </div>
                        </div>
                        <!-- /Footer Menu -->
                    	<!-- Copyright -->
  						<div class="col-md-12 col-sm-12 columns">
                        	<div class="copyright">
                        		<p>Copyright © 2014 - Avendor | All Rights Reserved</p>
                            </div>
                        </div>
                        <!-- /Copyright -->
                        <!-- Footer Social -->
  						<div class="col-md-12 col-sm-12 columns">
                        	<div class="social-footer">
                            	<ul class="list-inline social-list">
                                	<li><a href="" class="ToolTip" title="Facebook"><span class="fa fa-facebook"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Twitter"><span class="fa fa-twitter"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Google+"><span class="fa fa-google-plus"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Pinterest"><span class="fa fa-pinterest"></span></a></li>
                                    <li><a href="" class="ToolTip" title="Linkedin"><span class="fa fa-linkedin"></span></a></li>
                                </ul>
                            </div>
                        </div>
                        <!-- /Footer Social -->
					</div>
                
                </div>
				<!-- /Container -->

			</div>
			<!-- /Footer Bottom Container -->

		</div>
		<!-- /Footer Container -->

	</div>	

	<!-- Back To Top -->
	<a href="#page-top" class="scrollup smooth-scroll" ><span class="fa fa-angle-up"></span></a>
	<!-- /Back To Top -->

 
    <!-- Javascripts
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

	<script type="text/javascript" src="js/themejs/jquery.countdown.js"></script>

	<!-- Preloader -->
	<script src="js/themejs/jquery.queryloader2.min.js" type="text/javascript"></script>

	<!-- Smooth Scroll -->
	<script src="js/themejs/SmoothScroll.js" type="text/javascript"></script>

	<!-- Stick On Scroll -->
	<script src="js/themejs/jquery.stickOnScroll.js" type="text/javascript"></script>
    
    <!-- Scrolling Smooth to section - requires jQuery Easing plugin -->
	<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

    <!-- SLIDER REVOLUTION 4.x SCRIPTS  -->
    <script src="js/revolutionslider/jquery.themepunch.plugins.min.js"></script>
    <script src="js/revolutionslider/jquery.themepunch.revolution.min.js"></script>          

	<!-- LivIcons -->
	<script src="js/livicons/livicons-1.3.min.js" type="text/javascript"></script>
    <script src="js/livicons/raphael-min.js" type="text/javascript"></script>
    
	<!-- Portfolio -->
	<script src="js/themejs/jquery.isotope.min.js" type="text/javascript"></script>
    <script src="js/themejs/jquery.colio.min.js" type="text/javascript"></script>

	<!-- Parallax -->
	<script src="js/themejs/jquery.stellar.min.js" type="text/javascript"></script>

	<!-- Carousel -->
	<script src="js/owl-carousel/owl.carousel.js" type="text/javascript"></script>

	<!-- Counters -->
	<script src="js/themejs/jquery.countTo.js" type="text/javascript"></script>

	<!-- Lightbox -->
	<script src="js/themejs/jquery.magnific-popup.min.js" type="text/javascript"></script>

	<!-- Tooltips -->
	<script src="js/themejs/jQuery.Opie.Tooltip.min.js" type="text/javascript"></script>

	<!-- Animation Viewport -->
	<script src="js/themejs/jquery.waypoints.min.js" type="text/javascript"></script>
    
	<!-- Pie Chart -->
	<script src="js/themejs/jquery.easypiechart.min.js" type="text/javascript"></script>
 
 	<!-- Twitter -->
	<script src="twitter/jquery.tweet.js" type="text/javascript"></script>
    
    <!-- Google Maps -->
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyASm3CwaK9qtcZEWYa-iQwHaGi3gcosAJc&sensor=false"></script>
   
    <!-- Load Scripts -->
	<script src="js/themejs/application.js"></script>

  </body>
</html>