Author: lewismc
Date: Mon Jul 28 12:59:44 2014
New Revision: 1614006
URL: http://svn.apache.org/r1614006
Log:
fix formatting within HTML
Modified:
oodt/cms_site/trunk/content/elements.md
Modified: oodt/cms_site/trunk/content/elements.md
URL:
http://svn.apache.org/viewvc/oodt/cms_site/trunk/content/elements.md?rev=1614006&r1=1614005&r2=1614006&view=diff
==============================================================================
--- oodt/cms_site/trunk/content/elements.md (original)
+++ oodt/cms_site/trunk/content/elements.md Mon Jul 28 12:59:44 2014
@@ -1,521 +1,521 @@
-<!DOCTYPE html>
-<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
-->
-<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en">
<![endif]-->
-<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
-<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
-<!--[if gt IE 8]><!-->
-<html class="no-js" lang="en">
-<!--<![endif]-->
-<head>
-<meta charset="utf-8"/>
-<!-- Set the viewport width to device width for mobile -->
-<meta name="viewport" content="width=device-width"/>
-<title>Studio Francesca - Premium Theme by WowThemes.net</title>
-<!-- Included CSS Files-->
-<link rel="stylesheet" href="stylesheets/style.css">
-<link rel="stylesheet" href="stylesheets/skins/teal.css"><!-- skin color -->
-<link rel="stylesheet" href="stylesheets/responsive.css">
-<!-- IE Fix for HTML5 Tags -->
-<!--[if lt IE 9]>
- <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js";></script>
- <![endif]-->
-</head>
-<body>
-<!-- HIDDEN PANEL
-================================================== -->
-<div id="panel">
- <div class="row">
- <div class="twelve columns">
- <img src="images/info.png" class="pics" alt="info">
- <div class="infotext">
- Thank you for visiting my theme! Replace this
with your message to visitors.
- </div>
- </div>
- </div>
-</div>
-<p class="slide">
- <a href="#" class="btn-slide"></a>
-</p>
-<!-- HEADER
-================================================== -->
-<div class="row">
- <div class="four columns">
- <div class="logo">
- <a href="index.html"><h4>Studio
Francesca</h4></a>
- </div>
- </div>
- <div class="eight columns noleftmarg">
- <nav id="nav-wrap">
- <ul class="nav-bar sf-menu">
-
- <li class="current">
- <a href="index.html">Home</a>
- <ul>
-
- <li><a
href="index2.html">Without slider</a></li>
- </ul>
- </li>
-
- <li>
- <a href="#">Portofolio</a>
- <ul>
- <li><a
href="portofolio2.html">2 Columns</a></li>
- <li><a
href="portofolio3.html">3 Columns</a></li>
- <li><a
href="portofolio4.html">4 Columns</a></li>
- <li><a
href="portofoliodetail.html">Project Details</a></li>
- </ul>
- </li>
-
- <li>
- <a href="#">Blog</a>
- <ul>
- <li><a
href="blogpage1.html">Blog page style 1</a></li>
- <li><a
href="blogpage2.html">Blog page style 2</a></li>
- <li><a
href="blogpage3.html">Blog page style 3</a></li>
- <li><a
href="blogsinglepost.html">Single post</a></li>
- </ul>
- </li>
-
- <li>
- <a href="#">Pages</a>
- <ul>
- <li><a href="about.html">About
us</a></li>
- <li><a
href="services.html">Services</a></li>
- </ul>
- </li>
-
- <li>
- <a href="#">Features</a>
- <ul>
- <li><a
href="columns.html">Columns</a></li>
- <li><a
href="elements.html">Elements</a></li>
- <li><a
href="typography.html">Typography</a></li>
- </ul>
- </li>
-
- <li>
- <a href="contact.html">Contact</a>
- </li>
-
- </ul>
- </nav>
- </div>
-</div>
-<div class="clear">
-</div>
-<!-- SUBHEADER
-================================================== -->
-<div id="subheader" class="blogstyle">
- <div class="row">
- <div class="eight columns">
- <p class="bread leftalign">
- You are here: <a href="index.html"> Home</a> /
<a href="elements.html">Elements</a>
- </p>
- </div>
- <div class="four columns">
- <div class="row collapse">
- <div class="ten mobile-three columns">
- <input type="text" class="nomargin"
placeholder="Search...">
- </div>
- <div class="two mobile-one columns">
- <a href="#" class="postfix button
expand">Go</a>
- </div>
- </div>
- </div>
- </div>
-</div>
-<div class="hr">
-</div>
-<!-- CONTENT
-================================================== -->
-<div class="row">
- <!-- TABS-->
- <div class="six columns">
- <h5>TABS</h5>
- <dl class="tabs">
- <dd class="active"><a href="#simple1">Simple Tab
1</a></dd>
- <dd><a href="#simple2">Simple Tab 2</a></dd>
- <dd><a href="#simple3">Simple Tab 3</a></dd>
- </dl>
- <ul class="tabs-content">
- <li class="active" id="simple1Tab">
- <p>
- This is simple tab 1's content. Pretty neat,
huh? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et non ex maxima
parte de tota iudicabis? Item de contrariis, a quibus ad genera formasque
generum.
- </p>
- <p>
- Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Et non ex maxima parte de tota iudicabis? Item de contrariis,
a quibus ad genera formasque generum venerunt. Sit enim idem caecus, debilis.
Duo Reges: constructio interrete.
- </p>
- <p>
- Sit enim idem caecus, debilis. Duo Reges:
constructio interrete.
- </p>
- </li>
- <li id="simple2Tab">This is simple tab 2's content. Now
you see it! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et non ex
maxima parte de tota iudicabis? Item de contrariis, a quibus ad genera
formasque generum.</li>
- <li id="simple3Tab">This is simple tab 3's content.
It's, you know...okay. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Et non ex maxima parte de tota iudicabis? Item de contrariis, a quibus ad
genera formasque generum.</li>
- </ul>
- </div>
- <!-- ACCORDIONS-->
- <div class="six columns">
- <h5>ACCORDIONS</h5>
- <ul class="accordion">
- <li class="active">
- <div class="title">
- <b>Accordion Panel 1</b>
- </div>
- <div class="content" style="overflow: hidden; display:
block; ">
- <p>
- Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
- </p>
- </div>
- </li>
- <li class="">
- <div class="title">
- <b>Accordion Panel 2</b>
- </div>
- <div class="content" style="overflow: hidden; display:
none; ">
- <p>
- Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
- </p>
- </div>
- </li>
- <li class="">
- <div class="title">
- <b>Accordion Panel 3</b>
- </div>
- <div class="content" style="overflow: hidden; display:
none; ">
- <p>
- Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
- </p>
- </div>
- </li>
- </ul>
-
- </div>
-</div>
- <div class="row">
- <hr>
- <!-- TABLES-->
- <div class="seven columns">
- <h5>TABLES</h5>
- <table>
- <thead>
- <tr>
- <th>
- Table Header
- </th>
- <th>
- Table Header
- </th>
- <th>
- Table Header
- </th>
- <th>
- Table Header
- </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>
- Content
- </td>
- <td>
- This is longer content
- </td>
- <td>
- Content
- </td>
- <td>
- Content
- </td>
- </tr>
- <tr>
- <td>
- Content
- </td>
- <td>
- This is longer content
- </td>
- <td>
- Content
- </td>
- <td>
- Content
- </td>
- </tr>
- <tr>
- <td>
- Content
- </td>
- <td>
- This is longer content
- </td>
- <td>
- Content
- </td>
- <td>
- Content
- </td>
- </tr>
- <tr>
- <td>
- Content
- </td>
- <td>
- This is longer content
- </td>
- <td>
- Content
- </td>
- <td>
- Content
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- <!-- ALERTS-->
- <div class="five columns">
- <h5>ALERTS</h5>
- <div class="alert-box default">
- This is the default alert. <a href=""
class="close">x</a>
- </div>
- <div class="alert-box">
- This is a standard alert. <a href=""
class="close">x</a>
- </div>
- <div class="alert-box success">
- This is a success alert. <a href=""
class="close">x</a>
- </div>
- <div class="alert-box alert">
- This is an alert. <a href=""
class="close">x</a>
- </div>
- <div class="alert-box secondary">
- This is a secondary alert. <a href=""
class="close">x</a>
- </div>
- </div>
- </div>
- <div class="row">
- <hr>
- <!-- VIDEOS-->
- <div class="seven columns">
- <h5>VIDEOS</h5>
- <dl class="tabs contained">
- <dd class="active"><a
href="#video1">4:3</a></dd>
- <dd class=""><a
href="#video2">Widescreen</a></dd>
- <dd class=""><a href="#video3">Vimeo</a></dd>
- </dl>
- <ul class="tabs-content contained">
- <li class="active" id="video1Tab"
style="display: block; ">
- <div class="flex-video">
- <iframe width="420" height="315"
src="http://www.youtube.com/embed/9otNWTHOJi8"; style="border:0px;">
- </iframe>
- </div>
- </li>
- <li id="video2Tab" style="display: none; "
class="">
- <div class="flex-video widescreen">
- <iframe width="560" height="315"
src="http://www.youtube.com/embed/N966cATFWjI"; style="border:0px;">
- </iframe>
- </div>
- </li>
- <li id="video3Tab" style="display: none; "
class="">
- <div class="flex-video widescreen vimeo">
- <iframe
src="http://player.vimeo.com/video/21762736?title=0&byline=0&portrait=0";
width="400" height="225" style="border:0px;">
- </iframe>
- </div>
- </li>
- </ul>
- </div>
- <!-- PROGRESS BARS-->
- <div class="five columns">
- <h5>PROGRESS BARS</h5>
- <div class="progress six">
- <span class="meter"></span>
- </div>
- <div class="radius progress success eight">
- <span class="meter"></span>
- </div>
- <div class="nice round progress alert ten">
- <span class="meter"></span>
- </div>
- <div class="nice secondary progress">
- <span class="meter"></span>
- </div>
- <div class="hr">
- </div>
- <h5>BUTTONS</h5>
- <a href="#" class="button">Button</a>
- <a href="#" class="success button">Button</a>
- <a href="#" class="secondary button">Button</a>
- <a href="#" class="alert button">Button</a>
- <div class="minipause"></div>
- <div class="button dropdown">
- Dropdown
- <ul>
- <li><a href="#">Dropdown Item</a></li>
- <li><a href="#">Another Dropdown
Item</a></li>
- <li class="divider"></li>
- <li><a href="#">Last Item</a></li>
- </ul>
- </div>
- </div>
- </div>
- <div class="row">
- <hr>
- <!-- FORMS-->
- <div class="seven columns">
- <h5>FORMS</h5>
- <form>
- <fieldset>
- <legend>Form Title Here</legend>
- <div class="row">
- <div class="five columns">
- <label>Name</label>
- <input type="text"
class="smoothborder"/>
-
<label>Occupation</label>
- <input type="text"
class="smoothborder"/>
- <label>Twitter</label>
- <div class="row
collapse">
- <div class="two
columns">
- <span
class="prefix">@</span>
- </div>
- <div class="ten
columns">
- <input
type="text" placeholder="twitterusername" class="smoothborder"/>
- </div>
- </div>
- <label>URL</label>
- <div class="row
collapse">
- <div
class="nine columns">
- <input
type="text" placeholder="website" class="smoothborder"/>
- </div>
- <div
class="three columns">
- <span
class="postfix">.com</span>
- </div>
- </div>
- </div>
- </div>
- <label>Address</label>
- <input type="text" placeholder="Street
(e.g. 123 Amazing St.)"/>
- <div class="row">
- <div class="eight columns">
- <input type="text"
placeholder="City" class="smoothborder"/>
- </div>
- <div class="four columns">
- <input type="text"
placeholder="ZIP" class="smoothborder"/>
- </div>
- </div>
- </fieldset>
- </form>
- </div>
- <div class="five columns">
- <!-- PANELS-->
- <h5>PANELS</h5>
- <div class="panel">
- <h5>This is a regular panel.</h5>
- <p>
- It has an easy to override visual
style, and is appropriately subdued.
- </p>
- </div>
- <div class="panel callout radius">
- <h5>This is a callout panel.</h5>
- <p>
- A little ostentatious, but useful for
important content.
- </p>
- </div>
- <div class="hr">
- </div>
- <!-- PAGINATION-->
- <h5>PAGINATION</h5>
- <ul class="pagination">
- <li class="arrow unavailable"><a
href="">«</a></li>
- <li class="current"><a href="">1</a></li>
- <li><a href="">2</a></li>
- <li><a href="">3</a></li>
- <li><a href="">4</a></li>
- <li class="unavailable"><a
href="">…</a></li>
- <li><a href="">12</a></li>
- <li><a href="">13</a></li>
- <li class="arrow"><a href="">»</a></li>
- </ul>
- </div>
- </div>
-<div class="hr">
-</div>
-<!-- TWITTER
-================================================== -->
-<div class="tweetarea">
- <div class="tweettext">
- <div class="row">
- <div class="twelve columns">
- <div class="tweet">
- </div>
- </div>
- </div>
- </div>
-</div>
-<!-- FOOOTER
-================================================== -->
-<div id="footer">
- <footer class="row">
- <p class="back-top floatright">
- <a href="#top"><span></span></a>
- </p>
- <div class="four columns">
- <h1>ABOUT US</h1>
- Our goal is to keep clients satisfied!
- </div>
- <div class="four columns">
- <h1>GET SOCIAL</h1>
- <div class="social facebook">
- <a href="#"></a>
- </div>
- <div class="social twitter">
- <a href="#"></a>
- </div>
- <div class="social deviantart">
- <a href="#"></a>
- </div>
- <div class="social flickr">
- <a href="#"></a>
- </div>
- <div class="social dribbble">
- <a href="#"></a>
- </div>
- </div>
- <div class="four columns">
- <h1 class="newsmargin">NEWSLETTER</h1>
- <div class="row collapse newsletter floatright">
- <div class="ten mobile-three columns">
- <input type="text" class="nomargin"
placeholder="Enter your e-mail address...">
- </div>
- <div class="two mobile-one columns">
- <a href="#" class="postfix button expand">GO</a>
- </div>
- </div>
- </div>
- </footer>
-</div>
-<div class="copyright">
- <div class="row">
- <div class="six columns">
- ©<span class="small"> Copyright 2013 Your Agency
Name</span>
- </div>
- <div class="six columns">
- <span class="small floatright"> Purchase "Studio
Francesca" - WowThemes.net</span>
- </div>
- </div>
-</div>
-<!-- JAVASCRIPTS
-================================================== -->
-<!-- Javascript files placed here for faster loading -->
-<script src="javascripts/foundation.min.js"></script>
-<script src="javascripts/jquery.cycle.js"></script>
-<script src="javascripts/app.js"></script>
-<script src="javascripts/modernizr.foundation.js"></script>
-<script src="javascripts/slidepanel.js"></script>
-<script src="javascripts/scrolltotop.js"></script>
-<script src="javascripts/hoverIntent.js"></script>
-<script src="javascripts/superfish.js"></script>
-<script src="javascripts/responsivemenu.js"></script>
-<script src="javascripts/jquery.tweet.js"></script>
-<script src="javascripts/twitterusername.js"></script>
-</body>
+<!DOCTYPE html>
+<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
-->
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en">
<![endif]-->
+<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
+<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
+<!--[if gt IE 8]><!-->
+<html class="no-js" lang="en">
+<!--<![endif]-->
+<head>
+<meta charset="utf-8"/>
+<!-- Set the viewport width to device width for mobile -->
+<meta name="viewport" content="width=device-width"/>
+<title>Studio Francesca - Premium Theme by WowThemes.net</title>
+<!-- Included CSS Files-->
+<link rel="stylesheet" href="stylesheets/style.css">
+<link rel="stylesheet" href="stylesheets/skins/teal.css"><!-- skin color -->
+<link rel="stylesheet" href="stylesheets/responsive.css">
+<!-- IE Fix for HTML5 Tags -->
+<!--[if lt IE 9]>
+ <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js";></script>
+ <![endif]-->
+</head>
+<body>
+<!-- HIDDEN PANEL
+================================================== -->
+<div id="panel">
+ <div class="row">
+ <div class="twelve columns">
+ <img src="images/info.png" class="pics" alt="info">
+ <div class="infotext">
+ Thank you for visiting my theme! Replace this
with your message to visitors.
+ </div>
+ </div>
+ </div>
+</div>
+<p class="slide">
+ <a href="#" class="btn-slide"></a>
+</p>
+<!-- HEADER
+================================================== -->
+<div class="row">
+ <div class="four columns">
+ <div class="logo">
+ <a href="index.html"><h4>Studio
Francesca</h4></a>
+ </div>
+ </div>
+ <div class="eight columns noleftmarg">
+ <nav id="nav-wrap">
+ <ul class="nav-bar sf-menu">
+
+ <li class="current">
+ <a href="index.html">Home</a>
+ <ul>
+
+ <li><a
href="index2.html">Without slider</a></li>
+ </ul>
+ </li>
+
+ <li>
+ <a href="#">Portofolio</a>
+ <ul>
+ <li><a
href="portofolio2.html">2 Columns</a></li>
+ <li><a
href="portofolio3.html">3 Columns</a></li>
+ <li><a
href="portofolio4.html">4 Columns</a></li>
+ <li><a
href="portofoliodetail.html">Project Details</a></li>
+ </ul>
+ </li>
+
+ <li>
+ <a href="#">Blog</a>
+ <ul>
+ <li><a
href="blogpage1.html">Blog page style 1</a></li>
+ <li><a
href="blogpage2.html">Blog page style 2</a></li>
+ <li><a
href="blogpage3.html">Blog page style 3</a></li>
+ <li><a
href="blogsinglepost.html">Single post</a></li>
+ </ul>
+ </li>
+
+ <li>
+ <a href="#">Pages</a>
+ <ul>
+ <li><a href="about.html">About
us</a></li>
+ <li><a
href="services.html">Services</a></li>
+ </ul>
+ </li>
+
+ <li>
+ <a href="#">Features</a>
+ <ul>
+ <li><a
href="columns.html">Columns</a></li>
+ <li><a
href="elements.html">Elements</a></li>
+ <li><a
href="typography.html">Typography</a></li>
+ </ul>
+ </li>
+
+ <li>
+ <a href="contact.html">Contact</a>
+ </li>
+
+ </ul>
+ </nav>
+ </div>
+</div>
+<div class="clear">
+</div>
+<!-- SUBHEADER
+================================================== -->
+<div id="subheader" class="blogstyle">
+ <div class="row">
+ <div class="eight columns">
+ <p class="bread leftalign">
+ You are here: <a href="index.html"> Home</a> /
<a href="elements.html">Elements</a>
+ </p>
+ </div>
+ <div class="four columns">
+ <div class="row collapse">
+ <div class="ten mobile-three columns">
+ <input type="text" class="nomargin"
placeholder="Search...">
+ </div>
+ <div class="two mobile-one columns">
+ <a href="#" class="postfix button
expand">Go</a>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+<div class="hr">
+</div>
+<!-- CONTENT
+================================================== -->
+<div class="row">
+ <!-- TABS-->
+ <div class="six columns">
+ <h5>TABS</h5>
+ <dl class="tabs">
+ <dd class="active"><a href="#simple1">Simple Tab
1</a></dd>
+ <dd><a href="#simple2">Simple Tab 2</a></dd>
+ <dd><a href="#simple3">Simple Tab 3</a></dd>
+ </dl>
+ <ul class="tabs-content">
+ <li class="active" id="simple1Tab">
+ <p>
+ This is simple tab 1's content. Pretty neat,
huh? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et non ex maxima
parte de tota iudicabis? Item de contrariis, a quibus ad genera formasque
generum.
+ </p>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Et non ex maxima parte de tota iudicabis? Item de contrariis,
a quibus ad genera formasque generum venerunt. Sit enim idem caecus, debilis.
Duo Reges: constructio interrete.
+ </p>
+ <p>
+ Sit enim idem caecus, debilis. Duo Reges:
constructio interrete.
+ </p>
+ </li>
+ <li id="simple2Tab">This is simple tab 2's content. Now
you see it! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et non ex
maxima parte de tota iudicabis? Item de contrariis, a quibus ad genera
formasque generum.</li>
+ <li id="simple3Tab">This is simple tab 3's content.
It's, you know...okay. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Et non ex maxima parte de tota iudicabis? Item de contrariis, a quibus ad
genera formasque generum.</li>
+ </ul>
+ </div>
+ <!-- ACCORDIONS-->
+ <div class="six columns">
+ <h5>ACCORDIONS</h5>
+ <ul class="accordion">
+ <li class="active">
+ <div class="title">
+ <b>Accordion Panel 1</b>
+ </div>
+ <div class="content" style="overflow: hidden; display:
block; ">
+ <p>
+ Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
+ </p>
+ </div>
+ </li>
+ <li class="">
+ <div class="title">
+ <b>Accordion Panel 2</b>
+ </div>
+ <div class="content" style="overflow: hidden; display:
none; ">
+ <p>
+ Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
+ </p>
+ </div>
+ </li>
+ <li class="">
+ <div class="title">
+ <b>Accordion Panel 3</b>
+ </div>
+ <div class="content" style="overflow: hidden; display:
none; ">
+ <p>
+ Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.
+ </p>
+ </div>
+ </li>
+ </ul>
+
+ </div>
+</div>
+<div class="row">
+ <hr>
+ <!-- TABLES-->
+ <div class="seven columns">
+ <h5>TABLES</h5>
+ <table>
+ <thead>
+ <tr>
+ <th>
+ Table Header
+ </th>
+ <th>
+ Table Header
+ </th>
+ <th>
+ Table Header
+ </th>
+ <th>
+ Table Header
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ Content
+ </td>
+ <td>
+ This is longer content
+ </td>
+ <td>
+ Content
+ </td>
+ <td>
+ Content
+ </td>
+ </tr>
+ <tr>
+ <td>
+ Content
+ </td>
+ <td>
+ This is longer content
+ </td>
+ <td>
+ Content
+ </td>
+ <td>
+ Content
+ </td>
+ </tr>
+ <tr>
+ <td>
+ Content
+ </td>
+ <td>
+ This is longer content
+ </td>
+ <td>
+ Content
+ </td>
+ <td>
+ Content
+ </td>
+ </tr>
+ <tr>
+ <td>
+ Content
+ </td>
+ <td>
+ This is longer content
+ </td>
+ <td>
+ Content
+ </td>
+ <td>
+ Content
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+<!-- ALERTS-->
+<div class="five columns">
+ <h5>ALERTS</h5>
+ <div class="alert-box default">
+ This is the default alert. <a href="" class="close">x</a>
+</div>
+<div class="alert-box">
+This is a standard alert. <a href="" class="close">x</a>
+</div>
+<div class="alert-box success">
+This is a success alert. <a href="" class="close">x</a>
+</div>
+<div class="alert-box alert">
+This is an alert. <a href="" class="close">x</a>
+</div>
+<div class="alert-box secondary">
+This is a secondary alert. <a href="" class="close">x</a>
+</div>
+</div>
+</div>
+<div class="row">
+<hr>
+<!-- VIDEOS-->
+ <div class="seven columns">
+ <h5>VIDEOS</h5>
+ <dl class="tabs contained">
+ <dd class="active"><a
href="#video1">4:3</a></dd>
+ <dd class=""><a
href="#video2">Widescreen</a></dd>
+ <dd class=""><a href="#video3">Vimeo</a></dd>
+ </dl>
+ <ul class="tabs-content contained">
+ <li class="active" id="video1Tab"
style="display: block; ">
+ <div class="flex-video">
+ <iframe width="420" height="315"
src="http://www.youtube.com/embed/9otNWTHOJi8"; style="border:0px;">
+ </iframe>
+ </div>
+ </li>
+ <li id="video2Tab" style="display: none; "
class="">
+ <div class="flex-video widescreen">
+ <iframe width="560" height="315"
src="http://www.youtube.com/embed/N966cATFWjI"; style="border:0px;">
+ </iframe>
+ </div>
+ </li>
+ <li id="video3Tab" style="display: none; "
class="">
+ <div class="flex-video widescreen vimeo">
+ <iframe
src="http://player.vimeo.com/video/21762736?title=0&byline=0&portrait=0";
width="400" height="225" style="border:0px;">
+ </iframe>
+ </div>
+ </li>
+ </ul>
+ </div>
+ <!-- PROGRESS BARS-->
+ <div class="five columns">
+ <h5>PROGRESS BARS</h5>
+ <div class="progress six">
+ <span class="meter"></span>
+ </div>
+ <div class="radius progress success eight">
+ <span class="meter"></span>
+ </div>
+ <div class="nice round progress alert ten">
+ <span class="meter"></span>
+ </div>
+ <div class="nice secondary progress">
+ <span class="meter"></span>
+ </div>
+ <div class="hr">
+ </div>
+ <h5>BUTTONS</h5>
+ <a href="#" class="button">Button</a>
+ <a href="#" class="success button">Button</a>
+ <a href="#" class="secondary button">Button</a>
+ <a href="#" class="alert button">Button</a>
+ <div class="minipause"></div>
+ <div class="button dropdown">
+ Dropdown
+ <ul>
+ <li><a href="#">Dropdown Item</a></li>
+ <li><a href="#">Another Dropdown
Item</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Last Item</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+ <hr>
+ <!-- FORMS-->
+ <div class="seven columns">
+ <h5>FORMS</h5>
+ <form>
+ <fieldset>
+ <legend>Form Title Here</legend>
+ <div class="row">
+ <div class="five columns">
+ <label>Name</label>
+ <input type="text"
class="smoothborder"/>
+
<label>Occupation</label>
+ <input type="text"
class="smoothborder"/>
+ <label>Twitter</label>
+ <div class="row
collapse">
+ <div class="two
columns">
+ <span
class="prefix">@</span>
+ </div>
+ <div class="ten
columns">
+ <input
type="text" placeholder="twitterusername" class="smoothborder"/>
+ </div>
+ </div>
+ <label>URL</label>
+ <div class="row
collapse">
+ <div
class="nine columns">
+ <input
type="text" placeholder="website" class="smoothborder"/>
+ </div>
+ <div
class="three columns">
+ <span
class="postfix">.com</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <label>Address</label>
+ <input type="text" placeholder="Street
(e.g. 123 Amazing St.)"/>
+ <div class="row">
+ <div class="eight columns">
+ <input type="text"
placeholder="City" class="smoothborder"/>
+ </div>
+ <div class="four columns">
+ <input type="text"
placeholder="ZIP" class="smoothborder"/>
+ </div>
+ </div>
+ </fieldset>
+ </form>
+ </div>
+ <div class="five columns">
+ <!-- PANELS-->
+ <h5>PANELS</h5>
+ <div class="panel">
+ <h5>This is a regular panel.</h5>
+ <p>
+ It has an easy to override visual
style, and is appropriately subdued.
+ </p>
+ </div>
+ <div class="panel callout radius">
+ <h5>This is a callout panel.</h5>
+ <p>
+ A little ostentatious, but useful for
important content.
+ </p>
+ </div>
+ <div class="hr">
+ </div>
+ <!-- PAGINATION-->
+ <h5>PAGINATION</h5>
+ <ul class="pagination">
+ <li class="arrow unavailable"><a
href="">«</a></li>
+ <li class="current"><a href="">1</a></li>
+ <li><a href="">2</a></li>
+ <li><a href="">3</a></li>
+ <li><a href="">4</a></li>
+ <li class="unavailable"><a
href="">…</a></li>
+ <li><a href="">12</a></li>
+ <li><a href="">13</a></li>
+ <li class="arrow"><a href="">»</a></li>
+ </ul>
+ </div>
+ </div>
+<div class="hr">
+</div>
+<!-- TWITTER
+================================================== -->
+<div class="tweetarea">
+ <div class="tweettext">
+ <div class="row">
+ <div class="twelve columns">
+ <div class="tweet">
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+<!-- FOOOTER
+================================================== -->
+<div id="footer">
+ <footer class="row">
+ <p class="back-top floatright">
+ <a href="#top"><span></span></a>
+ </p>
+ <div class="four columns">
+ <h1>ABOUT US</h1>
+ Our goal is to keep clients satisfied!
+ </div>
+ <div class="four columns">
+ <h1>GET SOCIAL</h1>
+ <div class="social facebook">
+ <a href="#"></a>
+ </div>
+ <div class="social twitter">
+ <a href="#"></a>
+ </div>
+ <div class="social deviantart">
+ <a href="#"></a>
+ </div>
+ <div class="social flickr">
+ <a href="#"></a>
+ </div>
+ <div class="social dribbble">
+ <a href="#"></a>
+ </div>
+ </div>
+ <div class="four columns">
+ <h1 class="newsmargin">NEWSLETTER</h1>
+ <div class="row collapse newsletter floatright">
+ <div class="ten mobile-three columns">
+ <input type="text" class="nomargin"
placeholder="Enter your e-mail address...">
+ </div>
+ <div class="two mobile-one columns">
+ <a href="#" class="postfix button expand">GO</a>
+ </div>
+ </div>
+ </div>
+ </footer>
+</div>
+<div class="copyright">
+ <div class="row">
+ <div class="six columns">
+ ©<span class="small"> Copyright 2013 Your Agency
Name</span>
+ </div>
+ <div class="six columns">
+ <span class="small floatright"> Purchase "Studio
Francesca" - WowThemes.net</span>
+ </div>
+ </div>
+</div>
+<!-- JAVASCRIPTS
+================================================== -->
+<!-- Javascript files placed here for faster loading -->
+<script src="javascripts/foundation.min.js"></script>
+<script src="javascripts/jquery.cycle.js"></script>
+<script src="javascripts/app.js"></script>
+<script src="javascripts/modernizr.foundation.js"></script>
+<script src="javascripts/slidepanel.js"></script>
+<script src="javascripts/scrolltotop.js"></script>
+<script src="javascripts/hoverIntent.js"></script>
+<script src="javascripts/superfish.js"></script>
+<script src="javascripts/responsivemenu.js"></script>
+<script src="javascripts/jquery.tweet.js"></script>
+<script src="javascripts/twitterusername.js"></script>
+</body>
</html>
\ No newline at end of file
