music-portal
<!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 Portal</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */
#main
{
width:800px;
background-color:#c6d496;
}
.topheader
{
width:800px;
height:61px;
background-color:#000000;
}
.topblank
{
width:800px;
height:20px;
background-color:#000000;
float:left;
}
.topblank1
{
width:36px;
height:41px;
background-color:#000000;
float:left;
}
.toplinks
{
width:495px;
height:41px;
float:left;
}
.toplinks ul
{
margin:0px;
padding:0px;
}
.toplinks li
{
width:77px;
height:17px;
background-image:url(music-portal-images/aboutus.jpg);
background-repeat:no-repeat;
background-position:top;
display:block;
list-style-type:none;
margin-left:15px;
margin-top:5px;
float:left;
}
.toplinks ul li a
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#478b38;
text-decoration:none;
vertical-align:top;
}
.toplinks a:hover
{
text-decoration:none;
color:#000000;
}
.links
{
width:417px;
height:170px;
float:left;
}
.links11
{
width:200px;
height:160px;
float:left;
}
.links1
{
width:150px;
height:160px;
float:left;
}
.links1 ul
{
margin:0px;
padding:0px;
list-style:none;
}
.links1 li
{
height:17px;
margin-top:20px;
margin-left:30px;
float:left;
}
.links1 ul li a
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#478b38;
text-decoration:underline;
vertical-align:top;
}
.links1 a:hover
{
text-decoration:none;
color:#000000;
}
.links2
{
width:150px;
height:160px;
float:left;
}
.links12
{
width:200px;
height:100px;
float:left;
}
.links12 ul
{
margin:0px;
padding:0px;
list-style:none;
}
.links12 li
{
height:17px;
margin-top:20px;
margin-left:50px;
float:left;
}
.links12 ul li a
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#c7d3ab;
text-decoration:underline;
vertical-align:top;
}
.links12 a:hover
{
text-decoration:none;
color:#ffffff;
}
.links2
{
width:200px;
height:170px;
float:left;
}
img
{
border:0px;
}
.aboutus
{
width:77px;
height:17px;
background-image:url(music-portal-images/aboutus.jpg);
background-repeat:no-repeat;
float:left;
padding-left:20px;
}
.link
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#336633;
padding-right:18px;
text-align:left;
float:left;
}
.login
{
width:196px;
height:41px;
background-color:#000000;
float:left;
}
.go
{
width:26px;
height:17px;
background-image:url(music-portal-images/go.jpg);
background-repeat:no-repeat;
float:left;
}
.blank
{
width:800px;
height:9px;
background-color:#c6d496;
background-repeat:repeat-y;
}
.logo
{
width:739px;
height:61px;
background-image:url(music-portal-images/logobg.jpg);
background-repeat:repeat-x;
}
.leftcorner
{
width:4px;
height:61px;
background-image:url(music-portal-images/leftbg.jpg);
background-repeat:no-repeat;
float:left;
}
.rightcorner
{
width:4px;
height:61px;
background-image:url(music-portal-images/rightbg.jpg);
background-repeat:no-repeat;
float:right;
vertical-align:text-top;
}
.image
{
width:107px;
height:61px;
float:left;
}
.image1
{
width:68px;
height:61px;
background-image:url(music-portal-images/image.jpg);
background-repeat:no-repeat;
float:right;
}
.musiclogo
{
width:202px;
height:61px;
background-image:url(music-portal-images/music.jpg);
background-repeat:no-repeat;
float:left;
}
.logoblank
{
width:276px;
height:61px;
float:left;
}
.headerimage
{
width:109px;
height:61px;
float:left;
background-image:url(music-portal-images/headerimage.jpg);
background-repeat:no-repeat;
}
.greenbg
{
width:737px;
height:124px;
background-image:url(music-portal-images/greenbg.jpg);
background-repeat:repeat-x;
}
.matter
{
width:540px;
float:left;
height:120px;
}
.leftblank
{
width:30px;
height:102px;
float:left;
}
.matter1
{
width:479px;
height:44px;
background-image:url(music-portal-images/abc.jpg);
background-repeat:no-repeat;
float:left;
}
.matterblank1
{
width:463px;
height:70px;
float:left;
}
.matterblank2
{
width:463px;
height:20px;
float:left;
}
.inblank1
{
width:254px;
height:20px;
float:left;
margin-bottom:10px;
}
.inblank2
{
width:254px;
height:20px;
float:left;
margin-bottom:10px;
}
.text
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
margin-bottom:5px;
padding-left:5px;
}
.matterblank3
{
width:50px;
height:50px;
float:left;
margin:-30px 0px 0px 0px;
padding-left:10px;
}
.search
{
width:95px;
height:27px;
background-image:url(music-portal-images/search.jpg);
background-repeat:no-repeat;
float:left;
margin:-30px 0px 0px 0px;
}
.matterblank4
{
width:170px;
height:124px;
background-image:url(music-portal-images/image1.jpg);
background-repeat:no-repeat;
float:right;
}
.lightgreen
{
width:737px;
height:221px;
background-image:url(music-portal-images/lightgreenbg.jpg);
background-repeat:repeat-x;
}
.lightgreen1
{
width:737px;
height:311px;
background-image:url(music-portal-images/lightgreenbg1.jpg);
background-repeat:repeat-x;
}
.greenblank
{
width:737px;
height:19px;
}
.greenblank1
{
width:737px;
height:19px;
}
.greenblank2
{
width:320px;
height:19px;
float:left;
}
.greenblank3
{
width:317px;
height:19px;
float:left;
}
.new
{
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#000000;
float:left;
font-weight:bold;
margin-left:50px;
}
.last
{
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#85a60a;
font-weight:bold;
text-align:left;
}
.middle
{
width:737px;
height:154px;
float:left;
}
.middle1
{
width:320px;
height:273px;
float:left;
}
.midd
{
width:320px;
height:81px;
float:left;
float:left;
margin-top:10px;
}
.music
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#FFFFFF;
text-decoration:underline;
}
.music:hover
{
text-decoration:none;
}
.music2
{
width:76px;
height:75px;
background-image:url(music-portal-images/group.jpg);
background-repeat:no-repeat;
float:left;
margin-left:20px;
}
.music3
{
width:76px;
height:75px;
background-image:url(music-portal-images/group1.jpg);
background-repeat:no-repeat;
float:left;
margin-left:20px;
}
.middle2
{
width:417px;
height:273px;
float:left;
}
.our
{
width:417px;
height:100px;
float:left;
}
.style
{
width:135px;
height:90px;
background-image:url(music-portal-images/style.jpg);
background-repeat:no-repeat;
float:left;
margin-top:10px;
margin-left:30px;
}
.week
{
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#000000;
font-weight:bold;
text-align:center;
margin-top:10px;
}
.center
{
width:670px;
height:154px;
}
.center1
{
width:118px;
height:154px;
float:left;
margin-left:10px;
}
.center2
{
width:118px;
height:121px;
margin-top:5px;
background-image:url(music-portal-images/boy.jpg);
background-repeat:no-repeat;
}
.center3
{
width:118px;
height:33px;
}
.sound
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-decoration:underline;
}
.sound:hover
{
text-decoration:none;
}
.headphone
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#339966;
text-decoration:underline;
}
.headphone:hover
{
color:#336633;
text-decoration:none;
}
.center4
{
width:118px;
height:154px;
float:left;
margin-left:50px;
}
.center5
{
width:118px;
height:154px;
float:left;
margin-left:50px;
}
.center6
{
width:118px;
height:154px;
float:left;
margin-left:50px;
}
.headphone1
{
width:118px;
height:121px;
margin-top:5px;
background-image:url(music-portal-images/headphones.jpg);
background-repeat:no-repeat;
}
.headphone2
{
width:118px;
height:121px;
background-image:url(music-portal-images/lion.jpg);
background-repeat:no-repeat;
margin-top:5px;
}
.headphone3
{
width:118px;
height:121px;
background-image:url(music-portal-images/headphones1.jpg);
background-repeat:no-repeat;
margin-top:5px;
}
.view
{
width:737px;
height:21px;
float:left;
}
.more
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
float:right;
text-decoration:underline;
}
.more:hover
{
text-decoration:none;
}
.blackblock
{
width:737px;
height:292px;
background-image:url(music-portal-images/blackbg.jpg);
background-repeat:repeat-x;
}
.blackblock1
{
width:737px;
height:202px;
background-image:url(music-portal-images/blackbg.jpg);
background-repeat:repeat-x;
}
.eventsbg
{
width:737px;
height:47px;
}
.news
{
width:203px;
height:27px;
float:left;
margin:20px 0px 0px 10px;
background-image:url(music-portal-images/downloads.jpg);
background-repeat:no-repeat;
}
.news1
{
width:203px;
height:27px;
float:right;
margin:20px 10px 0px 0px;
background-image:url(music-portal-images/downloads.jpg);
background-repeat:no-repeat;
}
.events
{
font-family:Arial, Helvetica, sans-serif;
font-size:24px;
color:#FFFFFF;
}
.middleblock
{
width:737px;
height:218px;
}
.leftblock
{
width:241px;
height:218px;
float:left;
}
.leftblock1
{
width:270px;
height:218px;
float:left;
}
.leftblock2
{
width:223px;
height:218px;
float:left;
}
.lefttop
{
width:241px;
height:85px;
float:left;
margin-top:10px;
}
.april
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#85a60a;
line-height:30px;
float:left;
padding-left:30px;
}
.april1
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
float:left;
padding-left:15px;
text-align:left;
}
.lefttop1
{
width:241px;
height:30px;
float:left;
}
.lefttop2
{
width:241px;
height:55px;
float:left;
}
.lefttop3
{
width:241px;
height:85px;
float:left;
margin-top:10px;
padding-left:20px;
}
.down
{
width:188px;
height:65px;
float:left;
margin-left:15px;
margin-top:7px;
}
.downimage1
{
width:66px;
height:51px;
background-image:url(music-portal-images/himage.jpg);
background-repeat:no-repeat;
float:left;
margin-top:10px;
}
.downimage3
{
width:66px;
height:51px;
background-image:url(music-portal-images/himage1.jpg);
background-repeat:no-repeat;
float:left;
margin-top:10px;
}
.downimage4
{
width:66px;
height:51px;
background-image:url(music-portal-images/himage2.jpg);
background-repeat:no-repeat;
float:left;
margin-top:10px;
}
.downimage2
{
width:122px;
height:51px;
float:left;
margin-top:10px;
}
.music
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#FFFFFF;
text-decoration:underline;
}
.music:hover
{
text-decoration:none;
}
.music1
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#85a60a;
text-decoration:underline;
}
.music1:hover
{
text-decoration:none;
}
.newsevents
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
float:right;
text-decoration:none;
}
.newsevents:hover
{
text-decoration:underline;
}
.black11
{
width:737px;
height:25px;
float:left;
}
.black2
{
width:500px;
height:20px;
float:left;
}
.black3
{
width:200px;
height:20px;
float:right;
}
.viewmore
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
padding-left:20px;
text-decoration:none;
}
.viewmore:hover
{
text-decoration:none;
}
.footbg
{
width:737px;
height:82px;
background-image:url(music-portal-images/footbg.jpg);
background-repeat:repeat-x;
}
.musicportal
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;
float:left;
padding-left:30px;
line-height:80px;
}
.musicportal1
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#85a60a;
float:left;
line-height:40px;
text-decoration:none;
}
.musicportal1
{
text-decoration:underline;
}
.enjoy
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:center;
margin-top:20px;
}
.enjoy1
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:left;
margin-top:10px;
}
.enjoy3
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#ffffff;
text-align:left;
margin-top:10px;
}
.enjoy5
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:left;
margin-top:10px;
}
.enjoy2
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:left;
margin-top:60px;
}
.enjoy4
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#ffffff;
text-align:left;
margin-top:60px;
}
.read
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:right;
margin-top:10px;
text-decoration:underline;
}
.read:hover
{
text-decoration:none;
}
.read1
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#ffffff;
text-align:right;
margin-top:20px;
text-decoration:underline;
}
.read1:hover
{
text-decoration:none;
}
.stars
{
width:72px;
height:9px;
background-image:url(music-portal-images/stars.jpg);
background-repeat:no-repeat;
float:left;
margin-left:30px;
margin-top:10px;
}
.stars1
{
width:72px;
height:9px;
background-image:url(music-portal-images/stars1.jpg);
background-repeat:no-repeat;
float:left;
margin-left:30px;
margin-top:10px;
}
.stars2
{
width:72px;
height:9px;
background-image:url(music-portal-images/stars2.jpg);
background-repeat:no-repeat;
float:left;
margin-left:30px;
margin-top:10px;
}
.centerblock
{
width:737px;
margin-top:10px;
}
.black
{
width:365px;
height:202px;
float:left;
}
.black2
{
width:365px;
height:202px;
float:left;
}
.footimg
{
width:101px;
height:135px;
background-image:url(music-portal-images/footimg.jpg);
background-repeat:no-repeat;
float:left;
}
.footright
{
width:360px;
height:140px;
float:left;
margin-top:10px;
}
.women
{
width:75px;
height:75px;
background-image:url(music-portal-images/music1.jpg);
background-repeat:no-repeat;
float:left;
margin-left:20px;
}
.music10
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#85a60a;
text-decoration:underline;
}
.music10:hover
{
text-decoration:none;
}
</style>
</head>
<body bgcolor="#ffffdf">
<center>
<div id="main">
<div class="topheader">
<div class="topblank"> </div>
<div class="topblank1"> </div>
<div class="toplinks">
<ul>
<li><a href="http://www.free-css.com/">Home</a></li>
<li><a href="subpage.html">About Us</a></li>
<li><a href="http://www.free-css.com/">Downloads</a></li>
<li><a href="http://www.free-css.com/">Releases</a></li>
<li><a href="http://www.free-css.com/">Contacts</a></li>
</ul>
</div>
<div class="login">
<input name="" type="text" value="login" size="8" />
<input name="" type="text" size="8" />
</div>
<div class="go"><a href="http://www.free-css.com/"><img src="music-portal-images/go.jpg" /></a> </div>
</div>
<div class="centerblock">
<div class="logo">
<div class="leftcorner"> </div>
<div class="logobg">
<div class="image">
<div class="image1"> <a href="http://www.free-css.com/" class="image1"><img src="music-portal-images/image.jpg" /></a> </div>
</div>
</div>
<div class="musiclogo"> <a href="http://www.free-css.com/" class="musiclogo"><img src="music-portal-images/music.jpg" /></a> </div>
<div class="logoblank"> </div>
<div class="headerimage"> </div>
<div class="rightcorner"> </div>
</div>
<div class="greenbg">
<div class="matter">
<div class="leftblank"> </div>
<div class="matter1"> </div>
<div class="matterblank1">
<div class="matterblank2"> </div>
<div class="inblank1">
<input name="" type="text" size="37" />
</div>
<div class="inblank2">
<input name="" type="radio" />
<span class="text">Artist</span>
<input name="" type="radio" />
<span class="text">Album</span>
<input name="" type="radio" />
<span class="text">song</span>
<input name="" type="radio" />
<span class="text">text</span> </div>
<div class="matterblank3"></div>
<div class="search"> <a href="http://www.free-css.com/"><img src="music-portal-images/search.jpg" /></a> </div>
</div>
</div>
<div class="matterblank4"> </div>
</div>
<div class="lightgreen">
<div class="greenblank"><img src="music-portal-images/hand.jpg" align="right" width="142px" height="19px"/> </div>
<div class="greenblank1"> <span class="new">New Releases</span><span class="last">of Last Week</span> </div>
<div class="middle">
<div class="center">
<div class="center1">
<div class="center2"><a href="http://www.free-css.com/"><img src="music-portal-images/boy.jpg" /></a> </div>
<div class="center3"> <span class="sound"><a href="http://www.free-css.com/" class="sound">Sound Track</a></span><br />
<span class="headphone"><a href="http://www.free-css.com/" class="headphone">Head Phones</a></span> </div>
</div>
<div class="center4">
<div class="headphone1"><a href="http://www.free-css.com/"><img src="music-portal-images/headphones.jpg" /></a> </div>
<div class="center3"> <span class="sound"><a href="http://www.free-css.com/" class="sound">Sound Track</a></span><br />
<span class="headphone"><a href="http://www.free-css.com/" class="headphone">Head Phones</a></span> </div>
</div>
<div class="center5">
<div class="headphone2"><a href="http://www.free-css.com/"><img src="music-portal-images/lion.jpg" /></a> </div>
<div class="center3"> <span class="sound"><a href="http://www.free-css.com/" class="sound">Sound Track</a></span><br />
<span class="headphone"><a href="http://www.free-css.com/" class="headphone">Head Phones</a></span> </div>
</div>
<div class="center6">
<div class="headphone3"><a href="http://www.free-css.com/"><img src="music-portal-images/headphones1.jpg" /></a> </div>
<div class="center3"> <span class="sound"><a href="http://www.free-css.com/" class="sound">Sound Treck</a></span><br />
<span class="headphone"><a href="http://www.free-css.com/" class="headphone">Head Phones</a></span> </div>
</div>
</div>
</div>
<div class="view"><span class="more"><a href="http://www.free-css.com/" class="more">viewmore...</a></span></div>
</div>
<div class="blackblock">
<div class="eventsbg">
<div class="news"><span class="events">News & Events</span></div>
<div class="news1"><span class="events"> Top Downloads</span></div>
</div>
<div class="middleblock">
<div class="leftblock">
<div class="lefttop">
<div class="lefttop1"> <span class="april">April 11, 2007</span> </div>
<div class="lefttop2"> <img src="music-portal-images/button.jpg" style="float:left; padding-left:10px;" /><span class="april1">To display information about Mozilla Firefox in this window, click topics in<br />
the Contents sidebar. </span> </div>
</div>
<div class="lefttop">
<div class="lefttop1"> <span class="april">April 11, 2007</span> </div>
<div class="lefttop2"> <img src="music-portal-images/button.jpg" style="float:left; padding-left:10px;" /><span class="april1">To display information about Mozilla Firefox in this window, click topics in<br />
the Contents sidebar. </span> </div>
</div>
</div>
<div class="leftblock1">
<div class="lefttop3">
<div class="lefttop1"> <span class="april">April 11, 2007</span> </div>
<div class="lefttop2"> <img src="music-portal-images/button.jpg" style="float:left; padding-left:10px;" /><span class="april1">To display information about Mozilla Firefox in this window, click topics in<br />
the Contents sidebar. </span> </div>
</div>
<div class="lefttop3">
<div class="lefttop1"> <span class="april">April 11, 2007</span> </div>
<div class="lefttop2"> <img src="music-portal-images/button.jpg" style="float:left; padding-left:10px;" /><span class="april1">To display information about Mozilla Firefox in this window, click topics in<br />
the Contents sidebar. </span> </div>
</div>
</div>
<div class="leftblock2">
<div class="down">
<div class="downimage1"><a href="http://www.free-css.com/"><img src="music-portal-images/himage.jpg" /></a></div>
<div class="downimage2"><span class="music"><a href="http://www.free-css.com/" class="music">Music</a></span><br />
<span class="music10"><a href="http://www.free-css.com/" class="music10">Enjoy the Fun</a></span> </div>
</div>
<div class="down">
<div class="downimage3"><a href="http://www.free-css.com/"><img src="music-portal-images/himage1.jpg" /></a></div>
<div class="downimage2"><span class="music"><a href="http://www.free-css.com/" class="music">Music</a></span><br />
<span class="music10"><a href="http://www.free-css.com/" class="music10">Enjoy the Fun</a></span> </div>
</div>
<div class="down">
<div class="downimage4"><a href="http://www.free-css.com/"><img src="music-portal-images/himage2.jpg" /></a></div>
<div class="downimage2"><span class="music"><a href="http://www.free-css.com/" class="music">Music</a></span><br />
<span class="music10"><a href="http://www.free-css.com/" class="music10">Enjoy the Fun</a></span> </div>
</div>
</div>
</div>
<div class="black1">
<div class="black3"><span class="viewmore"><a href="http://www.free-css.com/" class="viewmore">View More</a></span> </div>
</div>
</div>
<div class="footbg"> <span class="musicportal">music portal @ 2007</span> <span class="musicportal1"><a href="http://www.free-css.com/" class="musicportal1">Privacy Policy </a></span> </div>
</div>
</div>
</center>
</body>
</html>
Related examples in the same category