index copy.html

---
layout: default
---

	<!-- Home start -->

	<section id="home" class="module-image js-height-full">

		<div class="intro">
			<div class="hello">Hello, my name is Maria Furman and</div>
			<h1>I am a Software Engineer</h1>
			<div class="who-creates">who is passionate about UI/UX design.</div>
		</div>

		<div class="mouse-icon">
			<div class="wheel"></div>
		</div>

		<div class="slider">

			<div id="myCarousel" class="carousel slide" data-ride="carousel">
				<!-- Indicators -->
				<ol class="carousel-indicators">
					<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
					<li data-target="#myCarousel" data-slide-to="1"></li>
					<li data-target="#myCarousel" data-slide-to="2"></li>
				</ol>

				<!-- Wrapper for slides -->
				<div class="carousel-inner">
					<div class="item active">
						<img src="assets/images/laugh2.jpg" alt="Los Angeles">
					</div>

					<div class="item">
						<img src="assets/images/smile.jpg" alt="Chicago">
					</div>

					<div class="item">
						<img src="assets/images/calcifer.jpg" alt="New York">
					</div>
				</div>

				<!-- Left and right controls -->
				<a class="left carousel-control" href="#myCarousel" data-slide="prev">
					<i class="fas fa-chevron-left"></i>
					<span class="sr-only">Previous</span>
				</a>
				<a class="right carousel-control" href="#myCarousel" data-slide="next">
					<i class="fas fa-chevron-right"></i>
					<span class="sr-only">Next</span>
				</a>
			</div>

		</div>

	</section>

	<!-- Home end -->

	<!-- Navigation start -->

    <header class="header">

        <nav class="navbar navbar-custom">

            <div class="container">

                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#custom-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="/index.html">Maria Furman</a>
                </div>

                <div class="collapse navbar-collapse" id="custom-collapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#home">home</a></li>
                        <!-- <li><a href="#portfolio">Works</a></li> -->
                        <!-- <li><a href="#services">Service</a></li> -->
                        <li><a href="#about">About</a></li>
                        <!-- <li><a href="#testimonial">Testimonial</a></li> -->
                        <li><a href="#blog">Blog</a></li>
                        <li><a href="#contact">Contact</a></li>
                    </ul>
                </div>

            </div><!-- .container -->

        </nav>

    </header>

    <!-- Navigation end -->

	<!-- Portfolio start -->

	<section id="portfolio" class="module">
		<div class="container">
			<div class="row">

				<div class="module-header">
					<h2 class="module-title">
						My works
						<span>Portfolio</span>
					</h2>
					<div class="module-line"></div>
				</div>

			</div><!-- .row -->

			<!-- Portfolio Filter start-->

			<div class="row">

				<div class="col-sm-12">

					<ul id="filter">
						<li class="active" data-group="all">All</li>
						<li data-group="slideshow">Slideshow</li>
						<li data-group="video">Video</li>
						<li data-group="image">Image</li>
					</ul>

				</div>

			</div><!-- .row -->

			<!-- Portfolio Filter end -->

		</div><!-- .contaier -->

		<ul class="list-items-container">

			<li class="list-item" data-groups="all slideshow">
				<figure>
					<img src="{{site.baseurl}}assets/images/p1-1.jpg" alt="p1">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p1-1.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Slideshow</div>
						</div>
					</figcaption>
				</figure>
			</li>

			<li class="list-item" data-groups="all video">
				<figure>
					<img src="{{site.baseurl}}assets/images/p2-2.jpg" alt="p2">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p2-2.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Video</div>
						</div>
					</figcaption>
				</figure>
			</li>

			<li class="list-item" data-groups="all image">
				<figure>
					<img src="{{site.baseurl}}assets/images/p3-3.jpg" alt="p3">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p3-3.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Image</div>
						</div>
					</figcaption>
				</figure>
			</li>

			<li class="list-item" data-groups="all slideshow">
				<figure>
					<img src="{{site.baseurl}}assets/images/p4-4.jpg" alt="p4">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p4-4.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Slideshow</div>
						</div>
					</figcaption>
				</figure>
			</li>

			<li class="list-item" data-groups="all video">
				<figure>
					<img src="{{site.baseurl}}assets/images/p5-5.jpg" alt="p5">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p5-5.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Video</div>
						</div>
					</figcaption>
				</figure>
			</li>

			<li class="list-item" data-groups="all image">
				<figure>
					<img src="{{site.baseurl}}assets/images/p6-6.jpg" alt="p6">
					<figcaption>
						<a href="{{site.baseurl}}assets/images/p6-6.jpg" class="simple-ajax-popup"></a>
						<div class="caption-inner">
							<h3 class="portfolio-item-title">Some work one</h3>
							<div class="portfolio-item-desc">Image</div>
						</div>
					</figcaption>
				</figure>
			</li>

		</ul><!-- .projects-container -->

	</section>

	<!-- Portfolio end -->

	<!-- Services start -->

	<section id="services" class="module module-gray">
		<div class="container">

			<div class="module-header wow fadeInUp">
				<h2 class="module-title">
					My Services
					<span>Services</span>
				</h2>
				<div class="module-line"></div>
			</div>

			<div class="row">

				<div class="col-sm-4">
					<div class="iconbox wow fadeInUp">
						<div class="iconbox-icon">
							<i class="fas fa-desktop"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Web Design</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-4">
					<div class="iconbox wow fadeInUp">
						<div class="iconbox-icon">
							<i class="fas fa-code"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Web Development</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-4">
					<div class="iconbox wow fadeInUp" data-wow-delay=".2s">
						<div class="iconbox-icon">
							<i class="fab fa-sketch"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Logo Design</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>
				</div>

				<div class="col-sm-4">

					<div class="iconbox wow fadeInUp" data-wow-delay=".4s">
						<div class="iconbox-icon">
							<i class="far fa-comments"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Marketing</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>

				</div>

				<div class="col-sm-4">

					<div class="iconbox wow fadeInUp" data-wow-delay=".6s">
						<div class="iconbox-icon">
							<i class="fas fa-palette"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Design</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>

				</div>

				<div class="col-sm-4">

					<div class="iconbox wow fadeInUp" data-wow-delay=".8s">
						<div class="iconbox-icon">
							<i class="fas fa-rocket"></i>
						</div>
						<div class="iconbox-text">
							<h3 class="iconbox-title">Branding</h3>
							<div class="iconbox-desc">
								Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...
							</div>
						</div>
					</div>

				</div>

			</div><!-- .row -->
		</div><!-- .container -->
	</section>

	<!-- Services end -->

	<!-- About start -->

	<section id="about">

		<div class="row position-relative margin-0">

			<div class="col-xs-12 col-md-6 side-image"></div>

			<div class="col-xs-12 col-md-6 col-md-offset-6 side-image-text">

				<div class="row">

					<div class="col-sm-12">

						<div class="module-header wow fadeInUp">
							<h2 class="module-title">
								About me
								<span>About</span>
							</h2>
							<div class="module-line"></div>
						</div>

					</div>

				</div><!-- .row -->

				<div class="row">

					<div class="col-sm-6">

						<div class="iconboxleft wow fadeInUp">
							<div class="iconboxleft-icon">
								<i class="fas fa-camera-retro"></i>
							</div>
							<div class="iconboxleft-text">
								<h3 class="iconboxleft-title">Photographer</h3>
								<div class="iconboxleft-desc">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt .
								</div>
							</div>
						</div>

					</div>

					<div class="col-sm-6">

						<div class="iconboxleft wow fadeInUp" data-wow-delay=".2s">
							<div class="iconboxleft-icon">
								<i class="fas fa-headphones-alt"></i>
							</div>
							<div class="iconboxleft-text">
								<h3 class="iconboxleft-title">Music</h3>
								<div class="iconboxleft-desc">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt . 
								</div>
							</div>
						</div>

					</div>

				</div><!-- .row -->

				<div class="row">

					<div class="col-sm-6">

						<div class="iconboxleft wow fadeInUp">
							<div class="iconboxleft-icon">
								<i class="fas fa-paint-brush"></i>
							</div>
							<div class="iconboxleft-text">
								<h3 class="iconboxleft-title">Painting</h3>
								<div class="iconboxleft-desc">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.
								</div>
							</div>
						</div>

					</div>

					<div class="col-sm-6">

						<div class="iconboxleft wow fadeInUp" data-wow-delay=".2s">
							<div class="iconboxleft-icon">
								<i class="fas fa-hat-wizard"></i>
							</div>
							<div class="iconboxleft-text">
								<h3 class="iconboxleft-title">Magic</h3>
								<div class="iconboxleft-desc">
									Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.
								</div>
							</div>
						</div>

					</div>

				</div><!-- .row -->

			</div><!-- col-xs-12 -->

		</div><!-- .row -->
	</section>

	<!-- About end -->

	<!-- Testimonial start -->

	<div id="testimonial" class="module module-gray text-center">
		<div class="container">
			
			<div class="module-header wow fadeInUp">
				<h2 class="module-title">
					Testimony
					<span>Testimony</span>
				</h2>
				<div class="module-line"></div>
			</div>

			<div class="row">

				<div class="col-sm-8 col-sm-offset-2">

					<div class="module-header wow fadeInUp">
						<div class="module-icon"><i class="fas fa-quote-left"></i></div>
					</div>

					<div class="testimonials owl-carousel wow fadeInUp">
						<div class="single-testimonials">
							<p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica.</p>
							<span>Jon Doe, Web Developer</span>
						</div>
						<div class="single-testimonials">
							<p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica.</p>
							<span>Jon Doe, Web Developer</span>
						</div>
						<div class="single-testimonials">
							<p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica.</p>
							<span>Jon Doe, Web Developer</span>
						</div>
					</div>

				</div>

			</div><!-- .row -->
		</div><!-- .container -->
	</div>

	<!-- Testimonial end -->

	<!-- Blog start -->

	<section id="blog" class="module blog">
		<div class="container">

			<div class="module-header">
				<h2 class="module-title">Blog
					<span>Articles</span>
				</h2>
				<div class="module-line"></div>
			</div>

			<div class="row">

            	{% for post in site.posts limit:3 %}
					<div class="col-sm-4">
						<a href="{{site.baseurl}}{{post.url}}" class="blogList wow fadeInUp">
							<div class="blogList-img">
								{% if post.banner_image %}
									<img src="{{ "assets/images/" | append: post.banner_preview | prepend: site.baseurl }}" alt="Blog Desc">
								{% endif %}
								{% if post.category %}
								<span>{{post.category}}</span>
								{% endif %}
							</div>
							<div class="blogList-desc">
								<h3>{{post.title}}</h3>
								<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim...</div>
							</div>
						</a>
					</div>
				{% endfor %}

				<div class="col-sm-12">
					<a class="blog-viewMore" href="{{site.baseurl}}blog.html">VIEW MORE</a>
				</div>

			</div><!-- .row -->
		</div><!-- .container -->
	</section>

	<!-- Blog end -->

	<!-- Google Map start-->

	<div id="map-section">

		<div id="map"></div>

	</div>

	<!-- Google Map end -->

	<!-- Contact start -->

	<section id="contact" class="module">
		<div class="container">

			<div class="module-header">
				<h2 class="module-title">Contact
					<span>Contact</span>
				</h2>
				<div class="module-line"></div>
			</div>


			<div class="row">

				<div class="col-sm-6 col-sm-offset-3">

					<form id="contact-form" action="#">
						<div class="ajax-hidden">
							<div class="form-group wow fadeInUp">
								<label class="sr-only" for="c_name">Name</label>
								<input type="text" id="c_name" class="form-control" name="c_name" placeholder="Name" required>
							</div>

							<div class="form-group wow fadeInUp" data-wow-delay=".1s">
								<label class="sr-only" for="c_email">Email address</label>
								<input type="email" id="c_email" class="form-control" name="c_email" placeholder="E-mail" required>
							</div>

							<div class="form-group wow fadeInUp" data-wow-delay=".2s">
								<textarea class="form-control" id="c_message" name="c_message" rows="7" placeholder="Your message" required></textarea>
							</div>

							<button type="submit" class="btn btn-block btn-custom-2 wow fadeInUp" data-wow-delay=".3s">Send Message
							</button>
						</div>
						<div class="ajax-response"></div>
					</form>

				</div>

			</div><!-- .row -->
		</div><!-- .container -->
	</section>

	<!-- Contact end -->