historicpaper
<!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>HistoricPaper | About</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type='text/css'>
@charset "utf-8";
body {
margin:0;
padding:0;
width:100%;
background:url(historicpaper-images/main_bg.gif);
}
html {
padding:0;
margin:0;
}
li.bg, .bg {
clear:both;
padding:0;
margin:10px 0;
height:3px;
list-style:none;
background:url(historicpaper-images/bg.gif) top repeat-x;
}
p.clr, .clr {
clear:both;
padding:0;
margin:0;
}
.main {
margin:0 auto;
padding:0;
}
.header_resize {
margin:0 auto;
padding:0;
width:932px;
}
.header {
background:url(historicpaper-images/header_bg.gif) top repeat-x;
margin:0;
padding:0;
}
.logo {
width:600px;
margin:0 auto;
padding:0;
float:left;
}
.logoimg h2 {
padding:32px 0 32px 130px;
color:#fff;
font:normal 30px/1.2em Georgia, "Times New Roman", Times, serif;
letter-spacing:-1px;
background:url(historicpaper-images/logo_img.gif) no-repeat left top;
}
.logoimg h2 span {
color:#575c5c;
}
h1 {
margin:0;
padding:26px 0;
color:#fff;
font:italic bold 40px/1.2em Georgia, "Times New Roman", Times, serif;
}
h1 a, h1 a:hover {
color:#fff;
text-decoration:none;
}
h1 span {
font-weight:bold;
color:#eee;
}
h1 small {
padding:8px 0;
font:italic 12px/1.2em Georgia, "Times New Roman", Times, serif;
text-transform:uppercase;
}
.search {
padding:45px 20px 0 0;
margin:0;
width:260px;
float:right;
}
.search form {
float:right;
padding:0;
margin:0;
}
.search span {
display:block;
float:left;
background:url(historicpaper-images/search_bg.gif) left top no-repeat;
width:153px;
padding:0 5px;
}
.search form .keywords {
width:149px;
line-height:14px;
height:14px;
float:left;
background:none;
border:0;
padding:5px 2px;
margin:0;
font:normal 11px Arial, Helvetica, sans-serif;
color:#000;
}
.search form .button {
float:left;
margin:0 0 0 5px;
padding:0;
}
.menu {
padding:10px 0 14px 0;
margin:0;
width:410px;
float:left;
}
.menu ul {
padding:0;
margin:0;
list-style:none;
border:0;
float:left;
}
.menu ul li {
float:left;
margin:0;
padding:15px 5px;
}
.menu ul li a {
float:left;
margin:0;
padding:0 10px 0 0;
color:#575c5c;
font:normal 17px "Times New Roman", Times, serif;
text-decoration:none;
}
.menu ul li a:hover {
color:#fff;
}
.menu ul li a.active {
color:#fff;
}
.body_resize {
margin:0 auto;
padding:0 20px 0 20px;
width:892px;
background:#fff;
}
.body {
margin:0;
padding:0;
}
.body h2 {
font:italic 35px "Times New Roman", Times, serif;
color:#c05622;
padding:0 0 6px 0;
margin:0 0 10px 0;
line-height:2em;
}
.body h2 span {
font:italic 14px "Times New Roman", Times, serif;
color:#575c5c;
}
.body h3 {
color:#575c5c;
font:normal 20px "Times New Roman", Times, serif;
padding:30px 0 6px 0;
margin:0 0 10px 0;
}
.body p {
font:normal 14px "Times New Roman", Times, serif;
color:#585858;
padding:5px;
margin:0;
line-height:1.8em;
}
.body img {
float:left;
margin:5px;
padding:0;
}
.body img.floated {
float:right;
margin:5px;
padding:0;
}
.body a {
color:#c05622;
text-decoration:none;
}
.left {
float:left;
width:636px;
margin:0;
padding:20px 0;
}
.right {
float:right;
width:214px;
margin:0;
padding:0 0 20px 0;
}
.right ul {
list-style:none;
margin:5px 10px;
padding:0;
}
.right li {
font:normal 14px Arial, Helvetica, sans-serif;
color:#464646;
padding:5px 0;
}
.right li a {
background:url(historicpaper-images/ul_li.gif) left no-repeat;
padding:0 0 0 20px;
margin:0;
font:bold 17px "Times New Roman", Times, serif;
color:#575c5c;
text-decoration:none;
}
.right li a:hover {
color:#c05622;
text-decoration:none;
}
.right ul.sponsors {
list-style:none;
margin:5px 10px;
padding:0;
}
.right li.sponsors {
background:url(historicpaper-images/bg.gif) bottom repeat-x;
font:normal 12px "Times New Roman", Times, serif;
color:#575c5c;
padding:8px 0 8px 0;
}
.right li.sponsors a {
background:url(historicpaper-images/ul_li.gif) left no-repeat;
padding:0 0 0 20px;
margin:0;
font:normal 14px "Times New Roman", Times, serif;
color:#575c5c;
text-decoration:none;
}
.right li.sponsors span {
color:#c05622;
font:bold 13px "Times New Roman", Times, serif;
}
.widget_calendar ul {
margin:0;
padding:0;
}
.widget_calendar ul li {
margin:0;
padding:0;
list-style:none;
background:none;
}
.widget_calendar table {
width:100%;
}
.widget_calendar table td {
text-align:center;
padding:3px;
}
.widget_calendar caption {
padding:5px 0;
color:#575c5c;
font:bold 14px "Times New Roman", Times, serif;
text-transform:uppercase;
}
.widget_calendar table td a {
text-decoration:none;
background:none;
padding:2px 5px;
margin:0;
font:normal 12px "Times New Roman", Times, serif;
color:#575c5c;
}
.widget_calendar table td a:hover {
background:#575c5c;
color:#fff;
text-decoration:none;
}
.widget_calendar table td a.active {
background:#575c5c;
color:#fff;
text-decoration:none;
}
.FBG_resize {
margin:0 auto;
padding:0;
width:930px;
background:#fff;
}
.FBG {
margin:0;
padding:0;
}
.FBG img {
float:left;
margin:5px 20px 5px 0;
padding:0;
}
.FBG img.floated {
float:right;
margin:5px 0 5px 10px;
padding:0;
}
.FBG h2 {
color:#c05622;
font:normal 30px "Times New Roman", Times, serif;
padding:3px 0;
margin:5px 0 15px 0;
}
.FBG p {
color:#575c5c;
font:normal 14px "Times New Roman", Times, serif;
padding:5px 0;
margin:0;
line-height:1.6em;
}
.FBG a {
color:#ea7d1b;
text-decoration:none;
font:bold 12px Arial, Helvetica, sans-serif;
}
.FBG ul {
list-style:none;
float:left;
padding:0;
margin:10px 0;
}
.FBG li {
background:url(historicpaper-images/ul_li_fbg.gif) left no-repeat;
padding:4px 1px;
margin:0;
}
.FBG li a {
color:#575c5c;
font:normal 13px "Times New Roman", Times, serif;
text-decoration:none;
padding:0 0 0 10px;
}
.FBG li a:hover {
color:#c05622;
text-decoration:none;
}
.FBG .blok {
width:270px;
float:left;
padding:5px 20px;
margin:0;
}
.footer_resize {
margin:0 auto;
padding:0;
color:#575c5c;
font:normal 12px "Times New Roman", Times, serif;
}
.footer {
padding:10px 0;
margin:0 auto;
width:930px;
}
.footer p {
margin:0;
padding:4px 0;
line-height:normal;
color:#575c5c;
}
.footer a {
color:#575c5c;
padding:inherit;
text-decoration:underline;
}
.footer a:hover {
text-decoration:none;
}
.footer .lf {
float:left;
}
.footer .rf {
float:right;
}
#contactform {
margin:0;
padding:5px 10px;
}
#contactform * {
color:#F00;
}
#contactform ol {
margin:0;
padding:0;
list-style:none;
}
#contactform li {
margin:0;
padding:0;
background:none;
border:none;
display:block;
clear:both;
}
#contactform li.buttons {
margin:5px 0 5px 0;
}
#contactform label {
margin:0;
width:110px;
display:block;
padding:10px 0;
color:#666;
font:normal 12px Arial, Helvetica, sans-serif;
text-transform:capitalize;
float:left;
}
#contactform label span {
color:#F00;
}
#contactform input.text {
width:480px;
border:1px solid #c0c0c0;
margin:2px 0;
padding:5px 2px;
height:16px;
background:#fff;
float:left;
}
#contactform textarea {
width:480px;
border:1px solid #c0c0c0;
margin:2px 0;
padding:2px;
background:#fff;
float:left;
}
#contactform li.buttons input {
border:1px solid #000;
background:#ea7d1b;
padding:10px;
margin:10px 0 0 110px;
color:#fff;
float:left;
font:normal 12px Arial, Helvetica, sans-serif;
}
p.response {
text-align:center;
color:#F00;
font:normal 11px Georgia, "Times New Roman", Times, serif;
line-height:1.8em;
width:auto;
}
</style>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/georgiai.js"></script>
<script type="text/javascript" src="js/cuf_run.js"></script>
</head>
<body>
<!-- START PAGE SOURCE -->
<div class="main">
<div class="header">
<div class="header_resize">
<div class="logo">
<h1><a href="index.html">HistoricPaper<br />
<small>Best and necessary.</small></a></h1>
</div>
<div class="search">
<form id="form1" name="form1" method="post" action="#">
<span>
<input name="q" type="text" class="keywords" id="textfield" maxlength="50" value="Search..." />
</span>
<input name="b" type="image" src="historicpaper-images/search.gif" class="button" />
</form>
</div>
<div class="clr"></div>
<div class="menu">
<ul>
<li><a href="index.html"><span>Home</span></a></li>
<li><a href="services.html"><span>Services</span></a></li>
<li><a href="about.html" class="active"><span>About Us</span></a></li>
<li><a href="contact.html"><span>Contact Us</span></a></li>
</ul>
</div>
<div class="clr"></div>
<div class="logoimg">
<h2>You can find more of my free template designs at my website.<br />
For premium commercial designs, you can check out<br />
<span>MyWebsite.com.</span></h2>
</div>
</div>
</div>
<div class="body">
<div class="body_resize">
<div class="left">
<h2>About</h2>
<p class="big bgline">Mauris ornare aliquam urna, accumsan bibendum eros auctor ac.</p>
<p>Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl. Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc.</p>
<p> Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl.</p>
<p> Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl. Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.</p>
<p>Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl. Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.</p>
<p><strong>Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl. Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.</strong></p>
<p>Suspendisse adipiscing rhoncus massa, sit amet sollicitudin quam vulputate non. In non turpis nisl. Curabitur purus mi, pharetra vitae viverra et, mattis sit amet nunc. Quisque enim ipsum, convallis sit amet molestie in, placerat vel urna.</p>
</div>
<div class="right">
<h3><span>What</span> They Say</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui off icia deserunt mollit anim id estlaborum.</p>
<img src="historicpaper-images/img_1.jpg" width="108" height="122" alt="" />
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<h3>Calendar</h3>
<div class="bg"></div>
<div class="widget_calendar">
<ul>
<li>
<table>
<caption>
MARCH 2010
</caption>
<tbody>
<tr>
<td colspan="2"> </td>
<td><a href="#">1</a></td>
<td><a href="#">2</a></td>
<td><a href="#">3</a></td>
<td><a href="#">4</a></td>
<td><a href="#">5</a></td>
</tr>
<tr>
<td><a href="#">6</a></td>
<td><a href="#">7</a></td>
<td><a href="#">8</a></td>
<td><a href="#">9</a></td>
<td><a href="#">10</a></td>
<td><a href="#">11</a></td>
<td><a href="#">12</a></td>
</tr>
<tr>
<td><a href="#">13</a></td>
<td><a href="#">14</a></td>
<td><a href="#">15</a></td>
<td><a href="#">16</a></td>
<td><a href="#">17</a></td>
<td><a href="#">18</a></td>
<td><a href="#">19</a></td>
</tr>
<tr>
<td><a href="#">20</a></td>
<td><a href="#">21</a></td>
<td><a href="#">22</a></td>
<td><a href="#">23</a></td>
<td><a href="#">24</a></td>
<td><a href="#">25</a></td>
<td><a href="#">26</a></td>
</tr>
<tr>
<td><a href="#">27</a></td>
<td><a href="#">28</a></td>
<td><a href="#">29</a></td>
<td><a href="#">30</a></td>
<td><a href="#">31</a></td>
<td> </td>
</tr>
</tbody>
</table>
</li>
</ul>
</div>
</div>
<div class="clr"></div>
</div>
</div>
<div class="FBG_resize"><img src="historicpaper-images/fbg_img.gif" alt="" width="931" height="20" /></div>
<div class="FBG">
<div class="FBG_resize">
<div class="blok">
<h2>Image Gallery</h2>
<div class="bg"></div>
<img src="historicpaper-images/banner_1.jpg" alt="" width="68" height="68" /><img src="historicpaper-images/banner_2.jpg" alt="" width="68" height="68" /><img src="historicpaper-images/banner_3.jpg" alt="" width="68" height="68" /><img src="historicpaper-images/banner_4.jpg" alt="" width="68" height="68" /><img src="historicpaper-images/banner_5.jpg" alt="" width="68" height="68" /><img src="historicpaper-images/banner_6.jpg" alt="" width="68" height="68" />
<div class="clr"></div>
<div class="bg"></div>
<p><a href="#">view all images</a></p>
</div>
<div class="blok">
<h2>Company News</h2>
<div class="bg"></div>
<img src="historicpaper-images/fbg_1.gif" alt="" width="74" height="81" class="floated" />
<p>Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac<br />
more news</p>
<p><a href="#">12. 03. 10</a></p>
<div class="bg"></div>
<img src="historicpaper-images/fbg_2.gif" alt="" width="74" height="81" class="floated" />
<p>Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac<br />
more news</p>
<p><a href="#">12. 03. 10</a></p>
</div>
<div class="blok">
<h2>Services</h2>
<div class="bg"></div>
<ul>
<li><a href="#">consequat molestie</a></li>
<li><a href="#">sem justo</a></li>
<li><a href="#">semper</a></li>
<li><a href="#">magna sed purus</a></li>
<li><a href="#">magna sed purus</a></li>
<li><a href="#">consequat molestie</a></li>
</ul>
</div>
<div class="clr"></div>
</div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="lf">Copyright © 2010 <a href="#">SiteName</a> - All Rights Reserved</p>
<p class="rf"><a href="http://www.free-css.com/">Free CSS Templates</a> by <a href="http://www.hotwebsitetemplates.net">Hot Website Templates</a></p>
<div class="clr"></div>
</div>
<div class="clr"></div>
</div>
</div>
<!-- END PAGE SOURCE -->
</body>
</html>
Related examples in the same category