authenticity
<!-- Designed by Kenneth Barbour.
If you use this design, please let me know at kenbarbour@gmail.com.
The two bullets are from www.stylegala.com/features/bulletmadness
The Original CSS code is by Anthony Yeung-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>.:(*AUTHENTICITY*):.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */
body {
margin: 25px auto 0px auto;
background-image: url(authenticity-images/top.jpg);
background-repeat: repeat-x;
background-position: top;
font-family: "Lucida Grande", Verdana, Halvetica, sans-serif;
text-align: center;
}
a:hover {
color: #990000;
text-decoration: underline;
}
a {
color: #990000;
text-decoration: none;
}
#container {
font-weight: normal;
margin: 0px auto 0px auto;
width: 686px;
text-align: center;
}
#main {
padding-top: 50px;
padding-bottom: 50px;
border: 1px solid #CC0000;
height: auto;
}
#title {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 36px;
color: #FFF;
font-weight: normal;
font-size:36px;
text-align: center;
color: #FFFFFF;
padding-top: 28px;
}
#top {
margin: 0px auto;
width: 686px;
height: 96px;
background: url(authenticity-images/topbar.jpg) no-repeat
}
#middle {
background: url(authenticity-images/middle.jpg) no-repeat;
background-repeat: repeat-y;
margin: -2px auto 0px auto;
}
#bottom {
margin: -100px auto 0px;
width: 686px;
height: 106px;
background: url(authenticity-images/bottom.gif) no-repeat;
clear: left;
}
#nav {
width: 455px;
padding: 20px 30px 10px;
margin: 0px auto;
color: #999;
font-weight: normal;
font-size: 11px;
text-align: center;
}
#nav li {
list-style: none;
display: inline;
margin-right: 20px;
}
#nav a {
font-size: 10px;
font-weight: bold;
color: #999;
text-decoration: none;
}
#nav a:hover {
color: #990000;
text-decoration: underline;
}
#content {
padding: 0px 68px 1px 68px;
margin: 0px auto 0px auto;
text-align: left;
}
#side {
margin: 30px auto 0px auto;
width: 110px;
border-left: 1px dotted #C4D0D7;
padding: 0px 10px 0px 20px;
color: #999;
float: right;
font-size: 70%;
}
#content h2 {
color: #993300;
font-weight: bolder;
font-size: 14px;
padding: 0px 135px 0px 10px;
}
#content h2 a:hover{
color: #990000;
text-decoration: underline;
}
#content h2 a{
color: #990000;
text-decoration: none;
}
#content h3 {
color: #000000;
font-size: 10px;
letter-spacing: .3em;
padding: 0px 135px 0px 10px;
text-decoration: underline;
}
#content p {
padding: 0px 170px 0px 10px;
font-size: 70%;
line-height: 1.7em;
margin: 0px 0px 1.7em 0px;
vertical-align: top;
color: #666666;
}
#footertext {
font-size: 10px;
font-weight: bold;
margin: 20px auto 0px;
height: 20px;
width: 686px;
height: 31px;
text-align: center;
color: #888;
}
#footertext a {
font-size: 10px;
font-weight: bold;
color: #999;
text-decoration: none;
}
#footertext a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div id="container">
<div id="top">
<div id="title">Authenticity</div>
</div>
<div id="middle">
<div id="nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Archives</a></li>
<li><a href="#">Portfolio</a></li>
</ul>
</div>
<div id="content">
<div id="side">
<strong>Announcements</strong> <br />
<br />
Etiam iaculis, quam a blandit bibendum, nisl nibh laoreet lorem, quis mollis lectus mi varius dui.
<br /><br />
<br />
<strong>Links</strong><br />
<br />
<a href="http://www.arson-network.org">Arson-Network</a> <br />
<br />
<a href="http://www.axiscreations.com">Axis Creations</a><br />
<br />
<a href="http://www.flashkit.com">FlashKit</a><br />
<br />
<a href="http://www.oswd.org">OSWD</a><br />
<br />
<a href="http://www.axiscreations.com/~ken/l33t/">Ken:L33t </a><br />
<br />
<a href="http://google.com">Google</a><br />
<br />
<a href="http://stylegala.com">Style Gala</a><br />
<br /><br /></div>
<h2><a href="#">Authenticity</a></h2>
<h3><strong>June 8th 2005</strong></h3>
<p> <img src="authenticity-images/0171_new_page.png" alt="" width="12" height="12" />
The original design is by Anthony Yeung. You can see the original here:
<a href="http://validator.w3.org/check?uri=referer">Contempo</a>. I am
very sorry for everything. Aliquam in justo. Maecenas nec augue. Mauris
sit amet purus faucibus nulla luctus suscipit. Aenean enim est, malesuada
non, congue sit amet, faucibus adipiscing, est. Integer odio massa, interdum
ac, hendrerit a, convallis sit amet, urna. Nam nulla. Mauris luctus, augue
eu ornare egestas, tortor sem molestie turpis, sit amet consectetuer ipsum
dolor id justo. Nunc eget sapien quis pede ultricies porta. Fusce ultrices
lobortis arcu. Cras pulvinar, velit non malesuada sagittis, felis arcu
interdum magna, mattis iaculis tortor lacus sed wisi. Ut ipsum tellus,
pulvinar eget, semper non, consectetuer id, leo. Suspendisse vulputate.
The Original CSS and layout is by Anthony Yeung.</p>
<p><img src="authenticity-images/0170_bubble.png" alt="" />
<a href="#">Comment</a> | <a href="#">More Info</a><br />
</p>
<br/>
<h2><a href="#">Axis Creations</a></h2>
<h3><strong>June 9th 2005</strong></h3>
<p><img src="authenticity-images/0171_new_page.png" alt="" width="12" height="12" />
<a href="http://www.axsicreations.com">Axis Creations</a> is great for
web development, programming, and graphics. For specialized web content,
PHP/MySQL driven management and display, and Macromedia Flash animation,
drop a line.</p>
<p><img src="authenticity-images/0170_bubble.png" alt="" width="12" height="12" />
<a href="#">Comment</a> | <a href="#">More Info</a></p>
</div>
</div>
</div>
<div id="bottom"> </div>
<div id="footertext"><a href="http://validator.w3.org/check?uri=referer">Valid
XHTML</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">Valid
CSS</a> | Copyright 2005 © Your Name | <a href="http://www.axiscreations.com/">Axis
Creations</a>, Designed by Kenneth Barbour.</div>
</body>
</html>
Related examples in the same category