diff --git a/header.php b/header.php
index 80f4f37..c9c27c2 100644
--- a/header.php
+++ b/header.php
@@ -36,16 +36,41 @@
  
 
 
-<style>#panel {
-  padding: 5px;
-  text-align: center;
-  background-color: #e5eecc;
-  border: solid 1px #c3c3c3;
-}
+<style>
 
 #panel {
-  /* padding: 50px; */
+  padding: 5px;
+  text-align: left;
+  background-color: #e5eecc;
+  border: solid 1px #c3c3c3;
+/*   column-count: 4; */
+  padding: 20px;
   display: none;
+  margin: 0 0 20px 0;
+}
+
+.bar1, .bar2, .bar3 {
+  width: 35px;
+  height: 5px;
+  background-color: #777;
+  margin: 6px 0;
+  transition: 0.4s;
+}
+
+.change .bar1 {
+  -webkit-transform: rotate(-45deg) translate(-9px, 6px);
+  transform: rotate(-45deg) translate(-9px, 6px);
+}
+
+.change .bar2 {opacity: 0;}
+
+.change .bar3 {
+  -webkit-transform: rotate(45deg) translate(-8px, -8px);
+  transform: rotate(45deg) translate(-8px, -8px);
+}
+
+#flip {
+margin: -40px 0 0 90%;
 }
 </style>
  
@@ -80,6 +105,7 @@
 jQuery(document).ready(function(){
   jQuery("#flip").click(function(){
     jQuery("#panel").slideToggle();
+    jQuery("#flip").toggleClass("change");
   });
 });
 </script>
@@ -88,7 +114,7 @@ jQuery(document).ready(function(){
 <body <?php body_class(); ?>>
 <div id="wrapper">
 <?php /* Our navigation menu.  If one isn't filled out, wp_nav_menu falls back to wp_page_menu.  The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used.  */ ?>
-  <?php wp_nav_menu( array( 'container_class' => 'melville_header_menu', 'theme_location' => 'header-menu' ) ); ?>
+
 
 	<div id="header">
 		<?php $heading_tag = ( is_home() || is_front_page() ) ? 'h1' : 'div'; ?>
@@ -97,24 +123,13 @@ jQuery(document).ready(function(){
 				</<?php echo $heading_tag; ?>>
 				<div id="site-description"><?php bloginfo( 'description' ); ?></div>
 	</div><!--#header-->
-  <div id="flip">Click to slide down panel</div>
+  <div id="flip">  <div class="bar1"></div>
+  <div class="bar2"></div>
+  <div class="bar3"></div></div>
 <div id="panel">
 <?php wp_nav_menu( array( 'container_class' => 'melville_header_menu', 'theme_location' => 'header-menu' ) ); ?>
 
-Hello world!Top References
-<ul>
-	<li>HTML Reference</li>
-	<li>CSS Reference</li>
-	<li>JavaScript Reference</li>
-	<li>SQL Reference</li>
-	<li>Python Reference</li>
-	<li>W3.CSS Reference</li>
-	<li>Bootstrap Reference</li>
-	<li>PHP Reference</li>
-	<li>HTML Colors</li>
-	<li>Java Reference</li>
-	<li>Angular Reference</li>
-	<li>jQuery Reference</li>
-</ul>
+<div style="clear: both"></div>
+
 </div>
 <div id="content">
diff --git a/style.css b/style.css
index 1fff31a..ae089d2 100644
--- a/style.css
+++ b/style.css
@@ -243,7 +243,7 @@ hr { margin: 20px 0; }
 
 div#content
 {
-	margin: 0 0 20px 0;
+	margin: 40px 0 20px 0;
 	padding: 0px 80px 0 80px;
 }
 
@@ -393,7 +393,7 @@ br.clear
 /* @group Header ---------------------------------------------- */
 div#header
 {
-	margin: 0 0 60px 0;
+/* 	margin: 0 0 20px 0; */
 	padding: 0 0 20px 0;
 	color: #777777;
 	/* 	border-bottom: 1px solid #bbbbbb; */
@@ -637,7 +637,7 @@ input[type="submit"] { color: #333; }
 
 #respond
 {
-	border-top: 1px solid #e7e7e7;
+/* 	border-top: 1px solid #e7e7e7; */
 	margin: 24px 0;
 	overflow: hidden;
 	position: relative;
@@ -761,25 +761,29 @@ h3#reply-title { margin: 18px 0; }
 /* Footer Menu Styles */
 .melville_header_menu ul
 {
-	list-style: none;
+/* 	list-style: none; */
 	padding: 0px;
 }
 
 .melville_header_menu ul ul
 {
-	display: none;
-	position: absolute;
-	background-color: white;
+/* 	display: none; */
+/* 	position: absolute; */
+/* 	background-color: white; */
 }
 
 .melville_header_menu li
 {
 	display: inline-block;
-	padding-right: 20px;
+	padding-right: 0px;
+	width: 24%;
+	vertical-align: top;
+	
 }
 
 .melville_header_menu li a { text-decoration: none; }
 
+/* 
 .melville_header_menu li:hover ul
 {
 	display: block;
@@ -787,13 +791,16 @@ h3#reply-title { margin: 18px 0; }
 	padding: 0 10px;
 	border-top: 1px solid;
 }
+ */
+
 
 .melville_header_menu li li
 {
-	display: block;
+/* 	display: block; */
+	display: inline-block;
 	text-align: left;
 	padding-top: 10px;
-	padding-left: 5px;
+	padding-left: 0px;
 }
 
 .melville_header_menu li ul { }
@@ -801,7 +808,7 @@ h3#reply-title { margin: 18px 0; }
 
 .melville_header_menu
 {
-	text-align: center;
+	text-align: left;
 	font-variant: small-caps;
 }
 
@@ -1051,10 +1058,17 @@ p.has-drop-cap:not(:focus):first-letter
 	.page-link a:link, .page-link a:visited { background: #f1f1f1; }
 /* 	div#footer { background-color: #241f20; } */
 	input#s { background-color: #fefefe; }
-	#commentform input, #commentform textarea { background-color: #fcfcfc; }
+	#commentform input, #commentform textarea { 
+	 background: #241f20;
+/* 	background-color: #fcfcfc;  */
+	}
 		#menu div.menu, #menu div.melville_footer_menu
 	{
 		background-color: #67554F;}
+		
+		#panel {
+			 background: #323232; 
+		}
 	
 	/* 	Border Colors  */
 	div#wrapper
