diff --git a/README.md b/README.md
index 1a838a0..b16d94b 100755
--- a/README.md
+++ b/README.md
@@ -1,4 +1,3 @@
-
 FullscreenLayoutPageTransitions
 =========
 
@@ -8,4 +7,6 @@ This responsive layout is based on an initial grid of four boxes. Once a box is
 
 [demo](http://tympanus.net/Development/FullscreenLayoutPageTransitions)
 
-Licensed under the MIT License
\ No newline at end of file
+Licensed under the MIT License
+
+Edit: I have edited this project to enable the escape button funcionality. Pressing escape now returns you to the start page/navigation.
diff --git a/js/boxlayout.js b/js/boxlayout.js
index 96ec0fb..d80b5f0 100644
--- a/js/boxlayout.js
+++ b/js/boxlayout.js
@@ -4,7 +4,7 @@
  *
  * Licensed under the MIT license.
  * http://www.opensource.org/licenses/mit-license.php
- * 
+ *
  * Copyright 2013, Codrops
  * http://www.codrops.com
  */
@@ -43,9 +43,9 @@ var Boxlayout = (function() {
 	}
 
 	function initEvents() {
-		
+
 		$sections.each( function() {
-			
+
 			var $section = $( this );
 
 			// expand the clicked section and scale down the others
@@ -53,29 +53,37 @@ var Boxlayout = (function() {
 
 				if( !$section.data( 'open' ) ) {
 					$section.data( 'open', true ).addClass( 'bl-expand bl-expand-top' );
-					$el.addClass( 'bl-expand-item' );	
+					$el.addClass( 'bl-expand-item' );
 				}
 
 			} ).find( 'span.bl-icon-close' ).on( 'click', function() {
-				
-				// close the expanded section and scale up the others
-				$section.data( 'open', false ).removeClass( 'bl-expand' ).on( transEndEventName, function( event ) {
-					if( !$( event.target ).is( 'section' ) ) return false;
-					$( this ).off( transEndEventName ).removeClass( 'bl-expand-top' );
-				} );
-
-				if( !supportTransitions ) {
-					$section.removeClass( 'bl-expand-top' );
-				}
 
-				$el.removeClass( 'bl-expand-item' );
-				
+				closeSection( $section );
+
 				return false;
 
 			} );
 
 		} );
 
+		// pressing escape closes sections or work panels
+		$( document ).on( 'keyup', function( event ) {
+
+			if( event.keyCode === 27 ) {
+
+				var $section = $( 'section.bl-expand' );
+
+				// check if a section or a work panel is open
+				if( $( '.bl-show-work' ).length ) {
+					closeWorkPanel();
+				} else if( $section.length ) {
+					closeSection( $section );
+				}
+
+			}
+
+		});
+
 		// clicking on a work item: the current section scales down and the respective work panel slides up
 		$workItems.on( 'click', function( event ) {
 
@@ -95,7 +103,7 @@ var Boxlayout = (function() {
 
 		// navigating the work items: current work panel scales down and the next work panel slides up
 		$nextWorkItem.on( 'click', function( event ) {
-			
+
 			if( isAnimating ) {
 				return false;
 			}
@@ -115,7 +123,7 @@ var Boxlayout = (function() {
 				$currentPanel.removeClass( 'bl-hide-current-work' );
 				isAnimating = false;
 			}
-			
+
 			$nextPanel.addClass( 'bl-show-work' );
 
 			return false;
@@ -125,14 +133,36 @@ var Boxlayout = (function() {
 		// clicking the work panels close button: the current work panel slides down and the section scales up again
 		$closeWorkItem.on( 'click', function( event ) {
 
+			closeWorkPanel();
+
+			return false;
+
+		} );
+
+		var closeSection = function($section) {
+
+			// close the expanded section and scale up the others
+			$section.data( 'open', false ).removeClass( 'bl-expand' ).on( transEndEventName, function( event ) {
+				if( !$( event.target ).is( 'section' ) ) return false;
+				$( this ).off( transEndEventName ).removeClass( 'bl-expand-top' );
+			} );
+
+			if( !supportTransitions ) {
+				$section.removeClass( 'bl-expand-top' );
+			}
+
+			$el.removeClass( 'bl-expand-item' );
+
+		};
+
+		var closeWorkPanel = function() {
+
 			// scale up main section
 			$sectionWork.removeClass( 'bl-scale-down' );
 			$workPanelsContainer.removeClass( 'bl-panel-items-show' );
 			$workPanels.eq( currentWorkPanel ).removeClass( 'bl-show-work' );
-			
-			return false;
 
-		} );
+		}
 
 	}