plastic-surgery
<!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>Plastic Surgery</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* CSS Document */
body{padding:0px; margin:0px; background:#383838 url(plastic-surgery-images/b_body.gif) 0 0 repeat-x; color:#848484; font:11px/14px Arial, Helvetica, 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:11px/14px Arial, Helvetica, sans-serif; color:#6c8ea7; text-decoration:none;}
p a:hover{ color:#000; text-decoration:none;}
.headline{font:12px/14px Arial, Helvetica, sans-serif; color:#6c8ea7; font-weight:bold}
#container{width:656px; position:relative; margin:0 auto; padding-left:10px; padding-right:10px; background:#FFF}
/* TOP */
#topPan{width:656px; height:61px; position:relative;}
#topPan img#logo{position:absolute; top:17px; left:6px}
#topPan ul.menu{position:absolute; top:17px; left:289px; width:360px}
#topPan ul.menu li{height:27px; margin-right:24px; float:left}
#topPan ul.menu li a{height:27px; display:block; text-indent:-20000px; }
#topPan ul.menu li a:hover{height:27px;}
#topPan ul.menu li.btn_1 a{width: 57px; background:url(plastic-surgery-images/btn_1.gif) 0 0 no-repeat; }
#topPan ul.menu li.btn_1 a:hover{width: 57px; background:url(plastic-surgery-images/btn_1_over.gif) 0 0 no-repeat;}
#topPan ul.menu li.btn_2 a{width: 52px; background:url(plastic-surgery-images/btn_2.gif) 0 0 no-repeat; }
#topPan ul.menu li.btn_2 a:hover{width: 52px; background:url(plastic-surgery-images/btn_2_over.gif) 0 0 no-repeat;}
#topPan ul.menu li.btn_3 a{width: 47px; background:url(plastic-surgery-images/btn_3.gif) 0 0 no-repeat; }
#topPan ul.menu li.btn_3 a:hover{width: 47px; background:url(plastic-surgery-images/btn_3_over.gif) 0 0 no-repeat;}
#topPan ul.menu li.btn_4 a{width: 46px; background:url(plastic-surgery-images/btn_4.gif) 0 0 no-repeat; }
#topPan ul.menu li.btn_4 a:hover{width: 46px; background:url(plastic-surgery-images/btn_4_over.gif) 0 0 no-repeat;}
#topPan ul.menu li.btn_5{margin-right:0}
#topPan ul.menu li.btn_5 a{width: 52px; background:url(plastic-surgery-images/btn_5.gif) 0 0 no-repeat; }
#topPan ul.menu li.btn_5 a:hover{width: 52px; background:url(plastic-surgery-images/btn_5_over.gif) 0 0 no-repeat;}
/* HEADER */
#header{width:656px; height:288px; position:relative; background:url(plastic-surgery-images/b_header.jpg) 0 0 no-repeat}
#header img#slogan{position:absolute; top:66px; left:30px}
/* CONTENT */
#content{width:656px; position:relative; clear:both; margin: 0 auto}
#c01{width:190px; float:left; margin:18px 25px 0 7px; display:inline}
#c02{width:195px; float:left; margin:18px 30px 0 0;}
#c03{width:195px; float:left; margin:18px 0 0 0;}
#content ul li{font:11px/14px Arial, Helvetica, sans-serif; background:url(plastic-surgery-images/arrow.gif) 0 5px no-repeat; padding-left:16px; height:24px;}
#content ul li a{color:#205757; text-decoration:none;}
#content ul li a:hover{color:#205757; text-decoration:underline;}
#welcome h2{height:19px; position:relative; background:url(plastic-surgery-images/h_welcome.gif) 0 0 no-repeat; margin-bottom:16px}
#welcome p {margin-bottom:15px; margin-left:3px}
#welcome ul{margin-left:7px}
#services h2{height:19px; position:relative; background:url(plastic-surgery-images/h_services.gif) 0 0 no-repeat; margin-bottom:19px}
#services img{float:left; margin-right:7px}
#services p{margin-left:7px}
#services p.headline{float:left; width:108px; padding-top:5px; margin-left:0}
#services .clear {height:15px}
#stories h2{height:19px; position:relative; background:url(plastic-surgery-images/h_services.gif) 0 0 no-repeat; margin-bottom:19px}
#stories img{float:left; margin-right:7px}
#stories p{margin-left:7px; margin-bottom:10px}
#stories p.headline{float:left; width:108px; padding-top:5px; margin-left:0; margin-bottom:0}
#stories .clear {height:15px}
#stories ul{margin-left:7px}
.clear#end{height:15px}
/* FOOTER */
#footer{width:656px; height:56px; clear:both; background:#646874 }
#footer p{padding: 12px 0 0 0; font:11px/16px Arial, Helvetica, sans-serif; font-weight:normal; text-align:center; color:#fff;}
#footer p a{font:11px/16px Arial, Helvetica, sans-serif; font-weight:normal; color:#fff; text-decoration:none; padding: 0 3px }
#footer p a:hover{text-decoration:underline; color:#fff}
</style>
</head>
<body>
<div id="container">
<div id="topPan"> <img src="plastic-surgery-images/logo.gif" alt="" name="logo" width="172" height="31" id="logo"/>
<ul class="menu">
<li class="btn_1"><a href="#">home</a></li>
<li class="btn_2"><a href="#">about us</a></li>
<li class="btn_3"><a href="#">services</a></li>
<li class="btn_4"><a href="#">support</a></li>
<li class="btn_5"><a href="#">contacts</a></li>
</ul>
</div>
<div id="header"> <img src="plastic-surgery-images/slogan.jpg" alt="" name="logo" width="288" height="156" id="slogan"/> </div>
<div id="content">
<div id="c01">
<div id="welcome">
<h2></h2>
<p><span class="headline">Sed vestibulum. Integer in ante. Sed posuere ligula rhoncus erat.</span><br />
<br />
Morbi volutpat leo in ligula. Integer vel magna. Nam justo augue, dictum a, hendrerit in, ultricies in, leo. Nullam eleifend. Duis tempor ipsum vitae diam. Curabitur felis dui, bibendum </p>
<ul>
<li><a href="#">Phasellus convallis ligula in nulla</a></li>
<li><a href="#">Morbi aliquet, velit ac semper </a></li>
<li><a href="#">Phasellus convallis ligula in nulla</a></li>
<li><a href="#">Morbi aliquet, velit ac semper </a></li>
</ul>
</div>
</div>
<div id="c02">
<div id="services">
<h2></h2>
<img src="plastic-surgery-images/img_services.jpg" width="80" height="80" alt="" />
<p class="headline">Sed vestibulum. Integer in ante. Sed posuere ligula rhoncus erat. Fusce urna dui, </p>
<div class="clear"></div>
<p>Morbi volutpat leo in ligula. Integer vel magna. Nam justo augue, dictum a, hendrerit in, ultricies in, leo. Nullam eleifend. Duis tempor ipsum vitae diam. Curabitur felis dui, bibendum <br />
<br />
Nullam eleifend. Duis tempor ipsum vitae diam. Curabitur felis dui, bibendu <a href="#">read more</a></p>
</div>
</div>
<div id="c03">
<div id="stories">
<h2></h2>
<img src="plastic-surgery-images/img_stories.jpg" width="80" height="80" alt="" />
<p class="headline">Sed vestibulum. Integer in ante. Sed posuere ligula rhoncus erat. Fusce urna dui, </p>
<div class="clear"></div>
<p>Morbi volutpat leo in ligula. Integer vel magna. Nam justo augue, dictum a, hendrerit in, ultricies in, leo. Nullam eleifend. Duis tempor ipsum vitae diam. Curabitur felis dui, bibendum </p>
<ul>
<li><a href="#">Phasellus convallis ligula in nulla</a></li>
<li><a href="#">Morbi aliquet, velit ac semper </a></li>
</ul>
</div>
</div>
<div class="clear" id="end"></div>
</div>
<div id="footer">
<p><a href="#">HOME PAGE</a> | <a href="#">ABOUT US</a> | <a href="#">SERVICES</a> | <a href="#">SUPPORT</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