interior-art
<!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>Interior Art | About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* TAGS */
* {margin:0;padding:0}
html {min-width:1000px}
body {background:url(interior-art-images/tail-top.gif) repeat-x center 5px #f7f4ea;font-family:Arial,Helvetica,sans-serif;font-size:100%;line-height:1em;color:#000;min-width:1000px;border-top:5px solid #f2eddd}
object {vertical-align:top;outline:none}
input, textarea, select {font-family:Arial,Helvetica,sans-serif;font-size:1em;vertical-align:middle;font-weight:normal}
fieldset {border:0}
p {margin:0;padding:0}
img {border:0;vertical-align:top;text-align:left}
ul, ol {list-style:none}
/* 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-middle1 {background:#f7f4eb}
.tail-middle2 {background:#fbfaf5}
.tail-bottom {background:url(interior-art-images/tail-bottom.gif) left bottom repeat-x}
/* FORMS */
#login-form {width:249px}
#login-form .field {height:52px}
#login-form .field1 {padding:0 0 14px 0}
#login-form .field label {padding:0 0 5px 5px;display:block}
#login-form .field input {border:1px solid #e1e1dc;vertical-align:top;line-height:1.2em;padding:2px 0 2px 3px;width:244px}
#login-form .field1 a {color:#fff;float:right;display:block;background:#af3300;text-decoration:none}
#login-form .field1 a em {display:block;background:url(interior-art-images/button-left.gif) no-repeat left top}
#login-form .field1 a b {display:block;font-style:normal;font-weight:normal;background:url(interior-art-images/button-right.gif) no-repeat right top;padding:4px 20px 4px 20px}
#login-form .field1 a:hover {text-decoration:underline}
#login-form ul li {background:url(interior-art-images/button.gif) no-repeat left 1px;padding:0 0 7px 22px}
#contacts-form {clear:right;width:100%;overflow:hidden}
#contacts-form fieldset {border:none;float:left}
#contacts-form .field {clear:both}
#contacts-form label {float:left;width:111px;line-height:18px;padding-bottom:8px}
#contacts-form input {width:244px;padding:1px 0 1px 3px;border:1px solid #e1e1dc}
#contacts-form textarea {width:462px;height:334px;padding:1px 0 1px 3px;border:1px solid #e1e1dc;margin-bottom:15px;overflow:auto}
#contacts-form a {color:#fff;float:right;display:block;background:#af3300;text-decoration:none}
#contacts-form a em {display:block;background:url(interior-art-images/button-left.gif) no-repeat left top}
#contacts-form a b {display:block;font-style:normal;font-weight:normal;background:url(interior-art-images/button-right.gif) no-repeat right top;padding:4px 20px 4px 20px}
#contacts-form a:hover {text-decoration:underline}
/* LISTS */
.news {padding-bottom:15px}
.news li {padding:0 19px 0 22px;background:url(interior-art-images/marker.gif) no-repeat left 2px}
.news li a {font-size:.86em;text-decoration:none}
.news li a:hover {text-decoration:underline}
.logo-list {width:100%;overflow:hidden;padding-bottom:18px}
.logo-list li {float:left;border-right:1px solid #e1e1dc;padding-right:22px;margin-right:22px}
.logo-list li.last {border:0;margin:0;padding:0}
.list li {width:100%;overflow:hidden;vertical-align:top}
.list li img {float:left;margin-right:21px}
.list li a {text-decoration:none}
.list li a:hover {text-decoration:underline}
.list1 {padding-bottom:20px}
.list1 li {padding:0 0 0 20px;background:url(interior-art-images/button.gif) no-repeat left 4px;line-height:1.57em}
.address li {width:100%;overflow:hidden;vertical-align:top;line-height:1.57em}
.address li span {float:left;color:#af3300;width:87px}
/* OTHER */
.img-box1 {width:100%;overflow:hidden;padding-bottom:12px}
.img-box1 img {float:left;margin:0 20px 0 0}
p {line-height:1.57em;margin-bottom:20px}
.p0 {margin:0}
/* TXT, LINKS, LINES, TITLES */
a {color:#af3300;outline:none}
a:hover {text-decoration:none}
h3 {font-size:30px;line-height:1.2em;border-bottom:1px solid #dedbd3;margin:0 0 14px 0;padding:0 0 8px 19px;position:relative;left:-19px}
h3 span, h3 b {color:#af3300}
h3 b {font-weight:normal}
h4 {font-size:.86em;margin-bottom:5px}
.txt1 {color:#af3300}
/* HEADER */
#header .row-1 {height:112px;width:100%;overflow:hidden}
#header .row-1 .fleft {padding-top:27px}
#header .row-1 .fright {padding-top:38px}
#header .row-1 .fright ul li {font-size:21px;line-height:1.2em;float:left;margin-left:1px}
#header .row-1 .fright ul li a {display:block;color:#fff;text-decoration:none}
#header .row-1 .fright ul li a em {display:block}
#header .row-1 .fright ul li a b {display:block;font-style:normal;font-weight:normal;padding:5px 29px 5px 29px}
#header .row-1 .fright ul li a:hover, #header .row-1 .fright ul li a.active {background-color:#af3300}
#header .row-1 .fright ul li a:hover em, #header .row-1 .fright ul li a.active em {background:url(interior-art-images/nav-act-left.gif) no-repeat left top}
#header .row-1 .fright ul li a:hover b, #header .row-1 .fright ul li a.active b {background:url(interior-art-images/nav-act-right.gif) no-repeat right top}
#header .row-2 { padding:42px 0 0 56px}
#header .row-2 ul {width:100%}
#header .row-2 ul li {padding:0 0 12px 19px;background:url(interior-art-images/arrow.gif) no-repeat left 5px}
#header .extra {position:absolute;right:53px;top:90px}
/* CONTENT */
#content .indent {padding:28px 55px 21px 56px}
#content .indent1 {padding:28px 36px 34px 56px}
#content .indent2 {padding-right:25px}
#content .indent3 {padding:28px 0 34px 56px}
#content .inner_copy, #content .inner_copy a {border:0;float:right;background:#000;color:#f00;width:100%;line-height:10px;font-size:10px;margin:-50% 0 0 0;overflow:hidden;padding:0}
#content .row-3 ul li {font-size:.86em;background-repeat:no-repeat;background-position:0 2px;padding-bottom:8px}
#content .row-3 ul li.twitter {background:url(interior-art-images/twitter.gif) no-repeat}
#content .row-3 ul li.delicious {background:url(interior-art-images/delicious.gif) no-repeat}
#content .row-3 ul li.stumbleupon {background:url(interior-art-images/stumbleupon.gif) no-repeat}
#content .row-3 ul li.facebook {background:url(interior-art-images/facebook.gif) no-repeat}
#content .row-3 ul li a {color:#898989}
#content .row-3 .col-1 ul li {padding-left:23px}
/* FOOTER */
#footer p {font-size:.86em;line-height:2.17em;padding-top:22px}
</style>
<link href="layout.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.4.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_300.font.js" type="text/javascript"></script>
<script src="js/Myriad_Pro_400.font.js" type="text/javascript"></script>
</head>
<body id="page2">
<div class="tail-bottom">
<!-- HEADER -->
<div id="header">
<div class="row-1">
<div class="fleft"><a href="index.html"><img src="interior-art-images/logo.gif" alt="" /></a></div>
<div class="fright">
<ul>
<li><a href="index.html"><em><b>home</b></em></a></li>
<li><a href="about-us.html" class="active"><em><b>about us</b></em></a></li>
<li><a href="articles.html"><em><b>articles</b></em></a></li>
<li><a href="contact-us.html"><em><b>contact us</b></em></a></li>
<li><a href="sitemap.html"><em><b>site map</b></em></a></li>
</ul>
</div>
</div>
<div class="row-2">
<ul>
<li><a href="#">Home Furniture</a></li>
<li><a href="#">Armoire</a></li>
<li><a href="#">Bookcases</a></li>
<li><a href="#">Coffee Tables</a></li>
<li><a href="#">Computer Desks</a></li>
<li><a href="#">Corner Desks</a></li>
<li><a href="#">Cabinets and Storage</a></li>
</ul>
</div>
<div class="extra"><img src="interior-art-images/header-img.jpg" alt="" /></div>
</div>
<!-- CONTENT -->
<div id="content">
<div class="inner_copy">More Website Templates at TemplateMonster.com!</div>
<div class="tail-middle1">
<div class="row-1">
<div class="indent1">
<h3>About <span>Your Website</span></h3>
<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 class="p0">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>
</div>
<div class="tail-middle2">
<div class="row-2">
<div class="indent3">
<div class="container">
<div class="col-1">
<h3>Latest News</h3>
<ul class="news">
<li><a href="#">June 01, 2010</a>
<p>Lorem ipsum dolor sit amet, con- sectetur adipisicing elit, sed do eiusmod tempor.</p>
</li>
<li><a href="#">June 01, 2010</a>
<p>Ut enim ad minim veniam, quis<br />
nostrud exercitation ullamco laboris nisiut aliquip.</p>
</li>
</ul>
<h3>Login Form</h3>
<form action="#" id="login-form">
<fieldset>
<div class="field">
<label>Username:</label>
<input type="text" />
</div>
<div class="field">
<label>Password:</label>
<input type="password" />
</div>
<div class="field1"><a href="#"><em><b>Log In</b></em></a>
<label>Remember Me</label>
<input type="checkbox" />
</div>
<ul>
<li><a href="#">Forgot your password?</a></li>
<li><a href="#">Register</a></li>
</ul>
</fieldset>
</form>
</div>
<div class="col-2">
<h3>About Your Team</h3>
<div class="indent2">
<ul class="list">
<li><img src="interior-art-images/2page-img1.jpg" alt="" />
<p><a href="#">Team Member One</a><br />
He is most important member of your team. Usually this is the person who started the website. Maybe it is worth to write why he has made such a decision and what has inspired him.</p>
</li>
<li><img src="interior-art-images/2page-img2.jpg" alt="" />
<p><a href="#">Another Team Member</a><br />
We are completely 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.</p>
</li>
<li><img src="interior-art-images/2page-img3.jpg" alt="" />
<p><a href="#">Another Team Member</a><br />
We are completely 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.</p>
</li>
<li><img src="interior-art-images/2page-img4.jpg" alt="" />
<p><a href="#">Another Team Member</a><br />
We are completely 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.</p>
</li>
</ul>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
</div>
<div class="row-3">
<div class="indent">
<div class="wrapper">
<div class="col-1">
<h4>Link to us</h4>
<ul>
<li class="twitter"><a href="#">Twitter</a></li>
<li class="delicious"><a href="#">Delicious</a></li>
<li class="stumbleupon"><a href="#">Stumbleupon</a></li>
<li class="facebook"><a href="#">Facebook</a></li>
</ul>
</div>
<div class="col-2">
<h4>Home</h4>
<ul>
<li><a href="#">Today?s News</a></li>
<li><a href="#">Newsletter</a></li>
<li><a href="#">Blogs</a></li>
<li><a href="#">RSS Feeds</a></li>
</ul>
</div>
<div class="col-3">
<h4>Room Inspiration</h4>
<ul>
<li><a href="#">Kitchen</a></li>
<li><a href="#">Bathroom</a></li>
<li><a href="#">Living</a></li>
<li><a href="#">Bedroom</a></li>
</ul>
</div>
<div class="col-4">
<h4>Expert Advice</h4>
<ul>
<li><a href="#">Style Ideas</a></li>
<li><a href="#">Buyers? Guide</a></li>
<li><a href="#">Most FAQ?s</a></li>
<li><a href="#">Planning Tips</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- FOOTER -->
<div id="footer">
<p class="aligncenter"> Copyright - Type in your name here<br />
<a href="http://www.templatemonster.com/">Website template</a> designed by TemplateMonster.com<br />
<a href="http://www.templates.com/product/3d-models/">3D Models</a> provided by Templates.com </p>
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
Related examples in the same category