diff --git a/css/style.css b/css/style.css index 2728b48..b4076f2 100644 --- a/css/style.css +++ b/css/style.css @@ -8,7 +8,7 @@ # General --------------------------------------------------------------*/ body { - background: #fff; + background: #000; color: #999; font-family: "Open Sans", sans-serif; } @@ -45,7 +45,7 @@ h1, h2, h3, h4, h5, h6 { width: 100%; height: 100%; overflow: visible; - background: #fff url("../img/preloader.svg") no-repeat center center; + background: #000 url("../img/preloader.svg") no-repeat center center; } /* Back to top button */ @@ -98,7 +98,7 @@ h1, h2, h3, h4, h5, h6 { max-width: 100%; } -#top .hero-container { +#top .top-container { background: rgba(0, 0, 0, 0.3); display: table-cell; margin: 0; @@ -182,8 +182,8 @@ h1, h2, h3, h4, h5, h6 { --------------------------------------------------------------*/ #header { background: black; - padding: 5px 0; - height: 60px; + padding: 15px 0; + height: 80px; } #header #logo { @@ -497,6 +497,12 @@ body.mobile-nav-active #mobile-nav-toggle { margin-bottom: 0; } +#about .about-portrait { + display: block; + margin: auto; + max-height: 30rem; +} + /* Network Section --------------------------------*/ #network { @@ -511,15 +517,15 @@ body.mobile-nav-active #mobile-nav-toggle { #network .service-icon { float: left; - background: transparent; + background-color: #fff; padding: 16px; border-radius: 50%; transition: 0.5s; - border: 1px solid white; + border: 1px solid black; } #network .service-icon i { - color: #fff; + color: #000; font-size: 24px; } @@ -821,3 +827,60 @@ body.mobile-nav-active #mobile-nav-toggle { color: white; background-color: #1a82d8; } + +/*-------------------------------------------------------------- +# Custom hexagon buttons +--------------------------------------------------------------*/ +.hb-instagram, .hb-instagram:after, .hb-instagram:before { + background:#8a3ab9; + border-color:#8a3ab9; + color:#fff +} + +.hb-instagram-inv, .hb-instagram-inv:after, .hb-instagram-inv:before, .hb-instagram:hover, .hb-instagram:hover:after, .hb-instagram:hover:before { + background:0 0; + border-color:#8a3ab9; + color:#8a3ab9 +} + +.hb-instagram-inv:hover, .hb-instagram-inv:hover:after, .hb-instagram-inv:hover:before { + background:#8a3ab9; + border-color:#8a3ab9; + color:#fff; +} + +.hb-email, .hb-email:after, .hb-email:before { + background:#0c514e; + border-color:#0c514e; + color:#fff; +} + +.hb-email-inv, .hb-email-inv:after, .hb-email-inv:before, .hb-email:hover, .hb-email:hover:after, .hb-email:hover:before { + background:0 0; + border-color:#0c514e; + color:#0c514e; +} + +.hb-email-inv:hover, .hb-email-inv:hover:after, .hb-email-inv:hover:before { + background:#0c514e; + border-color:#0c514e; + color:#fff +} + +.hb-resume, .hb-resume:after, .hb-resume:before { + background:#500b25; + border-color:#500b25; + color:#fff; +} + +.hb-resume-inv, .hb-resume-inv:after, .hb-resume-inv:before, .hb-resume:hover, .hb-resume:hover:after, .hb-resume:hover:before { + background:0 0; + border-color:#500b25; + color:#500b25; +} + +.hb-resume-inv:hover, .hb-resume-inv:hover:after, .hb-resume-inv:hover:before { + background:#500b25; + border-color:#500b25; + color:#fff; +} diff --git a/index.html b/index.html index b0ed382..3b7f637 100644 --- a/index.html +++ b/index.html @@ -28,7 +28,7 @@ E.N. Paul - + @@ -49,7 +49,7 @@ - + @@ -58,14 +58,14 @@
-
+

Ethan N. Paul

-

I am an engineering student, tinkerer, programmer, designer

+

Engineer, programmer, and tinkerer, student, designer, mechanic, handyman, hiker, traveler, kayaker, swimmer

About Contact @@ -101,33 +101,20 @@
-
+

About Me

-

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam

-
+
-

adfasdfWe provide great services and ideass

-

- 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 -

-

- 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 -

-

- 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 -

+ Ethan N. Paul
-
+

We provide great services and ideass

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 @@ -147,19 +134,19 @@

-
+

Contact Me

Send me an email at enpaul@enpaul.net or feel free to download my résumé.

    - -
    • -
    • -
    • - -
    • +
    • +
    • +
    • +
    • +
    • +
@@ -167,7 +154,7 @@
-
+

Network Services

@@ -235,7 +222,7 @@
-
+

Service Status

diff --git a/js/custom.js b/js/custom.js index 8563559..cdc8e44 100644 --- a/js/custom.js +++ b/js/custom.js @@ -1,26 +1,28 @@ jQuery(document).ready(function( $ ) { + //alert("You're the 1000th visitor!!!!"); + // Preloader $(window).on('load', function() { $('#preloader').delay(100).fadeOut('slow',function(){$(this).remove();}); }); // Hero rotating texts - $("#hero .rotating").Morphext({ + $("#top .rotating").Morphext({ animation: "flipInX", separator: ",", speed: 3000 }); - + // Initiate the wowjs new WOW().init(); - + // Initiate superfish on nav menu $('.nav-menu').superfish({ animation: {opacity:'show'}, speed: 400 }); - + // Mobile Navigation if( $('#nav-menu-container').length ) { var $mobile_nav = $('#nav-menu-container').clone().prop({ id: 'mobile-nav'}); @@ -29,19 +31,19 @@ jQuery(document).ready(function( $ ) { $('body').prepend( '' ); $('body').append( '
' ); $('#mobile-nav').find('.menu-has-children').prepend(''); - + $(document).on('click', '.menu-has-children i', function(e){ $(this).next().toggleClass('menu-item-active'); $(this).nextAll('ul').eq(0).slideToggle(); $(this).toggleClass("fa-chevron-up fa-chevron-down"); }); - + $(document).on('click', '#mobile-nav-toggle', function(e){ $('body').toggleClass('mobile-nav-active'); $('#mobile-nav-toggle i').toggleClass('fa-times fa-bars'); $('#mobile-body-overly').toggle(); }); - + $(document).click(function (e) { var container = $("#mobile-nav, #mobile-nav-toggle"); if (!container.is(e.target) && container.has(e.target).length === 0) { @@ -55,7 +57,7 @@ jQuery(document).ready(function( $ ) { } else if ( $("#mobile-nav, #mobile-nav-toggle").length ) { $("#mobile-nav, #mobile-nav-toggle").hide(); } - + // Stick the header at top on scroll $("#header").sticky({topSpacing:0, zIndex: '50'}); @@ -64,13 +66,13 @@ jQuery(document).ready(function( $ ) { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { var target = $(this.hash); if (target.length) { - + var top_space = 0; - + if( $('#header').length ) { top_space = $('#header').outerHeight(); } - + $('html, body').animate({ scrollTop: target.offset().top - top_space }, 1500, 'easeInOutExpo'); @@ -85,12 +87,12 @@ jQuery(document).ready(function( $ ) { $('#mobile-nav-toggle i').toggleClass('fa-times fa-bars'); $('#mobile-body-overly').fadeOut(); } - + return false; } } }); - + // Back to top button $(window).scroll(function() { @@ -99,12 +101,12 @@ jQuery(document).ready(function( $ ) { } else { $('.back-to-top').fadeOut('slow'); } - + }); - + $('.back-to-top').click(function(){ $('html, body').animate({scrollTop : 0},1500, 'easeInOutExpo'); return false; }); -}); \ No newline at end of file +});