CSS Codes
CSS Layouts
<!DOCTYPE HTML>
<head>

<meta name="viewport" content="width=device-width" />


<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Rosario:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="pushmenu.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>


<script src="pushmenu.js">

/***********************************************
* Side Push Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Please keep this notice intact
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script>

jQuery(function(){ // on DOM load

menu1 = new pushmenu({ // initialize menu example
menuid: 'pushmenu1',
position: 'left',
marginoffset: 0,
revealamt: -8,
onopenclose:function(state){ // add or remove "open" class to animated drawer button depending on menu state
var $buttonref = $('#drawer')
if (state == 'open')
$buttonref.addClass('open')
else
$buttonref.removeClass('open')
}
})

})

</script>

</head>

<body>


<nav id="pushmenu1" class="pushmenu">

<h2>Navigation</h2>

<div class="closebutton fa fa-plus-circle" title="Close Menu"></div>

<ul class="mainnav">
<li><a href="http://www.dynamicdrive.com/"><i class="fa fa-bolt"></i> Dynamic Drive</a></li>
<li><a href="http://www.dynamicdrive.com/style/"><i class="fa fa-css3"></i> CSS Library</a></li>
<li><a href="http://www.dynamicdrive.com/forums/"><i class="fa fa-comment-o"></i> Help Forums</a></li>
<li><a href="http://tools.dynamicdrive.com/button/"><i class="fa fa-search"></i> Search</a></li>
<li><a href="http://tools.dynamicdrive.com/imageoptimizer/"><i class="fa fa-gears"></i> Gif Optimizer</a></li>
<li><a href="http://tools.dynamicdrive.com/favicon/"><i class="fa fa-gears"></i> Favicon Creator</a></li>
<li><a href="http://tools.dynamicdrive.com/button/"><i class="fa fa-gears"></i> Button Maker</a></li>
</ul>

<h2>Share It</h2>

<p style="padding: 10px">Follow us on <a href="http://twitter.com/ddrivegeorge">Twitter</a> or via <a href="http://pipes.yahoo.com/pipes/pipe.run?_id=a5e67ec6024feb24f1f5a78ee33fe991&_render=rss">RSS feed!</a></p>

</nav>

<div id="pushcontentwrapper">

 Your page contents here...
 Your page contents here...
 Your page contents here...

<a id="drawer" class="animateddrawer toggleitem" href="#" onClick="menu1.toggle(); return false">
<span></span>
</a>

</div>


</body>
</html>