Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
243 lines (219 sloc) 8.12 KB
<!DOCTYPE html>
<html>
<head>
<title>[brand]</title>
<!-- CSS -->
<link href="lib/css/main.css" type="text/css" rel="stylesheet" />
<link href="lib/css/jquery.fancybox-1.3.4.css" type="text/css" rel="stylesheet" />
<!-- JS -->
<!--[if lt IE 9]><script type="text/javascript" src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="lib/js/jquery.fancybox-1.3.4.pack.js"></script>
<script src="lib/js/jquery.validate.min.js"></script>
<script src="lib/js/jquery.hoverIntent.min.js"></script>
<script src="lib/js/scripts.js"></script>
</head>
<body>
<div class="headerContainer">
<div class="header">
<h1><a href="#" target="new">[brand]</a></h1>
<nav>
<a class="iframe" id="emailToFriend" href="email.html">Send to a friend</a>
<a class="iframe" id="getYourFreeBallcap" href="ballcap.html">Get Your Free Ballcap</a>
<a id="findYourDealer" href="#" target="new">Find Your Dealer</a>
</nav>
</div>
</div>
<div class="featureContainer feature0">
<div class="features">
<div id="slideshow">
<section id="feature0"></section>
<!-- DD13 -->
<section id="feature1" class="active">
<div class="sectionContents">
<header>
DD13&reg;. Big power. In a small package.
</header>
<div class="models">
<div id="m4700">
<h3>4700</h3>
<p>
The quality and value of a [brand] with the power and efficiency of a [product] engine &mdash; built specifically for the challenges of vocational applications.
</p>
<p class="link">
<a href="#" target="new">See the 4700.</a>
</p>
</div>
<div id="m4800">
<h3>4800</h3>
<p>
The most power in the shortest BBC. The 4800 with a DD13 offers up to 470 horsepower in just 109 inches.
</p>
<p class="link">
<a href="#" target="new">See the 4800.</a>
</p>
</div>
<div id="m4900">
<h3>4900</h3>
<p>
For short or LTL hauls, the DD13 offers all the power you need, with the efficiency you&#39;ve always wanted.
</p>
<p class="link">
<a href="#" target="new">See the 4900.</a>
</p>
</div>
<br clear="all" />
</div>
<a class="cta vidPopup" href="#vid1">See what the people who drove it thought</a>
</div>
</section>
<!-- DD15 -->
<section id="feature2">
<div class="sectionContents">
<header>
DD13&reg;. Big power. In a small package.
</header>
<div class="models">
<div id="m4900">
<h3>4900</h3>
<p>
You can&#39;t find a better match than a 4900 with the DD15. Pair them together and you can do just about anything &mdash; on highway or off.
</p>
<p class="link">
<a href="#" target="new">See the 4900.</a>
</p>
</div>
<div id="m6900">
<h3>6900</h3>
<p>
A powerful truck that takes it easy on fuel on and off the road. You can count on a 6900 with the DD15 to deliver more than efficiency.
</p>
<p class="link">
<a href="#" target="new">See the 6900.</a>
</p>
</div>
<br clear="all" />
</div>
<a class="cta vidPopup" href="#vid2">See what the people who drove it thought</a>
</div>
</section>
<!-- DD16 -->
<section id="feature3">
<div class="sectionContents">
<header>
DD13&reg;. Big power. In a small package.
</header>
<div class="models">
<div id="m4900">
<h3>4900</h3>
<p>
Heavy hauls or hill&#45;pulling torque, nothing will move your 4900 and its loads like the DD16.
</p>
<p class="link">
<a href="#" target="new">See the 4900.</a>
</p>
</div>
<div id="m6900">
<h3>6900</h3>
<p>
A heavy&#45;duty truck with a heavy&#45;duty engine. A 6900 with the DD16 is ready to tackle any challenge out there.
</p>
<p class="link">
<a href="#" target="new">See the 6900.</a>
</p>
</div>
<br clear="all" />
</div>
<a class="cta vidPopup" href="#vid1">See what the people who drove it thought</a>
</div>
</section>
</div>
<nav>
<div class="navWrapper">
<!-- feature nav 1 -->
<div>
<div id="featureNav1" rel="1">
<a rel="1"><img src="lib/images/DD13_navTitle.png" alt="DD13" /></a>
<p>
12.8L / 350-470HP / 1250-1650lb-ft
</p>
<a rel="1" class="learnMore" href="#" target="new">Learn More <img src="lib/images/doubleArrow_right.png" alt=" " style="display: inline;" /></a>
</div>
</div>
<!-- feature nav 2 -->
<div>
<div id="featureNav2" rel="2">
<a rel="2"><img src="lib/images/DD15_navTitle.png" alt="DD15" /></a>
<p>
14.8L / 455-560HP / 1550-1850lb-ft
</p>
<a rel="2" class="learnMore" href="#" target="new">Learn More <img src="lib/images/doubleArrow_right.png" alt=" " style="display: inline;" /></a>
</div>
</div>
<!-- feature nav 3 -->
<div>
<div id="featureNav3" rel="3">
<a rel="3"><img src="lib/images/DD16_navTitle.png" alt="DD15" /></a>
<p>
15.6L / 475-600HP / 1750-2050lb-ft
</p>
<a rel="3" class="learnMore" href="#" target="new">Learn More <img src="lib/images/doubleArrow_right.png" alt=" " style="display: inline;" /></a>
</div>
</div>
</div>
</nav>
</div>
</div>
<div class="body">
<h3>Combine the proven toughness of a factory&#45;custom [brand]<sup style="font-size: 8px; vertical-align: 6px;">&#174;</sup> truck with the industry-leading fuel economy of [product]<sup style="font-size: 8px; vertical-align: 6px;">&#174;</sup> engine. Less downtime, better fuel economy and happy drivers. But don&#39;t just take our word for it. Watch some of the videos here and see what the people who test drove them have to say. </h3>
<section class="videos">
<article id="a1">
<h4>Smooth Power</h4>
<a href="#vid1" class="vidPopup"><img src="lib/images/smoothPower_photo.jpg" /></a>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
</p>
<a class="watch vidPopup" href="#vid1">Watch his story</a>
</article>
<!--
<article id="a2">
<h4>Unbelievable Torque</h4>
<a href="#vid2" class="vidPopup"><img src="lib/images/unbelievableTorque_photo.jpg" /></a>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
</p>
<a class="watch vidPopup" href="#vid2">Watch his story</a>
</article>
-->
<article id="a3">
<h4>Pulls the Hills</h4>
<a href="#vid2" class="vidPopup"><img src="lib/images/pullsTheHills_photo.jpg" /></a>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
</p>
<a href="#vid2" class="watch vidPopup">Watch his story</a>
</article>
</section>
</div>
<div class="footerContainer">
<div class="footerStar">
<footer>
<div>
Copyright &copy; [brand]. <a href="#" target="new">Privacy Statement, Legal Notices, and Terms</a>.<br />
All rights reserved. [brand], Inc. is a subsidiary of [brand], a [brand] company.
</div>
</footer>
</div>
</div>
<div class="footerBottom">&nbsp;</div>
<section class="videoHolder">
<div id="vid1" class="video">[vid1]</div>
<div id="vid2" class="video">[vid2]</div>
<!-- <div id="vid3" class="video">[vid3]</div> -->
</section>
<div id="preloader">
<img src="lib/images/watchHisStory_hover.gif" />
<img src="lib/images/seeWhatThePeopleDrove_hover.png" />
</div>
</body>
</html>