FashionClub : Fashion « Templates « HTML / CSS






FashionClub

     

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>:: Welcome - E16 Fashion Club - about us ::</title>
<style type='text/css'>
/* CSS Document */
body {
padding:0;
margin:0;
font:9px Arial, Helvetica, sans-serif;
background:url(FashionClub-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(FashionClub-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(FashionClub-images/flower.gif) no-repeat 0 bottom #DED879;
padding:10px 0 0 10px;
color:#3A3E24;
float:left;
}
#userLog p.user{
background:url(FashionClub-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(FashionClub-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(FashionClub-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(FashionClub-images/teen_window.jpg) no-repeat 0 0;
width:307px;
height:106px;
}
/*---------------------Log in Block--------------------------*/
#BotBlock{
width:920px;
margin:0 auto;
background:url(FashionClub-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(FashionClub-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(FashionClub-images/pic1.jpg) no-repeat 0 0;
width:114px;
height:47px;
float:left;
}

p.picture1{
background:url(FashionClub-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(FashionClub-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(FashionClub-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(FashionClub-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(FashionClub-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(FashionClub-images/e16News.jpg) no-repeat 0 0;
height:84px;
}
ul.newsLink{
padding:0;
margin:0;
background:url(FashionClub-images/dashed_two.gif) repeat-x 0 0;
}
ul.newsLink li{
background:url(FashionClub-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(FashionClub-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(FashionClub-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(FashionClub-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">  
            <!--Top Panel -->
            <div id="main">
            <a href="index.html">
            <img src="FashionClub-images/logo.gif" alt=" E16 Fashion Club" width="213" height="219" border="0" class="logo" title=" E16 Fashion Club"/>
            </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>
            
            <!--navigation -->
                    <ul class="navlink">
                      <li><a href="index.html" title="home">home</a></li>
                      <li class="active" title="about us">about&nbsp;us</li>
                      <li><a href="#" title="the fashion blog">the fashion blog</a></li>
                      <li><a href="#" title="archieve">archieve</a></li>
                      <li><a href="#" title="latest trends">latest&nbsp;trends</a></li>
                      <li><a href="#" title="news">news</a></li>
                      <li><a href="#" title="videos">videos</a></li>
                      <li><a href="#" title="contact">contact</a></li>
                    </ul>
            
            <!--navigation -->
            
            
            <br class="spacer" />
            </div>
            <!--Top Panel -->
            <!--about Body -->
                    <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>
            <!--about Body -->
            
            <!--footer -->
            <div id="footer"> 
                                                                                               
            <ul class="footerlink">
              <li><a href="index.html" title="home">home</a></li>
              <li><a href="aboutus.html" title="about&nbsp;us">about&nbsp;us</a></li>
              <li><a href="#" title="the fashion blog">the&nbsp;fashion&nbsp;blog</a></li>
              <li><a href="#" title="archieve">archieve</a></li>
              <li><a href="#" title="latest trends">latest&nbsp;trends</a></li>
              <li><a href="#" title="news">news</a></li>
              <li><a href="#" title="videos">videos</a></li>
              <li><a href="#" title="contact">contact</a></li>
            </ul>
            
            <br class="spacer" />
            <p class="copyright"> Copyright Information Goes Here. All Rights Reserved.
            
            <span><a href="http://www.flashmint.com/show-type-flash.html">Flash Templates</a>  by<a href="http://www.flashmint.com/">FlashMint</a></span>

            </p>
            </div>
            <!--footer -->
<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.fashionhouse
6.fashionhut
7.fashionista
8.Celebrere
9.celebrity
10.beautiful
11.Beauty&Style
12.beauty-design
13.beauty-secrets
14.beautycompany
15.beautysalon
16.beautysecrets
17.metamorph_beauty
18.agedbeauty
19.face
20.facing
21.metamorph_middleage
22.clothes-collection
23.clothesfashion
24.metamorph_sweetlove
25.e16-fashion-club
26.freshair
27.wbfashion
28.ruby
29.shining-star
30.shopping