Added hexagon and contact section, started darkening
This commit is contained in:
Ethan N. Paul
parent
8a371f0902
commit
7f497713c9
File diff suppressed because one or more lines are too long
|
|
@ -181,9 +181,9 @@ h1, h2, h3, h4, h5, h6 {
|
|||
# Header
|
||||
--------------------------------------------------------------*/
|
||||
#header {
|
||||
background: #111;
|
||||
padding: 20px 0;
|
||||
height: 90px;
|
||||
background: black;
|
||||
padding: 5px 0;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
#header #logo {
|
||||
|
|
@ -224,7 +224,7 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
|
||||
.is-sticky #header {
|
||||
background: rgba(0, 0, 0, 0.85);
|
||||
background: black;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
@ -457,7 +457,7 @@ body.mobile-nav-active #mobile-nav-toggle {
|
|||
--------------------------------*/
|
||||
.section-title {
|
||||
font-size: 32px;
|
||||
color: #111;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
font-weight: 700;
|
||||
|
|
@ -479,7 +479,7 @@ body.mobile-nav-active #mobile-nav-toggle {
|
|||
/* Get Started Section
|
||||
--------------------------------*/
|
||||
#about {
|
||||
background: #fff;
|
||||
background-color: #111;
|
||||
padding: 80px 0;
|
||||
}
|
||||
|
||||
|
|
@ -505,12 +505,12 @@ body.mobile-nav-active #mobile-nav-toggle {
|
|||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Services Section
|
||||
/* Network Section
|
||||
--------------------------------*/
|
||||
#network {
|
||||
background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url("../img/circuit.jpg") fixed center center;
|
||||
background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("../img/circuit.jpg") fixed center center;
|
||||
background-size: cover;
|
||||
padding: 80px 0 60px 0;
|
||||
padding: 60px 0 40px 0;
|
||||
}
|
||||
|
||||
#network .service-item {
|
||||
|
|
@ -785,72 +785,9 @@ body.mobile-nav-active #mobile-nav-toggle {
|
|||
/* Contact Section
|
||||
--------------------------------*/
|
||||
#contact {
|
||||
background: #f7f7f7;
|
||||
padding: 80px 0;
|
||||
}
|
||||
|
||||
#contact .info {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
#contact .info i {
|
||||
font-size: 32px;
|
||||
color: #03C4EB;
|
||||
float: left;
|
||||
}
|
||||
|
||||
#contact .info p {
|
||||
padding: 0 0 10px 50px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
#contact .form #sendmessage {
|
||||
color: #03C4EB;
|
||||
border: 1px solid #03C4EB;
|
||||
display: none;
|
||||
background: #111;
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
#contact .form #errormessage {
|
||||
color: red;
|
||||
display: none;
|
||||
border: 1px solid red;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
#contact .form #sendmessage.show, #contact .form #errormessage.show, #contact .form .show {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#contact .form .validation {
|
||||
color: red;
|
||||
display: none;
|
||||
margin: 0 0 20px;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#contact .form input, #contact .form textarea {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#contact .form button[type="submit"] {
|
||||
background: #03C4EB;
|
||||
border: 0;
|
||||
padding: 10px 24px;
|
||||
color: #fff;
|
||||
transition: 0.4s;
|
||||
}
|
||||
|
||||
#contact .form button[type="submit"]:hover {
|
||||
background: #25d8fc;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
|
|
|
|||
48
index.html
48
index.html
|
|
@ -37,18 +37,20 @@
|
|||
<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/hexagons.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>
|
||||
<script type="text/javascript" src="js/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" src="js/superfish.hoverIntent.js"></script>
|
||||
<script type="text/javascript" src="js/superfish.min.js"></script>
|
||||
<script type="text/javascript" src="js/morphext.min.js"></script>
|
||||
<script type="text/javascript" src="js/wow.min.js"></script>
|
||||
<script type="text/javascript" src="js/sticky.js"></script>
|
||||
<script type="text/javascript" src="js/easing.min.js"></script>
|
||||
<script type="text/javascript" src="js/hexagons.min.js"></script>
|
||||
<script type="text/javascript" src="js/custom.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
|
|
@ -130,6 +132,34 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<section id="contact">
|
||||
<div class="container wow fadeInUp">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<h3 class="section-title">Contact Me</h3>
|
||||
<div class="section-title-divider"></div>
|
||||
<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>
|
||||
</section>
|
||||
|
||||
<section id="network">
|
||||
<div class="container wow fadeInUp">
|
||||
<div class="row">
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
jQuery(function(){jQuery(".hb-lg").parent().addClass("hb-lg-margin"),jQuery(".hb-md").parent().addClass("hb-md-margin"),jQuery(".hb-sm").parent().addClass("hb-sm-margin"),jQuery(".hb-xs").parent().addClass("hb-xs-margin")}),jQuery(function(){jQuery(".hb .fa-facebook,.hb .fa-facebook-square").parent().addClass("hb-facebook"),jQuery(".hb.inv .fa-facebook,.hb.inv .fa-facebook-square").parent().addClass("hb-facebook-inv").removeClass("hb-facebook"),jQuery(".hb .fa-twitter,.hb .fa-twitter-square").parent().addClass("hb-twitter"),jQuery(".hb.inv .fa-twitter,.hb.inv .fa-twitter-square").parent().addClass("hb-twitter-inv").removeClass("hb-twitter"),jQuery(".hb .fa-google-plus,.hb .fa-google-plus-square").parent().addClass("hb-google-plus"),jQuery(".hb.inv .fa-google-plus,.hb.inv .fa-google-plus-square").parent().addClass("hb-google-plus-inv").removeClass("hb-google-plus"),jQuery(".hb .fa-youtube,.hb .fa-youtube-square, .hb .fa-youtube-play").parent().addClass("hb-youtube"),jQuery(".hb.inv .fa-youtube,.hb.inv .fa-youtube-square, .hb.inv .fa-youtube-play").parent().addClass("hb-youtube-inv").removeClass("hb-youtube"),jQuery(".hb .fa-linkedin,.hb .fa-linkedin-square").parent().addClass("hb-linkedin"),jQuery(".hb.inv .fa-linkedin,.hb.inv .fa-linkedin-square").parent().addClass("hb-linkedin-inv").removeClass("hb-linkedin"),jQuery(".hb .fa-tumblr,.hb .fa-tumblr-square").parent().addClass("hb-tumblr"),jQuery(".hb.inv .fa-tumblr,.hb.inv .fa-tumblr-square").parent().addClass("hb-tumblr-inv").removeClass("hb-tumblr"),jQuery(".hb .fa-rss,.hb .fa-rss-square").parent().addClass("hb-rss"),jQuery(".hb.inv .fa-rss,.hb.inv .fa-rss-square").parent().addClass("hb-rss-inv").removeClass("hb-rss"),jQuery(".hb .fa-pinterest,.hb .fa-pinterest-square").parent().addClass("hb-pinterest"),jQuery(".hb.inv .fa-pinterest,.hb.inv .fa-pinterest-square").parent().addClass("hb-pinterest-inv").removeClass("hb-pinterest"),jQuery(".hb .fa-vimeo-square").parent().addClass("hb-vimeo"),jQuery(".hb.inv .fa-vimeo-square").parent().addClass("hb-vimeo-inv").removeClass("hb-vimeo"),jQuery(".hb .fa-github,.hb .fa-github-square, .hb .fa-github-alt").parent().addClass("hb-github"),jQuery(".hb.inv .fa-github,.hb.inv .fa-github-square, .hb.inv .fa-github-alt").parent().addClass("hb-github-inv").removeClass("hb-github"),jQuery(".hb .fa-flickr").parent().addClass("hb-flickr"),jQuery(".hb.inv .fa-flickr").parent().addClass("hb-flickr-inv").removeClass("hb-flickr"),jQuery(".hb .fa-dropbox").parent().addClass("hb-dropbox"),jQuery(".hb.inv .fa-dropbox").parent().addClass("hb-dropbox-inv").removeClass("hb-dropbox"),jQuery(".hb .fa-xing, .hb .fa-xing-square").parent().addClass("hb-xing"),jQuery(".hb.inv .fa-xing, .hb.inv .fa-xing-square").parent().addClass("hb-xing-inv").removeClass("hb-xing"),jQuery(".hb .fa-skype").parent().addClass("hb-skype"),jQuery(".hb.inv .fa-skype").parent().addClass("hb-skype-inv").removeClass("hb-skype"),jQuery(".hb .fa-dribbble").parent().addClass("hb-dribbble"),jQuery(".hb.inv .fa-dribbble").parent().addClass("hb-dribbble-inv").removeClass("hb-dribbble"),jQuery(".hb .fa-tencent-weibo").parent().addClass("hb-tencent-weibo"),jQuery(".hb.inv .fa-tencent-weibo").parent().addClass("hb-tencent-weibo-inv").removeClass("hb-tencent-weibo"),jQuery(".hb .fa-instragram").parent().addClass("hb-instragram"),jQuery(".hb.inv .fa-instragram").parent().addClass("hb-instragram-inv").removeClass("hb-instragram")});
|
||||
Loading…
Reference in New Issue