music-club : Music « Templates « HTML / CSS






music-club

   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Music Club - Inner Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */
body
{
  margin:0px;
  padding:0px;
  background:#34A0D9 url(music-club-images/tp_bgtile.jpg) repeat-x;
}
p
{
  margin:0px;
  padding:0px;
}
.flt
{
  float:left;
  display:inline;
}
img
{
  border:0px;
}
#mainblock
{
  margin:auto;width:1000px;
}
#innerblock
{  
  float:left;
  width:1000px;
}  
#toppanel
{
  float:left;
  width:1000px;
  height:322px;
}
#contentpanel  
{
  float:left;
  width:1000px;
}    
#footerpanel
{
  float:left;
  width:100%;
  background:url(music-club-images/fp_bg.jpg) repeat-x; 
  padding-bottom:22px; margin:10px 0px 0px 0px;
} 
.top1
{
  background:url(music-club-images/top1.jpg) no-repeat;
  width:391px;height:322px;
}
.top2
{
  background:url(music-club-images/top2.jpg) no-repeat;
  width:609px;
  height:322px;
}    
.tp_sea
{
  font:11px Tahoma;
  color:#FFFFFF;
  margin:27px 0px 0px 200px;
}  
.tp_align
{
  float:left;
  width:391px;
}  
.tp_text
{
  width:110px;
  height:12px;
  border:1px solid #0072FF;
  margin:25px 0px 0px 10px;
}  
.tp_go
{
  margin:23px 0px 0px 5px;
}  
.tp_home,.tp_abo,.tp_part,.tp_gal,.tp_con,.tp_ser
{
  font:bold 11px Tahoma;
  color:#FFFFFF;
  text-decoration:none;
  margin:56px 0px 0px 225px;
}  
.tp_abo
{
  margin:56px 0px 0px 44px;
}  
.tp_logo
{
  margin:78px 0px 0px 146px;
}  
.tp_sym
{
  margin:16px 0px 0px 200px;
}
.tp_align1
{
  width:609px;float:left;
}  
.tp_part
{
  margin:69px 0px 0px 7px;
}
.tp_gal
{
  margin:69px 0px 0px 42px;
}
.tp_ser
{
  margin:69px 0px 0px 45px;
}
.tp_con
{
  margin:69px 0px 0px 46px;
}
.cp_top,.cp_bot,.cp_ibg
{
  margin:0px 0px 0px 85px;
}
.cp_ibg
{
  background:url(music-club-images/cp_ibg.jpg) repeat-y;
  width:834px;
}  
.cp_abo
{
  margin:0px 0px 0px 24px;
}
.cp_align
{
  width:568px;
  float:left; 
  clear:left;
}
.cp_img1,.cp_music
{
  clear:left;
  margin:35px 0px 0px 20px;
}  
.cp_nunc,.cp_cur
{
  font:11px/14px Tahoma;
  color:#95C4E9; 
  width:360px; 
  margin:30px 0px 0px 25px;
}
.cp_cur
{
  width:520px; 
  margin:30px 0px 0px 24px; 
  clear:left;
}
.cp_bul,.cp_bu
{
  margin:50px 0px 0px 30px;
}
.cp_ali,.cp_al
{
  font:11px Tahoma;
  color:#95C4E9; 
  width:325px; 
  margin:47px 0px 0px 10px;
}
.cp_bu
{
  margin:10px 0px 0px 30px;
}
.cp_al
{
  margin:7px 0px 0px 10px;
}
.cp_align1
{  
  width:266px;
  float:left;
}
.cp_boxbg
{
  background:url(music-club-images/cp_boxbg.jpg) repeat-y;
  width:557px;
  margin:0px 0px 0px 11px;
}
.cp_ourdance
{
  margin:10px 0px 0px 10px;
}
.cp_ourser
{
  margin:10px 0px 0px 285px;
}
.cp_aimg2
{
  margin:25px 0px 0px 12px;
}
.cp_lor,.cp_mau,.cp_ma
{
  font:11px Tahoma;
  color:#95C4E9;
  width:190px;
  margin:30px 0px 0px 20px;
}  
.cp_sym
{
  margin:8px 0px 0px 20px;
}
.cp_ves
{
  font:11px Tahoma;
  color:#95C4E9;
  width:175px;
  margin:6px 0px 0px 6px;
}  
.cp_gold
{
  margin:25px 0px 0px 15px;
}
.cp_mau
{
  width:160px;
  margin:22px 0px 0px 10px;
}  
.cp_gol
{
  margin:12px 0px 0px 15px;
}
.cp_ma
{
  width:160px;
  margin:9px 0px 0px 10px;
}  

.rp_lat
{
  margin:0px 0px 0px 25px;
}
.rp_date
{
  font:bold 11px Tahoma;
  color:#95C4E9;
  margin:25px 0px 0px 25px; 
  width:100px;
}
.rp_bul
{
  margin:10px 0px 0px 25px;
}
.rp_pha,.rp_sed
{
  font:11px/14px Tahoma;
  color:#95C4E9; 
  width:205px; 
  margin:7px 0px 0px 10px;
}
.rp_read
{
  margin:15px 0px 0px 25px;
}
.rp_our,.rp_img2
{
   clear:left;
   margin:25px 0px 0px 25px;
 }
.rp_img1
{
  clear:left; 
  margin:15px 0px 0px 35px;
}
.rp_arrow
{
  margin:30px 0px 0px 25px;
}
.rp_sed
{
   width:210px; 
   margin:27px 0px 0px 10px;
}
.rp_usc,.rp_rut,.rp_ru
{
  font:11px/14px Tahoma;
  color:#95C4E9; 
  width:215px;
  margin:15px 0px 0px 25px;
}
.rp_green
{
  margin:25px 0px 0px 10px;
}    
.rp_rut
{
  width:140px;
  margin:20px 0px 0px 6px;
}
.rp_gree
{
  margin:12px 0px 0px 10px;
}    
.rp_ru
{
  width:140px;
  margin:7px 0px 0px 6px;
}  
  
.fp_co
{
  font:11px Tahoma;
  color:#87BFEB;
  margin:20px 0px 0px 370px;
}


</style>


</head>
<body>
<!--main block starts here -->
<div id="mainblock">
  <!--inner block starts here -->
  <div id="innerblock">
    <!--top panel starts here -->
    <div id="toppanel">
      <div class="top1 flt">
        <p class="tp_align"> <span class="tp_sea flt">SEARCH</span>
          <input type="text" name="" value="" class="tp_text flt" />
          <a href="http://www.free-css.com/"><img src="music-club-images/tp_go.jpg" width="20" height="19" alt="" class="tp_go flt" /></a> </p>
        <p class="tp_align"> <a href="http://www.free-css.com/" class="tp_home flt">HOME</a> <a href="http://www.free-css.com/" class="tp_abo flt">ABOUT US</a> </p>
        <a href="http://www.free-css.com/"><img src="music-club-images/tp_logo.jpg" width="194" height="45" alt="" class="tp_logo flt" /></a> </div>
      <div class="top2 flt"> <img src="music-club-images/tp_sym.jpg" alt="" width="167" height="13" border="0" usemap="#Map" class="tp_sym flt" />
        <map name="Map" id="Map">
          <area shape="rect" coords="1,1,40,12" href="http://www.free-css.com/" alt="" />
          <area shape="rect" coords="54,-1,101,10" href="http://www.free-css.com/" alt="" />
          <area shape="rect" coords="115,-2,156,12" href="http://www.free-css.com/" alt="" />
        </map>
        <p class="tp_align1"> <a href="http://www.free-css.com/" class="tp_part flt">PARTIES</a> <a href="http://www.free-css.com/" class="tp_gal flt">GALLERY</a> <a href="http://www.free-css.com/" class="tp_ser flt">SERVICES</a> <a href="http://www.free-css.com/" class="tp_con flt">CONTACT US</a> </p>
      </div>
    </div>
    <!--top panel ends here -->
    <!--content panel starts here -->
    <div id="contentpanel"> <img src="music-club-images/cp_top.jpg" width="834" height="43" alt="" class="cp_top flt" />
      <div class="cp_ibg flt">
        <div class="cp_align"> <img src="music-club-images/cp_wel.jpg" width="207" height="9" alt="" class="cp_abo flt" /> <span class="cp_align"> <img src="music-club-images/cp_aimg1.jpg" width="91" height="206" alt="" class="cp_img1 flt" /> <span class="cp_nunc flt" style="width:400px;">Nulla vitae sapien laoreet nibh aliquet elementum. Nullam quis sem. Vestibulum dui tellus, scelerisque id, dictum et, pellentesque ac, libero. Proin pharetra est eu tellus. Donec vitae quam et sem fringilla consequat. Maecenas tincidunt ullamcorper ligula. Vestibulum mauris arcu, luctus quis, porta ut, bibendum nec, lorem. Pellentesque ullamcorper mattis tellus. Fusce nec ante. Curabitur quis nibh non ipsum ullamcorper euismod. Maecenas +gravida diam id mi. <br />
          <br />
          Duis sem. Nam sed tellus at arcu adipiscing gravida. Praesent eros nisl, ultricies sed, dignissim at, pretium et, justo. Sed eget orci. Fusce condimentum, felis quis tincidunt sollicitudin, felis nisl hendrerit sem, eget porttitor diam velit at tortor. Proin pellentesque, risus a ultrices suscipit, massa metus pharetra magna, a aliquam orci justo sit amet risus. Phasellus id augue. Vivamus faucibus porttitor neque. Nulla ultricies nunc. </span> <a href="http://www.free-css.com/"><img src="music-club-images/cp_re.jpg" width="75" height="14" alt="" class="cp_read flt" style="margin:10px 0px 0px 20px;" /></a> </span> <img src="music-club-images/cp_boxtop.jpg" width="557" height="23" alt="" class=" flt" style="margin:30px 0px 0px 11px;" />
          <p class="cp_boxbg flt"> <img src="music-club-images/cp_ourdance.jpg" width="81" height="12" alt="" class="cp_ourdance flt" /> <img src="music-club-images/cp_ourser.jpg" width="98" height="12" alt="" class="cp_ourser flt" /> <span style="float:left; width:550px;"> <span  style="float:left; width:350px;"> <img src="music-club-images/cp_aimg2.jpg" width="112" height="165" alt="" class="cp_aimg2 flt" /> <span class="cp_lor flt">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Integer erat libero, suscipit vel, aliquet sodales, congue et, mi. unt, velit. Donec at mauris. Quisque nunc eros, malesuada eu, </span> <img src="music-club-images/cp_sym.jpg" width="7" height="10" alt="" class="cp_sym flt" /> <span class="cp_ves flt">Vestibulum quis massa et elit varius .</span> <img src="music-club-images/cp_sym.jpg" width="7" height="10" alt="" class="cp_sym flt" /> <span class="cp_ves flt">Phasellus lacinia lectus nec libero.</span> <img src="music-club-images/cp_sym.jpg" width="7" height="10" alt="" class="cp_sym flt" /> <span class="cp_ves flt">Vivamus bibendum ipsum eu mi.</span> <a href="http://www.free-css.com/"><img src="music-club-images/cp_re.jpg" width="75" height="14" alt="" class="cp_read flt" style="margin:10px 0px 0px 20px;" /></a> </span> <span  style="float:left; width:200px;"> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gold flt" /> <a href="http://www.free-css.com/" class="cp_mau flt">Mauris faucibus dui sit amet</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Etiam laoreet enim vitae mauris.</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Suspendisse vitae odio sit amet </a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Sed posuere feugiat pede.</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Donec sodales sollicitudin ante.</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Nulla facilisis justo in sem.</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Curabitur luctus eros at ante.</a> <img src="music-club-images/cp_gold.jpg" width="5" height="9" alt="" class="cp_gol flt" /> <a href="http://www.free-css.com/" class="cp_ma flt">Quisque dapibus ultricies </a> </span> </span> </p>
          <img src="music-club-images/cp_boxbot.jpg" width="557" height="20" alt="" class="flt" style="margin-left:11px;" /> <img src="music-club-images/cp_ourspecial.jpg" width="135" height="12" alt="" class="cp_abo flt" style="margin-top:20px;" /> <span class="cp_align"> <img src="music-club-images/cp_aimg3.jpg" width="112" height="165" alt="" class="cp_img1 flt" /> <span class="cp_nunc flt" style="width:400px; margin-top:40px;">Phasellus pellentesque faucibus tellus. Quisque suscipit dictum eros. Quisque euismod elit eu odio interdum interdum. Maecenas eleifend viverra eros. Duis scelerisque quam eu neque blandit interdum. Suspendisse tortor leo, venenatis non, dapibus ut, lacinia sit amet, justo. <br />
          <br />
          Nulla viverra, purus sollicitudin dictum gravida, lorem nisl sodales neque, adipiscing sagittis dolor enim in ligula. Maecenas malesuada cursus dolor. Donec dapibus lobortis pede. Fusce lorem tortor, accumsan vel, rutrum quis, vestibulum sit amet, tellus.</span> <a href="http://www.free-css.com/"><img src="music-club-images/cp_re.jpg" width="75" height="14" alt="" class="cp_read flt" style="margin:10px 0px 0px 20px;" /></a> </span> </div>
        <!--right panel starts here -->
        <div class="cp_align1"> <img src="music-club-images/rp_lat.jpg" width="180" height="9" alt="" class="rp_lat flt" /> <span class="rp_date flt">12-07-2008</span>
          <p class="cp_align1"> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Phasellus condimentum tortor non turpis.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Etiam lobortis pellentesque sapien.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Duis auctor quam sed est.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Mauris ac erat ut dui imperdiet tincidunt.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Proin dapibus arcu nec libero.</span> </p>
          <span class="rp_date flt">25-07-2008</span>
          <p class="cp_align1"> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Fusce vehicula dictum nibh.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Enean quis magna sed augue luctus </span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Sed pellentesque dignissim magna.</span> <img src="music-club-images/rp_bul.jpg" width="5" height="9" alt="" class="rp_bul flt" /> <span class="rp_pha flt">Cras fermentum gravida risus.</span> </p>
          <a href="http://www.free-css.com/"><img src="music-club-images/rp_read.jpg" width="60" height="9" alt="" class="rp_read flt" /></a> <img src="music-club-images/rp_opart.jpg" width="87" height="9" alt="" class="rp_our flt" /> <span class="rp_usc flt">Uscipit, erat at tristique semper, leo odio placerat quam, a mattis pede augue a urna. Quisque metus mi, porttitor sed, ultrices sed, faucibus et,sodales leo. Suspendisse consectetuer. Duis tristique. Mauris at magna sit .</span> <span style="float:left; width:260px;"> <img src="music-club-images/rp_aimg1.jpg" width="77" height="113" alt="" class="rp_img1 flt" style="margin-left:15px;" /> <img src="music-club-images/rp_green.jpg" width="7" height="6" alt="" class="rp_green flt" /> <span class="rp_rut flt">Sed rutrum viverra purus.</span> <img src="music-club-images/rp_green.jpg" width="7" height="6" alt="" class="rp_gree flt" /> <span class="rp_ru flt">Etiam adipiscing risus ac </span> <img src="music-club-images/rp_green.jpg" width="7" height="6" alt="" class="rp_gree flt" /> <span class="rp_ru flt">Morbi viverra ultrices lacus</span> <img src="music-club-images/rp_green.jpg" width="7" height="6" alt="" class="rp_gree flt" /> <span class="rp_ru flt">In venenatis mi sit amet</span> <img src="music-club-images/rp_green.jpg" width="7" height="6" alt="" class="rp_gree flt" /> <span class="rp_ru flt">In varius congue tortor at.</span> </span> <span class="rp_usc flt">Donec a magna. Praesent turpis. Donec tempor sapien id ante tempus sagittis. Etiam facilisis facilisis risus. Sed commodo. Nam dignissim eleifend risus. Pellentesque habitant morbi tristique</span> <a href="http://www.free-css.com/"><img src="music-club-images/rp_read.jpg" width="60" height="9" alt="" class="rp_read flt" /></a> <img  src="music-club-images/rp_aimg2.jpg" width="219" height="111" alt="" class="rp_img2 flt" /> </div>
        <img src="music-club-images/cp_bot.jpg" width="834" height="20" alt="" class="flt" /> </div>
      <!--right panel ends here -->
    </div>
    <!--content panel ends here -->
  </div>
  <!--inner block ends here -->
</div>
<!--main block ends here -->
<!--footer panel starts here -->
<div id="footerpanel"> <span class="fp_co flt"><a href="http://www.buytemplates.net/CSS-XHTML-web-templates.aspx" style="color:#CCCCCC;">Css/Xhtml template</a> from buytemplates.net. All Rights Reserved</span> </div>
<!--footer panel ends here -->
</body>
</html>

   
    
    
  








Related examples in the same category

1.music-beats
2.music-portal
3.music-school
4.music-store
5.music03
6.music1
7.music2
8.musiciansagency
9.musicmania
10.musicshop
11.musicshow
12.musicstore
13.wood-guitar
14.thepiano
15.Guitar-Band
16.guitarhero