lawyer-and-attorney
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Lawyer & Attorney</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type='text/css'>
?/*
template: Lawyer&Attorney
author: Luka Cvrk (www.solucija.com)
*/
* { margin: 0; padding: 0; }
body { font: .74em Tahoma, Verdana, Sans-Serif, Arial; background: url(../lawyer-and-attorney-images/body.gif) repeat; color: #7f7f7f; }
h1 { font: normal 3.4em "Trebuchet MS", Helvetica, Arial; }
h2 { font: normal 1.8em "Trebuchet MS", Helvetica, Arial; color: #dfdfdf; margin: 0 0 15px; }
h3 { font: normal 1.4em "Trebuchet MS", Helvetica, Arial; margin: 0 0 20px; }
h4 { font: normal 1.2em "Trebuchet MS", Helvetica, Arial; color: #dfdfdf; margin: 0 0 4px; }
p { margin: 0 0 15px; line-height: 1.6em; }
a { outline: 0; color: #304D6F; text-decoration: none; }
li { list-style: none; }
li a, img { display: block; }
img { outline: 0; border: 0; }
#wrapper { width: 984px; margin: auto; }
.clr { clear: both; }
#logo { float: left; padding: 30px 15px; }
#logo h1 a { color: #fff; }
#logo h1 a span { color: #808080; }
#menu { height: 44px; padding: 5px 0 0 4px; }
#menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
#menu li a { color: #888; margin: 0 50px 0 0; }
#menu li a.current, #menu li a:hover { color: #fff; }
#pitch { clear: both; background: url(../lawyer-and-attorney-images/pitch.jpg) no-repeat; height: 228px; margin: 0 0 30px; padding: 60px 360px 0 30px; }
#pitch h1 { font-size: 2.4em; color: #304D6F; margin: 0 0 20px; }
#pitch em { font-size: 1.3em; font-weight: bold; line-height: 1.6em; }
.content { background: url(../lawyer-and-attorney-images/content.gif) repeat; padding: 20px; }
.link { background: #304D6F; color: #fff; padding: 5px 10px; font-size: .9em; }
#main { padding: 20px; }
.col { float: left; width: 292px; margin: 0 30px 15px 0; }
.col.last { float: right; margin-right: 0; }
.case img { float: left; clear: left; margin: 0 20px 20px 0; background: #121212; padding: 3px; }
.short { padding: 0 0 15px 0; background: url(../lawyer-and-attorney-images/line.gif) repeat-x left bottom; }
.case a, .article a { color: #ddd; font-weight: bold; }
.date { font-size: .84em; margin: 0 0 3px; }
#footer { clear: both; background: url(../lawyer-and-attorney-images/line.gif) repeat-x; padding: 20px 20px 10px; font-size: .9em; }
#footer a { color: #ccc; margin: 0 10px 0 0; border-bottom: 1px dotted #444; padding: 0 0 1px; }
#links { float: right; }
#links a { margin: 0 0 0 10px; }
#footer p { margin: 0 0 8px; }
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo">
<h1><a href="#">Lawyer<span>&</span>Attorney</a></h1>
</div>
<div class="clr"></div>
</div>
<div class="content">
<ul id="menu">
<li><a class="current" href="#">Home</a></li>
<li><a href="#">Practice</a></li>
<li><a href="#">Attorneys</a></li>
<li><a href="#">Accidents</a></li>
<li><a href="#">News</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
<div id="pitch">
<h1>Sed at elit non est auctor lobortis sed nec<br />
Vivamus nec odio eget lacus semper</h1>
<p><em>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim risus, rhoncus sit amet ultricies vel, aliquet ut dolor. Duis iaculis urna vel massa ultricies suscipit.</em></p>
</div>
<div class="col">
<h2>Attorneys</h2>
<p>Sed at elit non est auctor lobortis sed nec turpis. Vivamus nec odio eget lacus semper ultrices. Cras rhoncus purus id lectus congue eu faucibus leo bibendum. Curabitur fermentum lobortis nunc, at ornare ante tristique quis.</p>
<a class="link" href="#">MORE</a> </div>
<div class="col">
<h2>Accidents</h2>
<p>Sed at elit non est auctor lobortis sed nec turpis. Vivamus nec odio eget lacus semper ultrices. Cras rhoncus purus id lectus congue eu faucibus leo bibendum. Curabitur fermentum lobortis nunc, at ornare ante tristique quis.</p>
<a class="link" href="#">MORE</a> </div>
<div class="col last">
<h2>Practice</h2>
<p>Sed at elit non est auctor lobortis sed nec turpis. Vivamus nec odio eget lacus semper ultrices. Cras rhoncus purus id lectus congue eu faucibus leo bibendum. Curabitur fermentum lobortis nunc, at ornare ante tristique quis.</p>
<a class="link" href="#">MORE</a> </div>
<div class="clr"></div>
</div>
<div id="main">
<div class="col">
<h3>Latest Articles</h3>
<div class="article">
<p class="date">March, 2010</p>
<h4><a href="#">Truck Accident Lawyers</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
<div class="article">
<p class="date">February, 2010</p>
<h4><a href="#">Car Accident Lawyers</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
<div class="article">
<p class="date">January, 2010</p>
<h4><a href="#">Car Accident Attorneys</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
</div>
<div class="col">
<h3>External Resources</h3>
<div class="article">
<p class="date">March, 2010</p>
<h4><a href="#">Truck Accident Attorneys</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
<div class="article">
<p class="date">February, 2010</p>
<h4><a href="#">Law Firm Marketing</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
<div class="article">
<p class="date">January, 2010</p>
<h4><a href="#">Nunc pellentesque a porta lacus</a></h4>
<p class="short">Quisque scelerisque purus quis eros sollicitudin gravida. Aliquam erat volutpat. Donec a sem consequat. <a href="#">»</a></p>
</div>
</div>
<div class="col last">
<h3>Verdicts and Settlements</h3>
<div class="case"> <img src="lawyer-and-attorney-images/thumb.gif" alt="" />
<p><a href="#">Donec arcu, convallis at pharetra</a><br />
Nunc in neque sem, a porta lacus. Pellentesque habitant morbi tristique senectus et netus et </p>
</div>
<div class="case"> <img src="lawyer-and-attorney-images/thumb.gif" alt="" />
<p><a href="#">Quisque quis laoreet tristique</a><br />
Nunc in neque sem, a porta lacus. Pellentesque habitant morbi tristique senectus et netus et </p>
</div>
<div class="case"> <img src="lawyer-and-attorney-images/thumb.gif" alt="" />
<p><a href="#">Nunc pellentesque a porta lacus</a><br />
Nunc in neque sem, a porta lacus. Pellentesque habitant morbi tristique senectus et netus et </p>
</div>
<div class="case"> <img src="lawyer-and-attorney-images/thumb.gif" alt="" />
<p><a href="#">Nunc pellentesque a porta lacus</a><br />
Nunc in neque sem, a porta lacus. Pellentesque habitant morbi tristique senectus et netus et </p>
</div>
</div>
<div class="clr"></div>
</div>
<div id="footer">
<p id="links"> <a href="#">Privacy Policy</a> <a href="#">Terms of Use</a> </p>
<p> <a href="#">Home</a> <a href="#">Practice</a> <a href="#">Attorneys</a> <a href="#">Accidents</a> <a href="#">News</a> <a href="#">About Us</a> <a href="#">Contact Us</a> </p>
<p>Copyright © 2010 − Lawyer&Attorney · Design: Luka Cvrk, <a href="http://www.solucija.com">Solucija</a> ¬ <a href="http://www.lawyermarketinggroup.com/">Law Firm Marketing</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category