Team:Hong Kong UCCKE/HTML Test
<link href="http://themeinthebox.com/demo/mountain-king-html/bootstrap/css/theme.css" rel="stylesheet">
<link href="http://themeinthebox.com/demo/mountain-king-html/style.css" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700,100' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway:300,700,900,500' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/typicons/2.0.7/typicons.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://themeinthebox.com/demo/mountain-king-html/assets/css/pushy.css">
<link rel="stylesheet" href="http://themeinthebox.com/demo/mountain-king-html/assets/css/masonry.css">
<link rel="stylesheet" href="http://themeinthebox.com/demo/mountain-king-html/assets/css/animate.css">
<link rel="stylesheet" href="http://themeinthebox.com/demo/mountain-king-html/assets/css/magnific-popup.css">
<link rel="stylesheet" href="http://themeinthebox.com/demo/mountain-king-html/assets/css/odometer-theme-default.css">
<script>
window.odometerOptions = {
selector: '.odometer',
format: '(,ddd)', // Change how digit groups are formatted, and how many digits are shown after the decimal point
duration: 13000, // Change how long the javascript expects the CSS animation to take
theme: 'default'
};
</script>
<body class="">
<nav class="pushy pushy-left">
- <a href="#home">Home</a>
- <a href="#feat">Features</a>
- <a href="#about">About me</a>
- <a href="#news">My Blog</a>
- <a href="#history">My History</a>
- <a href="#photos">Look my Photos</a>
- <a href="#contact">Get in Touch!</a>
- <a href="http://www.themeinthebox.com/ourtheme/mountain-king-bootstrap-template/" target="_blank">Download</a>
</nav>
<header id="home">
<a href="#" class="thumbnail logo">
<img src="images/your_logo.png" alt="" class="img-responsive">
</a>
Contents
In the hall of the</br> Mountain King
This is a simple hero unit, a simple jumbotron-style component for
calling extra attention to featured content or information.
<a class="btn btn-primary btn-lg" role="button">Learn more</a> <a target="_blank" href="http://www.themeinthebox.com/ourtheme/mountain-king-bootstrap-template/" class="btn btn-lg btn-danger" role="button">Download</a>
</header>
<section id="feat">
Consectetur Risus
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
Ultricies Aenean
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec ullamcorper nulla non metus auctor fringilla.
Cras Sollicitudin
Etiam porta sem malesuada magna mollis euismod. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum.
</section>
<section id="about" class="number wow fadeInUp" data-wow-delay="300ms">
Ligula Mattis Ornare Ultricies
Pellentesque Cursus Amet Parturient Etiam
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
Ultricies
00000
Fermentum
00000
</section>
<section id="news" class="blog wow fadeInUp" data-wow-delay="300ms">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec sed odio dui. Curabitur blandit tempus porttitor. Nullam id dolor id nibh ultricies vehicula ut id elit. Etiam porta sem malesuada magna mollis euismod.
Donec id elit non mi porta gravida at eget metus. Donec id elit non mi porta gravida at eget metus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nulla vitae elit libero, a pharetra augue.
<a class="btn btn-danger btn-lg" href="#">Take a Look </a>
<a href="#">
<img src="https://unsplash.it/1200/1200?image=839" alt="" class="img-responsive">
</a>
</section>
<section id="history" class="story wow fadeInUp" data-wow-delay="300ms">
Donec sed odio dui. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
– Fermentum Dapibus
Nibh Etiam Risus Bibendum
Nullam id dolor id nibh ultricies vehicula ut id elit.
</section>
<section id="photos" class="gallery wow fadeInUp" data-wow-delay="300ms">
<a href="https://unsplash.it/1000/600?image=529"> <img src="https://unsplash.it/600/300?image=529" alt="" /> </a>
<a href="https://unsplash.it/1000/600?image=523"> <img src="https://unsplash.it/320/776?image=523" alt="" /> </a>
<a href="https://unsplash.it/600/1000?image=503"> <img src="https://unsplash.it/500/800?image=503" alt="" /> </a>
<a href="https://unsplash.it/1000/600?image=505"> <img src="https://unsplash.it/400/400?image=505" alt="" /> </a>
<a href="https://unsplash.it/800/800?image=454"> <img src="https://unsplash.it/4403/2476?image=454" alt="" /> </a>
<a href="https://unsplash.it/800/800?image=515"> <img src="https://unsplash.it/585/439?image=515" alt="" /> </a>
<a href="https://unsplash.it/1000/600?image=451"> <img src="https://unsplash.it/600/140?image=451" alt="" /> </a>
</section>
<section class="clients wow fadeInUp" data-wow-delay="300ms">
<img src="images/logo-sample-01.jpg" class="img-responsive" />
<img src="images/logo-sample-02.jpg" class="img-responsive" />
<img src="images/logo-sample-03.png" class="img-responsive" />
<img src="images/logo-sample-04.jpg" class="img-responsive" />
<img src="images/logo-sample-05.jpg" class="img-responsive" />
<img src="images/logo-sample-06.png" class="img-responsive" />
</section>
<section id="contact" class="prefooter wow fadeInUp" data-wow-delay="300ms">
Maecenas sed diam eget risus varius
blandit sit amet non magna.
Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
<input type="text" class="form-control" placeholder="Your Email Here...">
<button type="button" class="btn btn-danger">Submit Newsletter</button>
</section>
<footer>
Your Logo
© 2016 Your Company. Designed and Developed by <a target="_blank" href="http://www.themeinthebox.com">ThemeintheBox.com</a>
</footer>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/jquery.min.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/bootstrap/js/bootstrap.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-scrollspy.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/ie10-viewport-bug-workaround.js"></script>
<script src="http://masonry.desandro.com/masonry.pkgd.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/masonry.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/pushy.min.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/jquery.magnific-popup.min.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/wow.min.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/scripts.js"></script>
<script src="http://themeinthebox.com/demo/mountain-king-html/assets/js/odometer.js"></script>
</body>
</html>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-34344036-1', 'auto');
ga('send', 'pageview');
</script>
