How to Slide Down Search Box in a Full Screen Overlay in Genesis

functions.php

<?php
//* Do NOT include the opening php tag

//* Make Font Awesome available
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' );
function enqueue_font_awesome() {

	wp_enqueue_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' );

}

add_filter( 'wp_nav_menu_items', 'sk_menu_extras', 10, 2 );
/**
 * Filter menu items, appending a a search icon at the end.
 *
 * @param string   $menu HTML string of list items.
 * @param stdClass $args Menu arguments.
 *
 * @return string Amended HTML string of list items.
 */
function sk_menu_extras( $menu, $args ) {
 
	//* Change 'primary' to 'secondary' to add extras to the secondary navigation menu
	if ( 'primary' !== $args->theme_location )
		return $menu;
 
	$menu .= '<li class="menu-item alignright"><a id="trigger-overlay" class="search-icon" href="#"><i class="fa fa-search"></i></a></li>';
	
	return $menu;
 
}

//* Enqueue Search in Overlay Scripts
add_action( 'wp_enqueue_scripts', 'custom_load_scripts' );
function custom_load_scripts() {

	wp_enqueue_style( 'style3', get_stylesheet_directory_uri() . '/css/style3.css' );

	wp_enqueue_script( 'modernizr', get_stylesheet_directory_uri() . '/js/modernizr.custom.js' );
	
	wp_enqueue_script( 'classie', get_stylesheet_directory_uri() . '/js/classie.js', '', '', true );
	wp_enqueue_script( 'demo1', get_stylesheet_directory_uri() . '/js/demo1.js', '', '', true );

	wp_enqueue_script( 'global', get_stylesheet_directory_uri() .'/js/global.js' , array( 'jquery' ), '1.0.0', true );

}

//* Customize search form input button text
add_filter( 'genesis_search_button_text', 'sk_search_button_text' );
function sk_search_button_text( $text ) {
 
	return esc_attr( '&#xf002;' );
 
}

//* Overlay content
add_action( 'genesis_after', 'sk_search' );
function sk_search() {
	echo '<div class="overlay overlay-slidedown">';
		echo '<button type="button" class="overlay-close">Close</button>';
		get_search_form();
	echo '</div>';
}

global.js

jQuery(function( $ ){

	$('#trigger-overlay').click(function(){
		$('.overlay .search-form input[type="search"]').focus();
	})
});

style.css

/* Search Box in Full Screen Overlay
------------------------------------------------------ */

a.search-icon {
	font-size: 30px;
	padding: 22px 24px;
}

.genesis-nav-menu a.search-icon:hover {
	color: #1ac5a5;
}

body .overlay {
	background: rgba(26,197,165,0.9);
}

body .overlay .overlay-close {
	background-image: url(images/cross.png);
}

.admin-bar .overlay .overlay-close {
	margin-top: 32px;
}

.overlay .search-form {
	text-align: center;
	position: relative;
	top: 50%;
	/*height: 60%;*/
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.overlay .search-form {
	margin: 0 auto;
}

.overlay .search-form input[type="search"] {
	width: 500px;
}

.overlay .search-form input[type="submit"] {
	font-family: FontAwesome;
	clip: inherit;
	width: 55px;
	height: 55px;
	font-size: 55px;
	background: transparent;
	color: #fff;
	position: static;
	margin-left: 10px;
	padding: 0;
	vertical-align: top;
}

.overlay .search-form input[type="submit"]:hover {
	color: #333;
}

@media screen and (max-height: 30.5em) {

	.overlay .search-form {
		/*height: 70%;*/
		font-size: 34px;
	}

}

@media only screen and (max-width: 768px) {

	a.search-icon {
		font-size: 16px;
		padding: 20px 16px;
	}

	.overlay .search-form {
		height: 70%;
	}

}

@media only screen and (max-width: 568px) {

	.overlay .search-form {
		height: auto;
	}

	.overlay .search-form input[type="search"] {
		width: 300px;
	}

	.overlay .search-form input[type="submit"] {
		vertical-align: middle;
	}

}

@media only screen and (max-width: 568px) {

	.overlay .search-form input[type="search"] {
		width: 200px;
	}

}