In this repo i store all my websites, each in a different branch
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

329 rindas
15 KiB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Marcel Haazen | Home</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="Marcel Haazen">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
<!-- Favicone Icon -->
<link rel="apple-touch-icon" sizes="180x180" href="/img/flavicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/img/flavicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/img/flavicon/favicon-16x16.png">
<link rel="manifest" href="/img/flavicon/manifest.json">
<link rel="mask-icon" href="/img/flavicon/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/img/flavicon/favicon.ico">
<meta name="msapplication-config" content="/img/flavicon/browserconfig.xml">
<meta name="theme-color" content="#646464">
<!-- CSS -->
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<script src="js/ityped.js" type="text/javascript"></script>
</head>
<body>
<!-- Site Wraper -->
<div class="wrapper">
<!-- Header -->
<header id="header" class="header">
<div class="container header-inner">
<!-- Logo -->
<div class="logo">
<a href="index.html">
<img class="logo-light" src="img/logo-black.png" alt="Haazen" />
<img class="logo-dark" src="img/logo-white.png" alt="Haazen" />
</a>
</div>
<!-- End Logo -->
<!-- Mobile Navbar Icon -->
<div class="nav-mobile nav-bar-icon">
<span></span>
</div>
<!-- End Mobile Navbar Icon -->
<!-- Navbar Navigation -->
<div class="nav-menu">
<ul class="nav-menu-inner">
<li><a href="/">Home</a></li>
<li><a href="service.html">Services</a></li>
</ul>
</div>
<!-- End Navbar Navigation -->
</div>
</header>
<!-- End Header -->
<!-- CONTENT --------------------------------------------------------------------------------->
<!-- Intro -->
<section id="intro" class="intro">
<!-- Intro Scroll Down -->
<div class="intro-scroll-down">
<a class="scroll-down"> <span class="mouse">
<span class="mouse-dot"></span> </span>
</a>
</div>
<!-- End Intro Scroll Down -->
<!-- Static Intro -->
<div class="bg-image overlay-dark80 dark-bg" data-background-img="img/full/09.jpg">
<div class="js-fullscreen-height container">
<div class="intro-content">
<div class="intro-content-inner">
<h1 class="">hi, I'm <span id="desc"></span>
</h1>
<script>
ityped.init('#desc', {
strings:['Marcel Haazen', 'a SysAdmin', 'a Programmer'], loop:true
});
</script>
<br>
<div><a class="btn btn-md btn-white-line xs-hidden" href="service.html">My services</a><span class="btn-space-10 xs-hidden"></span><a class="btn btn-md btn-white-line">My work</a></div>
</div>
</div>
</div>
</div>
<!-- End Static Intro -->
</section>
<!-- End Intro -->
<!-- Service Section -->
<section id="service" class="ptb-60 dark-bg ptb-sm-60">
<div class="container text-center">
<h3>My Services</h3>
<div class="spacer-60"></div>
<div class="row">
<div class="col-md-3 col-sm-6 mb-45">
<div class="page-icon-top"><i class="fa fa-server"></i></div>
<h5>Server Administration</h5>
<p>Do you need a server configured or setup from scratch? I will setup and configure everything so you never have to worry about a thing.</p>
</div>
<div class="col-md-3 col-sm-6 mb-45">
<div class="page-icon-top"><i class="fa fa-shield"></i></div>
<h5>Cyber Security</h5>
<p>Nowadays security is a must but you might not know how to set it up. I'll help you secure your systems so you don't have to worry.</p>
</div>
<div class="col-md-3 col-sm-6 mb-45">
<div class="page-icon-top"><i class="fa fa-code"></i></div>
<h5>Programming</h5>
<p>Need a custom system for a blog, website or API? I will create and set it up for you so you can be happy.</p>
</div>
<div class="col-md-3 col-sm-6 mb-45">
<div class="page-icon-top"><i class="fa fa-exchange"></i></div>
<h5>Migration</h5>
<p>People want to be able to change hosts or change the application they use. Usually its a pain but I'm here to make it as easy as possible.</p>
</div>
</div>
<div class="spacer-15"></div>
<div class="row">
<div class="col-md-8 col-sm-8">
<h4 class="">Want to see the rest?</h4>
<p class="mb-0">Click the button to see the rest of my services.</p>
</div>
<div class="col-md-2 col-sm-2 see-more">
<a class="btn btn-md btn-white-line float-right float-none-xs" href="service.html">See All services</a>
</div>
<div class="col-md-2 col-sm-2"></div>
</div>
</div>
</section>
<!-- End Service Section -->
<!-- Work Section -->
<section id="work" class="pt-60 pt-sm-60 text-center">
<div class="container">
<h3>My Work</h3>
<div class="spacer-30"></div>
<!-- work Filter -->
<div class="row">
<ul class="container-filter categories-filter">
<li><a class="categories active" data-filter="*">All</a></li>
<li><a class="categories" data-filter=".admin">Server Administration</a></li>
<li><a class="categories" data-filter=".design">Design</a></li>
<li><a class="categories" data-filter=".program">Programming</a></li>
<li><a class="categories" data-filter=".other">other</a></li>
</ul>
</div>
<!-- End work Filter -->
</div>
<!-- Work Gallary -->
<div class="container-fluid ">
<div class="row">
<div class="container-grid nf-col-4">
<div class="nf-item design other">
<div class="item-box">
<a class="cbox-gallary1" href="img/portfolio/puritysite.png" title="Template based Site - Purity Media">
<img class="item-container" src="img/portfolio/puritysite.png" alt="site" />
<div class="item-mask">
<div class="item-caption">
<h5 class="white">Template based Site - Purity Media</h5>
<p class="white">Design, Other</p>
</div>
</div>
</a>
</div>
</div>
<div class="nf-item design other">
<div class="item-box">
<a class="cbox-gallary1" href="img/portfolio/opimizesite.png" title="Template based site - Optimize Group">
<img class="item-container" src="img/portfolio/opimizesite.png" alt="site" />
<div class="item-mask">
<div class="item-caption">
<h5 class="white">Template based site - Optimize Group</h5>
<p class="white">Design, Other</p>
</div>
</div>
</a>
</div>
</div>
<div class="nf-item design other program">
<div class="item-box">
<a class="cbox-gallary1" href="img/portfolio/optimizeblog.png" title="Custom Blog - Optimize Group">
<img class="item-container" src="img/portfolio/optimizeblog.png" alt="Blog" />
<div class="item-mask">
<div class="item-caption">
<h5 class="white">Custom Blog - Optimize Group</h5>
<p class="white">Design, Programming, Other</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- End Work Gallary -->
</section>
<!-- End Work Section -->
<!-- Action Box Section -->
<section id="action-box" class="ptb-60">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-8">
<h4 class="">Want to see more?</h4>
<p class="mb-0">Click the button to see the rest of my work.</p>
</div>
<div class="col-md-4 col-sm-4 see-more">
<a class="btn btn-md btn-black-line float-right float-none-xs">See All Work</a>
</div>
</div>
</div>
</section>
<!-- End Action Box Section -->
<!-- Process -->
<section id="process" class="dark-bg ptb-60 ptb-sm-60">
<div class="container text-center">
<h3>Easy Process</h3>
<div class="spacer-60"></div>
<div class="row">
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step1 - Skype Interview" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-people-outline"></i></div>
<h6>Interview</h6>
</div>
</div>
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step2 - Project Plan" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-paper-outline"></i></div>
<h6>Plan</h6>
</div>
</div>
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step3 - Design" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-compose-outline"></i></div>
<h6>Design</h6>
</div>
</div>
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step4 - Development" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-gear-outline"></i></div>
<h6>Development</h6>
</div>
</div>
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step5 - Testing" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-pulse"></i></div>
<h6>Testing</h6>
</div>
</div>
<div class="col-md-2 col-sm-4 col-xs-6">
<div class="tipped" data-title="Step6 - Delivery" data-tipper-options='{"direction":"top"}'>
<div class="page-icon-top"><i class="ion ion-ios-clock-outline"></i></div>
<h6>Delivery</h6>
</div>
</div>
</div>
</div>
</section>
<!-- End Process -->
<!-- END CONTENT ---------------------------------------------------------------------------->
<!-- FOOTER -->
<footer class="footer pt-15-b5">
<div class="container">
<div class="row">
<!-- Copyright -->
<div class="col-md-7 col-sm-8 col-xs-12 mt-xs-15">
<p>© 2015-<script>document.write(new Date().getFullYear())</script> <a><b>Marcel Haazen</b></a>. All Rights Reserved</p>
</div>
<!-- End Copyright -->
<!-- Social -->
<div class="col-md-3 col-md-offset-2 col-sm-4 col-xs-12 mb-xs-15">
<ul class="social">
<li><a target="_blank" href="https://www.linkedin.com/in/mhaazen"><i class="fa fa-linkedin"></i></a></li>
<li><a target="_blank" href="https://twitter.com/NekoCentral"><i class="fa fa-twitter"></i></a></li>
<li><a target="_blank" href="https://www.facebook.com/mhaazen"><i class="fa fa-facebook"></i></a></li>
<li><a target="_blank" href="https://github.com/inpothet"><i class="fa fa-github"></i></a></li>
</ul>
</div>
<!-- End Social -->
</div>
</div>
</footer>
<!-- END FOOTER -->
<!-- Scroll Top -->
<a class="scroll-top">
<i class="fa fa-angle-double-up"></i>
</a>
<!-- End Scroll Top -->
</div>
<!-- Site Wraper End -->
<!-- JS -->
<script src="js/jquery-1.11.2.min.js" type="text/javascript"></script>
<script src="js/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/plugin/jquery.easing.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/plugin/jquery.viewportchecker.js" type="text/javascript"></script>
<script src="js/plugin/jquery.colorbox-min.js" type="text/javascript"></script>
<script src="js/plugin/owl.carousel.min.js" type="text/javascript"></script>
<script src="js/plugin/isotope.pkgd.min.js" type="text/javascript"></script>
<script src="js/plugin/imagesloaded.pkgd.min.js" type="text/javascript"></script>
<script src="js/plugin/jquery.fs.tipper.min.js" type="text/javascript"></script>
<script src="js/plugin/mediaelement-and-player.min.js"></script>
<script src="js/theme.js" type="text/javascript"></script>
</body>
</html>