diff --git a/scripts/src/intro.js b/scripts/src/intro.js
index 1d0426e..525b448 100644
--- a/scripts/src/intro.js
+++ b/scripts/src/intro.js
@@ -33,6 +33,7 @@ define(
 		{
 			button.classList.add( 'is-active' );
 			element.classList.add( 'is-active' );
+			element.style.top = '0';
 			is_open = true;
 		}
 
@@ -40,9 +41,15 @@ define(
 		{
 			button.classList.remove( 'is-active' );
 			element.classList.remove( 'is-active' );
+			element.style.top = -getHeight() + 'px';
 			is_open = false;
 		}
 
+		function getHeight()
+		{
+			return element.clientHeight;
+		}
+
 		return { init: init };
 	}
 );
\ No newline at end of file
diff --git a/styles/main.css b/styles/main.css
index 2488c28..2314169 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -106,8 +106,8 @@ a:hover {
 	top: -100%;
 	background-color: #fff;
 	background-color: rgba(255,255,255, 0.9);
-	-webkit-transition: all 0.5s ease-in;
-	transition: all 0.5s ease-in;
+	-webkit-transition: all 0.3s ease-out;
+	transition: all 0.3s ease-out;
 }
 
 .intro.is-active {