mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2025-10-27 07:53:11 +01:00
671 lines
26 KiB
HTML
671 lines
26 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
|
<title>Iam html5 portfolio resume template</title>
|
|
|
|
<!-- Mobile Specific Metas
|
|
================================================== -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<!-- CSS
|
|
================================================== -->
|
|
<!-- Bootstrap -->
|
|
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="css/font-awesome.min.css">
|
|
<link rel="stylesheet" href="css/animate.css">
|
|
<link rel="stylesheet" href="css/prettyPhoto.css">
|
|
<link rel="stylesheet" href="css/style.css">
|
|
|
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
<body data-spy="scroll" data-target=".main-nav">
|
|
|
|
<section id="section-banner">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="banner-content wow fadeInRight">
|
|
<h2 class="title">
|
|
Hello,<br/>
|
|
<span>
|
|
I'm John Doe, <br/>
|
|
a Web Developer,
|
|
From Universe. </span>
|
|
</h2>
|
|
|
|
<a href="#" class="btn btn-default">Learn More</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- section menu start -->
|
|
|
|
<section class="section-menu">
|
|
<div class="navbar navbar-default main-nav" role="navigation" >
|
|
<div class="container" >
|
|
<div class="navbar-header">
|
|
<button class="navbar-toggle collapsed" data-target="#bs-example-navbar-collapse-1" data-toggle="collapse">
|
|
<span class="sr-only"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
|
|
<a href="#" class="navbar-brand">I am ~</a>
|
|
</div> <!-- navbar-header end -->
|
|
<!-- main nav -->
|
|
|
|
<div class="collapse navbar-collapse navigation" id="bs-example-navbar-collapse-1" role="navigation">
|
|
<ul class="nav navbar-nav navbar-right">
|
|
<li class="active"><a href="#section-banner">Home </a></li>
|
|
<li><a href="#section-profile">About me </a></li>
|
|
<li><a href="#section-skill">Skills </a></li>
|
|
<li><a href="#section-resume">Resume </a></li>
|
|
<li><a href="#section-testimonial">Testimonials </a></li>
|
|
<li><a href="#section-portfolio">Portfolio </a></li>
|
|
<li><a href="#section-contact">Contact me </a></li>
|
|
</ul>
|
|
</div><!-- /.navbar-collapse -->
|
|
</div><!-- /.container-fluid -->
|
|
</div>
|
|
</section>
|
|
<!-- section menu end -->
|
|
<section id="section-overview" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="service-wrapper">
|
|
<div class="service-inner wow fadeInRight" data-wow-delay=".2s">
|
|
<i class="fa fa-users"></i>
|
|
<div class="service-box">
|
|
<h3>User Story</h3>
|
|
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation</p>
|
|
</div>
|
|
</div> <!-- service -inner -->
|
|
<div class="service-inner wow fadeInRight" data-wow-delay=".5s">
|
|
<i class="fa fa-bank"></i>
|
|
<div class="service-box">
|
|
<h3>Wireframe</h3>
|
|
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation</p>
|
|
</div>
|
|
</div> <!-- service -inner -->
|
|
<div class="service-inner wow fadeInRight" data-wow-delay=".8s">
|
|
<i class="fa fa-pencil"></i>
|
|
<div class="service-box">
|
|
<h3>Graphic Design</h3>
|
|
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation</p>
|
|
</div>
|
|
</div> <!-- service -inner -->
|
|
<div class="service-inner wow fadeInRight" data-wow-delay="1.1s">
|
|
<i class="fa fa-globe"></i>
|
|
<div class="service-box">
|
|
<h3>Web Development</h3>
|
|
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation</p>
|
|
</div>
|
|
</div> <!-- service -inner -->
|
|
</div>
|
|
</div><!-- row end -->
|
|
</div>
|
|
</section>
|
|
<!-- section overview end -->
|
|
|
|
<!-- section profile start -->
|
|
|
|
<section id="section-profile" class="section-padding">
|
|
<div class="profile-bg visible-md visible-lg"></div>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-7 col-sm-12 pull-right">
|
|
<div class="profile-desc wow fadeInRight">
|
|
<h2 class="section-title uppercase">Hello, My Name is John.</h2>
|
|
<br/>
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
</p>
|
|
<br/>
|
|
|
|
|
|
<p class="text-grey animated bounceInUp" style="opacity: 1;">
|
|
Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis.
|
|
</p>
|
|
<br/>
|
|
<p class="text-grey animated bounceInUp" style="opacity: 1;">
|
|
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
</p>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div> <!-- row end -->
|
|
</div><!-- container end -->
|
|
</section>
|
|
<!-- section profile end -->
|
|
|
|
<!-- section skill start -->
|
|
|
|
<section id="section-skill" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<h2 class="heading-title">My skills</h2>
|
|
</div>
|
|
<div class="col-md-6 col-sm-6 wow fadeInLeft">
|
|
<div class="skill-desc">
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri.
|
|
<br>
|
|
<br>
|
|
Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri.
|
|
<br>
|
|
<br>
|
|
Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est.</p>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-sm-6 wow fadeInRight" >
|
|
<div class="skill-box wow fadeInDown" data-wow-delay=".2s">
|
|
<label> Wireframe</label>
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progress-bar" aria-valuemin="0" aria-valuenow="70" aria-valuemax="100" style="width: 70%;" >
|
|
70%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="skill-box wow fadeInDown" data-wow-delay=".4s">
|
|
<label> Photoshop</label>
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progress-bar" aria-valuemin="0" aria-valuenow="85" aria-valuemax="100" style="width: 85%;" >
|
|
85%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="skill-box wow fadeInDown" data-wow-delay=".6s">
|
|
<label> HTML5 / CSS3</label>
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progress-bar" aria-valuemin="0" aria-valuenow="90" aria-valuemax="100" style="width: 90%;" >
|
|
90%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="skill-box wow fadeInDown" data-wow-delay=".8s">
|
|
<label> JavaScript </label>
|
|
<div class="progress">
|
|
<div class="progress-bar" role="progress-bar" aria-valuemin="0" aria-valuenow="65" aria-valuemax="100" style="width: 65%;" >
|
|
65%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- section skill End -->
|
|
|
|
<!-- Resume start -->
|
|
|
|
<section id="section-resume" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center wow fadeInUp">
|
|
<h2 class="heading-title">Resume</h2>
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri. Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est.</p>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="resume-details" class="section-padding">
|
|
|
|
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 wow fadeInLeft">
|
|
|
|
<div class="resume-inner">
|
|
<h2 class="heading-title">My Education</h2>
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri.
|
|
<br>
|
|
Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<div class="timeline-centered">
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-success">
|
|
<i class="entypo-feather"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">Graphics design diploma</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-secondary">
|
|
<i class="entypo-suitcase"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">Web design diploma</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-info">
|
|
<i class="entypo-location"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">User experience diploma</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-warning">
|
|
<i class="entypo-camera"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">User research</h3>
|
|
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry begin">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon" style="-webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg);">
|
|
<i class="entypo-flight"></i> +
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</article>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 wow fadeInLeft">
|
|
|
|
<div class="resume-inner">
|
|
<h2 class="heading-title">Work Experience</h2>
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri.
|
|
<br>
|
|
Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<div class="timeline-centered">
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-success">
|
|
<i class="entypo-feather"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">Sr. Web designer</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-secondary">
|
|
<i class="entypo-suitcase"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">Web designer</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-info">
|
|
<i class="entypo-location"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">Graphics designer</h3>
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon bg-warning">
|
|
<i class="entypo-camera"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h3 class="resume-title">developer</h3>
|
|
|
|
<p>Tolerably earnestly middleton extremely distrusts she boy now not. Add and offered prepare how cordial two promise. Greatly who affixed suppose but enquire compact prepare all put. Added forth chief trees but rooms think may.</p>
|
|
</div>
|
|
</div>
|
|
|
|
</article>
|
|
|
|
|
|
<article class="timeline-entry begin">
|
|
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon" style="-webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg);">
|
|
<i class="entypo-flight"></i> +
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</article>
|
|
|
|
</div>
|
|
|
|
<a href="#" class="btn btn-default featured">Download Resume</a>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
<!-- Resume end -->
|
|
|
|
<!-- section testimonial start -->
|
|
|
|
<section id="section-testimonial" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="carousel slide text-center" id="testimonial-carousel">
|
|
<ol class="carousel-indicators">
|
|
<li data-target="#testimonial-carousel" data-slide-to="0" class="active"></li>
|
|
<li data-target="#testimonial-carousel" data-slide-to="1"></li>
|
|
<li data-target="#testimonial-carousel" data-slide-to="2"></li>
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
<div class="item active">
|
|
<p>“ Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri. Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam. ”</p>
|
|
|
|
<h4 class="client-name">Fedrer Venliy</h4>
|
|
</div>
|
|
<div class="item">
|
|
<p>“ Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri. Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam. ”</p>
|
|
|
|
<h4 class="client-name">Markus Stephen</h4>
|
|
</div>
|
|
<div class="item ">
|
|
<p>“ Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri. Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam. ”</p>
|
|
|
|
<h4 class="client-name">John Deally</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- section testimonial end -->
|
|
|
|
<!-- section portfolio start -->
|
|
|
|
<section id="section-portfolio" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center wow fadeInUp">
|
|
<div class="section-heading">
|
|
<h2 class="heading-title">portfolio</h2>
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei, cum ne periculis molestiae pri. </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic1.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic1.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic2.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic2.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end 3step-->
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic3.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic3.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="clearfix"></div>
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic4.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic4.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic5.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolioportfolio_pic5.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end 6 step -->
|
|
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic6.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic6.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="clearfix"></div>
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic7.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic7.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic8.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic8.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
<div class="col-md-4 col-sm-4">
|
|
<div class="portfolio-box">
|
|
<img src="images/portfolio/portfolio_pic9.jpg" alt="" class="img-responsive">
|
|
<div class="image-overlay text-center">
|
|
<a href="images/portfolio/portfolio_pic9.jpg" data-rel="prettyPhoto"><i class="fa fa-arrows-alt"></i></a>
|
|
</div>
|
|
</div>
|
|
</div> <!-- col-md-4 end -->
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- section portfolio endt -->
|
|
|
|
<!-- section contact start -->
|
|
|
|
<section id="section-contact" class="section-padding">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<h2 class="heading-title">Contact me</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<div class="col-md-6 col-sm-6 wow fadeInRight">
|
|
<div class="contact-form">
|
|
<form class="contact-box">
|
|
<div class="form-group">
|
|
<label>Name*</label>
|
|
<input type="text" class="form-control">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Email address*</label>
|
|
<input type="text" class="form-control">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Message*</label>
|
|
<input type="text" class="form-control">
|
|
</div>
|
|
</form>
|
|
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<a href="#" class="btn btn-default">Contact me</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 col-sm-6 wow fadeInLeft">
|
|
<div class="contact-left">
|
|
<p>Lorem ipsum dolor sit amet, ea doming epicuri iudicabit nam, te usu virtute placerat. Purto brute disputando cu est, eam dicam soluta ei. Vel dicam vivendo accusata ei.</p>
|
|
<div class="location">
|
|
<p>122 34rd Some Street</p>
|
|
<p>Vendelliers, NYK</p>
|
|
<p>United Country 12</p>
|
|
</div>
|
|
<ul>
|
|
<li><span>Email :</span> <a>contact@yoursite.com</a></li>
|
|
<li><span>Phone :</span> <a>1-234-567-89</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- section contact end -->
|
|
|
|
<footer id="section-footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center">
|
|
<ul class="socail-link list-inline">
|
|
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
|
|
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
|
|
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
|
|
<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
|
|
</ul>
|
|
<h4>Copyright © 2015, Template by <a href="http://webthemez.com">WebThemez.com</a></h4>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
|
|
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
|
<!-- initialize jQuery Library -->
|
|
<script type="text/javascript" src="js/jquery.js"></script>
|
|
<!-- Bootstrap jQuery -->
|
|
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
|
|
<!-- PrettyPhoto -->
|
|
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
|
|
<!-- Wow Animation -->
|
|
<script type="text/javascript" src="js/wow.min.js"></script>
|
|
<!-- singlepagenav -->
|
|
<script src="js/jquery.singlePageNav.js"></script>
|
|
<!-- Eeasing -->
|
|
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
|
|
<!-- Sticky Menu -->
|
|
<script src="js/jquery.sticky.js"></script>
|
|
<script type="text/javascript" src="js/custom.js"></script>
|
|
<script>
|
|
$(".main-nav").sticky();
|
|
</script>
|
|
|
|
<script>
|
|
new WOW().init();
|
|
|
|
</script>
|
|
</body>
|
|
</html> |