shining-star : Fashion « Templates « HTML / CSS

HTML / CSS » Templates » Fashion 
shining-star
  

<!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>Shining Star</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type='text/css'>
/* CSS Document */
body{padding:0px; margin:0px; background:#1f0703; color:#969686; font:10px/14px Tahoma, sans-serif;}
div, p, ul, h2, h3, h4, img{padding:0px; margin:0px;}
ul{list-style-type:none;}

.clear {clear: both; margin: 0px; height:0}

p a{font:10px/14px Tahoma, sans-serif; color:#FFF; text-decoration:underline;}
p a:hovercolor:#FFF; text-decoration:none;}

.headline{font:12px/14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF; font-weight:normal}
.headline2{font:12px/14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF; font-weight:normal; padding-left:21px; background:url(shining-star-images/arrow1.gif0 2px no-repeat}

#container{width:705px; position:relative; margin:auto;}

/* HEADER */

#header{width:705px; height:332px; position:relative; background:url(shining-star-images/b_header.jpg0 0 no-repeat}

#header img#logo{position:absolute; top:19px; left:30px}
#header img#slogan{position:absolute; top:138px; left:22px}

/* MENU */

#menuPan{width:705px; height:50px; position:relative; background:url(shining-star-images/b_menu.gif0 0 repeat-x}

#menuPan ul.menu{position:absolute; top:14px; left:46px; width:650px}
#menuPan ul.menu li{height:25px; margin-right:20px; float:left}
#menuPan ul.menu li a{height:25px; display:block; text-indent:-20000px; }
#menuPan ul.menu li a:hover{height:25px;}

#menuPan ul.menu li.btn_1 a{width:81px; background:url(shining-star-images/btn_1.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_1 a:hover{width:81px; background:url(shining-star-images/btn_1_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.btn_2 a{width:69px; background:url(shining-star-images/btn_2.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_2 a:hover{width:69px; background:url(shining-star-images/btn_2_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.btn_3 a{width:59px; background:url(shining-star-images/btn_3.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_3 a:hover{width:59px; background:url(shining-star-images/btn_3_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.btn_4 a{width:59px; background:url(shining-star-images/btn_4.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_4 a:hover{width:59px; background:url(shining-star-images/btn_4_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.btn_5 a{width:72px; background:url(shining-star-images/btn_5.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_5 a:hover{width:72px; background:url(shining-star-images/btn_5_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.btn_6{margin-right:0}
#menuPan ul.menu li.btn_6 a{width:70px; background:url(shining-star-images/btn_6.jpg0 0 no-repeat; }
#menuPan ul.menu li.btn_6 a:hover{width:70px; background:url(shining-star-images/btn_6_over.jpg0 0 no-repeat;}

#menuPan ul.menu li.line{width:2px; background:url(shining-star-images/line_m.jpg0 0 no-repeat}

/* CONTENT */

#content{width:705px; position:relative; clear:both; margin: auto;}

#leftPan{width:195px; float:left; margin:32px 20px 0 23px; display:inline}
#rightPan{width:430px; float:left; margin:29px 0 0 0;}

#news2{padding-left:8px}
#news h2{height:18px; position:relative; background:url(shining-star-images/h_news.gif0 0 no-repeat; margin-bottom:18px}
#news p.newsText{padding-bottom:25px}

#welcome{margin-bottom:10px}
#welcome h2{height:21px; position:relative; background:url(shining-star-images/h_welcome.gif0 0 no-repeat;}
#welcome p.headline{margin-bottom:3px}
#welcome img{float:left; margin-right:12px;display:inline}
#welcome p#welText{float:left; width:335px; margin-left:0; padding-top:16px}

#events h2{height:21px; position:relative; background:url(shining-star-images/h_events.gif0 0 no-repeat; margin-bottom:5px}
.evItem{width:190px; float:left}
.evItem img{float:left; margin-right:19px}
.evItem p{float:left; width:100px}
.evItem#leftEv{margin:0 42px 0 1px}

.clear#end{height:15px}

/* FOOTER */

#footer{width:705px; height:63px; clear:both; border-top:#f3c442 3px solid}
#footer p{padding: 15px 0 0 0; font:11px/16px Tahoma, sans-serif; font-weight:normal; text-align:center; color:#fff;}
#footer p a{font:11px/16px Tahoma, sans-serif; font-weight:normal; color:#fff; text-decoration:none; padding: 0 3px }
#footer p a:hover{text-decoration:underline; color:#fff}


</style>


</head>
<body>
<div id="container">
  <div id="header"> <img src="shining-star-images/logo.jpg" alt="" name="logo" width="242" height="41" id="logo"/> <img src="shining-star-images/slogan.jpg" alt="" name="logo" width="375" height="95" id="slogan"/> </div>
  <div id="menuPan">
    <ul class="menu">
      <li class="btn_1"><a href="#">home</a></li>
      <li class="line"></li>
      <li class="btn_2"><a href="#">about us</a></li>
      <li class="line"></li>
      <li class="btn_3"><a href="#">parties</a></li>
      <li class="line"></li>
      <li class="btn_4"><a href="#">our djs</a></li>
      <li class="line"></li>
      <li class="btn_5"><a href="#">location</a></li>
      <li class="line"></li>
      <li class="btn_6"><a href="#">contacts</a></li>
    </ul>
  </div>
  <div id="content">
    <div id="leftPan">
      <div id="news">
        <h2></h2>
        <div id="news2">
          <p class="headline2">LOREM IPSUM DOLOR SIT </p>
          <p  class="newsText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam eu nulla. Donec </p>
          <p class="headline2"> DOLOR SIT LOREM IPSUM </p>
          <p  class="newsText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam eu nulla. Donec </p>
          <p class="headline2">LOREM IPSUM DOLOR SIT </p>
          <p  class="newsText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam eu nulla. Donec </p>
        </div>
      </div>
    </div>
    <div id="rightPan">
      <div id="welcome">
        <h2></h2>
        <p class="headline">LOREM IPSUM DOLOR SIT AMET, CONSECTETUER ADIPISCING ELIT. NAM EU </p>
        <img src="shining-star-images/img_welcome.jpg" width="80" height="72" alt="" />
        <p id="welText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam eu nulla. Donec lobortis purus vel urna. Nunc laoreet lacinia nunc. In volutpat sodales ipsum. Sed vestibulum. Integer in ante. Sed posuere ligula rhoncus</p>
        <div class="clear"></div>
      </div>
      <div id="events">
        <h2></h2>
        <div class="evItem" id="leftEv"> <img src="shining-star-images/img_events.jpg" width="71" height="71" alt="" />
          <p><a href="#">Lorem ipsum dolor sit amet, consectetuer</a><br />
            adipiscing elit. Nam eu nulla. Donec lobortis purus vel urna. Nunc </p>
          <div class="clear"></div>
        </div>
        <div class="evItem" id="rightEv"> <img src="shining-star-images/img_events-11.jpg" width="71" height="71" alt="" />
          <p><a href="#">Lorem ipsum dolor sit amet, consectetuer</a><br />
            adipiscing elit. Nam eu nulla. Donec lobortis purus vel urna. Nunc </p>
          <div class="clear"></div>
        </div>
        <div class="clear"></div>
      </div>
    </div>
    <div class="clear" id="end"></div>
  </div>
  <div id="footer">
    <p><a href="#">HOME PAGE</a> | <a href="#">ABOUT US</a> | <a href="#">PARTIES</a> | <a href="#">OUR DJS</a> | <a href="#">LOCATION</a> | <a href="#">NEWS</a> | <a href="#">CONTACTS</a><br/>
      Copyright &copy; Your Company Name | Design by <a href="http://freshtemplates.com/">Website Templates</a></p>
  </div>
</div>
</body>
</html>

   
    
  
Related examples in the same category
1.fashion-blog
2.fashion-brand
3.fashion-store
4.fashion 2
5.FashionClub
6.fashionhouse
7.fashionhut
8.fashionista
9.Celebrere
10.celebrity
11.beautiful
12.Beauty&Style
13.beauty-design
14.beauty-secrets
15.beautycompany
16.beautysalon
17.beautysecrets
18.metamorph_beauty
19.agedbeauty
20.face
21.facing
22.metamorph_middleage
23.clothes-collection
24.clothesfashion
25.metamorph_sweetlove
26.e16-fashion-club
27.freshair
28.wbfashion
29.ruby
30.shopping
java2s.com  | Contact Us | Privacy Policy
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.