fleeting/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Adometry Landing Page</title>
	<link rel="stylesheet" href="css/app.min.css">
</head>
<body>
	<header>
		<div class="full">
			<div class="header-logo half">
				<a href="#"><img src="images/adometry-logo.png" alt="Adometry Logo"></a>
			</div>

			<div class="half desktop-nav adometry-contact">
				<p><span class="icon-phone"></span> 1-866-512-5425</p>

				<a href="#" class="green-btn" title="Contact Us">Contact Us</a>
			</div> <!-- -->

			<nav class="desktop-nav">
				<ul class="full">
					<li><a href="#" class="current">Overview</a></li>
					<li><a href="#features">Features</a></li>
					<li><a href="#success">Success Stories</a></li>
					<li><a href="#webinar">Live Webinar</a></li>
				</ul>
			</nav> <!-- /.desktop-nav -->

			<nav class="mobile-nav">
				<a href="#" id="menuBtn" class="icon-menu"></a>

				<ul>
					<li><a href="#" class="current">Overview</a></li>
					<li><a href="#features">Features</a></li>
					<li><a href="#success">Success Stories</a></li>
					<li><a href="#webinar">Live Webinar</a></li>
				</ul>
			</nav> <!-- /.mobile-nav -->
		</div>
	</header>

	<section class="hero">
		<div class="hero-btn">
			<a href="#"><span class="chevron bottom"></span></a>
		</div>

		<div class="almost-full half-rtl hero-info">
			<h1>Measure TV like never before with TV attribution.</h1>

			<p>TV attribution allows you to create even stronger connections with your customers. Reveal unique insights into how your TV spend translates to online action, uncover actionable data in real time and optimize your buy – all to position your brand for success.</p>

			<a href="#" class="green-btn">Learn More</a>
		</div>

		<div class="hero-img half-ltr"></div>
	</section> <!-- /.hero -->

	<section class="quote-pane">
		<div class="almost-full">
			<h3 class="intro-text">"Our partnership with Adometry has allowed us to gain a clearer vision, and to evaluate TV creative performance in ways never before possible."</h3>

			<p><strong>CMO</strong> - Financial Services Company</p>
		</div>
	</section> <!-- /.quote-pane -->

	<section class="features content-pane" id="features">
		<div class="almost-full">
			<div class="half">
				<h3 class="section-header">Features</h3>

				<h2 class="intro-text">Connect with customers on a whole new level.</h2>

				<p>When consumers see your brand on TV they often use a second screen to search for your product or visit your site. Adometry by Google allows you to leverage this multi-screen behavior to provide you with a new level of insights to better optimize your offline investments.</p>
			</div>
		</div>

		<div class="almost-full">
			<div class="full">
				<ul id="tabs">
				  <li class="active">
				  	<span class="active"><span class="icon icon-actionable"></span>Actionable <i></i></span>

					<section class="is-open">
						<h3>Optimize your TV Spend.</h3>

						<p>TV attribution provides a wide range of data to deliver the most granular and actionable recommendations. You can see which networks, programs, ad lengths and creative are most effective at motivating customers to interact with your product online.</p>
					</section>
				  </li> <!-- /actionable-tab -->
				  <li>
				  	<span><span class="icon icon-datadriven"></span> Data-Driven <i></i></span>

					<section>
						<h3>Data-Drive CTA</h3>

						<p>Ut laoreet augue et neque pretium non sagittis nibh pulvinar. Etiam ornare tincidunt orci quis ultrices. Pellentesque ac sapien ac purus gravida ullamcorper. Duis rhoncus sodales lacus, vitae adipiscing tellus pharetra sed.</p>
					</section>
				  </li> <!-- /data-driven tab -->
				  <li>
				  	<span><span class="icon icon-quickeasy"></span> Quick &amp; Easy <i></i></span>

					<section>
						<h3>Quick &amp; Easy CTA</h3>

						<p>Donec mattis mauris gravida metus laoreet non rutrum sem viverra. Aenean nibh libero, viverra vel vestibulum in, porttitor ut sapien. Phasellus tempor lorem id justo ornare tincidunt.</p>
					</section>
				  </li> <!-- /quick-easy tab -->
				</ul> <!-- #tabs -->

				<a href="#" class="view-more">See all features <span class="icon-arrow-right2"></span></a>
			</div> <!-- /.full -->
		</div> <!-- /.almost-full -->
	</section> <!-- /.features -->

	<section class="infographic content-pane">
		<div class="almost-full">
			<div class="section-heading">
				<h3 class="section-header">Infographic</h3>
			</div>

			<div class="half-ltr">
				<h3 class="intro-text">Measure TV just like online marketing.</h3>

				<p>TV attribution allows you to connect the dots between TV airings and the actions your customers are taking online. Each time your tv spot drives website traffic or search query spikes, you glean valuable insights into ad performance. See how Nest was able to assess and improve their TV campaigns through the use of minute-by-minute TV attribution analysis.</p>

				<a href="#" class="view-more">Download our infographic <span class="icon-arrow-right2"></span></a>
			</div>

			<div class="half-rtl">
				<img src="images/adometry-tv.png" alt="Adometry Infographic">
			</div>
		</div>
	</section> <!-- /.infographic -->

	<section class="live-webinar content-pane" id="webinar">
		<div class="almost-full">
			<div class="section-heading">
				<h3 class="section-header">Live Webinar</h3>
			</div>

			<div class="half-ltr">
				<h3 class="intro-text">Five ways to use digital to amplify your TV market.</h3>

				<p>Hosted by Adometry by Google with Nest Labs.</p>

				<a href="#" class="view-more">Sign up for the webinar <span class="icon-arrow-right2"></span></a>
			</div>

			<div class="half-rtl">
				<img src="images/adometry-infographic.png" alt="Adometry infographic image">
			</div>
		</div>
	</section> <!-- /.live-webinar -->

	<section class="white-paper content-pane">
		<div class="almost-full">
			<div class="one-third">
				<img src="images/adometry-white-paper.png" alt="Adometry white paper image">
			</div>

			<div class="two-third">
				<h3 class="intro-text">"As marketers it’s our job to understand the shift in customer engagement and act accordingly.""</h3>

				<p><strong>Natasha Moonka</strong> — Product Marketing Manager, Adometry by Google</p>

				<a href="#" class="view-more-white">Download the full whitepaper <span class="icon-arrow-right2"></span></a>
			</div>
		</div>
	</section> <!-- /.white-paper -->

	<section class="adometry-image"></section>

	<section class="case-studies content-pane" id="success">
		<div class="almost-full">
			<h3 class="section-header">Case Studies</h3>

			<p>Our success stories.</p>

			<div class="success-story" id="left-success">
				<div class="one-third">
					<img src="images/financial-services.png" alt="Adometry financial services image">
				</div>

				<div class="two-third">
					<h3>March Madness</h3>

					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur tincidunt leo ut hendrerit. Mauris sapien nisl, tristique ut justo in, posuere sodales sapien.</p>

					<a href="#" class="view-more"><span class="icon-file-pdf"></span> View PDF</a>

				</div>
			</div> <!-- /.success-story -->

			<div class="success-story" id="right-success">
				<div class="one-third">
					<img src="images/financial-services.png" alt="Adometry financial services image">
				</div>

				<div class="two-third">
					<h3>How to Measure and Optimize</h3>

					<p>Proin consectetur tincidunt leo ut hendrerit. Mauris sapien nisl, tristique ut justo in, posuere sodales sapien.</p>

					<a href="#" class="view-more"><span class="icon-file-pdf"></span> View PDF</a>
				</div>
			</div>

			<a href="#" class="view-more-white">See all success stories <span class="icon-arrow-right2"></span></a>
		</div> <!-- /.success-story -->
	</section> <!-- /.case-studies -->

	<footer>
		<div class="almost-full footer-info" id="footer-info">
			<div class="footer-logo half" id="footer-logo">
				<img src="images/adometry-logo.png" alt="Adometry Logo">
			</div>

			<div class="footer-phone half" id="footer-phone">
				<p>Call to learn more.</p>

				<p><span class="icon-phone"></span> 1-866-512-5425</p>
			</div>
		</div>

		<div class="almost-full footer-bottom">
			<ul class="footer-links almost-full">
				<li><a href="#"><img src="images/help-icon.png" alt="Help"> Help</a></li>
				<li><a href="#">Google</a></li>
				<li><a href="#">Privacy</a></li>
				<li><a href="#">Terms</a></li>
			</ul>

			<ul class="footer-lang almost-full">
				<li><a href="#">English <span class="arrow-down"></span></a></li>
			</ul>
		</div>
	</footer>

	<script src="js/app.min.js"></script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Adometry Landing Page</title>
	<link rel="stylesheet" href="css/app.min.css">
	</head>
	<body>
	<header>
	<div class="full">
	<div class="header-logo half">
	<a href="#"><img src="images/adometry-logo.png" alt="Adometry Logo"></a>
	</div>

	<div class="half desktop-nav adometry-contact">
	<p><span class="icon-phone"></span> 1-866-512-5425</p>

	<a href="#" class="green-btn" title="Contact Us">Contact Us</a>
	</div> <!-- -->

	<nav class="desktop-nav">
	<ul class="full">
	<li><a href="#" class="current">Overview</a></li>
	<li><a href="#features">Features</a></li>
	<li><a href="#success">Success Stories</a></li>
	<li><a href="#webinar">Live Webinar</a></li>
	</ul>
	</nav> <!-- /.desktop-nav -->

	<nav class="mobile-nav">
	<a href="#" id="menuBtn" class="icon-menu"></a>

	<ul>
	<li><a href="#" class="current">Overview</a></li>
	<li><a href="#features">Features</a></li>
	<li><a href="#success">Success Stories</a></li>
	<li><a href="#webinar">Live Webinar</a></li>
	</ul>
	</nav> <!-- /.mobile-nav -->
	</div>
	</header>

	<section class="hero">
	<div class="hero-btn">
	<a href="#"><span class="chevron bottom"></span></a>
	</div>

	<div class="almost-full half-rtl hero-info">
	<h1>Measure TV like never before with TV attribution.</h1>

	<p>TV attribution allows you to create even stronger connections with your customers. Reveal unique insights into how your TV spend translates to online action, uncover actionable data in real time and optimize your buy – all to position your brand for success.</p>

	<a href="#" class="green-btn">Learn More</a>
	</div>

	<div class="hero-img half-ltr"></div>
	</section> <!-- /.hero -->

	<section class="quote-pane">
	<div class="almost-full">
	<h3 class="intro-text">"Our partnership with Adometry has allowed us to gain a clearer vision, and to evaluate TV creative performance in ways never before possible."</h3>

	<p><strong>CMO</strong> - Financial Services Company</p>
	</div>
	</section> <!-- /.quote-pane -->

	<section class="features content-pane" id="features">
	<div class="almost-full">
	<div class="half">
	<h3 class="section-header">Features</h3>

	<h2 class="intro-text">Connect with customers on a whole new level.</h2>

	<p>When consumers see your brand on TV they often use a second screen to search for your product or visit your site. Adometry by Google allows you to leverage this multi-screen behavior to provide you with a new level of insights to better optimize your offline investments.</p>
	</div>
	</div>

	<div class="almost-full">
	<div class="full">
	<ul id="tabs">
	<li class="active">
	<span class="active"><span class="icon icon-actionable"></span>Actionable <i></i></span>

	<section class="is-open">
	<h3>Optimize your TV Spend.</h3>

	<p>TV attribution provides a wide range of data to deliver the most granular and actionable recommendations. You can see which networks, programs, ad lengths and creative are most effective at motivating customers to interact with your product online.</p>
	</section>
	</li> <!-- /actionable-tab -->
	<li>
	<span><span class="icon icon-datadriven"></span> Data-Driven <i></i></span>

	<section>
	<h3>Data-Drive CTA</h3>

	<p>Ut laoreet augue et neque pretium non sagittis nibh pulvinar. Etiam ornare tincidunt orci quis ultrices. Pellentesque ac sapien ac purus gravida ullamcorper. Duis rhoncus sodales lacus, vitae adipiscing tellus pharetra sed.</p>
	</section>
	</li> <!-- /data-driven tab -->
	<li>
	<span><span class="icon icon-quickeasy"></span> Quick & Easy <i></i></span>

	<section>
	<h3>Quick & Easy CTA</h3>

	<p>Donec mattis mauris gravida metus laoreet non rutrum sem viverra. Aenean nibh libero, viverra vel vestibulum in, porttitor ut sapien. Phasellus tempor lorem id justo ornare tincidunt.</p>
	</section>
	</li> <!-- /quick-easy tab -->
	</ul> <!-- #tabs -->

	<a href="#" class="view-more">See all features <span class="icon-arrow-right2"></span></a>
	</div> <!-- /.full -->
	</div> <!-- /.almost-full -->
	</section> <!-- /.features -->

	<section class="infographic content-pane">
	<div class="almost-full">
	<div class="section-heading">
	<h3 class="section-header">Infographic</h3>
	</div>

	<div class="half-ltr">
	<h3 class="intro-text">Measure TV just like online marketing.</h3>

	<p>TV attribution allows you to connect the dots between TV airings and the actions your customers are taking online. Each time your tv spot drives website traffic or search query spikes, you glean valuable insights into ad performance. See how Nest was able to assess and improve their TV campaigns through the use of minute-by-minute TV attribution analysis.</p>

	<a href="#" class="view-more">Download our infographic <span class="icon-arrow-right2"></span></a>
	</div>

	<div class="half-rtl">
	<img src="images/adometry-tv.png" alt="Adometry Infographic">
	</div>
	</div>
	</section> <!-- /.infographic -->

	<section class="live-webinar content-pane" id="webinar">
	<div class="almost-full">
	<div class="section-heading">
	<h3 class="section-header">Live Webinar</h3>
	</div>

	<div class="half-ltr">
	<h3 class="intro-text">Five ways to use digital to amplify your TV market.</h3>

	<p>Hosted by Adometry by Google with Nest Labs.</p>

	<a href="#" class="view-more">Sign up for the webinar <span class="icon-arrow-right2"></span></a>
	</div>

	<div class="half-rtl">
	<img src="images/adometry-infographic.png" alt="Adometry infographic image">
	</div>
	</div>
	</section> <!-- /.live-webinar -->

	<section class="white-paper content-pane">
	<div class="almost-full">
	<div class="one-third">
	<img src="images/adometry-white-paper.png" alt="Adometry white paper image">
	</div>

	<div class="two-third">
	<h3 class="intro-text">"As marketers it’s our job to understand the shift in customer engagement and act accordingly.""</h3>

	<p><strong>Natasha Moonka</strong> — Product Marketing Manager, Adometry by Google</p>

	<a href="#" class="view-more-white">Download the full whitepaper <span class="icon-arrow-right2"></span></a>
	</div>
	</div>
	</section> <!-- /.white-paper -->

	<section class="adometry-image"></section>

	<section class="case-studies content-pane" id="success">
	<div class="almost-full">
	<h3 class="section-header">Case Studies</h3>

	<p>Our success stories.</p>

	<div class="success-story" id="left-success">
	<div class="one-third">
	<img src="images/financial-services.png" alt="Adometry financial services image">
	</div>

	<div class="two-third">
	<h3>March Madness</h3>

	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur tincidunt leo ut hendrerit. Mauris sapien nisl, tristique ut justo in, posuere sodales sapien.</p>

	<a href="#" class="view-more"><span class="icon-file-pdf"></span> View PDF</a>

	</div>
	</div> <!-- /.success-story -->

	<div class="success-story" id="right-success">
	<div class="one-third">
	<img src="images/financial-services.png" alt="Adometry financial services image">
	</div>

	<div class="two-third">
	<h3>How to Measure and Optimize</h3>

	<p>Proin consectetur tincidunt leo ut hendrerit. Mauris sapien nisl, tristique ut justo in, posuere sodales sapien.</p>

	<a href="#" class="view-more"><span class="icon-file-pdf"></span> View PDF</a>
	</div>
	</div>

	<a href="#" class="view-more-white">See all success stories <span class="icon-arrow-right2"></span></a>
	</div> <!-- /.success-story -->
	</section> <!-- /.case-studies -->

	<footer>
	<div class="almost-full footer-info" id="footer-info">
	<div class="footer-logo half" id="footer-logo">
	<img src="images/adometry-logo.png" alt="Adometry Logo">
	</div>

	<div class="footer-phone half" id="footer-phone">
	<p>Call to learn more.</p>

	<p><span class="icon-phone"></span> 1-866-512-5425</p>
	</div>
	</div>

	<div class="almost-full footer-bottom">
	<ul class="footer-links almost-full">
	<li><a href="#"><img src="images/help-icon.png" alt="Help"> Help</a></li>
	<li><a href="#">Google</a></li>
	<li><a href="#">Privacy</a></li>
	<li><a href="#">Terms</a></li>
	</ul>

	<ul class="footer-lang almost-full">
	<li><a href="#">English <span class="arrow-down"></span></a></li>
	</ul>
	</div>
	</footer>

	<script src="js/app.min.js"></script>
	</body>
	</html>