community-live : Design 3 « Templates « HTML / CSS






community-live

   

<!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" dir="ltr" lang="de-DE">
<head>
<title>Community Live - Impressum</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
/* --------------- Einstellung fr alle Elemente ---------------*/
html * { 
      margin: 0; 
      padding:0; 
    }

body {
  background: url(community-live-images/bg_page.jpg) left top repeat-x #a3c8e5;
  text-align: center;
  font-size: 82.50%;
  font-family: Verdana, Tahoma, Arial, sans-serif;
  color: #7e7e7e;
}

/* --------------- page ---------------*/
#page {
  width: 850px;
  margin: 0px auto 0px auto;
  text-align: left;
}



/* --------------- Header ---------------*/
#cheader {
  clear: left;
  float: left;
  width:850px;
  height: 304px;
  margin: 19px 0px 0px 0px;
  background: url(community-live-images/bg_cheader.jpg) left bottom no-repeat;
}

#logo {
  clear: left;
  float: left;
  width: 230px;
  height: 56px;
}

#hm {
  float: left;
  width: 620px;
  height: 56px;
  font-size: 82.50%;
}
#hm ul {
  margin: 25px 0px 0px 0px;
  list-style-type: none;
}
#hm ul li{
  float: left;
  width: 99px;
  height: 20px;
  margin: 0px 1px 0px 0px;
  padding: 11px 0px 0px 0px;
  background: url(community-live-images/bg_hm.gif) left top no-repeat;
  list-style-type: none;
  text-align: center;
}
#hm ul li a{
  font-weight: bold;
  color: #666;
  text-decoration: none;
  text-transform: lowercase;
}
#hm ul li a.active{
  color: #000;
}

#slogan {
  clear: left;
  float: left;
  width: 155px;
  height: 80px;
  margin: 55px 0px 0px 50px;
  text-align: right;
  color: #fff;
  line-height: 1.5em;
}
#slogan h1{
  margin: 0px 0px 10px 0px;
  font-size: 112.50%;
  text-transform: lowercase;
  color: #5186ac;
}

#search {
  float: left;
  clear: left;
  margin: 38px 0px 0px 32px;
}
#search input{
  width: 140px;
  border: none;
}



/* --------------- content ---------------*/
#ccontent {
  clear: left;
  float: left;
  width:850px;
  padding: 20px 0px 30px 0px;
  background: url(community-live-images/bg_ccontent.gif) left bottom no-repeat #fff;
}

#leftmenue {
  clear: left;
  float: left;
  width: 165px;
  margin: 30px 50px 0px 27px;
  text-align: right;
}
#leftmenue h2{
  margin: 0px 0px 1.0em 0px;
  font-size: 125.00%;
  color: #e6784c;
  text-transform: lowercase;
  font-weight: bold;
}
#leftmenue ul{
  list-style-type: none;
}
#leftmenue ul li{
  margin: 12px 0px 12px 0px;
  list-style-type: none;
}
#leftmenue ul li a{
  color: #666;
  text-decoration: none;
}
#leftmenue ul li a:hover{
  color: #e6784c;
}
#leftmenue ul li a:hover.active,
#leftmenue ul li a.active{
  color: #e6784c;
  font-weight: bold;
}


#hpv24{
  clear: left;
  float: left;
  width: 165px;
  margin: 0px 50px 0px 27px;
  font-size: 75.00%;
  color: #666;
  text-align: right;
}
#hpv24 a{
  color: #7ea227;
}



#content {
  float: left;
  width: 570px;
  line-height: 1.7em;
}
#content h1{
  margin: 0px 0px 1.0em 0px;
  font-size: 200.00%;
  font-weight: normal;
  text-transform: lowercase;
  color: #e6784c;
}
#content h2{
  font-size: 112.50%;
  color: #000;
  text-transform: lowercase;
}
#content p{
  margin: 0px 0px 1.3em 0px;
}

#content a{
  color: #e6784c;
}

#content a:hover{
  color: #000;
}

#content #links {
  clear: left;
  float: left;
  width: 290px;
  font-size: 82.50%;
}
#content #ressourcen {
  float: left;
  font-size: 82.50%;
}
#content #links ul ,
#content #ressourcen ul{
  list-style-type: none;
}

#content #links ul li,
#content #ressourcen ul li{
  list-style-type: none;
}

#content #links ul li a,
#content #ressourcen ul li a{
  padding: 0px 0px 0px 20px;
  background: url(community-live-images/pointer01.gif) left 4px no-repeat;
  color: #7ea227;
}

#content #links ul li a:hover,
#content #ressourcen ul li a:hover{
  color: #e6784c;
}

/* --------------- footer ---------------*/
#footer {
  clear: left;
  float: left;
  width: 850px;
  margin: 10px 0px 0px 0px;
  padding: 0px 0px 10px 0px;
  color: #517791;
  font-size: 82.50%;
}
#copyright {
  float: left;
  margin: 0px 0px 0px 20px;
}
#fmenue {
  float: right;
  margin: 0px 20px 0px 0px;
}
#fmenue ul{
  list-style-type: none;
}
#fmenue ul li{
  list-style-type: none;
  float: left;
}
#fmenue ul li a{
  margin: 0px 4px 0px 4px;
  color: #517791;
}

/* --------------- Formulare ---------------*/
#kontaktform {
  clear: left;
  float: left;
  line-height: normal;
  width: 440px;
  margin: 0px 0px 30px 0px;
  padding: 0px 10px 30px 10px;
  background-color: #efefef;
}
#kontaktform label {
  clear: left;
  float: left;
  width: 100px;
  margin: 10px 0px 0px 0px;
}
#kontaktform label.plabel {
  font-weight: bold;
}
#kontaktform input,
#kontaktform select,
#kontaktform textarea {
  float: left;
  width: 325px;
  margin: 10px 0px 0px 0px;
}
#kontaktform input.submit {
  width: auto;
  float: right;
  margin: 10px 0px 0px 0px;
}
#kontaktform input.reset {
  width: auto;
  float: right;
  margin: 10px 0px 0px 0px;
}

</style>


</head>
<body>
<div id="page">
  <div id="cheader">
    <div id="logo"> <img src="community-live-images/communitylive.gif" border="0" alt="" /> </div>
    <div id="hm">
      <ul>
        <li><a href="http://www.free-css.com/">Home</a></li>
        <li><a href="uebermich.html">&Uuml;ber mich</a></li>
        <li><a href="news.html">News</a></li>
        <li><a href="links.html">Links</a></li>
        <li><a href="kontakt.html">Kontakt</a></li>
        <li><a href="impressum.html" class="active">Impressum</a></li>
      </ul>
    </div>
    <div id="header">
      <div id="slogan">
        <h1>community slogan</h1>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitra</p>
      </div>
      <div id="search">
        <form name="search" id="searchform" method="post" action="#">
          <input type="text" name="searchstring" value="Suchbegriff" />
        </form>
      </div>
    </div>
  </div>
  <div id="ccontent">
    <div id="leftmenue">
      <h2>Submenue</h2>
      <ul>
        <li><a href="http://www.free-css.com/">Lorem ipsum dolor</a></li>
        <li><a href="http://www.free-css.com/" class="active">Duis autem vel enum</a></li>
        <li><a href="http://www.free-css.com/">At vero eos at</a></li>
        <li><a href="http://www.free-css.com/">Ipsum dolor</a></li>
        <li><a href="http://www.free-css.com/">Lorem ipsum dolor</a></li>
      </ul>
    </div>
    <div id="content">
      <h1>Impressum</h1>
      <p><strong>Deine Webseite sollte aus rechlichen Gr&uuml;nden auf jeden Fall ein Impressum enthalten. Weiterf&uuml;hrende Informationen findest Du im Internet unter &quot;Teledienstgesetzt&quot;.</strong></p>
      <div id="links">
        <h2>N&uuml;tzliche Links</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Lorem ipsum dolor</a></li>
          <li><a href="http://www.free-css.com/">Duis autem vel enum</a></li>
          <li><a href="http://www.free-css.com/">At vero eos at</a></li>
          <li><a href="http://www.free-css.com/">Ipsum dolor</a></li>
        </ul>
      </div>
      <div id="ressourcen">
        <h2>Ressourcen</h2>
        <ul>
          <li><a href="http://www.free-css.com/">Lorem ipsum dolor</a></li>
          <li><a href="http://www.free-css.com/">Duis autem vel enum</a></li>
          <li><a href="http://www.free-css.com/">At vero eos at</a></li>
          <li><a href="http://www.free-css.com/">Ipsum dolor</a></li>
        </ul>
      </div>
    </div>
    <div id="hpv24"> Design 2008<br />
      by <a href="http.//www.hpvorlagen24.de">www.hpvorlagen24.de</a> </div>
  </div>
  <div id="footer">
    <div id="copyright"> copyright &copy; 2008 by Dein Name </div>
    <div id="fmenue">
      <ul>
        <li><a href="http://www.free-css.com/">Home</a>|</li>
        <li><a href="uebermich.html">&Uuml;ber mich</a>|</li>
        <li><a href="news.html">News</a>|</li>
        <li><a href="links.html">Links</a>|</li>
        <li><a href="kontakt.html">Kontakt</a>|</li>
        <li><a href="impressum.html">Impressum</a></li>
      </ul>
    </div>
  </div>
</div>
</body>
</html>

   
    
    
  








Related examples in the same category

1.blankspace
2.Blasphemy
3.blended
4.blewwave
5.blootoon
6.blush
7.boardroom
8.BOOM
9.boorish
10.boosting
11.bordered
12.boswell
13.bounderies
14.boxedtype
15.boxes_template
16.boxybox
17.branches
18.breaking_ontop
19.brewedcoffee
20.brightfolio
21.brightsideoflife1.0
22.Broadcaster
23.broadsheet
24.brycesunrise
25.bucolic
26.burgeon
27.buzz
28.BW
29.bwdec2007
30.calliope
31.callofduty2
32.candiiclouds
33.cantya-studio
34.canuckington-post
35.canvass
36.capricious
37.capsicum
38.carbonated
39.carbonizer
40.carlmelon
41.caronline
42.carrera
43.castellated
44.catch_info
45.cattleya
46.center-stage
47.COIL
48.col1
49.col2
50.col3
51.collaboration
52.collectiveblue
53.collegemusic
54.colorus
55.colosseum
56.columna
57.combination
58.ComingSoon
59.commission
60.communication-1.0
61.communication-co
62.communication
63.compiled
64.complete-collection
65.complimentary
66.component
67.compressed
68.compromise
69.compus
70.conceptnova
71.concrete
72.concurrence
73.condition
74.conglomerate
75.conjunction
76.connection
77.connections
78.consulting-co
79.contemplate
80.convergence
81.cookiefusion
82.Copy of modify
83.corporattica
84.Cosmopolitan
85.counterstrike
86.cover
87.coverage
88.coxswain
89.creamburn
90.crisp2
91.criterion
92.crystalblack
93.css-heaven-1
94.cssgallery
95.cssheaven-2
96.cssmajesty
97.cubismo
98.cultivated
99.cultureshock
100.cupofcoffee
101.customary
102.customize
103.cyano
104.cyanspark
105.cyberarray
106.daleri-mega
107.daleri-structure
108.dalmatians
109.danmyaz1
110.dapple
111.david-kruger
112.deardiary
113.decorative
114.deepimpact
115.deerpark
116.dekada
117.delta
118.delzep_enterprise
119.description
120.deserted
121.desertsand
122.design-gallery
123.design-studio
124.design10
125.Design9
126.designersstudio
127.designersworld
128.designgalo
129.designhq
130.designstudio
131.Design_Agency
132.deskspace
133.detachable
134.deviation
135.devision
136.dewdrops
137.dezinstudio
138.didactic
139.Did_My_Time
140.differential
141.digitalweb
142.dimension
143.diminishing
144.dirtylicious
145.disambiguation
146.discovery
147.distillate
148.distinctive
149.diversity
150.DJ