2 <html xmlns="http://www.w3.org/1999/xhtml"
5 <meta charset="utf-8" />
6 <title>A Drop Above</title>
7 <link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
8 <link rel="stylesheet" type="text/css" href="print.css" media="print" />
9 <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
10 <link rel="stylesheet" type="text/css" href="superfish.css" media="screen"/>
11 <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
12 <script type="text/javascript" src="js/hoverIntent.js"></script>
13 <script type="text/javascript" src="js/superfish.js"></script>
14 <script type="text/javascript">
18 jQuery('ul.sf-menu').superfish();
24 <div id="wrapper"><!-- #wrapper -->
35 <a href="#">Mission</a>
38 <a href="#">Our Team</a>
40 <li><a href="#">Joe</a></li>
41 <li><a href="#">Jane</a></li>
42 <li><a href="#">Tom</a></li>
46 <a href="#">Office Locations</a>
48 <li><a href="#">New York</a></li>
49 <li><a href="#">Chicago</a></li>
50 <li><a href="#">Denver</a></li>
56 <a href="#">Products</a>
59 <a href="#">Widgets</a>
61 <li><a href="#">Red</a></li>
62 <li><a href="#">Blue</a></li>
66 <a href="#">Wodgets</a>
68 <li><a href="#">Basic</a></li>
69 <li><a href="#">Advanced</a></li>
70 <li><a href="#">Pro</a></li>
76 <a href="#">Contact Us</a>
79 </nav><!-- end of top nav -->
81 <header><!-- header -->
82 <h1><a href="#">A Drop Above</a></h1>
83 <h2>Your tag line here</h2>
84 </header><!-- end of header -->
86 <section id="main"><!-- #main content and sidebar area -->
87 <section id="content"><!-- #content -->
90 <h2><a href="#">First Article Title</a></h2> <img
91 src="images/flowersky.jpg" alt="flower" class="alignleft"/>
93 Lorem ipsum dolor sit amet, consectetur adipiscing
94 elit. Integer nec odio. Praesent libero. Sed cursus ante
95 dapibus diam. Sed nisi. Nulla quis sem at nibh elementum
96 imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce
97 nec tellus sed augue semper porta. Mauris
98 massa. Vestibulum lacinia arcu eget nulla. Class aptent
99 taciti sociosqu ad litora torquent per conubia nostra,
100 per inceptos himenaeos. Curabitur sodales ligula in
101 libero. Sed dignissim lacinia nunc.
106 <h2><a href="#">Second Article Title</a></h2>
108 Lorem ipsum dolor sit amet, consectetur adipiscing
109 elit. Integer nec odio. Praesent libero. Sed cursus ante
110 dapibus diam. Sed nisi. Nulla quis sem at nibh elementum
111 imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce
112 nec tellus sed augue semper porta. Mauris
113 massa. Vestibulum lacinia arcu eget nulla. Class aptent
114 taciti sociosqu ad litora torquent per conubia nostra,
115 per inceptos himenaeos. Curabitur sodales ligula in
116 libero. Sed dignissim lacinia nunc.
119 Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem
120 at nibh elementum imperdiet. Duis sagittis
121 ipsum. Praesent mauris. Fusce nec tellus sed augue
122 semper porta. Mauris massa. Vestibulum lacinia arcu eget
123 nulla. Class aptent taciti sociosqu ad litora torquent
124 per conubia nostra, per inceptos himenaeos. Curabitur
125 sodales ligula in libero. Sed dignissim lacinia nunc.
129 </section><!-- end of #content -->
131 <aside id="sidebar"><!-- sidebar -->
134 <li><a href="#">Curabitur sodales</a></li>
135 <li><a href="#">Sed dignissim</a></li>
136 <li><a href="#">Fusce nec</a></li>
137 <li><a href="#">Nulla quis</a></li>
142 <li><a href="#">Blah</a></li>
143 <li><a href="#">More blah</a></li>
146 </aside><!-- end of sidebar -->
148 </section><!-- end of #main content and sidebar-->
151 <section id="footer-area">
153 <section id="footer-outer-block">
154 <aside class="footer-segment">
157 <li><a href="#">one linkylink</a></li>
158 <li><a href="#">two linkylinks</a></li>
159 <li><a href="#">three linkylinks</a></li>
160 <li><a href="#">four linkylinks</a></li>
161 <li><a href="#">five linkylinks</a></li>
163 </aside><!-- end of #first footer segment -->
165 <aside class="footer-segment">
166 <h4>Awesome Stuff</h4>
168 <li><a href="#">one linkylink</a></li>
169 <li><a href="#">two linkylinks</a></li>
170 <li><a href="#">three linkylinks</a></li>
171 <li><a href="#">four linkylinks</a></li>
172 <li><a href="#">five linkylinks</a></li>
174 </aside><!-- end of #second footer segment -->
176 <aside class="footer-segment">
179 <li><a href="#">one linkylink</a></li>
180 <li><a href="#">two linkylinks</a></li>
181 <li><a href="#">three linkylinks</a></li>
182 <li><a href="#">four linkylinks</a></li>
183 <li><a href="#">five linkylinks</a></li>
185 </aside><!-- end of #third footer segment -->
187 <aside class="footer-segment">
190 Integer nec odio. Praesent libero. Sed cursus ante
191 dapibus diam. Sed nisi. Nulla quis sem at nibh
192 elementum imperdiet. Duis sagittis ipsum. Praesent
193 mauris. Fusce nec tellus sed augue semper porta.
195 </aside><!-- end of #fourth footer segment -->
197 </section><!-- end of footer-outer-block -->
199 </section><!-- end of footer-area -->
202 </div><!-- #wrapper -->
203 <!-- Free template created by http://freehtml5templates.com -->