feel-the-music : Holiday « Templates « HTML / CSS






feel-the-music

     

<!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>Feel The Music | About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
* {margin:0;padding:0}
html {min-width:1000px}
body {background:url(feel-the-music-images/tail-cont.gif) repeat center top #f2c142;font-family:Tahoma, Arial, helvetica, sans-serif;font-size:100%;line-height:1em;color:#000;min-width:1000px}
input, textarea, select {font-family:Tahoma, Arial, helvetica, sans-serif;font-size:1em}
input, select {vertical-align:middle;font-weight:normal}
img {border:0;vertical-align:top;text-align:left}
object {vertical-align:top;outline:none}
/* global */
#header, #content, #footer {font-size:0.75em}
.wrapper {width:100%;overflow:hidden}
.container {width:1000px;margin:0 auto;position:relative}
.col-1, .col-2, .col-3 {float:left}
.fleft {float:left}
.fright {float:right}
.clear {clear:both}
.alignright {text-align:right}
.aligncenter {text-align:center}
.wrapper {width:100%;overflow:hidden}
p {margin:0;padding:0}
.tail-top {background:url(feel-the-music-images/tail-top.gif) center top repeat-x}
.tail-top-left {height:161px;position:absolute;left:0;top:0;width:50%;background:url(feel-the-music-images/tail-top-left.gif) repeat-x left top}
.tail-bottom {background:url(feel-the-music-images/tail-bottom.png) left bottom repeat-x}
/* forms */
#contacts-form {clear:right;width:100%;overflow:hidden;padding:15px 0 0 0}
#contacts-form fieldset {border:none;float:left;}
#contacts-form .field {clear:both}
#contacts-form label {float:left;width:97px;line-height:18px;padding-bottom:8px;font-weight:bold;color:#9f5827}
#contacts-form input {width:227px;padding:1px 0 1px 3px;background:#fff;border-right:1px solid #db5100;border-left:0;border-top:0;border-bottom:1px solid #db5100;color:#70635b;float:left}
#contacts-form textarea {width:518px;height:252px;padding:1px 0 1px 3px;background:#fff;border-left:0;border-top:0;border-right:1px solid #db5100;border-bottom:1px solid #db5100;color:#70635b;margin-bottom:15px;overflow:auto;float:left}
/* list */
ul {list-style:none}
.nav {position:absolute;right:55px;top:56px}
.nav li {float:left;padding-right:24px;margin-right:24px;background:url(feel-the-music-images/divider.gif) repeat-y right top;height:11px}
.nav li.last {background:none;padding-right:0;margin-right:0}
.site-nav {position:absolute;left:0;top:128px;z-index:2}
.site-nav li {float:left;text-transform:uppercase;font-size:1.17em;background:url(feel-the-music-images/divider1.gif) repeat-y right top;line-height:1.08em}
.site-nav li a {color:#515151;text-decoration:none;display:block;width:200px;padding:4px 0 3px 0;text-align:center}
.site-nav li a:hover,
.site-nav li a.act {color:#a24f00}
.site-nav li.last {background:none}
.list {margin-top:-17px}
.list li {width:100%;overflow:hidden;vertical-align:top;padding-top:17px}
.list li b {display:block;margin-bottom:4px}
.list li img {float:left;margin-right:15px}
.list1 {padding-bottom:15px;margin:0;font-weight:bold}
.list1 li {padding:0 0 6px 8px;background:url(feel-the-music-images/marker.gif) no-repeat left 6px}
.list1 li ul {padding:8px 0 0 12px;margin-bottom:-4px}
/* other */
.img-box1 {width:100%;overflow:hidden;padding-bottom:12px}
.img-box1 img {float:left;margin:0 20px 0 0}
.p1 {margin-bottom:20px}
/* txt, links, lines, titles */
a {color:#c9710c;outline:none}
a:hover{text-decoration:none}
h2, h3 {color:#c9710c;line-height:1.2em;margin-bottom:20px}
h2 {font-size:36px}
h3 {font-size:25px}
.link {text-align:right;font-weight:bold}
/*header*/
#header {background:url(feel-the-music-images/header-bg.jpg) no-repeat left top;height:161px}
#header .logo {position:absolute;left:18px;top:3px}
/*content*/
#content {background:url(feel-the-music-images/cont-bg.jpg) no-repeat left top;min-height:561px;height:auto!important;height:561px}
#content .indent {padding:50px 50px 50px 329px}
#content .inner_copy {border:0;color:#fff;float:right;width:0.09%!important;margin:-100px;overflow:hidden;line-height:0px;padding:0px;font-size:11px}
#content .indent1 {padding-bottom:37px}
/*footer*/
#footer {height:79px}
#footer .indent {padding:32px 50px 20px 50px}
#footer a {color:#de7715}
#footer img {position:relative;top:-4px}

</style>


<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/Bauhaus_Md_BT_400.font.js" type="text/javascript"></script>
<!--[if lt IE 7]>
<script type="text/javascript" src="js/ie_png.js"></script>
<script type="text/javascript">ie_png.fix('.png');</script>
<![endif]-->
</head>
<body id="page2">
<div class="tail-cont">
  <div class="tail-top-left"></div>
  <div class="tail-top">
    <div class="container">
      <!-- header -->
      <div id="header">
        <div class="logo"><a href="#"><img src="feel-the-music-images/logo.jpg" alt="" /></a></div>
        <ul class="nav">
          <li><a href="#"><img src="feel-the-music-images/icon1.gif" alt="" /></a></li>
          <li><a href="#"><img src="feel-the-music-images/icon2.gif" alt="" /></a></li>
          <li class="last"><a href="#"><img src="feel-the-music-images/icon3.gif" alt="" /></a></li>
        </ul>
        <ul class="site-nav">
          <li><a href="index.html">Home</a></li>
          <li><a href="about-us.html" class="act">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>
      <!-- content -->
      <div id="content">
        <div class="indent">
          <div class="indent1">
            <h2>About Your Website</h2>
            <p>This is an "About Us" page. You are supposed to fill it with some information on your website or your company. People usually write about history of the company or about the website - why it was created, when, etc. If there are more than one person who supports the website you may consider writning about each memeber of your team.</p>
          </div>
          <h3>About Your Team</h3>
          <ul class="list p1">
            <li><img src="feel-the-music-images/2page-img1.jpg" alt="" /><b>Team Member One</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="feel-the-music-images/2page-img2.jpg" alt="" /><b>Another Team Member</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. If this person has his own website this is a good place to link to it...</li>
            <li><img src="feel-the-music-images/2page-img3.jpg" alt="" /><b>Last One Team Member</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. If this person has his own website this is a good place to link to it...</li>
          </ul>
          <p>If you do not know what to write on this page you may just delete it othervise copy your CV here.</p>
        </div>
        <div class="inner_copy">More <a href="#">Website Templates</a> @ Templates.com!</div>
      </div>
    </div>
  </div>
  <div class="tail-bottom png">
    <!-- footer -->
    <div id="footer">
      <div class="container">
        <div class="indent">
          <div class="fleft">Copyright - type in your name here.</div>
          <div class="fright">Designed by: <a href="http://www.templates.com/"><img alt="" src="feel-the-music-images/templates-logo.gif" /></a>&nbsp; Your <a href="http://www.templates.com/product/3d-models/">3D Models</a> Marketplace</div>
        </div>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>

   
    
    
    
    
  








Related examples in the same category

1.metamorph_helloween
2.Christmas-2008
3.christmas
4.metamorph_diving
5.metamorph_summertime
6.metamorph_valentine
7.metamorph_happyness
8.happy-holidays
9.metamorph_partytime
10.metamorph_peacefull
11.partytime
12.Romantic
13.thegathering
14.theharvest
15.timetorest
16.treasure-hunters
17.vacation
18.happyeaster
19.holiday 2
20.holidayseason
21.harvest
22.harvestfield
23.high5
24.hotspring