st-valentines-day
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>St. Valentines Day | About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* TAGS */
* {margin:0;padding:0}
body {background:#e6fbff;font-family:Tahoma,Arial,helvetica,sans-serif;font-size:100%;line-height:1em;color:#5e5e5e;min-width:1000px}
object {vertical-align:top;outline:none}
input, textarea, select {font-family:Tahoma,Arial,helvetica,sans-serif;font-size:1em;vertical-align:middle;font-weight:normal}
p {margin:0;padding:0}
img {border:0;vertical-align:top;text-align:left}
/* ALIGMENT */
.fleft {float:left}
.fright {float:right}
.clear {clear:both}
.alignright {text-align:right}
.aligncenter {text-align:center}
.wrapper {width:100%;overflow:hidden}
.container {width:100%}
/* TAILING */
.tail-top {background:url(st-valentines-day-images/tail-top.gif) left top repeat-x #fff}
.tail-bottom {background:url(st-valentines-day-images/tail-bottom.gif) left bottom repeat-x}
/* GLOBAL */
#header, #content, #footer {font-size:0.75em;width:1000px;margin:0 auto}
.col-1, .col-2, .col-3 {float:left}
/* FORMS */
#form .form {height:29px;width:100%;overflow:hidden}
#form input {width:119px;float:left;padding:1px 0 1px 3px;background:#fff;border:1px solid #a7ccce;vertical-align:top;line-height:1.2em;margin-right:5px}
#form a {float:left}
#contacts-form {clear:right;width:100%;overflow:hidden}
#contacts-form fieldset {border:none;float:left}
#contacts-form .field {clear:both;height:22px}
#contacts-form label {float:left;width:97px;font-weight:bold;color:#5e5e5e}
#contacts-form input {width:347px;padding:1px 0 1px 3px;border:1px solid #5eb2c1;color:#70635b;float:left}
#contacts-form textarea {width:347px;height:360px;padding:1px 0 1px 3px;border:1px solid #5eb2c1;color:#70635b;float:left;margin-bottom:15px;overflow:auto}
#contacts-form a {color:#e62525}
/* LISTS */
ul, ol {list-style:none}
.site-nav {padding-top:11px}
.site-nav li {float:left;font-size:17px;line-height:1.2em;text-transform:uppercase;padding:2px 42px 0 42px;background:url(st-valentines-day-images/divider.gif) repeat-y right top}
.site-nav li a {text-decoration:none;color:#133439}
.site-nav li a:hover {color:#e93434}
.site-nav li.last {background:none;padding-right:0}
.nav-list {position:absolute;right:113px;top:52px}
.nav-list li {float:left;padding:6px 17px 6px 15px;background:url(st-valentines-day-images/divider1.gif) repeat-y right top}
.nav-list li.last {background:none;padding-right:0}
.list li {padding:0 0 8px 11px;background:url(st-valentines-day-images/marker1.gif) no-repeat left 5px}
.list li a {color:#133439}
.list1 {margin-top:-15px}
.list1 li {color:#393939;padding-top:15px}
.list1 li b {display:block;padding-bottom:6px}
.list1 li a {text-decoration:none;color:#393939}
.list1 li a:hover {background:#fff}
.list2 {margin-top:-5px}
.list2 li {width:100%;overflow:hidden;vertical-align:top;padding-top:15px}
.list2 li img {float:left;margin:-10px 12px 0 0}
.list2 li b {display:block;padding-bottom:5px}
.list2 li b a {color:#5eb2c1;text-decoration:none}
.list2 li b a:hover {color:#000}
.list3 {margin-top:-9px}
.list3 li {width:100%;overflow:hidden;vertical-align:top;padding-top:10px}
.list3 li img {float:left;margin:6px 12px 0 0}
.list3 li b {display:block;padding-bottom:5px}
.list3 li b a {color:#5eb2c1;text-decoration:none}
.list3 li b a:hover {color:#000}
.list4 {padding-bottom:17px}
.list4 li {font-weight:bold;padding:0 0 5px 8px;background:url(st-valentines-day-images/marker2.gif) no-repeat left 6px}
.list4 li ul {padding-top:5px;margin-bottom:-5px}
.list4 li a {color:#e62525}
/* OTHER */
.img-box span {display:block;padding-top:20px;text-align:center;color:#133439}
.img-box span b {display:block;color:#e62525}
.img-box a {text-decoration:none}
p {margin-bottom:18px}
.p1 {margin-bottom:0}
.phone {float:right;margin-right:30px}
/* TXT, LINKS, LINES, TITLES */
a {color:#bc3027;outline:none}
a:hover {text-decoration:none}
h2 {font-size:24px;line-height:1.2em;text-transform:uppercase;color:#133439;margin-bottom:20px}
h2 span {color:#878787;padding-left:60px;display:inline-block}
h2 b {color:#e62525;position:relative;top:1px}
h2 strong {color:#5eb2c1;position:relative;top:1px}
h3 {font-size:20px;line-height:1.2em;color:#133439;text-transform:uppercase;margin-bottom:15px;font-weight:normal}
/* BOXES */
.box {background:url(st-valentines-day-images/box-tail.gif) repeat-y left top;width:208px;margin-bottom:20px}
.box .top {background:url(st-valentines-day-images/box-top.gif) no-repeat left top}
.box .bot {background:url(st-valentines-day-images/box-bot.gif) no-repeat left bottom;min-height:313px;height:auto!important;height:313px}
.box .inner, .box1 .inner, .box2 .inner {padding:25px 30px 25px 30px}
.box1 {background:url(st-valentines-day-images/box1-tail.gif) repeat-y left top;width:208px}
.box1 .top {background:url(st-valentines-day-images/box1-top.gif) no-repeat left top}
.box1 .bot {background:url(st-valentines-day-images/box1-bot.gif) no-repeat left bottom;min-height:289px;height:auto!important;height:289px}
.box2 {background:url(st-valentines-day-images/box2-tail.gif) repeat-y left top;width:208px}
.box2 .top {background:url(st-valentines-day-images/box2-top.gif) no-repeat left top}
.box2 .bot {background:url(st-valentines-day-images/box2-bot.gif) no-repeat left bottom;min-height:432px;height:auto!important;height:432px}
.box2 h3 {color:#7a2d2e}
.box3 {background:#f3f3f3;width:504px}
.box3 .top {background:url(st-valentines-day-images/box3-top.gif) no-repeat left top}
.box3 .bot {background:url(st-valentines-day-images/box3-bot.gif) no-repeat left bottom}
.box3 .inner {padding:25px 25px 20px 30px}
.box3 h3 {margin-bottom:9px}
.form-box {width:208px;background:url(st-valentines-day-images/form-box-tail.gif) repeat-y left top;margin-bottom:20px}
.form-box .top {background:url(st-valentines-day-images/form-box-top.gif) no-repeat left top}
.form-box .bot {min-height:170px;height:auto!important;height:170px;background:url(st-valentines-day-images/form-box-bot.gif) no-repeat left bottom}
.form-box .inner {padding:26px 20px 40px 30px}
.form-box h3, .form-box p {color:#fff}
.form-box h3 {margin-bottom:10px}
.form-box p {margin-bottom:6px}
.form-box a {color:#fbcec6}
/* HEADER */
#header {height:440px;background:url(st-valentines-day-images/header-bg.jpg) no-repeat left top;position:relative}
#header .logo {position:absolute;left:41px;top:63px}
/* CONTENT */
#content .col-1, #content .col-2 {margin-right:20px}
#content .col-1 {width:208px}
#content .col-2 {width:504px}
#content .col-3 {width:208px;float:right}
#content .indent {padding:30px 20px 40px 20px}
#content .indent1 {padding:20px 20px 30px 30px}
#content .inner_copy {border:0;color:#f00;float:left;width:50%!important;margin:-100px 0 0 0;overflow:hidden;line-height:0;padding:0;font-size:11px}
/* FOOTER */
#footer {height:85px;background:url(st-valentines-day-images/footer-bg.gif) no-repeat left top}
#footer p {text-align:center;padding-top:33px;color:#133439}
#footer p a {color:#e62525}
#footer img {position:relative;top:-4px}
</style>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/Myriad_Pro_400.font.js" type="text/javascript"></script>
<script src="js/Myriad_Pro_700.font.js" type="text/javascript"></script>
</head>
<body id="page2">
<div class="tail-top">
<div class="tail-bottom">
<!-- HEADER -->
<div id="header">
<ul class="site-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About Us</a></li>
<li><a href="articles.html">Articles</a></li>
<li><a href="contact-us.html">Contact Us</a></li>
<li class="last"><a href="sitemap.html">Site Map</a></li>
</ul>
<div class="nav-list">
<ul>
<li><a href="#"><img src="st-valentines-day-images/pic1.gif" alt="" /></a></li>
<li class="last"><a href="#"><img src="st-valentines-day-images/pic2.gif" alt="" /></a></li>
</ul>
</div>
<div class="logo"><a href="#"><img src="st-valentines-day-images/logo.gif" alt="" /></a></div>
</div>
<!-- CONTENT -->
<div id="content">
<div class="inner_copy">More <a href="#">Website Templates</a> @ Templates.com!</div>
<div class="indent">
<div class="wrapper">
<div class="col-1">
<div class="box">
<div class="top">
<div class="bot">
<div class="inner">
<h3>Categories:</h3>
<ul class="list">
<li><a href="#">Autumn Gifts</a></li>
<li><a href="#">Cookie Bouquets</a></li>
<li><a href="#">Engravable Gifts</a></li>
<li><a href="#">Flowers and Plants</a></li>
<li><a href="#">For Couples</a></li>
<li><a href="#">For Dad</a></li>
<li><a href="#">For Her</a></li>
<li><a href="#">For Him</a></li>
<li><a href="#">For Kids</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="box1">
<div class="top">
<div class="bot">
<div class="inner">
<h3>What’s New?</h3>
<div class="img-box"><a href="#"><img src="st-valentines-day-images/extra-img.jpg" alt="" /><span>Product #045<b>$49.99</b></span></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-2">
<div class="indent1">
<h2>About <b>Your Website</b></h2>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione.</p>
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam.</p>
</div>
<div class="box3">
<div class="top">
<div class="bot">
<div class="inner">
<h3>About Your Team:</h3>
<ul class="list3">
<li><img src="st-valentines-day-images/img-wrapper.gif" alt="" /><b><a href="#">Team Member One</a></b> He is supposed to be the most important member of your team. Ususally this is the person who started the website. Maybe it is worth to write why he made such a desicion, what inspired him and what are his plans for the future.</li>
<li><img src="st-valentines-day-images/img-wrapper.gif" alt="" /><b><a href="#">Another Team Member</a></b> We are completly lost on what he's responsible for but we hope that you know it ;) We also hope that you will tell it to the rest of the world including us by placing some real text here.</li>
<li><img src="st-valentines-day-images/img-wrapper.gif" alt="" /><b><a href="#">The Last Team Member</a></b> We are completly lost on what he's responsible for but we hope that you know it ;) We also hope that you will tell it to the rest of the world including us by placing some real text here.</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="col-3">
<div class="form-box">
<div class="top">
<div class="bot">
<div class="inner">
<h3>Site Search:</h3>
<form action="#" method="post" id="form">
<div class="form">
<input type="text" />
<a href="#"><img src="st-valentines-day-images/button-search.gif" alt="" /></a></div>
<p>Use keywords to find the product you are looking for.</p>
<div><a href="#">Advanced Search</a></div>
</form>
</div>
</div>
</div>
</div>
<div class="box2">
<div class="top">
<div class="bot">
<div class="inner">
<h3>Latest News:</h3>
<ul class="list1">
<li><b><a href="#">Jan 25, 2010</a></b>Satus error sit voluptatem accusatium dolorem.</li>
<li><b><a href="#">Jan 12, 2010</a></b>Totam rem aperiam, eaque ipsa quae sequi nesciunt eque porro.</li>
<li><b><a href="#">Jan 02, 2010</a></b>Nemo enim ipsam volupta- tem qoluptas sed.</li>
<li><b><a href="#">Dec 27, 2009</a></b>Dolores eos qui ratione voluptatem.</li>
<li><b><a href="#">Dec 13, 2009</a></b>Satus error sit voluptatem accusatium dolorem</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- FOOTER -->
<div id="footer">
<p>Copyright - Type in Your Name Here Designed by <a href="http://www.templates.com"><img alt="" src="st-valentines-day-images/templates-logo.gif" /></a> Your Provider of <a href="http://www.templates.com">Website Templates</a></p>
</div>
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
Related examples in the same category