e16-fashion-club : Fashion « Templates « HTML / CSS






e16-fashion-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>E16 Fashion Club - About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */
body {
padding:0;
margin:0;
font:9px Arial, Helvetica, sans-serif;
background:url(e16-fashion-club-images/backBg.gif) repeat-x 0 0 #731001;
color:inherit;
}
 h1, h2, h3, p, ul, form, input, select, textarea, label, div, li, a{
padding:0;
margin:0;
}
ul{
list-style-type:none;
  
}
a{
outline:none;
text-decoration:none;
}
img{
padding:0;
margin:0;
border:none;
}
.spacer{
padding:0;
margin:0;
font-size:0;
line-height:0;
clear:both;
}

#container{
width:958px; 
margin:0 auto;
background:url(e16-fashion-club-images/hdr_pic.jpg) no-repeat 0 0 #B6510D;
color:inherit;
}
/*------------------------------------------Top Panel-----------------------------------------*/
#main{
width:920px;
margin:0 auto;
height:479px;
position:relative;
}
.logo{
position:absolute;
left:20px;
top:16px;
}
h1{
font:normal 24px/24px Georgia, "Times New Roman", Times, serif;
color:#D3CC64;
background-color:inherit;
position:absolute;
left:278px;
top:25px;
}
h1 span{
font:normal 12px/15px Arial, Helvetica, sans-serif;
color:#CEA013;
background-color:inherit;
display:block;
padding:5px 0 0 0;
}
p.matTxt{
line-height:10px;
color:#F88B21;
background-color:inherit;
position:absolute;
left:278px;
top:99px;
width:502px;
}

/*--------------------- navigation------------------------------------*/
ul.navlink{
padding:0;
margin:0;
width:872px;
background-color:#141C10;
color:inherit;
position:absolute;
left:25px;
top:430px;
height:25px;
}
ul.navlink li{
float:left;
font:normal 16px/25px Arial, Helvetica, sans-serif;
}
ul.navlink li.active{
color:#EBE588;
background-color:#AB2C05;
width:93px;
text-align:center;

}

ul.navlink li a{
color:#B2AC58;
background-color:inherit;
padding:0 24px;
display:block;
}
ul.navlink li a:hover{
color:#EBE588;
background-color:#AB2C05;
}

#logBlock{
width:920px;
margin:0 auto;

}
#topBlock{
width:895px;
margin:0 auto;
background-color:#EBE588;
color:inherit;
padding-left:25px;
height:100%;
overflow:auto;

}
/*---------------------Log in Block--------------------------*/
#userLog{
width:544px;
height:193px;
border:solid 6px #C3BD66;
background:url(e16-fashion-club-images/flower.gif) no-repeat 0 bottom #DED879;
padding:10px 0 0 10px;
color:#3A3E24;
float:left;
}
#userLog p.user{
background:url(e16-fashion-club-images/e16_img.gif) no-repeat 0 0;
width:94px;
height:82px;
float:left;
}

/*--------------------------Form One----------------------------------*/
form.one{
width:428px;
float:left;
padding:0 0 0 14px;
}
form.one label{
font-size:12px;
line-height:16px;
color:#A9B100;
background-color:inherit;
font-weight:bold;
float:left;
padding:5px 113px 10px 0;

}
form.one input.txtfield{
width:165px;
height:51px;
font-size:40px;
color:#A9B100;
background-color:#EBE588;
float:left;
border:solid 1px #EBE589;
margin:0 9px 0 0;

}
form.one input.logButt{
background:url(e16-fashion-club-images/login.gif) no-repeat 0 0;
width:71px;
height:53px;
cursor:pointer;
border:none;
padding:53px 0 0 71px;
float:left;
}
p.register{
font-size:16px;
line-height:18px;
float:left;
padding:18px 0 0 110px;
width:410px;
}
p.register span{
display:block;
font-size:24px;
line-height:24px;

padding-top:13px;
}
p.register span a{
color:#AB2C05;
background-color:inherit;
}

p.register span a:hover{
text-decoration:underline;
}
#fashionBlock{
width:307px;
float:left;
}
.fashion{
background:url(e16-fashion-club-images/fashionspot_bg.jpg) no-repeat 0 0;
width:307px;
height:105px;
margin:3px 0 0 0;
}
h2.fashionPot{
font:normal 24px/24px Georgia, "Times New Roman", Times, serif;
color:#141C10;
background-color:inherit;
padding:16px 0 0 132px;
}
p.fashiontxt{
color:#A6A04D;
background-color:inherit;
line-height:11px;
padding:3px 0 0 132px;
width:126px;
}
p.fashiontxt span{
color:#AB2C05;
background-color:inherit;
}
.teenwindow{
background:url(e16-fashion-club-images/teen_window.jpg) no-repeat 0 0;
width:307px;
height:106px;
}
/*---------------------Log in Block--------------------------*/
#BotBlock{
width:920px;
margin:0 auto;
background:url(e16-fashion-club-images/bottom_roundBg.gif) no-repeat 0 bottom;
height:24px;
float:left;
}


/*------------------------------------------Top Panel-----------------------------------------*/

/*---------------------------------Body---------------------------------------*/
#BodyPan{
width:920px;
margin:0 auto;
padding:20px 0 0 0;
}

/*-------------------------------left panel--------------------------------------------*/
#leftPan{
width:570px;
float:left;

}
h2.trendy{
font:normal 75px/80px Georgia, "Times New Roman", Times, serif;
color:#D68615;
background-color:inherit;
padding-bottom:14px;
display:block;
}
p.dashed{
background:url(e16-fashion-club-images/dashed.gif) repeat-x 0 0;
height:16px;
}
h3{
font-size:12px;
line-height:14px;
color:#EBE588;
font-weight:bold;
background-color:inherit;
padding:16px 0 13px 0;
}
p.picture{
background:url(e16-fashion-club-images/pic1.jpg) no-repeat 0 0;
width:114px;
height:47px;
float:left;
}

p.picture1{
background:url(e16-fashion-club-images/pic2.jpg) no-repeat 0 0;
width:114px;
height:47px;
float:left;
}
p.labrumTxt{
color:#CEA013;
background-color:inherit;
line-height:12px;
float:left;
width:413px;
padding:0 0 0 11px;
}
#dashBlock{
background:url(e16-fashion-club-images/double_dash.gif) repeat-x 0 0;
height:21px;
width:204px;
float:left;
margin:15px 0 0 0;
padding-left:366px;
}
#dashBlock a{
color:#EBE588;
background-color:inherit;
}
#dashBlock a:hover{
text-decoration:underline;
}
p.special , p.comments{
background:url(e16-fashion-club-images/star_bullet.gif) no-repeat 0 50%;
color:#EBE588;
background-color:inherit;
line-height:21px;
padding:0 0 0 15px;
float:left;
}
p.comments{
background:url(e16-fashion-club-images/comments_bullet.gif) no-repeat 0 50%;
float:left;
margin-left:13px;
padding-left:21px;

}
/*-------------------------------left panel--------------------------------------------*/

/*-------------------------------right panel--------------------------------------------*/
#rghtPan{
width:331px;
float:right;
}
.magazineBlock{
width:132px;
background:url(e16-fashion-club-images/fashionmag_bg.jpg) no-repeat 0 0;
height:343px;
float:left;
padding:0 23px;
}
h2.fashionMag{
color:#CEC758;
background-color:inherit;
font:normal 24px/26px Georgia, "Times New Roman", Times, serif;
padding:30px 0 0 0;
text-align:center;
}
h2.fashionMag span{
text-align:center;
width:131px;
font:bold 11px/18px Arial, Helvetica, sans-serif;
display:block;
color:#7D771E;
background-color:#141C10;
margin-top:3px;
}
.newsBlock{
width:134px;
float:right;
}
p.news{
background:url(e16-fashion-club-images/e16News.jpg) no-repeat 0 0;
height:84px;
}
ul.newsLink{
padding:0;
margin:0;
background:url(e16-fashion-club-images/dashed_two.gif) repeat-x 0 0;
}
ul.newsLink li{
background:url(e16-fashion-club-images/dashed_two.gif) repeat-x 0 bottom;
height:17px;
font-size:0;
line-height:0;
padding:0 0 0 3px;
}
ul.newsLink li a{
font:normal 9px/17px Arial, Helvetica, sans-serif;
color:#EBE588;
background-color:inherit;
}
ul.newsLink li a:hover{
color:#fff;
background-color:inherit;
}
p.dates{
background:url(e16-fashion-club-images/e16_Dates.jpg) no-repeat 0 0;
width:134px;
height:83px;
margin:21px 0 0 0;
}
p.datingTxt{
color:#CEA013;
background-color:inherit;
line-height:11px;
padding-top:12px;
}
p.datingTxt span{
display:block;
padding:12px 0 0 0;

}
p.datingTxt span a{
color:#EBE588;
background-color:inherit;
}
p.datingTxt span a:hover{
text-decoration:underline;
}
/*-------------------------------right panel--------------------------------------------*/

/*---------------------------------Body---------------------------------------*/


/*ABOUT US*/
#about_container{
background:url(e16-fashion-club-images/about_us_hdr.jpg) no-repeat 0 0 #B6510D;
color:inherit;
width:958px;
margin:0 auto;
height:100%;
}
#aboutbody{
width:920px;
margin:0 auto;
padding-bottom:10px;
}
h2.about{
font:normal 75px/82px Georgia, "Times New Roman", Times, serif;
color:#D68615;
background-color:inherit;
padding:23px 0 6px 0;
}
p.aboutdash{
background:url(e16-fashion-club-images/dashed.gif) repeat-x 0 0;
width:920px;
height:16px;
}
h2.simlique{
font:normal 18px/20px Arial, Helvetica, sans-serif;
color:#141C10;
background-color:inherit;
padding:19px 0 0 13px;
}
p.veroTxt{
font:normal 12px/18px Arial, Helvetica, sans-serif;
color:#CEA013;
background-color:inherit;
padding:14px 0 12px 13px;
}

ul.identifyLink , ul.identifyLink1{
float:left;
padding:16px 31px 0 14px;

}
ul.identifyLink li , ul.identifyLink1 li{
font-size:12px;
line-height:18px;
color:#CEA013;
background-color:inherit;
}
ul.identifyLink1{
float:left;
padding-right:0;
}

/*--------------------------------------footer--------------------------------------*/
#footer{
width:920px;
margin:0 auto;
padding:20px 0 26px 0;
}
ul.footerlink{
width:895px;
color:#B2AC58;
background-color:#141C10;
height:25px;
padding-left:25px;
}
ul.footerlink li{
float:left;
padding:0 23px;
}
ul.footerlink li a{
font-size:16px;
line-height:25px;
color:#B2AC58;
background-color:inherit;
}
ul.footerlink li a:hover{
color:#EBE588;
background-color:inherit;
}
p.copyright{
font:normal 9px/17px Arial, Helvetica, sans-serif;
color:#CEA013;
background-color:inherit;
text-align:center;
padding-top:22px;
}
p.copyright span{
display:block;
}
p.copyright span a{
color:#EBE588;
background-color:inherit;
}
p.copyright span a:hover{
text-decoration:underline;
}
/*--------------------------------------footer--------------------------------------*/

</style>


</head>
<body>
<div id="about_container">
  <div id="main"> <a href="http://www.free-css.com/"> <img src="e16-fashion-club-images/logo.gif" alt="" width="213" height="219" border="0" class="logo" /> </a>
    <h1>"Fashion is a form of ugliness so intolerable that we have to alter it every six months" <span>- Oscar Wilde </span> </h1>
    <p class="matTxt">Maecenas eget orci quis elit malesuada tempor duise nullam vitae duise fellis figero lullam hallentroupe morbius corbista sed amet lullam.</p>
    <ul class="navlink">
      <li><a href="http://www.free-css.com/">home</a></li>
      <li class="active">about&nbsp;us</li>
      <li><a href="http://www.free-css.com/">the fashion blog</a></li>
      <li><a href="http://www.free-css.com/">archieve</a></li>
      <li><a href="http://www.free-css.com/">latest&nbsp;trends</a></li>
      <li><a href="http://www.free-css.com/">news</a></li>
      <li><a href="http://www.free-css.com/">videos</a></li>
      <li><a href="http://www.free-css.com/">contact</a></li>
    </ul>
    <br class="spacer" />
  </div>
  <div id="aboutbody">
    <h2 class="about">about us</h2>
    <p class="aboutdash">&nbsp;</p>
    <h2 class="simlique">Similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga sed amet. Senetore of the fellis sed amet curabiror lullam hallentrouype of the fellis. Aliquam in duiseore bocestore a secote nocto mallenose.</h2>
    <p class="veroTxt">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellatore.</p>
    <h2 class="simlique">Vision of E16 : Fashion that gives you a new identity</h2>
    <ul class="identifyLink">
      <li>Pellentesque non risus non tortor bibendum</li>
      <li>Quisque vulputate auctor nibh</li>
      <li>Donec ut nisl ac enim lacinia commodo.</li>
      <li>Maecenas sed lacus eu purus</li>
      <li>Aenean vestibulum</li>
      <li>Donec lobortis pretium mauris</li>
      <li>Phasellus vitae lectus et quam placerat</li>
      <li>Donec imperdiet pede</li>
      <li>Nullam eu nunc mollis pede faucibus</li>
      <li>Proin tincidunt pellentesque purus</li>
      <li>Nullam vehicula ligula</li>
    </ul>
    <ul class="identifyLink">
      <li>Cras bibendum auctor quam</li>
      <li>Vivamus aliquet rhoncus leo</li>
      <li>Vestibulum rutrum mi aliquam lectus</li>
      <li>Sed suscipit aliquam eros</li>
      <li>Quisque molestie felis in neque ullamcorper aliquam</li>
      <li>Phasellus interdum est a tellus</li>
      <li>Proin a arcu a pede pretium tristique</li>
      <li>Donec lobortis pretium mauris</li>
      <li>Phasellus vitae lectus et quam placerat molestie</li>
      <li>Donec imperdiet pede ac quam</li>
      <li>Nullam eu nunc mollis pede faucibus pharetra</li>
    </ul>
    <ul class="identifyLink1">
      <li>Donec ut nisl ac enim lacinia commodo. </li>
      <li>Vivamus aliquet rhoncus leo</li>
      <li>Aenean vestibulum</li>
      <li>Donec lobortis pretium mauris</li>
      <li>Phasellus vitae lectus et quam placerat</li>
      <li>Donec imperdiet pede</li>
      <li>Nunc sit amet nibh eget pede consequat iaculis</li>
      <li>Etiam gravida semper mauris</li>
      <li>Aliquam at libero interdum orci porta hendrerit</li>
      <li>Morbi at neque et dolor suscipit tempor</li>
      <li>Donec ut nunc dapibus leo gravida ullamcorper</li>
    </ul>
    <br class="spacer" />
  </div>
  <div id="footer">
    <ul class="footerlink">
      <li><a href="http://www.free-css.com/">home</a></li>
      <li><a href="http://www.free-css.com/">about&nbsp;us</a></li>
      <li><a href="http://www.free-css.com/">the&nbsp;fashion&nbsp;blog</a></li>
      <li><a href="http://www.free-css.com/">archieve</a></li>
      <li><a href="http://www.free-css.com/">latest&nbsp;trends</a></li>
      <li><a href="http://www.free-css.com/">news</a></li>
      <li><a href="http://www.free-css.com/">videos</a></li>
      <li><a href="http://www.free-css.com/">contact</a></li>
    </ul>
    <br class="spacer" />
    <p class="copyright"> Copyright Information Goes Here. All Rights Reserved. <span>Design by: <a href="http://www.hire-a-designer.com">Hire-A-Designer</a></span> </p>
  </div>
  <br class="spacer" />
</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.freshair
27.wbfashion
28.ruby
29.shining-star
30.shopping