ad-agency
<!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">
<head>
<title>Advertising Agency</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type='text/css'>
/*----------- collingarythomasgrasley (modetwentythree.com) collingrasley@gmail.com --- public domain template, because sharing is good ------- no link back required, but it would be real swell :) --------------------*/
/* ----------------- page styles -------------------------------------------------------*/
body { padding:0; margin:0; font:11px Verdana, sans-serif; line-height: 17px; background:#f4f4f4 url(../ad-agency-images/bodybg.gif) center repeat-y; color: #555; }
#wrapper { margin:2px auto; width:900px; padding:0; background:#fff;}
/* ----------------- general styles -------------------------------------------------------*/
a { color:#631e19; text-decoration: underline;background:none; }
a:hover { color:#894e4e; background:none; text-decoration:underline; }
p { margin:0;padding-top:2px;}
h2 { font-weight:bold; font-size:12px; padding:0px 0 4px 0px; margin: 0 0 2px 0; color:#444; background:none; border-bottom: 2px dotted #444; }
ul { margin: 0; padding : 0; list-style : none; }
img { border: 0;}
h4 {font: 30px 'HelveticaNeue-CondensedBold', 'Arial Narrow', Helvetica, Arial, sans-serif; margin:0;}
.pic{margin-top:8px;}
/* ----------------- top info -------------------------------------------------------*/
#header { clear:both; width:900px; height:80px; background: url(../ad-agency-images/header.jpg) no-repeat;
margin:0; }
#title {float:left; width:240px; padding: 20px 0 10px 60px;}
#title h3 {font-size:12px; padding:5px 0 0 0; margin:0; color:#444;}
#hright {float:right; width:540px; height: 60px; margin:15px 0 0 0;}
#hrighttop {width: 200px;margin: 0 2px 0 0; padding: 0 8px 2px 0; float:right; text-align: right;}
#title p {font-size: 0.9em; color: #808080; padding: 0; background: inherit;}
#menu { width: 540px; float:right; margin:2px 0 0 0; padding:0; text-align:right;}
#menu li { display:inline; }
#menu li a { color:#444; text-decoration:none; padding:1px 10px 1px 10px;
height:19px; background:none;}
#menu li a:hover { background: none;color:#631e19;}
/* ----------------- Main content -------------------------------------------------------*/
#homepic {width:900px; height:250px; margin:5px 0 10px 0;background: url(../ad-agency-images/homepic.jpg) no-repeat;}
#homepic a {color:#fff;}
#homepic:hover {background: url(../ad-agency-images/homepichover.jpg) no-repeat;}
.message{ position:absolute; width:360px; float:left; margin:70px 0px 0px 165px; color:#fff;}
#bottomcontenttop{width:900px;height:10px;background: url(../ad-agency-images/b_contenttop.jpg) no-repeat;}
#bottomcontent{width:898px; height:300px;border-right:1px solid #c5c5c5;border-left:1px solid #c5c5c5;}
#bottomcontentbtm{width:900px;height:10px;background: url(../ad-agency-images/b_contentbtm.jpg) no-repeat;}
.left {float: right;width: 270px;margin: 0 6px 5px 0; padding:10px;}
.middle {float: right;width: 270px;margin: 0 6px 5px 0; padding:10px;}
.right {float: right;width: 270px;margin: 0 6px 5px 0; padding:10px;}
.thumbs img{position:relative;padding:1px;margin:5px 8px 5px 9px;border:2px solid #631e19;background:none;}
.thumbs img:hover{border:2px solid #c5c5c5; background:none;}
/* ----------------- Bottom content -------------------------------------------------------*/
#footer { clear: both; text-align:center; line-height: 1.8em; color: #444; background: #fff; padding: 4px 0;
margin:10px 0 0 0;}
#footer a {color: #631e19; background: inherit;}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="hright">
<div id="hrighttop">
<p><a href="http://www.free-css.com/">Log in</a> | <a href="http://www.free-css.com/">Register</a> | <a href="http://www.free-css.com/">Client</a></p>
</div>
<div id="menu">
<ul>
<li><a href="http://www.free-css.com/">Home</a> |</li>
<li><a href="http://www.free-css.com/">Services</a> |</li>
<li><a href="http://www.free-css.com/">Our people</a> |</li>
<li><a href="http://www.free-css.com/">Client list</a> |</li>
<li><a href="http://www.free-css.com/">Our Process</a> |</li>
<li><a href="http://www.free-css.com/">Contact us</a></li>
</ul>
</div>
</div>
<div id="title">
<h3>Your Advertising Agency</h3>
<p>Lorem Ipsum Dolor Sit Amet</p>
</div>
</div>
<div id="homepic">
<div class="message">
<h4>We are creative. Lorem ipsum </h4>
<p>"Lorem ipsum dolor, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ipsum dolor, consectetuer."<br />
<a href="http://www.free-css.com/">>> Lorem ipsum dolor, consectetuer</a></p>
</div>
</div>
<div id="bottomcontenttop"></div>
<div id="bottomcontent">
<div class="right">
<h2>Featured work - 2007 </h2>
<p class="thumbs"> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> <a href="http://www.free-css.com/"><img src="ad-agency-images/thumb.jpg" width="40" height="40" alt="" /></a> </p>
<p>Lorem ipsum dolor, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim <a href="http://www.free-css.com/">>> Lorem ipsum dolor</a></p>
</div>
<div class="middle">
<h2>Lorem ipsum dolor, consectetuer</h2>
<img src="ad-agency-images/02.jpg" alt="" class="pic" width="270" height="60" />
<p>Lorem ipsum dolor, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad <a href="http://www.free-css.com/">minim veniam</a>, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis minim<a href="http://www.free-css.com/"><br />
>> Lorem ipsum dolor, consectetuer</a></p>
</div>
<div class="left">
<h2>Lorem ipsum dolor, consectetuer</h2>
<img src="ad-agency-images/01.jpg" alt="" class="pic" width="270" height="60" />
<p>Lorem ipsum dolor, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore <a href="http://www.free-css.com/">magna nisl ut aliquip</a> ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse <a href="http://www.free-css.com/">molestie consequat</a>, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla <a href="http://www.free-css.com/">>> Lorem ipsum dolor consectetuer</a>.</p>
</div>
</div>
<div id="bottomcontentbtm"></div>
<div id="footer">
<p>©2007 your info here - <a href="http://www.modetwentythree.com/">m23</a> | <a href="mailto:collingrasley@gmail.com">coll23</a> | <a href="http://www.free-css.com/">Home</a> | <a href="http://www.free-css.com/">Our people</a> | <a href="http://www.free-css.com/">Client list</a> | <a href="http://www.free-css.com/">Our process</a> | <a href="http://www.free-css.com/">Contact us</a> | <a href="http://www.free-css.com/">RSS Feed</a> | <a target="_blank" href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a target="_blank" href="http://validator.w3.org/check?uri=referer">XHTML</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category