software
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Software</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
body {
font-family: tahoma, helvetica, arial, sans-serif;
font-size: 10px;
text-align: center;
background: url(software-images/page_bg.jpg);
color: #6f6f6f;
}
html, body, #wrapper, h1, #nav-top, #nav-top li, #nav-left, #nav-top li {
margin: 0;
padding: 0;
list-style: none;
}
th, td {
font-size: 11px;
}
img { border: 0; }
#wrapper {
margin: 16px auto;
text-align: left;
width: 750px;
position: relative;
}
h1, h2, h3 {
font-size: 11px;
}
h1 {
margin: 0;
padding: 0;
}
h2 {
margin: 0 0 5px 0;
padding: 0;
}
h3 {
padding: 4px 0 0 0;
}
p {
margin: 1em 0;
padding: 0;
}
.block {
display: block;
}
.clear {
clear: both;
height: 1px;
padding-top: 0;
margin-top: 0;
margin-bottom: 0;
font-size: 1px;
line-height: 1px;
}
* html .clear {
margin-top: -5px;
margin-bottom: -4px;
}
.left {
float: left;
margin: 1px 8px 0px 0px;
}
.softright {
text-align: right;
}
.readmore {
text-align: right;
}
/* ***** */
#wrapper {
width: 688px;
}
/* header */
#header {
background: url(software-images/header_bg.gif) repeat-x;
position: relative;
width: 688px;
margin-bottom: 11px;
}
#header .bl { height: 157px; }
#header .tr { background: url(software-images/header_tr.gif) top right no-repeat; }
#header .bl { background: url(software-images/header_bl.gif) bottom left no-repeat; }
#header .br { background: url(software-images/header_br.jpg) bottom right no-repeat; width:100%;}
/* the story of two navs */
#nav-top {
position: absolute;
top: 17px; left: 252px;
color: #fff;
}
#nav-top li {
display: inline;
}
#nav-top a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
#nav-top a:hover {
text-decoration: underline;
}
#nav-left {
position: absolute;
top: 66px; left: 26px;
}
/* body */
#body {
background: url(software-images/body_bg.gif) repeat-y;
}
#body h2 {
margin: 0 0 1.5em 0;
}
#body h3 {
margin: 0 0 0 0;
}
#body ul {
margin: 0;
padding: 0;
list-style: none;
}
#body li {
padding: 0;
margin: 0.8em 0;
}
a {
color: #ce7210;
}
a:hover {
color: #6f3f0b;
}
#cap {
background: url(software-images/column_cap.gif) no-repeat;
padding-top: 19px;
width: 688px;
}
#buy {
float: left;
width: 189px;
margin-left: 12px;
display: inline;
}
#capabilities {
float: left;
width: 225px;
margin-left: 28px;
}
#capabilities p {
line-height: 1.5;
}
#capabilities h3 {
font-size: 10px;
}
#news {
float: left;
width: 190px;
margin-left: 34px;
}
#news h3 {
font-size: 10px;
}
#news h3 a {
text-decoration: none;
}
#news p {
line-height: 1.5;
}
.timed {
background: #5b96da url(software-images/support_bg.jpg) no-repeat;
color: #fff;
padding: 10px 10px 1.3em 71px;
margin: 2em 0;
border-bottom: 1px solid white;
}
.timed .readmore {
margin-bottom: 0;
}
.timed h3 {
margin: 0;
padding: 0;
text-indent: -57px;
}
.timed a {
color: #fff;
}
.timed a:hover {
text-decoration: none;
}
/* footer */
#footer {
clear: both;
text-align: center;
background: url(software-images/footer_bg.gif) repeat-x;
}
#footer div div { padding: 8px 0; }
#footer, #footer a {
color: #fff;
}
#footer div { background: url(software-images/footer_l.gif) no-repeat; width:100%; }
#footer div div { background: url(software-images/footer_r.gif) top right no-repeat;width:100%; width:100%; }
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<div class="tr">
<div class="br">
<div class="bl">
<h1><a href="http://www.free-css.com/"><img src="software-images/logo.gif" width="203" height="49" alt="Software Company" /></a></h1>
<ul id="nav-top">
<li><a href="http://www.free-css.com/">Home</a> | </li>
<li><a href="http://www.free-css.com/">Your cart</a> | </li>
<li><a href="http://www.free-css.com/">Solutions</a> | </li>
<li><a href="http://www.free-css.com/">Products</a> | </li>
<li><a href="http://www.free-css.com/">Contacts</a></li>
</ul>
<!-- end top-nav -->
<ul id="nav-left">
<li><a href="http://www.free-css.com/"><img src="software-images/menu_1.gif" width="96" height="19" alt="Partners" /></a></li>
<li><a href="http://www.free-css.com/"><img src="software-images/menu_2.gif" width="96" height="18" alt="Home and Office" /></a></li>
<li><a href="http://www.free-css.com/"><img src="software-images/menu_3.gif" width="96" height="19" alt="Small Business" /></a></li>
</ul>
</div>
</div>
</div>
<!-- end .corners -->
</div>
<!-- end header -->
<div id="body">
<div id="cap"></div>
<div id="buy">
<h2><img src="software-images/title_reasons_to_buy.gif" width="95" height="14" alt="reasons to buy" /></h2>
<ul>
<li><a href="http://www.free-css.com/">Single source</a></li>
<li><a href="http://www.free-css.com/">Multi-platform integration</a></li>
<li><a href="http://www.free-css.com/">Exceptional service</a></li>
<li><a href="http://www.free-css.com/">Comprehensive documentation</a></li>
<li><a href="http://www.free-css.com/">Tutorials</a></li>
<li><a href="http://www.free-css.com/">Scalability</a></li>
<li><a href="http://www.free-css.com/">High quality</a></li>
</ul>
<div class="timed">
<h3>Get Support 24x7</h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
<p class="readmore"><a href="http://www.free-css.com/">...Go for more</a></p>
</div>
<!-- end .timed -->
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
</div>
<!-- end buy -->
<div id="capabilities">
<h2><img src="software-images/title_capabilities.gif" width="120" height="14" alt="capabilities" /></h2>
<h3><a href="http://www.free-css.com/">This is a demo text. It will be replaced by the original.</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text.</p>
<h3><a href="http://www.free-css.com/">This is a demo text. It will be replaced by the original.</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
<h3><a href="http://www.free-css.com/">This is a demo text. It will be replaced by the original.</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
</div>
<!-- end capabilities -->
<div id="news">
<h2><img src="software-images/title_news.gif" width="96" height="14" alt="company news" /></h2>
<h3><a href="http://www.free-css.com/">July 11, 2005</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. This is a demo text. It will be replaced by the original.</p>
<h3><a href="http://www.free-css.com/">July 12, 2005</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. This is a demo text. It will be replaced by the original.</p>
<h3><a href="http://www.free-css.com/">July 13, 2005</a></h3>
<p>This is a demo text. It will be replaced by the original. This is a demo text. This is a demo text. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original. This is a demo text. It will be replaced by the original.</p>
</div>
<!-- end news -->
<div id="footer">
<div>
<div> Powered by <a href="http://www.freewebsitetemplates.com">Free Website Templates</a> </div>
</div>
</div>
<!-- end footer -->
</div>
<!-- end body -->
</div>
<!-- end wrapper -->
</body>
</html>
Related examples in the same category