<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8" />
<title>SmartDesign</title>
<meta name="robots" content="index, follow" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<!-- CSS
================================================== -->
<link rel="stylesheet" href="styles/style.css" />
<link rel="stylesheet" href="styles/color.css" />
<link rel="stylesheet" href="styles/inner.css" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Favicons
================================================== -->
<link rel="shortcut icon" href="images/favicon.ico" />
<link rel="apple-touch-icon" href="images/apple-touch-icon.png" />
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png" />
</head>
<body>
<div id="bodychild">
<div id="outercontainer">
<div class="bg-color inner"></div>
<div id="bg-header" class="inner">
<!-- BEFORE HEADER -->
<div id="outerbeforeheader">
<div class="container">
<div id="beforeheader" class="twelve columns">
<section id="beforetheheader">
Welcome! It's Tuesday May 22, 2013
</section>
</div>
</div>
</div>
<!-- END BEFORE HEADER -->
<!-- HEADER -->
<div id="outerheader">
<div class="container">
<header id="header" class="twelve columns">
<div id="logo" class="three columns alpha"><a href="index-2.html"><img src="images/logo.png" alt=""></a></div>
<section id="navigation" class="nine columns omega">
<nav>
<ul id="topnav" class="sf-menu">
<li><a href="index-2.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="#">Portfolio</a>
<ul>
<li><a href="portfolio.html">Portfolio 1 Column</a></li>
<li><a href="portfolio2.html">Portfolio 2 Column</a></li>
<li><a href="portfolio3.html">Portfolio 3 Column</a></li>
<li><a href="portfolio4.html">Portfolio 4 Column</a></li>
</ul>
</li>
<li class="current"><a href="element.html">Element</a></li>
<li><a href="contact.html">Contact</a></li>
</ul><!-- topnav -->
</nav><!-- nav -->
<div class="clear"></div>
</section>
<div class="clear"></div>
</header>
</div>
</div>
<!-- END HEADER -->
<!-- BEFORE CONTENT -->
<div id="outerbeforecontent">
<div class="container">
<section id="beforecontent" class="twelve columns">
<article id="beforethecontent">
<div class="four columns alpha">
<h1 class="pagetitle">This is<br/> Our<br/> Element</h1>
</div>
<div class="eight columns omega" >
<div class="imgframe">
<img src="images/content/page-img2.jpg" alt="" /><span class="shadowimg586"></span>
</div>
</div>
<div class="clear"></div>
</article>
<div class="clear"></div>
</section>
</div>
</div>
<!-- END BEFORE CONTENT -->
</div>
<!-- MAIN CONTENT -->
<div id="outermain">
<div class="container">
<section id="maincontent" class="twelve columns">
<div class="one_half firstcols">
<h4>Images in Paragraph</h4>
<p><img src="images/content/s1.jpg" class="alignleft frame" alt="" />Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Sed placerat libero quis metus malesuada venenatis. Nulla facilisi. Duis condimentum molestie lacus.</p>
<p>Morbi a eros sed nisi laoreet.Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.laoreet molestie. Nulla facilisi. Duis condimentum molestie lacus ac tincidunt.Morbi a eros sed nisi laoreet molestie. Sed placerat libero quis metus malesuada venenatis. Proin vulputate, ligula id pellentesque laoreet, arcu odio tincidunt nunc, in dictum leo dui sed sapien. Cras rhoncus odio quis risus porta ullamcorper adipiscing nulla sodales. </p>
<p>Nulla facilisi. Duis condimentum molestie lacus ac tincidunt. Cras rhoncus odio quis risus porta ullamcorper adipiscing nulla sodales. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br />
</div>
<div class="one_half lastcols">
<h4>Tables</h4>
<table>
<tbody>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr class="even">
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr class="even">
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Divi