interior-design
<!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 Design | About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
* {margin:0;padding:0}
html, body {height:100%}
html {min-width:1000px}
body {background:#000;font-family:Arial, Helvetica, sans-serif;font-size:100%;line-height:1.125em;color:#242424}
img {border:0;vertical-align:top;text-align:left}
object {vertical-align:top;outline:none}
ul, ol {list-style:none}
.fleft {float:left}
.fright {float:right}
.clear {clear:both}
.col-1, .col-2, .col-3 {float:left}
.alignright {text-align:right}
.aligncenter {text-align:center}
.wrapper {width:100%;overflow:hidden}
.container {width:100%}
/* GLOBAL */
#main {width:1000px;margin:0 auto;font-size:.8125em;position:relative;background:url(interior-design-images/main-bg.jpg) no-repeat left 291px #a53b19}
#header {height:291px;background:url(interior-design-images/header-bg.jpg) no-repeat left bottom}
#content {padding:0 20px 20px 20px}
#content .aside {float:left;width:275px;margin-right:30px}
#content .mainContent {float:left;width:655px}
#footer {padding:0 20px 30px 20px}
/* forms parameters */
input, select, textarea {font-family:Arial, Helvetica, sans-serif;font-size:1em;vertical-align:middle;font-weight:normal}
/* other */
.img-indent {margin:0 20px 0 0;float:left}
.img-box {width:100%;overflow:hidden;padding-bottom:20px}
.img-box img {float:left;margin:0 20px 0 0}
.extra-wrap {overflow:hidden}
p {margin-bottom:18px}
.p1 {margin-bottom:9px}
.p2 {margin-bottom:18px}
.p3 {margin-bottom:27px}
/* txt, links, lines, titles */
a {color:#fff;outline:none}
a:hover{text-decoration:none}
h1 {width:399px;height:138px;background:url(interior-design-images/logo.jpg) no-repeat left top;text-indent:-9999em}
h1 a {display:block;width:399px;height:138px}
h2 {background:url(interior-design-images/title-bg.jpg) no-repeat left top;height:47px;font-size:18px;line-height:47px;color:#fff;text-transform:uppercase;font-weight:normal;padding:0 0 0 28px}
h3 {font-size:18px;line-height:1.2em;color:#fff;text-transform:uppercase;margin-bottom:15px}
h4 {font-size:14px;font-weight:normal;background:url(interior-design-images/title-left.gif) no-repeat left top;padding-left:1px;color:#fff}
h4 span {display:block;background:url(interior-design-images/title-right.gif) no-repeat right top;padding-right:1px}
h4 span span {background:#242424;padding:5px 0 5px 19px}
h5 {font-size:1em;color:#fff}
h5 a {text-decoration:none}
h5 a:hover {text-decoration:underline}
h6 {font-size:1em;margin-bottom:18px}
/* boxes */
.box {background:url(interior-design-images/box-bg.png) left top;width:100%}
.box .inner {padding:40px 30px 30px 30px}
.box .inner .inner, .box1 .inner .inner, .box2 .inner .inner {padding:22px 0 0 10px}
.box1 {background:url(interior-design-images/box1-bg.png) left top;width:100%}
.box1 .inner {padding:26px 30px 30px 30px}
.box2 {background:url(interior-design-images/box2-bg.png) left top;width:100%;font-family:Tahoma, Geneva, sans-serif}
.box2 .inner {padding:22px 20px 20px 24px}
/* header */
.extra-bg {position:absolute;background:url(interior-design-images/extra-bg.png) no-repeat left top;width:397px;height:333px;top:7px;left:5px;z-index:10}
#header .row-1 {height:61px;background:url(interior-design-images/header-bg-top.gif) left top repeat-x;overflow:hidden}
#header .top-links {float:left;padding:16px 0 0 23px;position:relative;z-index:11}
#header .top-links li {float:left}
#header .nav {float:right;padding:18px 0 0 0;position:relative;z-index:12}
#header .nav li {float:left;background:url(interior-design-images/divider.gif) no-repeat left top;padding:0 42px 0 43px;font-size:15px;line-height:1.2em}
#header .nav li.first {background:none}
#header .nav li a {color:#fff;text-decoration:none;text-transform:uppercase;float:left;padding:3px 0 3px 0}
#header .nav li a:hover {color:#b95126}
#header .row-2 {padding:43px 0 0 564px}
/* content */
#content .aside .section {padding-bottom:20px}
#content .mainContent .section {padding-bottom:35px}
#content .mainContent .indent {padding:22px 20px 0 30px}
#content .inner_copy {border:0;color:#fff;float:left;width:50%!important;margin:-100px 0 0 0;overflow:hidden;line-height:0;padding:0;font-size:11px}
#content dl dt {color:#fff;font-weight:bold}
#content dl dd {padding-bottom:18px}
#content dl dd.last {padding-bottom:0}
.img-list li {width:100%;overflow:hidden;padding-bottom:2px;vertical-align:top}
.img-list li.last {padding-bottom:0}
.img-list li img {float:left;margin:12px 10px 0 0}
.img-list li h5 {padding-top:10px}
.list1 li {width:100%;overflow:hidden;padding-bottom:17px}
.list1 li img {float:left;margin-right:15px}
.list2 {padding-bottom:18px}
.list2 li {background:url(interior-design-images/arrow1.gif) no-repeat left 7px;padding:0 0 0 12px;position:relative}
.list2 li a {font-weight:bold}
/* footer */
#footer {font-family:Tahoma, Geneva, sans-serif}
#footer img {position:relative;margin-top:-2px}
#footer .nav {background:#242424;padding:12px 0 11px 0;text-align:center;margin-bottom:27px;font-family:Arial, Helvetica, sans-serif}
#footer .nav li {display:inline}
#footer .nav li a {color:#fff;font-size:14px;background:url(interior-design-images/divider1.gif) no-repeat left 4px;padding:0 65px 0 65px}
#footer .nav li a.first {background:none}
/* forms */
#poll-form fieldset {border:none}
#poll-form label {display:block;vertical-align:top;width:100%;overflow:hidden;height:24px}
#poll-form input.radio {width:14px;height:14px;margin-right:5px}
#poll-form input.submit {background:url(interior-design-images/vote.gif) no-repeat left top;width:77px;height:20px;color:#fff;text-align:center;border:none;font-size:14px}
#poll-form div {padding-top:16px}
#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:107px;line-height:18px;padding-bottom:4px;font-weight:bold}
#contacts-form input {width:265px;padding:0 0 0 3px;background:#fff;border:1px solid #952a10;color:#111;float:left}
#contacts-form textarea {width:484px;height:280px;padding:1px 0 1px 3px;background:#fff;border:1px solid #952a10;color:#111;margin-bottom:15px;overflow:auto;float:left}
#contacts-form a {float:right;background:url(interior-design-images/send-button.gif) no-repeat left top;width:178px;height:20px;line-height:20px;color:#fff;text-decoration:none;text-align:center}
#contacts-form a:hover {text-decoration:underline}
</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>
<!--[if lt IE 7]>
<link href="ie_style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/ie_png.js"></script>
<script type="text/javascript">ie_png.fix('.png, .extra-bg, .box, .box1, .box2, .img-list img');</script>
<![endif]-->
</head>
<body id="page2">
<div id="main">
<div class="extra-bg"></div>
<!-- header -->
<div id="header">
<div class="row-1">
<ul class="top-links">
<li><a href="#"><img alt="" src="interior-design-images/home-icon.gif" /></a></li>
<li><a href="#"><img alt="" src="interior-design-images/mail-icon.gif" /></a></li>
</ul>
<ul class="nav">
<li class="first"><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><a href="site_map.html">Site Map</a></li>
</ul>
</div>
<div class="row-2">
<h1><a href="#">Interior Design</a></h1>
</div>
</div>
<!-- content -->
<div id="content">
<div class="wrapper">
<div class="aside">
<div class="inner_copy">More <a href="#">Website Templates</a> @ Templates.com!</div>
<div class="section">
<!-- box begin -->
<div class="box">
<div class="inner">
<h4><span><span>Latest News:</span></span></h4>
<div class="inner">
<dl>
<dt>December 31, 2009</dt>
<dd>Satum quae sequi nesciueqpro doloremque laudantium.</dd>
<dt>December 22, 2009</dt>
<dd class="last">Totam rem aperiam, eaquepsquae ab explicabo.</dd>
</dl>
</div>
</div>
</div>
<!-- box end -->
</div>
<!-- box1 begin -->
<div class="box1">
<div class="inner">
<h4><span><span>Polls:</span></span></h4>
<div class="inner">
<form id="poll-form" action="#">
<fieldset>
<h6>Satus error voluptatem accum satium quae sequi?</h6>
<label for="name1">
<input type="radio" name="name" class="radio" id="name1" checked="checked" />
Totam rem aperiam</label>
<label for="name2">
<input type="radio" name="name" class="radio" id="name2"/>
Eaque ipsquae sequi neseiunt</label>
<label for="name3">
<input type="radio" name="name" class="radio" id="name3"/>
Hque porro qusquam</label>
<label for="name4">
<input type="radio" name="name" class="radio" id="name4"/>
Gxplicabo atus error sit </label>
<div class="aligncenter">
<input type="submit" value="Vote" class="submit"/>
</div>
</fieldset>
</form>
</div>
</div>
</div>
<!-- box1 end -->
</div>
<div class="mainContent">
<div class="section">
<h2>About Your Website</h2>
<div class="indent"> 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 voluptatem sequi nesciunt. 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. </div>
</div>
<!-- box2 begin -->
<div class="box2">
<div class="inner">
<h3>About Your TEam</h3>
<ul class="list1">
<li> <img alt="" src="interior-design-images/img2.jpg" />
<h5>Team Member One</h5>
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 alt="" src="interior-design-images/img3.jpg" />
<h5>Another Team Member</h5>
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 alt="" src="interior-design-images/img4.jpg" />
<h5>The Last Team Member</h5>
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>
<!-- box2 end -->
</div>
</div>
</div>
<!-- footer -->
<div id="footer">
<ul class="nav">
<li><a href="#" class="first">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Articles</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Site Map</a></li>
</ul>
<div class="wrapper aligncenter">Copyright - Type in your name here Designed by <a href="http://www.templates.com/"><img alt="" src="interior-design-images/t-com_logo.gif" /></a> Your <a href="http://www.templates.com/product/3d-models/">3D Models</a> Marketplace</div>
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
Related examples in the same category