<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.1/css/font-awesome.min.css">
<div id="ftl_menu">
	<h2>Free Time Learning</h2>
</div>
<div id="menu">
<nav>
	<h2><i class="fa fa-reorder"></i>Tutorials </h2>
	<ul>
		<li>
			<a href="#"><i class="fa fa-book"></i>Frontend</a>
			<ul>
				<li>
					<a href="#"><i class="fa fa-book"></i>HTML</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/html-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/html/html-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>HTML5</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/html5-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/html5/html5-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>CSS</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/css-basic-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/css-tutorial/css-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>CSS3</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/css3-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/css3/css3-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>JavaScript</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/javascript-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/javascript/javascript-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>jQuery</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/jquery-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/jquery/jquery-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>Bootstrap</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/bootstrap-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/bootstrap/bootstrap-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><i class="fa fa-book"></i>AngularJS</a>
					<ul>
						<li><a href="http://www.freetimelearning.com/angularjs-tutorial.php" target="_blank">Tutorial</a></li>
						<li><a href="http://www.freetimelearning.com/angularjs/angularjs-examples.php" target="_blank">Examples</a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li>
			<a href="#"><i class="fa fa-book"></i>Backend</a>
			<ul>
				<li><a href="http://www.freetimelearning.com/java-tutorial.php" target="_blank">Java</a></li>
				<li><a href="http://www.freetimelearning.com/php-tutorial.php" target="_blank">PHP</a> </li>
				<li><a href="http://www.freetimelearning.com/python-tutorial.php" target="_blank">Python</a></li>
			</ul>
		</li>
		 <li>
			<a href="#"><i class="fa fa-book"></i>Examples</a>
			<ul>
				<li><a href="http://www.freetimelearning.com/html/html-examples.php" target="_blank">HTML Examples</a></li>
				<li><a href="http://www.freetimelearning.com/html5/html5-examples.php" target="_blank">HTML5 Examples</a></li>
				<li><a href="http://www.freetimelearning.com/css-tutorial/css-examples.php" target="_blank">CSS Examples</a></li>
				<li><a href="http://www.freetimelearning.com/css3/css3-examples.php" target="_blank">CSS3 Examples</a></li>
				<li><a href="http://www.freetimelearning.com/javascript/javascript-examples.php" target="_blank">JavaScript Examples</a></li>
				<li><a href="http://www.freetimelearning.com/jquery/jquery-examples.php" target="_blank">jQuery Examples</a></li>
				<li><a href="http://www.freetimelearning.com/bootstrap/bootstrap-examples.php" target="_blank">Bootstrap Examples</a></li>
				<li><a href="http://www.freetimelearning.com/angularjs/angularjs-examples.php" target="_blank">AngularJS Examples</a></li>
			</ul>
		</li>
		<li>
			<a href="#"><i class="fa fa-gear"></i>Sample Menu</a>
			<ul>
				<li><a href="#"><i class="fa fa-gears"></i>Sample Menu</a>
					<ul>
						<li><a href="#"><i class="fa fa-check"></i>Sample Sub Menu</a>
							<ul>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
							</ul>
						</li>
						<li><a href="#"><i class="fa fa-check"></i>Sample Sub Menu</a>
							<ul>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
								<li><a href="#">Sample Menu</a></li>
							</ul>
						</li>
					</ul>
				</li>
				<li><a href="#">Sample Menu</a></li>
				<li><a href="#">Sample Menu</a></li>
				<li><a href="#">Sample Menu</a></li>
			</ul>
		</li>
		<li> <a href="http://www.freetimelearning.com/contact-us.php" target="_blank">Contact Us</a></li>
	</ul>
</nav>
</div>

<script type="text/javascript" src="http://www.freetimelearning.com/plugins/responsive-menus/responsive-menu-8/js/modernizr.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://www.freetimelearning.com/plugins/responsive-menus/responsive-menu-8/js/jquery_menu.js"></script>
body {
	margin: 0;
	padding: 0;
	background:#F2F2F2;
}

#ftl_menu {
	position: absolute;
	padding:20px 0px;
	font-weight:bold;
	left: 300px;
	color:#FC0;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 2.3em;
	z-index: 1;
}
.ftl_push_menu {
	position: absolute;
	overflow: hidden;
	min-width: 100%;
	min-height: 100%;
	margin: 0;
	padding: 0;
}

.ftl_push_menu .levelHolderClass {
	position: absolute;
	overflow: hidden;
	top: 0;
	background:#FC0;
	width: auto;
	min-height: 100%;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1em;
	zoom: 1;
}

.ftl_push_menu .ltr {
	margin-left: -100%;
	left: 0;
	-moz-box-shadow: 5px 0 5px -5px #1f4164;
	-webkit-box-shadow: 5px 0 5px -5px #1f4164;
	box-shadow: 5px 0 5px -5px #1f4164;
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#1f4164,direction=90,strength=2);
}

.ftl_push_menu .rtl {
	margin-right: -100%;
	right: 0;
	-moz-box-shadow: 5px 0 5px 5px #1f4164;
	-webkit-box-shadow: 5px 0 5px 5px #1f4164;
	box-shadow: 5px 0 5px 5px #1f4164;
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#1f4164,direction=270,strength=2);
}

.ftl_push_menu .multilevelpushmenu_inactive {
	background: #FC0;
}

.ftl_push_menu h2 {
	font-size: 1.5em;
	line-height: 1em;
	font-weight: bold;
	color: #1f4164;
	padding: 0 .4em 0 .4em;
}

.ftl_push_menu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.ftl_push_menu li {
	cursor: pointer;
	border-top: 1px solid #295685;
	padding: .4em .4em .4em .4em;
}

.ftl_push_menu li:last-child {
	border-bottom: 1px solid #295685;
}

.ftl_push_menu li:hover {
	background-color:#DDBC00;
}

.ftl_push_menu a {
	display: block;
	outline: none;
	overflow: hidden;
	font-size: 1em;
	line-height: 1em;
	padding: .2em .2em;
	text-decoration: none;
	color: #fff;
}

.ftl_push_menu a:hover {
	color: #ffe;
}

.ftl_push_menu .backItemClass {
	display: block;
	padding: .4em .4em .4em .4em;
	background:#F90;
	border-top: 1px solid #FC0;
}

.ftl_push_menu .floatRight {
	float: right;
}

.ftl_push_menu .floatLeft {
	float: left;
}

.ftl_push_menu .cursorPointer {
	cursor: pointer;
}

.ftl_push_menu .iconSpacing_ltr {
	padding: 0 .4em 0 0;
}

.ftl_push_menu .iconSpacing_rtl {
	padding: 0 0 0 .4em;
}
$(document).ready(function(){
	// HTML markup implementation, overlap mode
	$( '#menu' ).multilevelpushmenu({
		containersToPush: [$( '#ftl_menu' )]
	});
});

We see you’re using an ad blocker.

Our website is made possible by displaying ads to our visitors.

Please help us continue to provide you with free. So please disabling your ad blocker.