yellowbusiness : Yellow « Templates « HTML / CSS






yellowbusiness

   

<!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" xml:lang="de" lang="de">
<head>
<title>Yellow Business</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<style type='text/css'>
/* CSS Document */

* {
  margin:0;
  padding:0;
}

html {
  height:100%;
}

body {
  background-image:url(yellowbusiness-images/bg.jpg);
  color:#1b1b1b;
  font-family:Verdana, Helvetica, sans-serif;
  font-size:10px;
  height:100%;
}

a {
  color:#8a8a8a;
  outline:none;
  text-decoration:underline;
}

a img {
  border:0;
}

p {
  padding:5px 0 5px 0;
  margin:0;
}

/* Variable Klassen */

.active a {
  background:scroll url(yellowbusiness-images/menudot.gif) 0 -10px no-repeat !important;
}

#big {
  background-image:url(yellowbusiness-images/inlay_bg.jpg);
  background-position:50% 0;
  background-repeat:repeat-y;
  min-height:100%;
  height:auto !important;
  height:100%;
  margin:0 auto -30px auto;
  width:721px;
}
.clear {
  clear:both;
}

#content {
  float:left;
  margin:42px 0 0 17px;
  width:399px;
}

#content h1 {
  color:#e7bc24;
  font-size:10px;
  font-weight:normal;
  margin:5px 0 7px 0;
}

.contentc {
  padding:0 4px 0 4px;
}

.contentbox {
  border:1px solid #ebebeb;
  color:#868686;
  float:left;
  margin:18px 4px 0 0;
  padding:5px;
  width:116px;
}

.contentbox h2 {
  background-color:#232323;
  color:#ffffff;
  font-size:10px;
  font-weight:normal;
  height:14px;
  padding:1px 0 0 0;
  text-indent:4px;
}

.contentbox p {
  padding:2px 0 1px 0 !important;
}

#footer {
  background-image:url(yellowbusiness-images/footer.jpg);
  color:#e7bc24;
  height:14px;
  margin:15px auto 0 auto;
  padding:1px 0 0 0;
  text-align:center;
  width:721px;
}

#header {
  background-image:url(yellowbusiness-images/header.jpg);
  color:#ffffff;
  font-family:"Trebuchet MS", Helvetica, sans-serif;
  font-size:17px;
  height:180px;
  padding:7px 0 0 0;
  text-indent:29px;
  width:721px;
}

#inlay {
  background-image:url(yellowbusiness-images/inlay_top.jpg);
  background-position:0 0;
  background-repeat:no-repeat;
  float:left;
}

#menu {
  border-top:1px solid #cacaca;
  display:inline;
  float:left;
  margin:53px 0 0 27px;
  width:106px;
}

#menu li {
  border-bottom:1px solid #dadada;
  float:left;
  list-style-type:none;
}

#menu li a {
  background:scroll url(yellowbusiness-images/menudot.gif) 0 8px no-repeat;
  color:#585858;
  display:block;
  height:17px;
  margin:0 0 0 1px;
  padding:6px 0 0 0;
  text-decoration:none;
  text-indent:28px;
  width:105px;
}

#menu li a:hover {
  background:scroll url(yellowbusiness-images/menudot.gif) 0 -10px no-repeat;
}

.news {
  color:#5c5c5c;
  font-family:Arial, Helvetica, sans-serif;
  margin:72px 0 0 9px;
}

.news dd {
    margin:0 0 20px 0;
}

#newsbox {
  float:left;
  margin:4px 0 0 0;
  width:156px;
}

#newsbox h2 {
  color:#0e0e0e;
  font-size:11px;
  font-weight:bold;
  padding:0 29px 0 0;
  text-align:right;
}

.newsboxpic {
  border-bottom:10px solid #f4f4f4;
  border-left:10px solid #f4f4f4;
  border-right:9px solid #f4f4f4;
  border-top:10px solid #f4f4f4;
}

#push {
  clear:both;
  height:30px;
}

</style>


<!--[if lt IE 6]>
<link rel="stylesheet" media="screen" href="ie5.css" />
<![endif]-->
</head>
<body>
<div id="big">
  <h1 id="header">BUSINESS TEMPLATE</h1>
  <div id="inlay">
    <ul id="menu">
      <li class="active"><a href="http://www.free-css.com/">Startseite</a></li>
      <li><a href="http://www.free-css.com/">News</a></li>
      <li><a href="http://www.free-css.com/">Team</a></li>
      <li><a href="http://www.free-css.com/">Galerie</a></li>
      <li><a href="http://www.free-css.com/">Angebot</a></li>
    </ul>
    <div id="content">
      <div class="contentc">
        <h1>Willkommen auf domain.ch</h1>
        <p>Blindtexte werden zunehmend popul?r! Besonders naive Leute lesen diese sinnlosen Aneinanderreihungen von Worten immer sehr gerne und mit grossem Interesse. Aber wieso ist das eigentlich so? Geschieht das nur bei langweiligen Deisgns oder auch sonst? Naja, kann uns eigentlich egal sein, denn nun wiederholt sich der Text eh nur noch, also wenn Sie immer noch dabei sein sollten, ist nun endg?Schluss:Blindtexte werden zunehmend popul?r! Besonders naive Leute lesen diese sinnlosen Aneinanderreihungen von Worten immer sehr gerne </p>
      </div>
      <div class="contentbox logos">
        <h2>Logos</h2>
        <img src="yellowbusiness-images/h_logos.jpg" alt="" />
        <p>Logos sind langwei-<br />
          lig, wenn sie ohne Emotionen zubereit-<br />
          et wurden, was wir nat? tun...</p>
      </div>
      <div class="contentbox webdesign">
        <h2>Webdesign</h2>
        <img src="yellowbusiness-images/h_webdesign.jpg" alt="" />
        <p>Logos sind langwei-<br />
          lig, wenn sie ohne Emotionen zubereit-<br />
          et wurden, was wir nat? tun...</p>
      </div>
      <div class="contentbox prindesign">
        <h2>Printdesign</h2>
        <img src="yellowbusiness-images/h_printdesign.jpg" alt="" />
        <p>Logos sind langwei-<br />
          lig, wenn sie ohne Emotionen zubereit-<br />
          et wurden, was wir nat? tun...</p>
      </div>
    </div>
    <div id="newsbox">
      <h2>STIUVOU NEWS</h2>
      <dl class="news">
        <dt>17 Jun 2006</dt>
        <dd>Unter <a href="http://www.free-css.com/">Galerie</a> finden sich nun die ersten Werke.</dd>
        <dt>03 Mar 2006</dt>
        <dd>Das <a href="http://www.free-css.com/">Team</a> ist komplett und stellt sich vor. </dd>
        <dt>17 Mar 2006</dt>
        <dd>Irgendetwas fehlt noch, mal schauen, was das genau ist</dd>
      </dl>
      <img src="yellowbusiness-images/newsboxpic.jpg" class="newsboxpic" alt="" /> </div>
  </div>
  <div id="push">&nbsp;</div>
</div>
<div id="footer">copyright by domain.ch</div>
</body>
</html>

   
    
    
  








Related examples in the same category

1.metamorph_yellowfield
2.yellowbubbles
3.yellowing
4.yellowstone
5.solutionyellow