Team:HIT-Harbin
From 2013.igem.org
Line 1: | Line 1: | ||
- | + | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
- | <html> | + | <html xmlns="http://www.w3.org/1999/xhtml"> |
- | <head> | + | <head> |
+ | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> | ||
+ | <title>HIT-Harbin</title> | ||
- | <!-- | + | <!-- CSS Imports --> |
- | ======== | + | <link href="css/prettyPhoto.css" media="screen" rel="stylesheet" type="text/css" /> |
- | < | + | <link href="css/nivo-slider.css" media="screen" rel="stylesheet" type="text/css" /> |
- | + | <link href="css/style.css" media="screen" rel="stylesheet" type="text/css" /> | |
+ | </head> | ||
- | < | + | <body> |
- | + | ||
- | + | ||
- | < | + | <div id="root"> |
- | + | ||
- | + | ||
- | <!-- | + | <!-- HEADER START --> |
- | + | ||
- | + | ||
- | < | + | <div id="header"> |
- | = | + | <div class="header-bar"> |
- | < | + | <div id="logo"> |
- | < | + | <h1><a href="#">HIT-Harbin</a></h1> |
- | </ | + | </div> |
- | + | ||
- | + | ||
- | < | + | <ul id="menu"> |
- | < | + | <li class="current-menu-item"> |
- | <div class="four columns"> | + | <a href="index.html">Home</a> |
- | < | + | <ul class="sub-menu"> |
- | </ | + | <li><a href="homepage-ver2.html">Homepage ver 2</a></li> |
+ | <li><a href="homepage-ver3.html">Homepage ver 3</a></li> | ||
+ | <li><a href="sidebar-layouts.html">Sidebar layouts</a></li> | ||
+ | <li><a href="gallery.html">Gallery page</a></li> | ||
+ | <li><a href="column-layouts.html">Column layouts</a></li> | ||
+ | <li><a href="column-layouts-sidebar.html">Column layouts + sidebar</a></li> | ||
+ | <li> | ||
+ | <a href="#" class="more">Another submenu</a> | ||
+ | <ul class="sub-menu"> | ||
+ | <li><a href="#">Sample links</a></li> | ||
+ | <li><a href="#">For you</a></li> | ||
+ | <li><a href="#">To enjoy</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="portfolio.html">Portfolio</a> | ||
+ | <ul class="sub-menu"> | ||
+ | <li><a href="portfolio-ver2.html">2 columns</a></li> | ||
+ | <li><a href="portfolio-sidebar.html">Portfolio + sidebar</a></li> | ||
+ | <li><a href="portfolio-single.html">Single page</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="blog.html">Blog</a> | ||
+ | <ul class="sub-menu"> | ||
+ | <li><a href="blog-single.html">Blog single page</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="services.html">Services</a></li> | ||
+ | <li> | ||
+ | <a href="#"><span>Mega Menu</span></a> | ||
+ | <div class="pixel-mega-menu four-columns"> | ||
+ | <ul class="sub-menu"> | ||
+ | <li class="fourth-column"> | ||
+ | <h4>Sample menu</h4> | ||
+ | <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p> | ||
+ | <ul class="sub-menu"> | ||
+ | <li><a href="#">Custom Shortcodes</a></li> | ||
+ | <li><a href="#">Video demo</a></li> | ||
+ | <li><a href="#" class="last">Submenu item 3</a></li> | ||
+ | <li><a href="#" class="last">Custom Shortcodes</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="fourth-column"> | ||
+ | <h4>Another sample menu</h4> | ||
+ | <ul class="sub-menu"> | ||
+ | <li><a href="#">Shortcodes</a></li> | ||
+ | <li><a href="#">Video demo</a></li> | ||
+ | <li><a href="#" class="last">Submenu item 3</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="fourth-column"> | ||
+ | <h4>Shortcodes</h4> | ||
+ | <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p> | ||
+ | </li> | ||
+ | <li class="fourth-column last"> | ||
+ | <h4>Shortcodes</h4> | ||
+ | <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p> | ||
+ | </li> | ||
- | <div | + | </ul> |
+ | </div> | ||
+ | </li> | ||
+ | <li><a href="contact.html">Contact</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
- | + | <div id="subheader-bar"> | |
- | <div id=" | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | < | + | <div class="site-description">This could be a short description line of the site. Very useful.</div> |
- | + | ||
- | </div> | + | |
- | <!-- | + | </div> |
- | + | </div> <!-- END HEADER --> | |
- | <!-- | + | <!-- CONTENT START --> |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
+ | <div id="content"> | ||
+ | <div class="mainarea"> | ||
- | + | <!-- NIVO SLIDER --> | |
- | <!-- | + | |
- | <div class=" | + | <div class="px-slider-wrapper" id="slider"> |
+ | <div class="px-slider nivoSlider"> | ||
+ | <a href="default.htm"><img src="images/demo-images/slider-img-1.jpg" alt="" title="#slider-caption-1" /></a> | ||
+ | <img src="images/demo-images/slider-img-2.jpg" title="#slider-caption-2" alt="" /> | ||
+ | <a href="default.htm"><img src="images/demo-images/slider-img-3.jpg" alt="" title="This is a caption demo" /></a> | ||
+ | <img src="images/demo-images/slider-img-4.jpg" alt="" title="This is another caption demo" /> | ||
+ | <a href="default.htm"><img src="images/demo-images/slider-img-5.jpg" alt="" title="#slider-caption-3" /></a> | ||
+ | </div> | ||
- | <div class=" | + | <div id="slider-caption-1" class="nivo-html-caption"> |
+ | <span class="caption-title">Vivid coloring</span> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt. | ||
+ | </div> | ||
+ | <div id="slider-caption-2" class="nivo-html-caption"> | ||
+ | <span class="caption-title">Sample title</span> | ||
+ | <span>This</span> is an example of a <em>HTML</em> caption with <a href="#">a link</a>. | ||
+ | </div> | ||
+ | <div id="slider-caption-3" class="nivo-html-caption"> | ||
+ | <span class="caption-title">Simple questions</span> | ||
+ | Lorem ipsum dolor sit amet, consectetur adipisicing elit. | ||
+ | </div> | ||
+ | </div> | ||
- | < | + | <!-- CALL TO ACTION BOX --> |
- | + | <div class="cta-box"> | |
- | + | <a href="#" class="custom-button">Learn More</a> | |
- | < | + | <p>You can promote your files here just by following some easy stepts.</p> |
- | < | + | </div> |
- | + | <!-- SITE FEATURES --> | |
- | < | + | |
- | + | <h6 class="hashed"><span>Site features</span></h6> | |
+ | <div class="multi-columns"> | ||
+ | <div class="fourth"> | ||
+ | <div class="custom-headline">Quicker installation</div> | ||
+ | <img src="images/clock-icon.png" alt="" class="alignleft icon" /> | ||
+ | <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.</p> | ||
+ | <a href="#" class="more-button">more</a> | ||
+ | </div> | ||
+ | <div class="fourth"> | ||
+ | <div class="custom-headline">Great navigation</div> | ||
+ | <img src="images/compass-icon.png" alt="" class="alignleft icon" /> | ||
+ | <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.</p> | ||
+ | <a href="#" class="more-button">more</a> | ||
+ | </div> | ||
+ | <div class="fourth"> | ||
+ | <div class="custom-headline">Easy to configure</div> | ||
+ | <img src="images/mouse-icon.png" alt="" class="alignleft icon" /> | ||
+ | <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.</p> | ||
+ | <a href="#" class="more-button">more</a> | ||
+ | </div> | ||
+ | <div class="fourth last"> | ||
+ | <div class="custom-headline">Monthly updates</div> | ||
+ | <img src="images/clock-icon.png" alt="" class="alignleft icon" /> | ||
+ | <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.</p> | ||
+ | <a href="#" class="more-button">more</a> | ||
+ | </div> | ||
+ | </div> | ||
- | + | <!-- RECENT WORK --> | |
- | + | <h6 class="hashed"><span>Recent work</span></h6> | |
+ | <div class="multi-columns recent-work"> | ||
+ | <div class="third"> | ||
+ | <a href="#" class="image-holder preload"> | ||
+ | <span class="image-zoom"></span> | ||
+ | <img src="images/demo-images/recent-work-img1.jpg" alt="" class="aligncenter" /> | ||
+ | </a> | ||
+ | <div class="custom-headline"><a href="#">My first work</a></div> | ||
+ | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | ||
+ | </div> | ||
+ | <div class="third"> | ||
+ | <a href="#" class="image-holder preload"> | ||
+ | <span class="image-zoom"></span> | ||
+ | <img src="images/demo-images/recent-work-img2.jpg" alt="" class="aligncenter" /> | ||
+ | </a> | ||
+ | <div class="custom-headline"><a href="#">My second work</a></div> | ||
+ | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | ||
+ | </div> | ||
+ | <div class="third last"> | ||
+ | <a href="#" class="image-holder preload"> | ||
+ | <span class="image-zoom"></span> | ||
+ | <img src="images/demo-images/recent-work-img3.jpg" alt="" class="aligncenter" /> | ||
+ | </a> | ||
+ | <div class="custom-headline"><a href="#">My third work</a></div> | ||
+ | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | </div><!-- END CONTENT --> | ||
- | + | <!-- FOOTER START --> | |
- | + | <div id="footer"> | |
+ | <div class="wrapper960"> | ||
+ | <div class="multi-columns"> | ||
- | + | <div class="third footer-sidebar-1"> | |
+ | <div class="widget"> | ||
+ | <h6 class="hashed"><span>Archives</span></h6> | ||
+ | <ul> | ||
+ | <li><a href="#">December 2011</a></li> | ||
+ | <li><a href="#">November 2011</a></li> | ||
+ | <li><a href="#">June 2011</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
- | + | <div class="widget"> | |
+ | <h6 class="hashed"><span>Categories</span></h6> | ||
+ | <ul> | ||
+ | <li><a href="#">Barriers</a></li> | ||
+ | <li><a href="#">Design Tips & Tricks</a></li> | ||
+ | <li><a href="#">Manipulating images</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
- | + | <div class="third footer-sidebar-2"> | |
+ | <div class="widget dribble-shots-widget"> | ||
+ | <h6 class="hashed"><span>Dribble shots</span></h6> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img1.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img2.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img3.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img4.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img5.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img5.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img5.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#"><img src="images/demo-images/dribble-img5.jpg" alt="" /></a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
- | + | <div class="third footer-sidebar-3 last"> | |
- | < | + | <div class="widget twitter-widget"> |
- | <p> | + | <h6 class="hashed"><span>Twitter</span></h6> |
+ | <ul> | ||
+ | <li> | ||
+ | <p><a href="#">@Yojimbo</a>Why is everything "lil" in the music industry. Especially when the artist that goes with that name is an ugly son of a bitch.</p> | ||
+ | <span class="twitdate">20 hours ago</span> | ||
+ | </li> | ||
+ | <li class="last"> | ||
+ | <p><a href="#">@Zatoichi</a>Listening to 'Why Not Sell Physical Stuff With Digital Media ? <a href="#">http://www.copyblogger.com/online-marketing-physical-products/</a> via <a href="#">@copyblogger</a></p> | ||
+ | <span class="twitdate">24 hours ago</span> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <a href="#" class="custom-button">Follow us on Twitter</a> | ||
+ | </div> | ||
+ | </div> | ||
- | + | </div> | |
+ | </div> | ||
+ | </div><!-- END FOOTER --> | ||
- | + | <!-- SUBFOOTER START --> | |
- | + | <div id="subfooter"> | |
- | < | + | <div class="wrapper960"> |
- | < | + | <div class="copyright-note">Hajimari © All rights reserved 2013.</div> |
+ | <ul class="subfooter-menu"> | ||
+ | <li><a href="#">Home</a></li> | ||
+ | <li><a href="#">Portfolio</a></li> | ||
+ | <li><a href="#">Blog</a></li> | ||
+ | <li><a href="#">Contact</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div><!-- END SUBFOOTER --> | ||
- | |||
- | + | </div> | |
- | |||
- | + | <!-- JAVASCRIPT Imports --> | |
- | + | <script type="text/javascript" src="js/jquery/jquery-all.min.js"></script> | |
- | </ | + | <script type="text/javascript" src="js/jquery/jquery.color.js"></script> |
- | < | + | <script type="text/javascript" src="js/cufon/cufon-yui.js"></script> |
- | < | + | <script type="text/javascript" src="js/cufon/Bebas_5F400.font.js"></script> |
- | < | + | <script type="text/javascript" src="js/jquery/jquery.roundabout.min.js"></script> |
- | </ | + | <script type="text/javascript" src="js/jquery/jquery.nivo.slider.pack.js"></script> |
- | </ | + | <script type="text/javascript" src="js/jquery/jquery.jcarousel.min.js"></script> |
- | </ | + | <script type="text/javascript" src="js/jquery/jquery.prettyPhoto.js"></script> |
+ | <script type="text/javascript" src="js/main.js"></script> | ||
+ | <script type="text/javascript"> Cufon.now(); </script> | ||
- | + | <div style="display:none"><script src='http://v7.cnzz.com/stat.php?id=155540&web_id=155540' language='JavaScript' charset='gb2312'></script></div> | |
- | <div | + | |
</body> | </body> | ||
</html> | </html> |
Revision as of 06:59, 22 September 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
You can promote your files here just by following some easy stepts.
Site features
![](images/clock-icon.png)
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.
more![](images/compass-icon.png)
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.
more![](images/mouse-icon.png)
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.
more![](images/clock-icon.png)
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor.
moreRecent work
![](images/demo-images/recent-work-img1.jpg)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
![](images/demo-images/recent-work-img2.jpg)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.