<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Home</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="keywords" content="" />
<!-- css files -->
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all">
<link href="css/cobox.css" rel="stylesheet" type="text/css">
<link href="css/portfolio.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all">
<!-- /css files -->
<!-- font links -->
<link href='#css?family=Quicksand:400,700,300' rel='stylesheet' type='text/css'>
<link href='#css?family=Cinzel:400,700,900' rel='stylesheet' type='text/css'>
<!-- /font links -->
<!-- js files -->
<script src="js/modernizr.custom.js"></script>
<!-- /js files -->
</head>
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60">
<div class="navbar-wrapper">
<div class="container">
<nav class="navbar navbar-inverse navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<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">My Profile</a>
</div>
<div id="navbar" class="navbar-collapse collapse navbar-right">
<ul class="nav navbar-nav link-effect">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#gallery">Gallery</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
</div>
</div>
<!-- Banner -->
<div class="banner">
<ul class="rslides" id="slider">
<li>
<div class="banner-info">
<h3>Its My Life</h3>
<span class="line1"></span>
<p>Lorem Ipsum is dummy text.</p>
<span class="line2"></span>
<div class="social-icons">
<a href="#"><span class="facebook"></span></a>
<a href="#"><span class="twitter"></span></a>
<a href="#"><span class="linkedin"></span></a>
<a href="#"><span class="googleplus"></span></a>
</div>
</div>
</li>
<li>
<div class="banner-info">
<h3>My Passion</h3>
<span class="line1"></span>
<p>Lorem Ipsum is dummy text.</p>
<span class="line2"></span>
<div class="social-icons">
<a href="#"><span class="facebook"></span></a>
<a href="#"><span class="twitter"></span></a>
<a href="#"><span class="linkedin"></span></a>
<a href="#"><span class="googleplus"></span></a>
</div>
</div>
</li>
<li>
<div class="banner-info">
<h3>My Life Style</h3>
<span class="line1"></span>
<p>Lorem Ipsum is dummy text.</p>
<span class="line2"></span>
<div class="social-icons">
<a href="#"><span class="facebook"></span></a>
<a href="#"><span class="twitter"></span></a>
<a href="#"><span class="linkedin"></span></a>
<a href="#"><span class="googleplus"></span></a>
</div>
</div>
</li>
</ul>
</div>
<!-- /Banner -->
<!-- About -->
<div class="about-me" id="about">
<h3 class="text-center slideanim">About My Skills</h3>
<div class="container">
<div class="row">
<div class="col-md-4 col-xs-12">
<div class="mydetails slideanim text-center">
<img class="img-circle img-responsive" src="images/man.jpg" alt="Generic placeholder image" width="200" height="200">
<h3>Tzar Nicholas</h3>
<p>Web Designer</p>
<div class="social-icons">
<a href="#"><span class="facebook"></span></a>
<a href="#"><span class="twitter"></span></a>
<a href="#"><span class="linkedin"></span></a>
<a href="#"><span class="googleplus"></span></a>
</div>
</div>
</div>
<div class="col-md-8 col-xs-12">
<div class="myskills slideanim">
<h3 class="text-center">My Skill Info</h3>
<p class="skill-text">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
<div class="skill-info">
<div class="table-responsive">
<table class="table">
<tbody>
<tr>
<td><h4>Photoshop</h4></td>
<td><span class="longline1"></span><span class="shortline1"></span></td>
<td><p>89%</p></td>
</tr>
<tr>
<td><h4>Multimedia</h4></td>
<td><span class="longline2"></span><span class="shortline2"></span></td>
<td><p>90%</p></td>
</tr>
<tr>
<td><h4>After-Effects</h4></td>
<td><span class="longline3"></span><span class="shortline3"></span></td>
<td><p>95%</p></td>
</tr>
<tr>
<td><h4>Wordpress</h4></td>
<td><span class="longline4"></span><span class="shortline4"></span></td>
<td><p>92%</p></td>
</tr>
<tr>
<td><h4>HTML5</h4></td>
<td><span class="longline5"></span><span class="shortline5"></span></td>
<td><p>96%</p></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /About -->
<!-- Portfolio -->
<div class="myportfolio" id="portfolio">
<h3 class="text-center slideanim">My Portfolio</h3>
<p class="text-center slideanim">My Recent Projects , Just "Click" on them to know More.</p>
<section class="vertical" id="grid3d">
<div class="grid-wrap">
<div class="grid">
<figure><img class="slideanim" src="images/1.jpg" alt="img01"/></figure>
<figure><img class="slideanim" src="images/2.jpg" alt="img05"/></figure>
<figure><img class="slideanim" src="images/3.jpg" alt="img08"/></figure>
<figure><img class="slideanim" src="images/4.jpg" alt="img02"/></figure>
<figure><img class="slideanim" src="images/5.jpg" alt="img04"/></figure>
<figure><img class="slideanim" src="images/6.jpg" alt="img03"/></figure>
<figure><img class="slideanim" src="images/7.jpg" alt="img09"/></figure>
<figure><img class="slideanim" src="images/8.jpg" alt="img06"/></figure>
<figure><img class="slideanim" src="images/9.jpg" alt="img07"/></figure>
</div>
</div><!-- /grid-wrap -->
<div class="content">
<div>
<div class="content-img"><img src="images/1-1.jpg" class="img-responsive" alt="my projects"></div>
<h3 class="content-text">Classy Coming Soon</h3>
<p class="content-text">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div>
<div class="content-img"><img src="images/2-2.jpg" class="img-responsive" alt="my projects"></div>
<h3 class="content-text">404 Error Page</h3>
<p class="content-text">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div>
<div class="content-img"><img src="images/3-3.jpg" class="img-responsive" alt="my projects"></div>
<h3 class="content-text">Credit Card V