software-co
<!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 Co.</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/*
CSS Credit: http://www.templatemo.com/
*/
body {
margin: 0;
padding: 0;
line-height: 1.5em;
font-family: Verdana, Arial, san-serif;
font-size: 11px;
color: #e4e4e4;
background: #000000;
}
a:link, a:visited { color: #CCFF00; text-decoration: none; font-weight: normal; }
a:active, a:hover { color: #FFFF00; text-decoration: underline; }
p {
margin: 0px;
padding: 0px;
}
.cleaner {
clear: both;
width: 100%;
height: 1px;
font-size: 1px;
}
.cleaner_with_height {
clear: both;
width: 100%;
height: 30px;
font-size: 1px;
}
.readmore a {
clear: both;
float: left;
height: 21px;
width: 100px;
padding: 2px 0 0 10px;
margin: 0 15px 10px 0;
text-align: center;
font-weight: bold;
text-decoration: none;
color: #ffffff;
border: none;
background: url(software-co-images/readmore_button.jpg) no-repeat;
}
.download a {
clear: both;
float: left;
height: 21px;
width: 100px;
padding: 2px 0 0 10px;
margin: 0 15px 10px 0;
text-align: center;
font-weight: bold;
text-decoration: none;
color: #ffffff;
border: none;
background: url(software-co-images/readmore_button.jpg) no-repeat;
}
#container {
width: 960px;
margin: 0 auto;
}
/* header panel */
#header_panel {
width: 880px;
height: 80px;
padding: 40px 30px 0px 50px;
background: #202020 url(software-co-images/header_bg.jpg) top center no-repeat;
}
#header_panel #site_title {
float: left;
}
#site_title h1 {
font-size: 40px;
margin: 0px;
padding: 10px 0;
color: #218dfb;
}
#site_title h1 span {
color: #fff;
}
#site_title h2 {
font-size: 16px;
color: #878181;
margin: 0px;
padding: 0px;
font-weight: normal;
}
#header_panel #search_box {
float: right;
}
#search_box form {
margin: 0;
padding: 0;
text-align: left;
}
#searchfield {
border: 1px solid #767676;
background: #434343;
color: #ffffff;
font-size: 12px;
font-variant: normal;
height: 15px;
line-height: normal;
padding: 4px;
width: 180px;
}
#search_box form #searchbutton {
cursor: pointer;
font-size: 12px;
font-weight: bold;
height: 25px;
margin: 0 0 0 7px;
padding: 0 6px;
text-align: center;
vertical-align: bottom;
white-space: pre;
width: 50px;
background:url(software-co-images/go_button.jpg) no-repeat;
border: 0px;
}
/* end of header panel */
/* banner panel */
#banner_panel {
width: 880px;
height: 263px;
padding: 0px 30px 0px 50px;
background: #000000 url(software-co-images/banner_bg.jpg) top center no-repeat;
}
#banner_panel #banner_section {
float: left;
padding-top: 40px;
width: 370px;
}
#banner_section h1 {
font-size: 24px;
color: #0fb1cb;
margin: 0px;
padding: 5px 0 30px 0;
}
#banner_section p {
padding-bottom: 30px;
}
#banner_panel #menu_section {
float: right;
width: 220px;
padding: 5px 15px 0px 15px;
}
#menu_section ul {
clear: both;
margin: 0px;
padding: 0px;
padding-top: 10px;
list-style: none;
}
#menu_section ul li {
height: 13px;
padding: 12px 0px 10px 7px;
font-weight: bold;
margin: 0px 0px 5px 0px;
background: url(software-co-images/menu_item_bg.jpg) left bottom no-repeat;
}
#menu_section ul li a {
margin: 0px;
padding: 0px;
font-size: 18px;
font-weight: bold;
color: #2bb9ec;
}
#menu_section ul li a span {
margin: 0px;
padding: 0px;
margin-left: 50px;
font-size: 13px;
font-weight: bold;
color: #2bb9ec;
}
#menu_section ul li a span:hover {
color: #fff;
}
#menu_section li a:hover, #menu_section li .current {
color: #fff;
text-decoration: none;
}
/* end of banner panel */
/* content */
#content_top {
clear: both;
width: 960px;
height: 30px;
background: url(software-co-images/content_top.jpg) top center no-repeat;
}
#content {
clear: both;
overflow: hidden;
width: 880px;
padding: 10px 20px 0 40px;
margin: 0 10px;
background-color: #1f1f1f;
}
#content_bottom {
clear: both;
width: 960px;
height: 30px;
background: url(software-co-images/content_bottom.jpg) top center no-repeat;
}
/* content left */
#content #content_left {
float: left;
width: 580px;
}
#content_left h1 {
font-size: 22px;
color: #218dfb;
margin: 0 0 10px 0;
padding: 0 0 10px 0;
border-bottom: 1px dotted #000000;
}
#content_left p {
padding-bottom: 10px;
text-align: justify;
}
#content_left .content_left_two_column {
float: left;
width: 270px;
margin-right: 20px;
}
.content_left_two_column h2 {
color: #20d1ee;
font-size: 18px;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
border-bottom: 1px dotted #000000;
font-weight: normal;
}
.content_left_two_column h3 {
margin: 0px;
padding: 0px;
font-size: 12px;
font-weight: bold;
}
.content_left_two_column h4 {
margin: 0px;
padding: 0px;
font-size: 12px;
font-weight: normal;
}
/* end of content left */
/* content right */
#content #content_right {
float: right;
width: 250px;
padding-top: 20px;
}
#content_right h1 {
font-size: 18px;
font-weight: bold;
margin: 0 0 30px 0;
padding: 0px;
}
#content_right h2 {
font-size: 12px;
font-weight: bold;
margin: 0 0 10px 0;
padding: 0px;
}
#content_right ul {
margin: 0 0 10px 0;
padding: 0px;
}
#content_right ul li {
margin: 0 0 0 5px;
padding: 0 0 5px 5px;
list-style: none;
}
#content_right .content_right_product_01 {
clear: both;
height: 182px;
padding: 18px 10px 0 10px;
margin-bottom: 15px;
background: url(software-co-images/product_01_bg.jpg) no-repeat;
}
#content_right .content_right_product_02 {
clear: both;
height: 182px;
padding: 18px 10px 0 10px;
background: url(software-co-images/produc_02_bg.jpg) no-repeat;
}
/* end of content right */
/* end of content */
/* ----- Footer ----- */
#footer {
clear: both;
padding: 10px;
width: 940px;
text-align: center;
text-align: center;
}
#footer a {
color: #fff;
font-weight: normal;
}
#footer a:hover {
color: #CCFF00;
}
/* ----- End of Footer ----- */
</style>
<script language="javascript" type="text/javascript">
function clearText(field)
{
if (field.defaultValue == field.value) field.value = '';
else if (field.value == '') field.value = field.defaultValue;
}
</script>
</head>
<body>
<div id="container">
<div id="header_panel">
<div id="site_title">
<h1>Software <span>Co.</span></h1>
<h2>Free CSS Template</h2>
</div>
<div id="search_box">
<form method="get" action="http://www.free-css.com/">
<input name="keyword" type="text" value="Search..." id="searchfield" onfocus="clearText(this)" onblur="clearText(this)" />
<input type="submit" name="submit" id="searchbutton" value="" />
</form>
</div>
</div>
<!-- end of header panel -->
<div id="banner_panel">
<div id="banner_section">
<h1>New Website Editor</h1>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc quis sem nec tellus blandit tincidunt. Aliquam tristique lacus in sapien. Aliquam tristique lacus in sapien. </p>
<div class="readmore"><a href="http://www.free-css.com/">Read more</a></div>
</div>
<!-- end of banner section -->
<div id="menu_section">
<ul>
<li><a href="http://www.free-css.com/" class="current">01<span class="current">Home</span></a></li>
<li><a href="http://www.free-css.com/">02<span>Products</span></a></li>
<li><a href="http://www.free-css.com/">03<span>Partners</span></a></li>
<li><a href="http://www.free-css.com/">04<span>Support</span></a></li>
<li><a href="http://www.free-css.com/">05<span>About Us</span></a></li>
<li><a href="http://www.free-css.com/">06<span>Contact Us</span></a></li>
</ul>
</div>
<!-- end of menu section -->
</div>
<!-- end of banner panel -->
<div id="content_top"></div>
<div id="content">
<div id="content_left">
<h1>Welcome to our website</h1>
<p><strong>Software Co.</strong> is provided by TemplateMo.com. You may download, modify and apply this template for your personal or business websites.</p>
<p>Sed consectetur, lacus et dictum tristique, odio neque elementum ante, nec eleifend leo dolor vel tortor. Vivamus vulputate felis. Etiam luctus. Quisque facilisis suscipit elit. Curabitur eleifend.</p>
<div class="cleaner_with_height"> </div>
<div class="content_left_two_column">
<h2>Our Services</h2>
<p>Aenean eleifend, neque hendrerit elementum sodales, odio erat sagittis quam, sed tempor orci magna vitae tellus.</p>
<ul>
<li>Quisque facilisis suscipit elit</li>
<li>Lacus et dictum tristique</li>
<li>Eeros ac tincidunt aliquam</li>
<li>Nullam commodo arcu non facilisis</li>
<li>Lorem ipsum dolor sit amet</li>
<li>Donec felis. Pellentesque leo lacus</li>
</ul>
<div class="readmore"><a href="http://www.free-css.com/">Read more</a></div>
</div>
<div class="content_left_two_column">
<h2>Our News</h2>
<h4>[October 24, 2024]</h4>
<h3>Donec euismod enim et risus</h3>
<p><br />
Nunc aliquam, dolor vitae sollicitudin lacinia, nibh orci sagittis diam, dignissim sodales dui erat nec eros.</p>
<div class="readmore"><a href="http://www.free-css.com/">Read more</a></div>
<div style="clear: both; margin-top: 30px;"> <a href="http://validator.w3.org/check?uri=referer"><img style="border:0;width:88px;height:31px" src="http://www.w3.org/Icons/valid-xhtml10" alt="" width="88" height="31" vspace="8" border="0" /></a> <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/software-co-images/vcss-blue" alt="" vspace="8" border="0" /></a> </div>
</div>
<div class="cleaner"></div>
</div>
<!-- end of content left -->
<div id="content_right">
<div class="content_right_product_01">
<h1>Full Package</h1>
<h2>Vivamus felis?</h2>
<ul>
<li>» Eeros ac tincidunt</li>
<li>» Aliquam tristique lacus</li>
<li>» Lacus et dictum tristique</li>
</ul>
<div class="readmore"><a href="http://www.free-css.com/">Details</a></div>
</div>
<div class="content_right_product_02">
<h1>Basic Package</h1>
<h2>Curabitur eleifend?</h2>
<ul>
<li>» Aliquam tristique lacu</li>
<li>» Nunc aliquam dolor vitae</li>
<li>» Quisque facilisis suscipit</li>
</ul>
<div class="readmore"><a href="http://www.free-css.com/">Details</a></div>
</div>
</div>
<!-- end of content right -->
</div>
<div id="content_bottom"></div>
<div id="footer"> <a href="http://www.free-css.com/">Home</a> | <a href="http://www.free-css.com/">Products</a> | <a href="http://www.free-css.com/">Partners</a> | <a href="http://www.free-css.com/">Support</a> | <a href="http://www.free-css.com/">About Us</a> | <a href="http://www.free-css.com/">Contact Us</a><br />
Copyright © 2024 <a href="http://www.free-css.com/"><strong>Your Company Name</strong></a> | Designed by <a href="http://www.templatemo.com">Free CSS Templates</a> </div>
<!-- end of footer -->
</div>
<!-- end of container -->
</body>
</html>
Related examples in the same category