Browse Source

loader and form

windhamdavid 9 years ago
parent
commit
9a46860463
8 changed files with 978 additions and 37 deletions
  1. 2 1
      functions.php
  2. 0 1
      gruntfile.js
  3. 20 8
      header-home.php
  4. 101 0
      index.php
  5. 33 0
      js/init.js
  6. 578 6
      js/scripts.js
  7. 2 8
      loader.php
  8. 242 13
      style.css

+ 2 - 1
functions.php

@@ -28,9 +28,10 @@ function dw_scripts() {
 	wp_deregister_script('jquery');
 	wp_enqueue_script('jquery', get_template_directory_uri() . '/js/jquery-2.1.1.min.js', array(), false, true);
 	
-	//wp_enqueue_script( 'scripts', get_template_directory_uri() . '/js/scripts.js', 'jquery', '', true );
+	wp_enqueue_script( 'scripts', get_template_directory_uri() . '/js/scripts.js', 'jquery', '', true );
 	wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', 'jquery', '', true );
 	wp_enqueue_script( 'trans', get_template_directory_uri() . '/js/smooth.js', 'jquery', '', true );
+	//wp_enqueue_script( 'valid', get_template_directory_uri() . '/js/validate.js', 'jquery', '', true );
 	wp_enqueue_script( 'init', get_template_directory_uri() . '/js/init.js', 'jquery', '', true );
 
 	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {

+ 0 - 1
gruntfile.js

@@ -50,7 +50,6 @@ module.exports = function(grunt) {
 	grunt.loadNpmTasks('grunt-contrib-jshint');
 	grunt.loadNpmTasks('grunt-contrib-uglify');
 	
-	grunt.registerTask('htmlmin', [ 'htmlmin' ]);
 	grunt.registerTask('jshint', [ 'jshint' ]);
 	grunt.registerTask('default', [ 'cssmin', 'concat', 'uglify' ]);
 

+ 20 - 8
header-home.php

@@ -9,6 +9,7 @@
 -->
 <meta charset="UTF-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="shortcut icon" href="../favicon.ico?v=2" />
 <title><?php dw_page_title();?></title>
 <?php wp_head(); ?>
 </head>
@@ -18,19 +19,30 @@
 <div class="intro">
 	<div id="big-top" class="container-full">
 		<div class="container">
-			
+			<div class="row">
+				<div class="col-lg-8 col-lg-offset-2 col-centered">
+					<div class="typed"></div>
+					<div class="screen-reader">
+						<h1>Hello,</h1>
+						<h3>Welcome to my little corner of the internet.</h3>		
+						<h4>Very nice to see you here!</h4>
+					</div>
+				</div>
+			</div>
 		</div>
 	</div>
 </div>
 <header id="header">
-	<div class="navbar navbar-fixed-top">
-		<div class="container">
-		<div class="site-title">
-			<a href="http://davidawindham.com" title="David Windham"><img class="dw" title="David Windham" src="<?php echo get_bloginfo('template_directory');?>/img/dw.png" width="17"/></a>
-			<a href="<?php echo home_url( '/' ); ?>" class="navbar-brand navbar-right" title="David A. Windham" rel="home">David A. Windham</a>			
-		</div>
+	<div id="nav">
+		<div class="navbar navbar-fixed-top">
+			<div class="container">
+				<div class="site-title">
+					<a href="http://davidawindham.com" title="David Windham"><img class="dw" title="David Windham" src="<?php echo get_bloginfo('template_directory');?>/img/dw.png" width="17"/></a>
+					<a href="<?php echo home_url( '/' ); ?>" class="navbar-brand navbar-right" title="David A. Windham" rel="home">David A. Windham</a>			
+				</div>
+			</div>
+			<a href="#" class="nav-toggle navbar-right" data-toggle="offcanvas" data-target=".navmenu" data-canvas="body"><span></span></a>
 		</div>
-		<a href="#" class="nav-toggle navbar-right" data-toggle="offcanvas" data-target=".navmenu" data-canvas="body"><span></span></a>
 	</div>
 </header>
 <nav class="navmenu navmenu-default navmenu-fixed-right offcanvas" role="navigation">

+ 101 - 0
index.php

@@ -33,5 +33,106 @@
 				<?php endwhile; ?>
 			</div>
 		</div>
+	<div>
+	<div class="container">
+		<div class="row">
+			<div class="col-md-4">
+				<h1>Some Static Content</h1>
+				<h2>Some Static Content</h2>
+				<h3>Some Static Content</h3>
+				<h4>Some Static Content</h4>
+				<h5>Some Static Content</h5>
+				<h6>Some Static Content</h6>
+			</div>
+			<div class="col-md-4">
+				<h1>Some Static Content</h1>
+				<h2>Some Static Content</h2>
+				<h3>Some Static Content</h3>
+				<h4>Some Static Content</h4>
+				<h5>Some Static Content</h5>
+				<h6>Some Static Content</h6>
+			</div>
+			<div class="col-md-4">
+				<h1>Some Static Content</h1>
+				<h2>Some Static Content</h2>
+				<h3>Some Static Content</h3>
+				<h4>Some Static Content</h4>
+				<h5>Some Static Content</h5>
+				<h6>Some Static Content</h6>
+			</div>
+		</div>
+	</div>
+	<div id="big-top" class="container-full leader dark">
+		<!-- Not sure what I'm going to have on my main page just yet maybe the card again -->
+		<div class="container">
+
+		</div>
+	</div>
+	<div class="container">
+		<div class="row">
+			<div class="col-md-6">
+
+			</div>
+			<div class="col-md-6">
+				<h1>Some Static Content</h1>
+				<h2>Some Static Content</h2>
+				<h3>Some Static Content</h3>
+				<h4>Some Static Content</h4>
+				<h5>Some Static Content</h5>
+				<h6>Some Static Content</h6>
+			</div>
+		</div>
+	</div>
+	<div id="big-top" class="container-full leader dark">
+		<!-- Not sure what I'm going to have on my main page just yet maybe the card again -->
+		<div class="container">
+			<div class="row">
+				<div class="col-lg-8 col-lg-offset-2 col-centered">
+					<h2 class="light">Subscribe / Contact</h2>
+					<p class="dim">Subscribe to be notified of new post or contact me and I'll get back with you.</p>
+					<form action="//davidawindham.us1.list-manage.com/subscribe/post?u=f581cb29340364ff0a4421d5c&amp;id=d7b8f624d3" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+						<div class="form-row texts">
+							<label class='text-field'>
+								<input type="text" value="" name="FNAME" class="required" id="mce-FNAME" placeholder='David' required>
+							<strong>First name <span class='req'>*</span></strong>
+							</label>
+							<label class='text-field'>
+								<input type="text" value="" name="LNAME" class="required" id="mce-LNAME" placeholder='Windham' required>
+							<strong>Last name <span class='req'>*</span></strong>
+							</label>
+						</div>
+						<div class="form-row texts">
+							<label class='text-field'>
+								<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" placeholder='you@gmail.com' required>
+							<strong>Email address <span class='req'>*</span></strong>
+							</label>
+			
+							<label class='text-field'>
+								<input type="text" value="" name="COMPANY" class="" placeholder='Your Place'>
+							<strong>Company <i>or</i> School</strong>
+							</label>
+						</div>
+						<div class="contact-form-message">
+							<label class='text-field'>
+								<input type="text" size="100" value="" name="MMERGE3" class="" placeholder='Your Message'>
+							<strong>Message</strong>
+							</label>
+						</div>
+							<input type="hidden" value="8" name="group[9585][8]">
+						<div style="position: absolute; left: -5000px;">
+							<input type="text" name="b_f581cb29340364ff0a4421d5c_d7b8f624d3" tabindex="-1" value="">
+						</div>
+						<div class="actions">
+							<button type="submit" class="submit btn default" value="Subscribe" name="subscribe" id="mc-embedded-subscribe">Subscribe</button>
+							<span> ~ or ~ </span>
+							<button type="submit" class="submit btn default" value="Conctact" name="contact" id="contact">Contact Me</button>
+						</div>
+					</form>
+				</div>
+			</div>
+		</div>
 	</div>
+		
+
+
 <?php get_footer(); ?>

+ 33 - 0
js/init.js

@@ -8,6 +8,39 @@ $(window).bind("load", function () {
     $('#loader').fadeOut(2700);
 });
 
+$('#nav').affix({
+	offset: {
+		top: $('.intro').height()-$('#nav').height()
+	}
+});	
+
+
+
+
+$(function(){
+  $(".typed").typed({
+    strings: ["Hey,", "Hello,\n^10Welcome to ^1000my domain ^10...", "Hello, \nWelcome to my little corner of the internet \n^10It's nice to ", "Hello, \nWelcome to my little corner of the internet \nIt's very nice to have you here!\n"],
+	typeSpeed: -50,
+	backSpeed: 0,
+	startDelay: 0,
+	backDelay: 0,
+	loop: false,
+	loopCount: false,
+	attr: null,
+	callback: function(){
+	 	shift();
+	 }
+  });
+});
+  
+function shift(){
+	$('.leader').ScrollTo({
+	    duration: 2500,
+		easing: 'linear',
+	    durationMode: 'all'
+	});
+}
+
 var headerHeight = $('.navbar').height();
 $(window).on('scroll', { previousTop: 0 },
 function() {

+ 578 - 6
js/scripts.js

@@ -1,6 +1,578 @@
-(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-ga('create', 'UA-1906067-6', 'davidawindham.com');
-ga('send', 'pageview');
+// The MIT License (MIT)
+// Typed.js | Copyright (c) 2014 Matt Boldt | www.mattboldt.com
+
+
+!function($){
+
+    "use strict";
+
+    var Typed = function(el, options){
+
+        // chosen element to manipulate text
+        this.el = $(el);
+
+        // options
+        this.options = $.extend({}, $.fn.typed.defaults, options);
+
+        // text content of element
+        this.baseText = this.el.text() || this.el.attr('placeholder') || '';
+
+        // typing speed
+        this.typeSpeed = this.options.typeSpeed;
+
+        // add a delay before typing starts
+        this.startDelay = this.options.startDelay;
+
+        // backspacing speed
+        this.backSpeed = this.options.backSpeed;
+
+        // amount of time to wait before backspacing
+        this.backDelay = this.options.backDelay;
+
+        // input strings of text
+        this.strings = this.options.strings;
+
+        // character number position of current string
+        this.strPos = 0;
+
+        // current array position
+        this.arrayPos = 0;
+
+        // number to stop backspacing on.
+        // default 0, can change depending on how many chars
+        // you want to remove at the time
+        this.stopNum = 0;
+
+        // Looping logic
+        this.loop = this.options.loop;
+        this.loopCount = this.options.loopCount;
+        this.curLoop = 0;
+
+        // for stopping
+        this.stop = false;
+
+        // show cursor
+        this.showCursor = this.isInput ? false : this.options.showCursor;
+
+        // custom cursor
+        this.cursorChar = this.options.cursorChar;
+
+        // attribute to type
+        this.isInput = this.el.is('input');
+        this.attr = this.options.attr || (this.isInput ? 'placeholder' : null);
+
+        // All systems go!
+        this.build();
+    };
+
+        Typed.prototype =  {
+
+            constructor: Typed
+
+            , init: function(){
+                // begin the loop w/ first current string (global self.string)
+                // current string will be passed as an argument each time after this
+                var self = this;
+                self.timeout = setTimeout(function() {
+                    // Start typing
+                    self.typewrite(self.strings[self.arrayPos], self.strPos);
+                }, self.startDelay);
+            }
+
+            , build: function(){
+                // Insert cursor
+                if (this.showCursor === true){
+                  this.cursor = $("<span class=\"typed-cursor\">" + this.cursorChar + "</span>");
+                  this.el.after(this.cursor);
+                }
+                this.init();
+            }
+
+            // pass current string state to each function, types 1 char per call
+            , typewrite: function(curString, curStrPos){
+                // exit when stopped
+                if(this.stop === true)
+                   return;
+
+                // varying values for setTimeout during typing
+                // can't be global since number changes each time loop is executed
+                var humanize = Math.round(Math.random() * (100 - 30)) + this.typeSpeed;
+                var self = this;
+
+                // ------------- optional ------------- //
+                // backpaces a certain string faster
+                // ------------------------------------ //
+                // if (self.arrayPos == 1){
+                //  self.backDelay = 50;
+                // }
+                // else{ self.backDelay = 500; }
+
+                // contain typing function in a timeout humanize'd delay
+                self.timeout = setTimeout(function() {
+                    // check for an escape character before a pause value
+                    // format: \^\d+ .. eg: ^1000 .. should be able to print the ^ too using ^^
+                    // single ^ are removed from string
+                    var charPause = 0;
+                    var substr = curString.substr(curStrPos);
+                    if (substr.charAt(0) === '^') {
+                        var skip = 1;  // skip atleast 1
+                        if(/^\^\d+/.test(substr)) {
+                           substr = /\d+/.exec(substr)[0];
+                           skip += substr.length;
+                           charPause = parseInt(substr);
+                        }
+
+                        // strip out the escape character and pause value so they're not printed
+                        curString = curString.substring(0,curStrPos)+curString.substring(curStrPos+skip);
+                    }
+
+                    // timeout for any pause after a character
+                    self.timeout = setTimeout(function() {
+                        if(curStrPos === curString.length) {
+                           // fires callback function
+                           self.options.onStringTyped(self.arrayPos);
+
+                            // is this the final string
+                           if(self.arrayPos === self.strings.length-1) {
+                              // animation that occurs on the last typed string
+                              self.options.callback();
+
+                              self.curLoop++;
+
+                              // quit if we wont loop back
+                              if(self.loop === false || self.curLoop === self.loopCount)
+                                 return;
+                           }
+
+                           self.timeout = setTimeout(function(){
+                              self.backspace(curString, curStrPos);
+                           }, self.backDelay);
+                        } else {
+
+                           /* call before functions if applicable */
+                           if(curStrPos === 0)
+                              self.options.preStringTyped(self.arrayPos);
+
+                           // start typing each new char into existing string
+                           // curString: arg, self.baseText: original text inside element
+                           var nextString = self.baseText + curString.substr(0, curStrPos+1);
+                           if (self.attr) {
+                            self.el.attr(self.attr, nextString);
+                           } else {
+                            self.el.text(nextString);
+                           }
+
+                           // add characters one by one
+                           curStrPos++;
+                           // loop the function
+                           self.typewrite(curString, curStrPos);
+                        }
+                    // end of character pause
+                    }, charPause);
+
+                // humanized value for typing
+                }, humanize);
+
+            }
+
+            , backspace: function(curString, curStrPos){
+                // exit when stopped
+                if (this.stop === true) {
+                   return;
+                }
+
+                // varying values for setTimeout during typing
+                // can't be global since number changes each time loop is executed
+                var humanize = Math.round(Math.random() * (100 - 30)) + this.backSpeed;
+                var self = this;
+
+                self.timeout = setTimeout(function() {
+
+                    // ----- this part is optional ----- //
+                    // check string array position
+                    // on the first string, only delete one word
+                    // the stopNum actually represents the amount of chars to
+                    
+// ------------- CUSTOM OPTIONS --------------------------------------------- //
+// ========================================================================== //
+// -------------------------------------------------------------------------- //
+                    if (self.arrayPos == 1) {
+						self.stopNum = 17;
+						self.backDelay = 500;
+					}
+					else if (self.arrayPos == 2) {
+						self.stopNum = 54; 
+					}
+					else{self.stopNum = 0;}
+
+                    // ----- continue important stuff ----- //
+                    // replace text with base text + typed characters
+                    var nextString = self.baseText + curString.substr(0, curStrPos);
+                    if (self.attr) {
+                     self.el.attr(self.attr, nextString);
+                    } else {
+                     self.el.text(nextString);
+                    }
+
+                    // if the number (id of character in current string) is
+                    // less than the stop number, keep going
+                    if (curStrPos > self.stopNum){
+                        // subtract characters one by one
+                        curStrPos--;
+                        // loop the function
+                        self.backspace(curString, curStrPos);
+                    }
+                    // if the stop number has been reached, increase
+                    // array position to next string
+                    else if (curStrPos <= self.stopNum) {
+                        self.arrayPos++;
+
+                        if(self.arrayPos === self.strings.length) {
+                           self.arrayPos = 0;
+                           self.init();
+                        } else
+                            self.typewrite(self.strings[self.arrayPos], curStrPos);
+                    }
+
+                // humanized value for typing
+                }, humanize);
+
+            }
+
+            // Start & Stop currently not working
+
+            // , stop: function() {
+            //     var self = this;
+
+            //     self.stop = true;
+            //     clearInterval(self.timeout);
+            // }
+
+            // , start: function() {
+            //     var self = this;
+            //     if(self.stop === false)
+            //        return;
+
+            //     this.stop = false;
+            //     this.init();
+            // }
+
+            // Reset and rebuild the element
+            , reset: function(){
+                var self = this;
+                clearInterval(self.timeout);
+                var id = this.el.attr('id');
+                this.el.after('<span id="' + id + '"/>')
+                this.el.remove();
+                this.cursor.remove();
+                // Send the callback
+                self.options.resetCallback();
+            }
+
+        };
+
+    $.fn.typed = function (option) {
+        return this.each(function () {
+          var $this = $(this)
+            , data = $this.data('typed')
+            , options = typeof option == 'object' && option;
+          if (!data) $this.data('typed', (data = new Typed(this, options)));
+          if (typeof option == 'string') data[option]();
+        });
+    };
+
+    $.fn.typed.defaults = {
+        strings: ["These are the default values...", "You know what you should do?", "Use your own!", "Have a great day!"],
+        // typing speed
+        typeSpeed: 0,
+        // time before typing starts
+        startDelay: 0,
+        // backspacing speed
+        backSpeed: 0,
+        // time before backspacing
+        backDelay: 500,
+        // loop
+        loop: false,
+        // false = infinite
+        loopCount: false,
+        // show cursor
+        showCursor: true,
+        // character for cursor
+        cursorChar: "|",
+        // attribute to type (null == text)
+        attr: null,
+        // call when done callback function
+        callback: function() {},
+        // starting callback function before each string
+        preStringTyped: function() {},
+        //callback for every typed string
+        onStringTyped: function() {},
+        // callback for reset
+        resetCallback: function() {}
+    };
+
+
+}(window.jQuery);
+
+
+/*global define:false require:false */
+(function (name, context, definition) {
+	if (typeof module != 'undefined' && module.exports) module.exports = definition();
+	else if (typeof define == 'function' && define.amd) define(definition);
+	else context[name] = definition();
+})('jquery-scrollto', this, function(){
+	// Prepare
+	var jQuery, $, ScrollTo;
+	jQuery = $ = window.jQuery || require('jquery');
+
+	// Fix scrolling animations on html/body on safari
+	$.propHooks.scrollTop = $.propHooks.scrollLeft = {
+		get: function(elem,prop) {
+			var result = null;
+			if ( elem.tagName === 'HTML' || elem.tagName === 'BODY' ) {
+				if ( prop === 'scrollLeft' ) {
+					result = window.scrollX;
+				} else if ( prop === 'scrollTop' ) {
+					result = window.scrollY;
+				}
+			}
+			if ( result == null ) {
+				result = elem[prop];
+			}
+			return result;
+		}
+	};
+	$.Tween.propHooks.scrollTop = $.Tween.propHooks.scrollLeft = {
+		get: function(tween) {
+			return $.propHooks.scrollTop.get(tween.elem, tween.prop);
+		},
+		set: function(tween) {
+			// Our safari fix
+			if ( tween.elem.tagName === 'HTML' || tween.elem.tagName === 'BODY' ) {
+				// Defaults
+				tween.options.bodyScrollLeft = (tween.options.bodyScrollLeft || window.scrollX);
+				tween.options.bodyScrollTop = (tween.options.bodyScrollTop || window.scrollY);
+
+				// Apply
+				if ( tween.prop === 'scrollLeft' ) {
+					tween.options.bodyScrollLeft = Math.round(tween.now);
+				}
+				else if ( tween.prop === 'scrollTop' ) {
+					tween.options.bodyScrollTop = Math.round(tween.now);
+				}
+
+				// Apply
+				window.scrollTo(tween.options.bodyScrollLeft, tween.options.bodyScrollTop);
+			}
+			// jQuery's IE8 Fix
+			else if ( tween.elem.nodeType && tween.elem.parentNode ) {
+				tween.elem[ tween.prop ] = tween.now;
+			}
+		}
+	};
+
+	// jQuery ScrollTo
+	ScrollTo = {
+		// Configuration
+		config: {
+			duration: 400,
+			easing: 'swing',
+			callback: undefined,
+			durationMode: 'each',
+			offsetTop: 0,
+			offsetLeft: 0
+		},
+
+		// Set Configuration
+		configure: function(options){
+			// Apply Options to Config
+			$.extend(ScrollTo.config, options||{});
+
+			// Chain
+			return this;
+		},
+
+		// Perform the Scroll Animation for the Collections
+		// We use $inline here, so we can determine the actual offset start for each overflow:scroll item
+		// Each collection is for each overflow:scroll item
+		scroll: function(collections, config){
+			// Prepare
+			var collection, $container, container, $target, $inline, position, containerTagName,
+				containerScrollTop, containerScrollLeft,
+				containerScrollTopEnd, containerScrollLeftEnd,
+				startOffsetTop, targetOffsetTop, targetOffsetTopAdjusted,
+				startOffsetLeft, targetOffsetLeft, targetOffsetLeftAdjusted,
+				scrollOptions,
+				callback;
+
+			// Determine the Scroll
+			collection = collections.pop();
+			$container = collection.$container;
+			$target = collection.$target;
+			containerTagName = $container.prop('tagName');
+
+			// Prepare the Inline Element of the Container
+			$inline = $('<span/>').css({
+				'position': 'absolute',
+				'top': '0px',
+				'left': '0px'
+			});
+			position = $container.css('position');
+
+			// Insert the Inline Element of the Container
+			$container.css({position:'relative'});
+			$inline.appendTo($container);
+
+			// Determine the top offset
+			startOffsetTop = $inline.offset().top;
+			targetOffsetTop = $target.offset().top;
+			targetOffsetTopAdjusted = targetOffsetTop - startOffsetTop - parseInt(config.offsetTop,10);
+
+			// Determine the left offset
+			startOffsetLeft = $inline.offset().left;
+			targetOffsetLeft = $target.offset().left;
+			targetOffsetLeftAdjusted = targetOffsetLeft - startOffsetLeft - parseInt(config.offsetLeft,10);
+
+			// Determine current scroll positions
+			containerScrollTop = $container.prop('scrollTop');
+			containerScrollLeft = $container.prop('scrollLeft');
+
+			// Reset the Inline Element of the Container
+			$inline.remove();
+			$container.css({position:position});
+
+			// Prepare the scroll options
+			scrollOptions = {};
+
+			// Prepare the callback
+			callback = function(event){
+				// Check
+				if ( collections.length === 0 ) {
+					// Callback
+					if ( typeof config.callback === 'function' ) {
+						config.callback();
+					}
+				}
+				else {
+					// Recurse
+					ScrollTo.scroll(collections,config);
+				}
+				// Return true
+				return true;
+			};
+
+			// Handle if we only want to scroll if we are outside the viewport
+			if ( config.onlyIfOutside ) {
+				// Determine current scroll positions
+				containerScrollTopEnd = containerScrollTop + $container.height();
+				containerScrollLeftEnd = containerScrollLeft + $container.width();
+
+				// Check if we are in the range of the visible area of the container
+				if ( containerScrollTop < targetOffsetTopAdjusted && targetOffsetTopAdjusted < containerScrollTopEnd ) {
+					targetOffsetTopAdjusted = containerScrollTop;
+				}
+				if ( containerScrollLeft < targetOffsetLeftAdjusted && targetOffsetLeftAdjusted < containerScrollLeftEnd ) {
+					targetOffsetLeftAdjusted = containerScrollLeft;
+				}
+			}
+
+			// Determine the scroll options
+			if ( targetOffsetTopAdjusted !== containerScrollTop ) {
+				scrollOptions.scrollTop = targetOffsetTopAdjusted;
+			}
+			if ( targetOffsetLeftAdjusted !== containerScrollLeft ) {
+				scrollOptions.scrollLeft = targetOffsetLeftAdjusted;
+			}
+
+			// Check to see if the scroll is necessary
+			if ( $container.prop('scrollHeight') === $container.width() ) {
+				delete scrollOptions.scrollTop;
+			}
+			if ( $container.prop('scrollWidth') === $container.width() ) {
+				delete scrollOptions.scrollLeft;
+			}
+
+			// Perform the scroll
+			if ( scrollOptions.scrollTop != null || scrollOptions.scrollLeft != null ) {
+				$container.animate(scrollOptions, {
+					duration: config.duration,
+					easing: config.easing,
+					complete: callback
+				});
+			}
+			else {
+				callback();
+			}
+
+			// Return true
+			return true;
+		},
+
+		// ScrollTo the Element using the Options
+		fn: function(options){
+			// Prepare
+			var collections, config, $container, container;
+			collections = [];
+
+			// Prepare
+			var	$target = $(this);
+			if ( $target.length === 0 ) {
+				// Chain
+				return this;
+			}
+
+			// Handle Options
+			config = $.extend({},ScrollTo.config,options);
+
+			// Fetch
+			$container = $target.parent();
+			container = $container.get(0);
+
+			// Cycle through the containers
+			while ( ($container.length === 1) && (container !== document.body) && (container !== document) ) {
+				// Check Container for scroll differences
+				var containerScrollTop, containerScrollLeft;
+				containerScrollTop = $container.css('overflow-y') !== 'visible' && container.scrollHeight !== container.clientHeight;
+				containerScrollLeft =  $container.css('overflow-x') !== 'visible' && container.scrollWidth !== container.clientWidth;
+				if ( containerScrollTop || containerScrollLeft ) {
+					// Push the Collection
+					collections.push({
+						'$container': $container,
+						'$target': $target
+					});
+					// Update the Target
+					$target = $container;
+				}
+				// Update the Container
+				$container = $container.parent();
+				container = $container.get(0);
+			}
+
+			// Add the final collection
+			collections.push({
+				'$container': $('html'),
+				// document.body doesn't work in firefox, html works for all
+				// internet explorer starts at the beggining
+				'$target': $target
+			});
+
+			// Adjust the Config
+			if ( config.durationMode === 'all' ) {
+				config.duration /= collections.length;
+			}
+
+			// Handle
+			ScrollTo.scroll(collections,config);
+
+			// Chain
+			return this;
+		}
+	};
+
+	// Apply our extensions to jQuery
+	$.ScrollTo = $.ScrollTo || ScrollTo;
+	$.fn.ScrollTo = $.fn.ScrollTo || ScrollTo.fn;
+
+	// Export
+	return ScrollTo;
+});

+ 2 - 8
loader.php

@@ -2,16 +2,10 @@
 	<div class="loading-animation">
 		<div class="svg-wrap">
 			<svg class="l1" width="250px" height="250px">	
-				<path d="M242.8,131.8c-0.4-29.9-22.1-50.1-48.1-50c-16.9,0-28.6,8.4-28.6,8.4s12.7-16.2,12.6-36.9
-					c-0.2-24.7-23-47.9-52.4-47.9C97.6,5.4,71.8,26,72.3,55.5C72.6,76.3,85,90.2,85,90.2c0,0-13.9-8.7-29-8.2
-					C16.5,83,6.6,115.8,7.3,132.9c1.2,33.4,15.4,53.8,52.7,54.2c34.2,0.4,54.9-32.3,61-43.5c1.5-9.5,0-13.9,0-13.9
-					c-3.1,1.6-14.5,27.9-35.6,16.1c-6.8-3.8-8.8-16.7-5.2-26.3c6.3-16.9,18.3-18.7,36-40.3c6.8-8.3,8.2-13.6,8.2-13.6s1.2,5.2,7.8,13.2
-					c17.4,21.2,30.1,23.6,36.7,40.4c4.1,10.4,1.8,23-6,26.9c-20.3,10.1-31.4-15.1-34.9-16.5c0,0-1.2,4,0.1,12.8
-					c2.6,5.7,21.7,44.2,64,44.2C226.3,186.6,243.1,156.2,242.8,131.8z"/>
+				<path d="M242.8,131.8c-0.4-29.9-22.1-50.1-48.1-50c-16.9,0-28.6,8.4-28.6,8.4s12.7-16.2,12.6-36.9c-0.2-24.7-23-47.9-52.4-47.9C97.6,5.4,71.8,26,72.3,55.5C72.6,76.3,85,90.2,85,90.2c0,0-13.9-8.7-29-8.2C16.5,83,6.6,115.8,7.3,132.9c1.2,33.4,15.4,53.8,52.7,54.2c34.2,0.4,54.9-32.3,61-43.5c1.5-9.5,0-13.9,0-13.9c-3.1,1.6-14.5,27.9-35.6,16.1c-6.8-3.8-8.8-16.7-5.2-26.3c6.3-16.9,18.3-18.7,36-40.3c6.8-8.3,8.2-13.6,8.2-13.6s1.2,5.2,7.8,13.2c17.4,21.2,30.1,23.6,36.7,40.4c4.1,10.4,1.8,23-6,26.9c-20.3,10.1-31.4-15.1-34.9-16.5c0,0-1.2,4,0.1,12.8c2.6,5.7,21.7,44.2,64,44.2C226.3,186.6,243.1,156.2,242.8,131.8z"/>
 			</svg>
 			<svg class="l2" width="250px" height="250px">	
-				<path d="M124.5,154.1c0,0-10.8,37.5-12.7,41.9c-4.9,11.3-26.6,38.8-26.6,38.8s25.2-2.8,40.4-2.8
-					c15.6,0,39.2,3.2,39.2,3.2s-22.8-28.1-27.6-39.6C135.4,191.2,124.5,154.1,124.5,154.1z"/>
+				<path d="M124.5,154.1c0,0-10.8,37.5-12.7,41.9c-4.9,11.3-26.6,38.8-26.6,38.8s25.2-2.8,40.4-2.8c15.6,0,39.2,3.2,39.2,3.2s-22.8-28.1-27.6-39.6C135.4,191.2,124.5,154.1,124.5,154.1z"/>
 			</svg>
 			<svg class="l3" width="250px" height="250px">
 				<path d="M0.5,125a124.5,124.5 0 1,0 249,0a124.5,124.5 0 1,0 -249,0"/>

+ 242 - 13
style.css

@@ -47,9 +47,22 @@ body,input,textarea {
 /*============================================
 										Typography 
 ==============================================*/
+* {
+	-webkit-font-smoothing: antialiased !important;
+	text-rendering: optimizeLegibility !important;
+	font-weight: normal;
+}
 
-body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;font-size: 14px;line-height: 1.42857143;}
-input,button,select,textarea {font-family: inherit;font-size: inherit;line-height: inherit;}
+body {
+	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+	font-size: 14px;
+	line-height: 1.42857143;
+}
+input,button,select,textarea {
+	font-family: inherit;
+	font-size: inherit;
+	line-height: inherit;
+}
 
 .light {
 	color:#fcfcfc;
@@ -342,12 +355,64 @@ input,button,select,textarea {font-family: inherit;font-size: inherit;line-heigh
 ==============================================*/
 .intro {
 	width: 100%;
-	height: 1000px;
-	background: url(img/?.jpg) no-repeat center center fixed; 
+	height: 100%;
+	min-height: 1000px;
+	padding: 250px 0 0;
+	background: #222; 
 	-webkit-background-size: cover;
 	-moz-background-size: cover;
 	-o-background-size: cover;
 	background-size: cover;
+	color: #cecece;
+}
+.typed {
+	padding: 10px;
+	max-width: 100%;
+	display: block;
+	white-space: pre;
+	font-size: 27px;
+}
+.typed:after {
+  visibility: visible;
+  content: '';
+  background-color: #d4f8e3;
+  opacity: .5;
+  display: inline-block;
+  position: relative;
+  width: 0.5em;
+  height: 1em;
+  top: 5px;
+  margin-left: 0;
+  margin-bottom: 2px;
+	-webkit-animation: blink 1s 30;
+	-moz-animation: blink 1s 30;
+	animation: blink 1s 30;
+}
+.typed-cursor{
+	display: none;
+}
+
+@keyframes blink{
+    0% { opacity:1; }
+    50% { opacity:0; }
+    100% { opacity:1; }
+}
+@-webkit-keyframes blink{
+    0% { opacity:1; }
+    50% { opacity:0; }
+    100% { opacity:1; }
+}
+@-moz-keyframes blink{
+    0% { opacity:1; }
+    50% { opacity:0; }
+    100% { opacity:1; }
+}
+.screen-reader {
+	text-indent: -10000px;
+	top:auto;
+	width:1px;
+	height:1px;
+	overflow:hidden;
 }
 
 
@@ -357,10 +422,9 @@ input,button,select,textarea {font-family: inherit;font-size: inherit;line-heigh
 										Navbar 
 ==============================================*/
 
+
 .navbar {
-  background-color: rgba(237, 237, 237, 0.7);
-}
-.navbar {
+	background-color: rgba(237, 237, 237, 0.7);
   -webkit-transition: background-color 0.3s;
   -moz-transition: background-color 0.3s;
   transition: background-color 0.3s;
@@ -369,14 +433,11 @@ input,button,select,textarea {font-family: inherit;font-size: inherit;line-heigh
   -ms-transform: translate3d(0, 0, 0);
   -o-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
-  -webkit-backface-visibility: hidden;
-  backface-visibility: hidden;
 }
 .navbar.fixed {
   position: fixed;
   top: -80px;
   background-color: rgba(237, 237, 237, 0.7);
-  border-bottom: 1px solid #f2f2f2;
   -webkit-transition: -webkit-transform 0.3s;
   -moz-transition: -moz-transform 0.3s;
   transition: transform 0.3s;
@@ -388,7 +449,25 @@ input,button,select,textarea {font-family: inherit;font-size: inherit;line-heigh
   -o-transform: translate3d(0, 100%, 0);
   transform: translate3d(0, 100%, 0);
 }
-
+#nav {
+  width: 100%;
+  background-color: rgba(237, 237, 237, 0.7);
+}
+#nav.affix-top {
+	visibility: collapse;
+	position: absolute;
+	top:0;
+	left:0;
+	height:80px;
+}
+#nav.affix {
+	position: fixed;
+	top: 0;
+	z-index:10;
+	-webkit-transition: all .3s ease-in-out;
+	-moz-transition: all .3s ease-in-out;
+	transition: all .3s ease-in-out;
+}
 
 /*============================================
 										NavMenu 
@@ -522,7 +601,6 @@ img.dw {
 
 /*===== Structure =====*/
 .leader {
-	margin: 80px 0;
 	padding: 50px 0;
 }
 .dark {
@@ -531,7 +609,10 @@ img.dw {
 .footer {
 	padding: 50px 0 100px;
 }
-
+.col-centered {
+	float: none;
+	margin: 0 auto;
+}
 
 
 /*===== Wordpress =====*/
@@ -1355,3 +1436,151 @@ span.quiet {
 }
 
 
+
+.form-row {
+  margin: 10px 0;
+}
+.form-row.checkbox {
+  font-size: 0.85em;
+}
+.form-row.texts:first-of-type {
+  margin-top: 30px;
+}
+.form-row.texts + .form-row:not(.texts) {
+  margin-top: 30px;
+}
+
+.checkbox-field input {
+  margin-right: 10px;
+}
+
+/*
+ * Text field
+ */
+
+.text-field {
+  width: 50%;
+  float: left;
+  display: block;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  position: relative;
+}
+.text-field > strong {
+  display: block;
+  font-weight: bold;
+  color: white;
+  font-size: 0.85em;
+  margin-top: -3px;
+}
+.text-field > strong > i {
+  font-weight: normal;
+  font-style: italic;
+  font-family: playfair display, serif;
+  font-size: 0.9em;
+  opacity: 0.8;
+}
+.text-field .req {
+  position: relative;
+  top: 4px;
+  left: 4px;
+  color: #1a8;
+  opacity: 0.5;
+}
+.text-field [type='email'],
+.text-field [type='text'] {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-transition: all 200ms linear;
+  transition: all 200ms linear;
+}
+.text-field [type='email']::-webkit-input-placeholder,
+.text-field [type='text']::-webkit-input-placeholder {
+  color: rgba(250, 250, 250, 0.2);
+  font-weight: normal;
+}
+.text-field [type='email']::-moz-placeholder,
+.text-field [type='text']::-moz-placeholder {
+  color: rgba(250, 250, 250, 0.2);
+  font-weight: normal;
+}
+.text-field [type='email']:-ms-input-placeholder,
+.text-field [type='text']:-ms-input-placeholder {
+  color: rgba(250, 250, 250, 0.2);
+  font-weight: normal;
+}
+.text-field [type='email']::placeholder,
+.text-field [type='text']::placeholder {
+  color: rgba(250, 250, 250, 0.2);
+  font-weight: normal;
+}
+.text-field [type='email'],
+.text-field [type='text'] {
+  background: transparent;
+  border: 0;
+  padding: 5px 0;
+  border-bottom: solid 1px rgba(250, 250, 250, 0.2);
+  margin: 5px 5px 5px 0;
+  color: #1d8;
+  font-weight: bold;
+}
+.text-field [type='email']:hover,
+.text-field [type='text']:hover {
+  border-bottom-color: rgba(250, 250, 250, 0.5);
+  outline: 0;
+}
+.text-field [type='email']:focus,
+.text-field [type='text']:focus {
+  color: #1d8;
+  border-bottom-color: #1d8;
+  outline: 0;
+}
+@media (min-width: 768px) {
+  .text-field [type='email'],
+  .text-field [type='text'] {
+    width: 92%;
+  }
+}
+
+/*============================================
+										Forms
+==============================================*/
+
+.signup-footer {
+  background: #101a12;
+  color: rgba(250, 250, 250, 0.7);
+}
+.signup-footer h2 {
+  font-weight: bold;
+  margin: 0;
+  font-size: 1.5em;
+  color: white;
+}
+@media (min-width: 768px) {
+  .signup-footer .in {
+    padding-top: 140px;
+    padding-bottom: 140px;
+  }
+}
+.signup-footer p {
+  margin: 0;
+  line-height: 1.4;
+}
+.signup-footer h2 + p {
+  margin-top: -0.25em;
+}
+.signup-footer .submit {
+  height: 40px;
+  line-height: 36px;
+}
+.signup-footer .actions {
+  margin-top: 30px;
+}
+form .actions button{
+	margin: 20px 0;
+}
+
+
+