financialco
<!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>FinancialCo.</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* CSS Document */
body{padding:0px; margin:0px; background:#d9d9cd; color:#40483d; font:10px/14px Tahoma, sans-serif;}
div, p, ul, h2, h3, h4, img{padding:0px; margin:0px;}
ul{list-style-type:none;}
.clear {clear: both; margin: 0px; height:0}
p a{font:10px/14px Tahoma, sans-serif; color:#40483d; text-decoration:underline;}
p a:hover{ color:#40483d; text-decoration:none;}
.headline{font:12px/14px Tahoma, Geneva, sans-serif; color:#e18b07; font-weight:bold}
#container{width:775px; position:relative; margin:0 auto; border:#111 1px solid}
/* HEADER */
#header{width:775px; height:336px; position:relative; background:url(financialco-images/B_header.jpg) 0 0 repeat-x;}
#header img#logo{position:absolute; top:20px; left:53px}
#header img#slogan1{position:absolute; top:38px; left:262px}
#header img#slogan2{position:absolute; top:158px; left:73px}
#header ul.menu{position:absolute; top:90px; left:53px; width:420px}
#header ul.menu li{height:16px; margin-right:14px; float:left}
#header ul.menu li a{height:16px; display:block; text-indent:-20000px; }
#header ul.menu li a:hover{height:16px;}
#header ul.menu li.btn_1 a{width:41px; background:url(financialco-images/btn_1.gif) 0 0 no-repeat; }
#header ul.menu li.btn_1 a:hover{width:41px; background:url(financialco-images/btn_1_over.gif) 0 0 no-repeat;}
#header ul.menu li.btn_2 a{width:47px; background:url(financialco-images/btn_2.gif) 0 0 no-repeat; }
#header ul.menu li.btn_2 a:hover{width:47px; background:url(financialco-images/btn_2_over.gif) 0 0 no-repeat;}
#header ul.menu li.btn_3 a{width:63px; background:url(financialco-images/btn_3.gif) 0 0 no-repeat; }
#header ul.menu li.btn_3 a:hover{width:63px; background:url(financialco-images/btn_3_over.gif) 0 0 no-repeat;}
#header ul.menu li.btn_4 a{width:71px; background:url(financialco-images/btn_4.gif) 0 0 no-repeat; }
#header ul.menu li.btn_4 a:hover{width:71px; background:url(financialco-images/btn_4_over.gif) 0 0 no-repeat;}
#header ul.menu li.btn_5{margin-right:0}
#header ul.menu li.btn_5 a{width:65px; background:url(financialco-images/btn_5.gif) 0 0 no-repeat; }
#header ul.menu li.btn_5 a:hover{width:65px; background:url(financialco-images/btn_5_over.gif) 0 0 no-repeat;}
#header ul.menu li.line{width:2px; background:url(financialco-images/line_m.gif) 0 0 no-repeat}
/* CONTENT */
#content{width:775px; position:relative; padding:0}
#leftPan{width:165px; float:left; margin-right:20px; margin-left:36px; display:inline}
#centerPan{width:280px; float:left; margin-right:20px; }
#rightPan{width:225px; float:left;}
ul.btn_more li{background:url(financialco-images/arrow2.gif) 62px 5px no-repeat;}
ul.btn_more li a{font:11px/14px Trebuchet MS, sans-serif; color:#111111; text-decoration:none; font-weight:bold; }
ul.btn_more li a:hover{color:#111111; text-decoration:underline}
#news{margin-bottom:25px; margin-top:5px}
#news h2{height:15px; position:relative; background:url(financialco-images/h_news.gif) 0 0 no-repeat; margin-bottom:13px}
#news p{margin:0 0 15px 0;}
#spotlight h2{height:15px; position:relative; background:url(financialco-images/h_spotlight.gif) 0 0 no-repeat; margin-bottom:18px}
#spotlight ul{width:160px; margin-left:2px}
#spotlight ul li{font:10px/14px Tahoma, sans-serif; background:url(financialco-images/arrow1.gif) 0 5px no-repeat; padding-left:11px; height:22px;}
#spotlight ul li a{color:#646b61; text-decoration:underline;}
#spotlight ul li a:hover{color:#fff; text-decoration:none; background:#646b61}
#welcome{width:265px; margin-bottom:25px;}
#welcome h2{height:44px; position:relative; background:url(financialco-images/h_welcome.gif) 0 0 no-repeat; margin-bottom:16px}
#welcome img{float:left; margin-right:14px; margin-left:6px; display:inline}
#welcome p#w01{width:105px; float:left; padding-top:3px}
#welcome p#w02{margin-left:6px; margin-top:15px; margin-bottom:10px}
#welcome ul.btn_more {margin-left:179px;}
#services{margin-top:5px}
#services h2{height:15px; position:relative; background:url(financialco-images/h_services.gif) 0 0 no-repeat; margin-bottom:20px}
#services .Sv_topic{margin-bottom:20px;}
#services .Sv_topic img{float:left; margin-right:12px;}
#services .Sv_topic p{width:165px; float:left}
#services ul.btn_more {margin-left:139px;}
/* FOOTER */
#footer{height:54px; clear:both; width:775px; margin-top:20px; background:#111111}
#footer p{padding: 10px 0 0 0; font:10px/16px Tahoma, sans-serif; font-weight:normal; text-align:center; color:#d9d9cd;}
#footer p a{font:10px/16px Tahoma, sans-serif; font-weight:normal; color:#d9d9cd; text-decoration:none; padding: 0 3px }
#footer p a:hover{text-decoration:none; background:#fff; color:#111}
</style>
</head>
<body>
<div id="container">
<div id="header"> <img src="financialco-images/logo.gif" width="196" height="38" alt="" id="logo" /> <img src="financialco-images/slogan.gif" alt="" name="slogan" width="188" height="17" id="slogan1" /> <img src="financialco-images/slogan2.gif" width="384" height="94" alt="" id="slogan2" />
<ul class="menu">
<li class="btn_1"><a href="#">home page</a></li>
<li class="line"></li>
<li class="btn_2"><a href="#">about us</a></li>
<li class="line"></li>
<li class="btn_3"><a href="#">services</a></li>
<li class="line"></li>
<li class="btn_4"><a href="#">solutions</a></li>
<li class="line"></li>
<li class="btn_5"><a href="#">contacts</a></li>
</ul>
</div>
<div id="content">
<div id="leftPan">
<div id="news">
<h2></h2>
<p><span class="headline">20.10.2009</span> <br />
<a href="#">Et suscipit nulla orci odio. In ac</a><br />
sem Mauris, quam ac porta </p>
<p><span class="headline">20.10.2009</span> <br />
<a href="#">Et suscipit nulla orci odio. In ac</a><br />
sem Mauris, quam ac porta </p>
</div>
<div id="spotlight">
<h2></h2>
<ul>
<li><a href="#">In volutpat sodales ipsum. Sed </a></li>
<li><a href="#">vestibulum. Integer in ante. </a></li>
<li><a href="#">Sed posuere ligula rhoncus </a></li>
<li><a href="#">erat. Fusce urna dui, sollicitudin </a></li>
<li><a href="#">ac, pulvinar quis, tincidunt et, </a></li>
</ul>
</div>
</div>
<div id="centerPan">
<div id="welcome">
<h2></h2>
<img src="financialco-images/img_welcome.jpg" width="138" height="92" alt="" />
<p id="w01"><a href="#">Et suscipit nulla orci sed odio. In ac sem Mauris tincidunt, quam ac porta Lorem ipsum dolor sit vestibulum. Integer in ante. </a></p>
<div class="clear"></div>
<p id="w02"><span class="headline">Sed laoreet. Aenean pede. Phasellus porta. Praesent vehicula suscipit ligula.</span><br />
<br />
et suscipit nulla orci sed odio. In ac sem Mauris tincidunt, quam ac porta Lorem ipsum dolor sit vestibulum. Integer in ante. Sed laoreet. Aenean pede. Phasellus porta. Ut dictum nonummy</p>
<ul class="btn_more">
<li><a href="#">read more</a></li>
</ul>
</div>
</div>
<div id="rightPan">
<div id="services">
<h2></h2>
<div class="Sv_topic"> <img src="financialco-images/ico_services.gif" width="42" height="42" alt="" />
<p><span class="headline">Sed laoreet. Aenean pede.</span><br />
et suscipit nulla orci sed odio. In ac sem <a href="#">quam ac porta Lorem</a> ipsum dolor sit vestibulum. Integer in ante. </p>
<div class="clear"></div>
</div>
<div class="Sv_topic"> <img src="financialco-images/ico_services-14.gif" width="42" height="42" alt="" />
<p><span class="headline">Maecenas non orci. </span><br />
et suscipit nulla orci sed odio. In ac sem <a href="#">quam ac porta Lorem</a> ipsum dolor sit vestibulum. Integer in ante. </p>
<div class="clear"></div>
</div>
<div class="Sv_topic"> <img src="financialco-images/ico_services-17.gif" width="42" height="42" alt="" />
<p><span class="headline">Sed laoreet. Aenean pede.</span><br />
et suscipit nulla orci sed odio. In ac sem <a href="#">quam ac porta Lorem</a> ipsum dolor sit vestibulum. Integer in ante. </p>
<div class="clear"></div>
</div>
<ul class="btn_more">
<li><a href="#">read more</a></li>
</ul>
</div>
</div>
<div class="clear"></div>
</div>
<div id="footer">
<p><a href="#">HOME</a> | <a href="#">ABOUT US</a> | <a href="#">SERVICES</a> | <a href="#">SOLUTIONS</a> | <a href="#">SUPPORT</a> | <a href="#">NEWS</a> | <a href="#">CONTACTS</a><br/>
Copyright © Your Company Name | Design by <a href="http://freshtemplates.com/">Website Templates</a></p>
</div>
</div>
</body>
</html>
Related examples in the same category