<!DOCTYPE html> 
<html>
	<head>
		<meta charset="utf-8">		
		<title>Sky Mega Menu</title>
		
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
		
		<link rel="stylesheet" href="Estilo/demo.css">
		<link rel="stylesheet" href="Estilo/font-awesome.css">
		<link rel="stylesheet" href="Estilo/sky-mega-menu.css">
		<link rel="stylesheet" href="Estilo/sky-mega-menu-orange.css">
		
		<!--[if lt IE 9]>
			<link rel="stylesheet" href="css/sky-mega-menu-ie8.css">
{literal}			
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
		
<![endif]-->
		
		<!--[if lt IE 10]>
			<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
			<script src="js/jquery.placeholder.min.js"></script>
		<![endif]-->
{/literal}
	</head>
	<body class="bg-orange">
		<div class="body">		
			<!-- mega menu -->
			<ul class="sky-mega-menu sky-mega-menu-anim-scale sky-mega-menu-response-to-icons">
				<!-- home -->
				<li>
					<a href="#"><i class="fa fa-single fa-home"></i></a>
				</li>
				<!--/ home -->
				
				<!-- about -->
				<li aria-haspopup="true">
					<a href="#"><i class="fa fa-star"></i>About us</a>
					<div class="grid-container3">
						<ul>
							<li><a href="#"><i class="fa fa-globe"></i>Mission</a></li>
							<li aria-haspopup="true">
								<a href="#"><i class="fa fa-group"></i>Our Team</a>
								<div class="grid-container3">
									<ul>
										<li aria-haspopup="true">
											<a href="#"><i class="fa fa-male"></i>Markus Fisher</a>
											<div class="grid-container3">
												<ul>
													<li><a href="#"><i class="fa fa-leaf"></i>About</a></li>
													<li><a href="#"><i class="fa fa-tasks"></i>Skills</a></li>
													<li><a href="#"><i class="fa fa-comments"></i>Contacts</a></li>
												</ul>
											</div>
										</li>
										<li aria-haspopup="true">
											<a href="#"><i class="fa fa-female"></i>Leyla Sparks</a>
											<div class="grid-container3">
												<ul>
													<li><a href="#"><i class="fa fa-leaf"></i>About</a></li>
													<li><a href="#"><i class="fa fa-tasks"></i>Skills</a></li>
													<li><a href="#"><i class="fa fa-comments"></i>Contacts</a></li>
												</ul>
											</div>
										</li>
										<li aria-haspopup="true">
											<a href="#"><i class="fa fa-male"></i>Gleb Ismailov</a>
											<div class="grid-container3">
												<ul>
													<li><a href="#"><i class="fa fa-leaf"></i>About</a></li>
													<li><a href="#"><i class="fa fa-tasks"></i>Skills</a></li>
													<li><a href="#"><i class="fa fa-comments"></i>Contacts</a></li>
												</ul>
											</div>
										</li>
										<li><a href="#"><i class="fa fa-female"></i>Viktoria Gibbers</a>
									</li>
									</ul>
								</div>
							</li>
							<li><a href="#"><i class="fa fa-trophy"></i>Rewards</a></li>
							<li><a href="#"><i class="fa fa-certificate"></i>Certificates</a></li>
						</ul>
					</div>
				</li>
				<!--/ about -->
				
				<!-- news -->
				<li aria-haspopup="true">
					<a href="#"><i class="fa fa-bullhorn"></i>News</a>
					<div class="grid-container3">
						<ul>
							<li><a href="#"><i class="fa fa-check"></i>Company</a></li>
							<li><a href="#"><i class="fa fa-check"></i>Products</a></li>
							<li><a href="#"><i class="fa fa-check"></i>Specials</a></li>
						</ul>
					</div>
				</li>
				<!--/ news -->
				
				<!-- portfolio -->
				<li aria-haspopup="true">
					<a href="#"><i class="fa fa-briefcase"></i>Portfolio</a>
					<div class="grid-container3">
						<ul>
							<li><a href="#"><i class="fa fa-lemon-o"></i>Logos</a></li>
							<li><a href="#"><i class="fa fa-globe"></i>Websites</a></li>
							<li><a href="#"><i class="fa fa-th-large"></i>Branding</a></li>
							<li><a href="#"><i class="fa fa-picture-o"></i>Illustrations</a></li>
						</ul>
					</div>
				</li>
				<!--/ portfolio -->
				
				<!-- blog -->
				<li>
					<a href="#"><i class="fa fa-edit"></i>Blog</a>
				</li>
				<!--/ blog -->
				
				<!-- contacts form -->
				<li aria-haspopup="true" class="right">
					<a href="#_"><i class="fa fa-envelope-o"></i>Contacts form</a>
					<div class="grid-container6">
						<form action="#">
							<fieldset>					
								<div class="row">
									<section class="col col-6">
										<label class="input">
											<i class="fa fa-append fa-user"></i>
											<input type="text" placeholder="Name">
										</label>
									</section>
									<section class="col col-6">
										<label class="input">
											<i class="fa fa-append fa-envelope-o"></i>
											<input type="email" placeholder="E-mail">
										</label>
									</section>
								</div>
								
								<!---<section>
									<label class="input">
										<i class="fa fa-append fa-tag"></i>
										<input type="text" placeholder="Subject">
									</label>
								</section>
								
								<section>
									<label class="textarea">
										<i class="fa fa-append fa-comment"></i>
										<textarea rows="4" placeholder="Message"></textarea>
									</label> 
								</section> --->
								
								<button type="submit" class="button">Send message</button>
							</fieldset>						
						</form>
					</div>
				</li>
				<!--/ contacts form -->
			</ul>
			<!--/ mega menu -->
		{content}	
		</div>
	</body>
</html>