Browse Source

Changed my mind again. Completely new style and design overhaul

project-revamp
Ethan N. Paul 4 years ago
parent
commit
eb01bd16fa
  1. 14
      Readme.md
  2. 0
      _archive/5.5/css/animate.css
  3. 6
      _archive/5.5/css/bootstrap.min.css
  4. 4
      _archive/5.5/css/font-awesome.min.css
  5. 0
      _archive/5.5/css/hexagons.min.css
  6. 349
      _archive/5.5/css/style.css
  7. BIN
      _archive/5.5/fonts/FontAwesome.otf
  8. BIN
      _archive/5.5/fonts/fontawesome-webfont.eot
  9. 2671
      _archive/5.5/fonts/fontawesome-webfont.svg
  10. BIN
      _archive/5.5/fonts/fontawesome-webfont.ttf
  11. BIN
      _archive/5.5/fonts/fontawesome-webfont.woff
  12. BIN
      _archive/5.5/fonts/fontawesome-webfont.woff2
  13. 0
      _archive/5.5/img/about-banner.jpg
  14. 0
      _archive/5.5/img/e-b.png
  15. 0
      _archive/5.5/img/e-longform.png
  16. BIN
      _archive/5.5/img/e-w.png
  17. BIN
      _archive/5.5/img/network.jpg
  18. 0
      _archive/5.5/img/port01.jpg
  19. 0
      _archive/5.5/img/port02.jpg
  20. 0
      _archive/5.5/img/port03.jpg
  21. 0
      _archive/5.5/img/portfolio01.jpg
  22. 0
      _archive/5.5/img/portfolio02.jpg
  23. 274
      _archive/5.5/index.html
  24. 7
      _archive/5.5/js/bootstrap.min.js
  25. 51
      _archive/5.5/js/custom.js
  26. 0
      _archive/5.5/js/jquery.easing.min.js
  27. 5
      _archive/5.5/js/jquery.min.js
  28. 0
      _archive/5.5/js/wow.js
  29. 11
      css/animate.min.css
  30. 1
      css/scss-files.txt
  31. 1213
      css/style.css
  32. BIN
      img/about-img.jpg
  33. BIN
      img/bw.jpg
  34. BIN
      img/circuit.jpg
  35. BIN
      img/client-1.jpg
  36. BIN
      img/client-2.jpg
  37. BIN
      img/hero-bg.jpg
  38. BIN
      img/logo.png
  39. BIN
      img/portfolio-1.jpg
  40. BIN
      img/portfolio-2.jpg
  41. BIN
      img/portfolio-3.jpg
  42. BIN
      img/portfolio-4.jpg
  43. BIN
      img/portfolio-5.jpg
  44. BIN
      img/portfolio-6.jpg
  45. BIN
      img/portfolio-7.jpg
  46. BIN
      img/portfolio-8.jpg
  47. 1
      img/preloader.svg
  48. BIN
      img/quote_sign_left.png
  49. BIN
      img/quote_sign_right.png
  50. BIN
      img/services-bg.jpg
  51. BIN
      img/subscribe-bg.jpg
  52. BIN
      img/team-1.jpg
  53. BIN
      img/team-2.jpg
  54. BIN
      img/team-3.jpg
  55. BIN
      img/team-4.jpg
  56. 758
      index.html
  57. 161
      js/custom.js
  58. 1
      js/easing.min.js
  59. 1
      js/morphext.min.js
  60. 287
      js/sticky.js
  61. 158
      js/superfish.hoverIntent.js
  62. 10
      js/superfish.min.js
  63. 2
      js/wow.min.js

14
Readme.md

@ -0,0 +1,14 @@
# Imperial - Free One Page Bootstrap Template
*Thanks for downloading!*
[BootstrapMade](https://bootstrapmade.com/imperial-free-onepage-bootstrap-theme/) is the author of this template.
Get more [free templates](https://themewagon.com/theme_tag/free/) from [ThemeWagon](https://themewagon.com/)
<!-- =======================================================
Theme Name: Imperial
Theme URL: https://bootstrapmade.com/imperial-free-onepage-bootstrap-theme/
Author: BootstrapMade.com
Author URL: https://bootstrapmade.com
======================================================= -->

0
css/animate.css → _archive/5.5/css/animate.css

6
_archive/5.5/css/bootstrap.min.css
File diff suppressed because it is too large
View File

4
_archive/5.5/css/font-awesome.min.css
File diff suppressed because it is too large
View File

0
css/hexagons.min.css → _archive/5.5/css/hexagons.min.css

349
_archive/5.5/css/style.css

@ -0,0 +1,349 @@
body {
line-height: 1.4;
font-family: 'Roboto', sans-serif;
font-size: 18px;
letter-spacing: 0.5px;
font-size: 15px;
font-weight: 400;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
outline: none;
}
a:hover, a:focus, a:active{
text-decoration: none;
outline: none;
}
/***********************************
************************************
Responsive media queries
************************************
***********************************/
.header {
background: url('../img/network.jpg') no-repeat fixed;
background-size: cover;
height: 100vh;
position: relative;
}
.navbar-default {
background-color: transparent;
border: 0px;
padding: 20px 0;
transition: all 0.3s;
}
.navbar-brand {
font-size: 25px;
}
.navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
color: #fff;
outline: none;
}
.navbar-default .navbar-nav > li > a{
font-size: 14px;
font-weight: 400;
color: #fff;
outline: none;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
color: #fffde0;
background-color: transparent;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
color: #fffde0;
background-color: transparent;
}
.top-nav-collapse {
padding: 0;
border-bottom-style: solid;
border-bottom-color: #606060;
background: rgba(0,0,0, 1);
}
.bg-color{
background-color: RGBA(0, 0, 0, 0.2);
height: 100vh;
}
.navbar-border{
}
.banner-text{
border-left: 5px solid #BE2525;
padding: 15px 40px;
color: #fff;
margin-top: 170px;
}
.banner-text h2, .banner-text p{
font-weight: 400;
font-family: 'Questrial', sans-serif;
}
.banner-text h2 {
font-size: 50px;
}
.banner-text p {
font-size: 30px;
}
.overlay-detail{
margin: 0 auto;
}
.overlay-detail a i {
text-align: center;
position: absolute;
bottom: -140px;
font-size: 24px;
color: #fff;
width: 40px;
height: 40px;
border: 1px solid #fff;
line-height: 40px;
border-radius: 50%;
}
#about{
/* margin-bottom: -3px;*/
}
.section-padding{
padding: 60px 0px;
}
.title{
font-size: 24px;
margin-bottom: 50px;
}
.title-text{
padding: 0px 25px 0px 0px;
border-right: 5px solid #BE2525;
font-size: 24px;
}
.abt-list li{
padding: 5px 0px;
font-size: 18px;
font-weight: 400;
}
section {
background-color: #3a3a3a;
color: white;
}
.grid-padding{
padding: 0 8px;
}
.grid-padding img{
margin-bottom: 15px;
}
.padding-right-zero{
padding-right: 0px !important;
}
#myGrid{
margin-top: 50px;
}
.test-sec blockquote {
background: #eee;
display: block;
font-size: 14px;
line-height: 20px;
padding: 15px;
position: relative;
}
.test-sec blockquote::after {
content: '';
position: absolute;
bottom: -14px;
margin-left: 10px;
border-top: 14px solid #eee;
border-left: 14px solid transparent;
border-right: 14px solid transparent;
}
blockquote {
padding: 10px 20px;
margin: 0 0 20px;
font-size: 17.5px;
border-left: 5px solid RGBA(0, 0, 0, 0.18);
}
.test-sec .carousel-info span {
display: block;
}
.test-sec span.testimonials-name {
color: #62646f;
font-weight: 600;
margin: 16px 0 5px;
}
#contact {
width: 100%;
background-color: RGBA(8, 7, 7, 0.92);
}
#contact .btn-primary {
background: #BE2525;
border: 1px solid #BE2525;
}
.validation {
color: red;
display:none;
margin: 0 0 20px;
font-weight:400;
font-size:13px;
}
#sendmessage {
color: green;
border:1px solid green;
background: #fff;
display:none;
text-align:center;
padding:15px;
font-weight:600;
margin-bottom:15px;
}
#errormessage {
color: red;
display:none;
border:1px solid red;
text-align:center;
padding:15px;
font-weight:600;
margin-bottom:15px;
background: #fff;
}
#sendmessage.show, #errormessage.show, .show {
display:block;
}
footer {
padding: 40px 0;
background: #F2F3EB;
}
.footer a {
color: #BE2525;
}
.footer__navigation li, .social-list li{
display: inline-block;
}
.contact-sec h2 {
font-size: 28px;
color: #fff;
font-weight: 600;
padding: 15px 0px;
}
.footer__navigation li a
{
display: inline-block;
color: #767676;
font-weight: 600;
font-variant-ligatures: common-ligatures;
font-size: 1.2em;
line-height: 1.625em;
margin-top: 0;
margin-bottom: 1.625em;
padding-right: 10px;
}
.contact-sec p {
color: #fff;
font-size: 18px;
padding: 16px 0px 24px;
}
.contact-sec i{
padding-right: 15px;
}
.contact-sec a {
color: #FFF;
background-color: RGBA(174, 142, 142, 0.7);
display: inline-block;
padding: 16px 34px;
font-size: 18px;
transition: all 0.5s ease-in 0s;
}
.carousel-info, blockquote {
float: left;
}
.social-list li{
transition: 0.2s linear;
-webkit-transition: 0.2s linear;
-moz-transition: 0.2s linear;
opacity: .5;
display: inline-block;
margin: 0;
}
.social-list li a{
font-size: 28px;
margin-right: 15px;
}
.type-underline, .type-underline:hover{
color: #767676;
}
.footer__lower {
margin-top: 3.25em;
}
.type--fine-print{
color: #767676;
}
.navbar-toggle {
position: relative;
background-color: #fff;
border-radius: 4px;
}
.navbar-nav > li > a {
padding-top: 24px;
padding-bottom: 24px;
}
.navbar-brand{
margin-top: 9px;
}
.grid-item { width: 200px; }
.grid-item--width2 { width: 400px; }
/***********************************
************************************
Responsive media queries
************************************
***********************************/
@media (min-width: 551px) and (max-width: 980px){
.title-text{
margin-bottom: 15px;
}
}
@media (min-width: 100px) and (max-width: 550px) {
.navbar-nav > li > a {
padding-top: 15px;
padding-bottom: 15px;
}
.navbar-brand{
margin-top: 0px;
}
.carousel-info {
margin-bottom: 30px;
}
.type--fine-print{
text-align: center;
}
.text-center-xs{
text-align: center !important;
}
.social-list{
margin-bottom: 15px;
}
.banner-text h2, .banner-text p {
font-size: 30px;
}
.title-text{
margin-bottom: 15px;
}
}

BIN
_archive/5.5/fonts/FontAwesome.otf

BIN
_archive/5.5/fonts/fontawesome-webfont.eot

2671
_archive/5.5/fonts/fontawesome-webfont.svg
File diff suppressed because it is too large
View File

BIN
_archive/5.5/fonts/fontawesome-webfont.ttf

BIN
_archive/5.5/fonts/fontawesome-webfont.woff

BIN
_archive/5.5/fonts/fontawesome-webfont.woff2

0
img/about-banner.jpg → _archive/5.5/img/about-banner.jpg

Before

Width: 1600  |  Height: 450  |  Size: 15 KiB

After

Width: 1600  |  Height: 450  |  Size: 15 KiB

0
img/e-b.png → _archive/5.5/img/e-b.png

Before

Width: 128  |  Height: 128  |  Size: 2.2 KiB

After

Width: 128  |  Height: 128  |  Size: 2.2 KiB

0
img/e-longform.png → _archive/5.5/img/e-longform.png

Before

Width: 750  |  Height: 250  |  Size: 12 KiB

After

Width: 750  |  Height: 250  |  Size: 12 KiB

BIN
_archive/5.5/img/e-w.png

After

Width: 256  |  Height: 256  |  Size: 4.2 KiB

BIN
_archive/5.5/img/network.jpg

After

Width: 1920  |  Height: 1200  |  Size: 190 KiB

0
img/port01.jpg → _archive/5.5/img/port01.jpg

Before

Width: 1080  |  Height: 720  |  Size: 198 KiB

After

Width: 1080  |  Height: 720  |  Size: 198 KiB

0
img/port02.jpg → _archive/5.5/img/port02.jpg

Before

Width: 1080  |  Height: 720  |  Size: 166 KiB

After

Width: 1080  |  Height: 720  |  Size: 166 KiB

0
img/port03.jpg → _archive/5.5/img/port03.jpg

Before

Width: 1080  |  Height: 720  |  Size: 225 KiB

After

Width: 1080  |  Height: 720  |  Size: 225 KiB

0
img/portfolio01.jpg → _archive/5.5/img/portfolio01.jpg

Before

Width: 500  |  Height: 850  |  Size: 49 KiB

After

Width: 500  |  Height: 850  |  Size: 49 KiB

0
img/portfolio02.jpg → _archive/5.5/img/portfolio02.jpg

Before

Width: 1100  |  Height: 500  |  Size: 26 KiB

After

Width: 1100  |  Height: 500  |  Size: 26 KiB

274
_archive/5.5/index.html

@ -0,0 +1,274 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="author" content="enpaul@enpaul.net"/>
<meta name="description" content="E N Paul personal landing page and Network Services website"/>
<meta name="keywords" content="enpaul, network, operations, networking, plex, media, server, adds, active, directory, wpi, worcester, polytechnic, institute, boston, mechanical, engineering, solidworks, home, lab, homelab, solid, works, autocad, cad, domain, windows, server"/>
<meta name="robots" content="index,follow"/>
<meta property="og:title" content="E.N. Paul"/>
<meta property='og:locale' content="en_US"/>
<meta property='og:description' content="E N Paul personal landing page and Network Services website"/>
<meta property="og:type" content="Website"/>
<meta property='og:site_name' content="E.N. Paul"/>
<meta property="og:url" content="https://enpaul.net/"/>
<title>E.N. Paul</title>
<link rel="shortcut icon" href="img\e-b.png">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Fira+Sans|Roboto:300,400|Questrial|Satisfy">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/hexagons.min.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<!--<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60" onload="myFunction()">-->
<body data-spy="scroll" data-target=".navbar" data-offset="60">
<!-- Header section -->
<div class="header">
<div class="bg-color">
<!-- Navigation bar and top-left icon section -->
<header id="main-header">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#lauraMenu">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><p><img src="img/e-w.png" style="max-width: 3rem;">&nbsp;E.N. Paul</p></a>
</div>
<div class="collapse navbar-collapse" id="lauraMenu">
<ul class="nav navbar-nav navbar-right navbar-border">
<li class="active"><a href="#main-header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#network">Network</a></li>
<!--<li><a href="#testimonial">Testimonial</a></li>-->
</ul>
</div>
</div>
</nav>
</header>
<!-- Main panel -->
<div class="wrapper">
<div class="container">
<div class="row">
<div class="col-md-12 wow fadeIn delay-05s">
<div class="banner-text">
<h2>Ethan N. Paul</h2>
<p><i>Student, tinkerer, programmer, aspiring engineer</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<section id="about" class="section-padding wow fadeIn delay-05s">
<div class="container">
<div class="row">
<div class="col-md-6 text-right">
<h2 class="title-text">
About me...
</h2>
</div>
<div class="col-md-6 text-left">
<div class="about-text">
<p>Hello! My name is Ethan Paul, and this is my website! I am a student at Worcester Polytechnic Institute, a part-time employee at WPI Network Operations, and a full-time tinkerer.</p>
<p>&nbsp;</p>
<p>My interests are varried and constantly changing, but pretty consistently you can find me designing in SolidWorks, programming in Python, or crawling underneath the rust bucket I call a car! <a href="/about">Want to know more?</a></p>
<p>&nbsp;</p>
<ul class="list-inline">
<li>
<a href="mailto:enpaul@enpaul.net"><span class="hb hb-sm"><i class="fa fa-envelope-o"></i></span></a>
</li>
<li>
<a target="_blank" href="https://twitter.com/theenpaul"><span class="hb hb-sm"><i class="fa fa-twitter"></i></span></a>
</li>
<li>
<a target="_blank" href="https://plus.google.com/+EthanPaul42"><span class="hb hb-sm"><i class="fa fa-google-plus"></i></span></a>
</li>
<li>
<a target="_blank" href="https://www.linkedin.com/in/enpaul"><span class="hb hb-sm"><i class="fa fa-linkedin"></i></span></a>
</li>
<li>
<a target="_blank" href="https://www.instagram.com/theenpaul/"><span class="hb hb-sm"><i class="fa fa-instagram"></i></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section id="network" class="section-padding wow fadeInUp delay-05s">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2 class="title text-center">The Network</h2>
</div>
<div class="col-md-12">
<div id="myGrid" class="grid-padding">
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
</div>
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/port03.jpg" class="img-responsive">
</div>
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port03.jpg" class="img-responsive">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
</div>
</div>
</div>
</div>
</div>
</section>
<!--<section id="testimonial" class="section-padding wow fadeInUp">
<div class="container">
<div class="row">
<h2 class="title text-center">See What Our <span class="deco">Client</span> Are Saying ?</h2>
<div class="test-sec">
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="contact" class="section-padding wow fadeIn delay-05s">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="contact-sec text-center">
<h2>Want To <span class="deco">Hire</span> Me?</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
</div>
</div>
<div class="col-md-8 col-md-push-2">
<div id="sendmessage">Your message has been sent. Thank you!</div>
<div id="errormessage"></div>
<form action="" method="post" role="form" class="contactForm">
<div class="form-group">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validation"></div>
</div>
<div class="form-group">
<textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
<div class="validation"></div>
</div>
<div class="text-center"><button type="submit" class="btn btn-primary btn-lg">Send Message</button></div>
</form>
</div>
</div>
</div>
</section> -->
<footer class="footer-2 text-center-xs bg--white">
<div class="container">
<!--end row-->
<div class="row">
<div class="col-md-6">
<div class="footer">
© Copyright Laura Theme. All Rights Reserved
<div class="credits">
<!--
All the links in the footer should remain intact.
You can delete the links only if you purchased the pro version.
Licensing information: https://bootstrapmade.com/license/
Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/buy/?theme=Laura
-->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade.com</a>
</div>
</div>
</div>
<div class="col-md-6 text-right">
<ul class="social-list">
<li>
<a href="#"><i class="fa fa-twitter"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-dribbble"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-vimeo"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-instagram"></i></a>
</li>
</ul>
</div>
</div>
<!--end row-->
</div>
</footer>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.bxslider.min.js"></script>
<script src="js/wow.js"></script>
<script src="js/custom.js"></script>
<script src="contactform/contactform.js"></script>
</body>
</html>

7
_archive/5.5/js/bootstrap.min.js
File diff suppressed because it is too large
View File

51
_archive/5.5/js/custom.js

@ -0,0 +1,51 @@
(function ($) {
// Init Wow
wow = new WOW( {
animateClass: 'animated',
offset: 100
});
wow.init();
// Navigation scrolls
$('.navbar-nav li a').bind('click', function(event) {
$('.navbar-nav li').removeClass('active');
$(this).closest('li').addClass('active');
var $anchor = $(this);
var nav = $($anchor.attr('href'));
if (nav.length) {
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500, 'easeInOutExpo');
event.preventDefault();
}
});
// About section scroll
$(".overlay-detail a").on('click', function(event) {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 900, function(){
window.location.hash = hash;
});
});
//jQuery to collapse the navbar on scroll
$(window).scroll(function() {
if ($(".navbar-default").offset().top > 50) {
$(".navbar-fixed-top").addClass("top-nav-collapse");
} else {
$(".navbar-fixed-top").removeClass("top-nav-collapse");
}
});
// Testimonials Slider
$('.bxslider').bxSlider({
adaptiveHeight: true,
mode: 'fade'
});
})(jQuery);

0
js/jquery.easing.min.js → _archive/5.5/js/jquery.easing.min.js

5
_archive/5.5/js/jquery.min.js
File diff suppressed because it is too large
View File

0
js/wow.js → _archive/5.5/js/wow.js

11
css/animate.min.css
File diff suppressed because it is too large
View File

1
css/scss-files.txt

@ -0,0 +1 @@
The scss source files are available in the pro version.

1213
css/style.css
File diff suppressed because it is too large
View File

BIN
img/about-img.jpg

After

Width: 800  |  Height: 533  |  Size: 97 KiB

BIN
img/bw.jpg

After

Width: 1920  |  Height: 1080  |  Size: 118 KiB

BIN
img/circuit.jpg

After

Width: 1680  |  Height: 1050  |  Size: 1.0 MiB

BIN
img/client-1.jpg

After

Width: 400  |  Height: 400  |  Size: 39 KiB

BIN
img/client-2.jpg

After

Width: 400  |  Height: 400  |  Size: 56 KiB

BIN
img/hero-bg.jpg

After

Width: 1920  |  Height: 1280  |  Size: 840 KiB

BIN
img/logo.png

After

Width: 348  |  Height: 112  |  Size: 3.9 KiB

BIN
img/portfolio-1.jpg

After

Width: 350  |  Height: 260  |  Size: 12 KiB

BIN
img/portfolio-2.jpg

After

Width: 350  |  Height: 260  |  Size: 54 KiB

BIN
img/portfolio-3.jpg

After

Width: 350  |  Height: 260  |  Size: 38 KiB

BIN
img/portfolio-4.jpg

After

Width: 350  |  Height: 260  |  Size: 50 KiB

BIN
img/portfolio-5.jpg

After

Width: 350  |  Height: 260  |  Size: 49 KiB

BIN
img/portfolio-6.jpg

After

Width: 350  |  Height: 260  |  Size: 33 KiB

BIN
img/portfolio-7.jpg

After

Width: 350  |  Height: 260  |  Size: 43 KiB

BIN
img/portfolio-8.jpg

After

Width: 350  |  Height: 260  |  Size: 46 KiB

1
img/preloader.svg

@ -0,0 +1 @@
<?xml version="1.0" encoding="utf-8"?><svg width='80px' height='80px' xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-ripple"><rect x="0" y="0" width="100" height="100" fill="none" class="bk"></rect><g> <animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#ebebeb" fill="none" stroke-width="3" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g><g><animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#03C4EB" fill="none" stroke-width="3" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g></svg>

BIN
img/quote_sign_left.png

After

Width: 37  |  Height: 29  |  Size: 1.3 KiB

BIN
img/quote_sign_right.png

After

Width: 37  |  Height: 29  |  Size: 1.3 KiB

BIN
img/services-bg.jpg

After

Width: 1920  |  Height: 1280  |  Size: 339 KiB

BIN
img/subscribe-bg.jpg

After

Width: 1920  |  Height: 726  |  Size: 412 KiB

BIN
img/team-1.jpg

After

Width: 400  |  Height: 400  |  Size: 67 KiB

BIN
img/team-2.jpg

After

Width: 400  |  Height: 400  |  Size: 48 KiB

BIN
img/team-3.jpg

After

Width: 400  |  Height: 400  |  Size: 66 KiB

BIN
img/team-4.jpg

After

Width: 400  |  Height: 400  |  Size: 46 KiB

758
index.html

@ -1,271 +1,487 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="author" content="enpaul@enpaul.net"/>
<meta name="description" content="E N Paul personal landing page and Network Services website"/>
<meta name="keywords" content="enpaul, network, operations, networking, plex, media, server, adds, active, directory, wpi, worcester, polytechnic, institute, boston, mechanical, engineering, solidworks, home, lab, homelab, solid, works, autocad, cad, domain, windows, server"/>
<meta name="robots" content="index,follow"/>
<meta property="og:title" content="E.N. Paul"/>
<meta property='og:locale' content="en_US"/>
<meta property='og:description' content="E N Paul personal landing page and Network Services website"/>
<meta property="og:type" content="Website"/>
<meta property='og:site_name' content="E.N. Paul"/>
<meta property="og:url" content="https://enpaul.net/"/>
<title>E.N. Paul</title>
<link rel="shortcut icon" href="img\e-b.png">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Fira+Sans|Roboto:300,400|Questrial|Satisfy">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/hexagons.min.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<!--<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60" onload="myFunction()">-->
<body data-spy="scroll" data-target=".navbar" data-offset="60">
<!-- Header section -->
<div class="header">
<div class="bg-color">
<!-- Navigation bar and top-left icon section -->
<header id="main-header">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#lauraMenu">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><p><img src="img/e-w.png" style="max-width: 3rem;">&nbsp;E.N. Paul</p></a>
</div>
<div class="collapse navbar-collapse" id="lauraMenu">
<ul class="nav navbar-nav navbar-right navbar-border">
<li class="active"><a href="#main-header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#network">Network</a></li>
<!--<li><a href="#testimonial">Testimonial</a></li>-->
</ul>
</div>
</div>
</nav>
</header>
<!-- Main panel -->
<div class="wrapper">
<div class="container">
<div class="row">
<div class="col-md-12 wow fadeIn delay-05s">
<div class="banner-text">
<h2>Ethan N. Paul</h2>
<p><i>Student, tinkerer, programmer, aspiring engineer</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<section id="about" class="section-padding wow fadeIn delay-05s">
<div class="container">
<div class="row">
<div class="col-md-6 text-right">
<h2 class="title-text">
About me...
</h2>
</div>
<div class="col-md-6 text-left">
<div class="about-text">
<p>Hello! My name is Ethan Paul, and this is my website! I am a student at Worcester Polytechnic Institute, a part-time employee at WPI Network Operations, and a full-time tinkerer.</p>
<p>&nbsp;</p>
<p>My interests are varried and constantly chaning, but pretty consistently you can find me designing in SolidWorks, programming in Python, or crawling underneath the rust bucket I call a car! Want to know more? <a href="https://download.enpaul.net/enpaul-resume.pdf" target="_blank">Download my resume!</a></p>
<p>&nbsp;</p>
<ul class="list-inline">
<li>
<a href="mailto:enpaul@enpaul.net"><span class="hb hb-sm"><i class="fa fa-envelope-o"></i></span></a>
</li>
<li>
<a target="_blank" href="https://twitter.com/theenpaul"><span class="hb hb-sm"><i class="fa fa-twitter"></i></span></a>
</li>
<li>
<a target="_blank" href="https://plus.google.com/+EthanPaul42"><span class="hb hb-sm"><i class="fa fa-google-plus"></i></span></a>
</li>
<li>
<a target="_blank" href="https://www.linkedin.com/in/enpaul"><span class="hb hb-sm"><i class="fa fa-linkedin"></i></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section id="network" class="section-padding wow fadeInUp delay-05s">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2 class="title text-center">Let's <span class="deco">See</span> My Work</h2>
</div>
<div class="col-md-12">
<div id="myGrid" class="grid-padding">
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
</div>
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/port03.jpg" class="img-responsive">
</div>
<div class="col-md-4 col-sm-4 padding-right-zero">
<img src="img/port01.jpg" class="img-responsive">
<img src="img/portfolio01.jpg" class="img-responsive">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port03.jpg" class="img-responsive">
<img src="img/portfolio02.jpg" class="img-responsive">
<img src="img/port02.jpg" class="img-responsive">
</div>
</div>
</div>
</div>
</div>
</section>
<!--<section id="testimonial" class="section-padding wow fadeInUp">
<div class="container">
<div class="row">
<h2 class="title text-center">See What Our <span class="deco">Client</span> Are Saying ?</h2>
<div class="test-sec">
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
<div class="col-sm-4">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed dapibus leo nec ornare diamsed commodo nibh ante facilisis bibendum dolor feugiat at. </p>
</blockquote>
<div class="carousel-info">
<div class="pull-left"> <span class="testimonials-name">John Doe</span> <span class="testimonials-post">CEO, Company Inc.</span> </div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="contact" class="section-padding wow fadeIn delay-05s">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="contact-sec text-center">
<h2>Want To <span class="deco">Hire</span> Me?</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
</div>
</div>
<div class="col-md-8 col-md-push-2">
<div id="sendmessage">Your message has been sent. Thank you!</div>
<div id="errormessage"></div>
<form action="" method="post" role="form" class="contactForm">
<div class="form-group">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validation"></div>
</div>
<div class="form-group">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validation"></div>
</div>
<div class="form-group">
<textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
<div class="validation"></div>
</div>
<div class="text-center"><button type="submit" class="btn btn-primary btn-lg">Send Message</button></div>
</form>
</div>
</div>
</div>
</section> -->
<footer class="footer-2 text-center-xs bg--white">
<div class="container">
<!--end row-->
<div class="row">
<div class="col-md-6">
<div class="footer">
© Copyright Laura Theme. All Rights Reserved
<div class="credits">
<!--
All the links in the footer should remain intact.
You can delete the links only if you purchased the pro version.
Licensing information: https://bootstrapmade.com/license/
Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/buy/?theme=Laura
-->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade.com</a>
</div>
</div>
</div>
<div class="col-md-6 text-right">
<ul class="social-list">
<li>
<a href="#"><i class="fa fa-twitter"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-dribbble"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-vimeo"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-instagram"></i></a>
</li>
</ul>
</div>
</div>
<!--end row-->
</div>
</footer>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.bxslider.min.js"></script>
<script src="js/wow.js"></script>
<script src="js/custom.js"></script>
<script src="contactform/contactform.js"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Web crawler and search indexing meta -->
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="author" content="enpaul@enpaul.net"/>
<meta name="description" content="E N Paul personal landing page and Network Services website"/>
<meta name="keywords" content="enpaul, network, operations, networking, plex, media, server, adds, active, directory, wpi, worcester, polytechnic, institute, boston, mechanical, engineering, solidworks, home, lab, homelab, solid, works, autocad, cad, domain, windows, server"/>
<meta name="robots" content="index,follow"/>
<!-- Facebook integration meta -->
<meta property="og:title" content="E.N. Paul"/>
<meta property='og:locale' content="en_US"/>
<meta property='og:description' content="E N Paul personal landing page and Network Services website"/>
<meta property="og:type" content="Website"/>
<meta property='og:site_name' content="E.N. Paul"/>
<meta property="og:url" content="https://enpaul.net/"/>
<!-- Twitter integration meta -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="">
<meta name="twitter:title" content="E.N. Paul">
<meta name="twitter:description" content="">
<meta name="twitter:image" content="">
<!-- Page title and favicon definition -->
<title>E.N. Paul</title>
<link rel="shortcut icon" href="img\e-b.png">
<!-- Google Fonts loader -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i|Raleway:300,400,500,700,800" rel="stylesheet">
<!-- CSS references -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
<link href="css/animate.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- JavaScript references -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/superfish.hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/morphext.min.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/sticky.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/custom.js"></script>
</head>
<body>
<div id="preloader"></div>
<section id="hero">
<div class="hero-container">
<div class="wow fadeIn">
<div class="hero-logo">
<img class="" src="img/e-w.png" alt="E. N. Paul">
</div>
<h1>Ethan N. Paul</h1>
<h2>I am an engineering <span class="rotating">student, tinkerer, programmer, designer</span></h2>
<div class="actions">
<a href="#about" class="btn-get-started">About Me</a>
<a href="#network" class="btn-services">Network Services</a>
</div>
</div>
</div>
</section>
<header id="header">
<div class="container">
<div id="logo" class="pull-left">
<a href="#hero"><img src="img/e-w.png" alt="ENPaul" title="" /></img></a>
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li class="menu-active"><a href="#hero">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="menu-has-children"><a href="#network">Network</a>
<ul>
<li><a href="https://gitlab.enpaul.net/">GitLab</a></li>
<li><a href="https://storage.enpaul.net/">Web Storage</a></li>
<li><a href="https://plex.enpaul.net/">Plex Media Server</a></li>
<li><a href="https://docs.enpaul.net/vpn/overview/">VPN</a></li>
</ul>
</li>
<li><a target="_blank" href="https://docs.enpaul.net/">Docs</a></li>
</ul>
</nav>
</div>
</header>
<section id="about">
<div class="container wow fadeInUp">
<div class="row">
<div class="col-md-12">
<h3 class="section-title">About Me</h3>
<div class="section-title-divider"></div>
<p class="section-description">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam</p>
</div>
</div>
</div>
<div class="container about-container wow fadeInUp">
<div class="row">
<div class="col-md-6 col-md-push-6 about-content">
<h2 class="about-title">We provide great services and ideass</h2>
<p class="about-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate
</p>
<p class="about-text">
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
id est laborum
</p>
<p class="about-text">
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim
id est laborum
</p>
</div>
</div>
</div>
</section>
<section id="network">
<div class="container wow fadeInUp">
<div class="row">
<div class="col-md-12">
<h3 class="section-title">Network Services</h3>
<div class="section-title-divider"></div>
<p class="section-description">The ENPaul Network provides a number of services for entertainment, reference, security, and productivity.<br>To Learn more about the network as a whole, please <a href="https://docs.enpaul.net/">read the docs</a>.</p>
</div>
</div>
<div class="row">
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-desktop"></i></div>
<h4 class="service-title"><a href="">Active Directory Domain</a></h4>
<p class="service-description">Voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident</p>
</div>
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-bar-chart"></i></div>
<h4 class="service-title"><a href="">VPN</a></h4>
<p class="service-description">Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat tarad limino ata</p>
</div>
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-paper-plane"></i></div>
<h4 class="service-title"><a href="">GitLab</a></h4>
<p class="service-description">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-photo"></i></div>
<h4 class="service-title"><a href="">Plex Media Server</a></h4>
<p class="service-description">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
</div>
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-road"></i></div>
<h4 class="service-title"><a href="">Cloud Storage</a></h4>
<p class="service-description">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque</p>
</div>
<div class="col-md-4 service-item">
<div class="service-icon"><i class="fa fa-shopping-bag"></i></div>
<h4 class="service-title"><a href="">Documentation</a></h4>
<p class="service-description">Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi</p>
</div>
</div>
</div>
</section>
<section id="status">
<div class="container wow fadeInUp">
<div class="row">
<div class="col-md-8">
<h3 class="status-title">Service Status</h3>
<p class="status-text">Having trouble accessing a network service? Check the status online and let me know if there are problems!</p>
</div>
<div class="col-md-4 status-btn-container">
<a class="disabled status-btn" href="#">Coming Soon!</a>
</div>
</div>
</div>
</section>
<!--==========================
Porfolio Section
============================
<section id="portfolio">
<div class="container wow fadeInUp">
<div class="row">
<div class="col-md-12">
<h3 class="section-title">Portfolio</h3>
<div class="section-title-divider"></div>
<p class="section-description">Si stante, hoc natura videlicet vult, salvam esse se, quod concedimus ses haec dicturum fuisse</p>
</div>
</div>
<div class="row">
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-1.jpg);" href="">
<div class="details">
<h4>Portfolio 1</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-2.jpg);" href="">
<div class="details">
<h4>Portfolio 2</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-3.jpg);" href="">
<div class="details">
<h4>Portfolio 3</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-4.jpg);" href="">
<div class="details">
<h4>Portfolio 4</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-5.jpg);" href="">
<div class="details">
<h4>Portfolio 5</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-6.jpg);" href="">
<div class="details">
<h4>Portfolio 6</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-7.jpg);" href="">
<div class="details">
<h4>Portfolio 7</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
<div class="col-md-3">
<a class="portfolio-item" style="background-image: url(img/portfolio-8.jpg);" href="">
<div class="details">
<h4>Portfolio 8</h4>
<span>Alored dono par</span>
</div>
</a>
</div>
</div>
</div>
</section>-->
<!--==========================
Testimonials Section
============================
<section id="testimonials">
<div class="container wow fadeInUp">
<div class="row">
<div class="col-md-12">
<h3 class="section-title">Testimonials</h3>
<div class="section-title-divider"></div>
<p class="section-description">Erdo lide, nora porodo filece, salvam esse se, quod concedimus ses haec dicturum fuisse</p>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="profile">
<div class="pic"><img src="img/client-1.jpg" alt=""></div>
<h4>Saul Goodman</h4>
<span>Lawless Inc</span>
</div>
</div>
<div class="col-md-9">
<div class="quote">
<b><img src="img/quote_sign_left.png" alt=""></b> Proin iaculis purus consequat sem cure digni ssim donec porttitora entum suscipit rhoncus. Accusantium quam, ultricies eget id, aliquam eget nibh et. Maecen aliquam, risus at semper. <small><img src="img/quote_sign_right.png" alt=""></small>