europe
<!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="en" lang="en">
<head>
<title>Europe</title>
<style type='text/css'>
* {
margin:0;
padding:0;
border:0;
}
body {
font:12px/140% verdana, arial, helvetica, sans-serif;
color:#0c375f;
background:#f6f6f6;
}
a {
text-decoration: underline;
font-weight: bold;
outline: none;
}
a:visited {
color: #4D4D4D;
}
a:active {
color: #ccc;
}
a:hover {
text-decoration: none;
}
/* ---------------------------- berschriften -------------------------------- */
h1 {
font-size: 40px;
line-height:37px;
}
h2 {
font-size: 18px;
font-weight: bold;
margin-bottom:16px;
line-height:18px;
}
h4 {
font-size:12px;
line-height:12px;
padding-left:3px;
font-weight:bold;
margin-bottom:9px;
padding-top:9px;
}
/* ---------------------------- Allgemein -------------------------------- */
img {
border: 0;
}
#middle p {
padding-bottom:25px;
}
#middle p img {
float:left;
margin-right:17px;
}
#middle hr {
height:10px;
color:white;
background:none;
}
/* ---------------------------- Div Teile -------------------------------- */
#container {
width:1128px;
margin:auto;
background:white url(europe-images/container_back.gif) repeat-y;
position:relative;
}
#con {
position:relative;
padding-bottom:20px;
}
#wrap {
width:1050px;
margin:auto;
padding:0 11px;
position:relative;
}
#top {
margin:auto;
padding-top:30px;
margin-bottom:5px;
height:300px;
width:1049px;
background:url(europe-images/logo.jpg) no-repeat bottom;
}
#left {
float:left;
}
#middle {
width:596px;
padding:0 20px;
margin:0 auto;
border-width:0 2px;
border-color:#f4f4f4;
border-style:solid;
padding-bottom:1px;
}
#right {
float:right;
}
#footer {
clear:both;
height:30px;
padding-top:40px;
text-align:center;
background:url(europe-images/footer_back.gif) no-repeat top;
color:#b3b3b3;
font-size:10px;
}
#copy {
position:absolute;
bottom:0;
left:50%;
font-size:10px;
color:#999999;
margin-bottom:10px;
}
#copy a {
text-decoration:none;
font-weight:normal;
color:#999999;
}
/* ---------------------------- Navigation -------------------------------- */
ul#navi {
margin-bottom:55px;
}
ul#navi, ul#navi ul {
list-style-type: none;
}
ul#navi li {
margin-bottom:2px;
border-bottom:1px dashed #cecece;
padding-bottom:2px;
width:193px;
}
ul#navi a {
display:block;
width:184px;
height:25px;
padding-left:9px;
text-decoration:none;
color:#0c375f;
background:url(europe-images/navi_back.gif) no-repeat;
line-height:20px;
}
ul#navi a.aktiver_navilink {
width:179px;
border-right:5px solid #0c375f;
}
ul#subnavi a {
font-weight:100;
padding-left:22px;
background:#f9f9f9;
width:166px;
border-right:5px solid #b3b3b3;
}
ul#navi a:hover {
text-decoration:underline;
}
ul#navi li.last_navi_li, ul#navi li.submenu_li {
border:0px;
}
ul#navi li.submenu_li {
margin:0;
padding:0;
}
/* ----------------------- teaser ---------------------- */
.article_teaser_left, .article_teaser_right {
background:#f6f6f6 url(europe-images/teaser_back.gif) no-repeat top;
}
.article_teaser_left, .article_teaser_right, .content_teaser {
width:173px;
padding:0 10px;
margin-bottom:25px;
font-size:9px;
}
.article_teaser_left p, .article_teaser_right p {
margin:9px 0;
}
.content_teaser {
padding:2px;
}
.content_teaser h4 {
padding:0px;
}
</style>
<!--[if IE]>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen" />
<![endif]-->
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="MSSmartTagsPreventParsing" content="TRUE" />
</head>
<body>
<div id="container">
<div id="copy"><a href="http://www.themmen-mix.de">template</a> by shocki</div>
<div id="wrap">
<div id="top">
<h1>YOUR HEADLINE</h1>
</div>
<div id="left">
<ul id="navi">
<li><a href="..." class="aktiver_navilink">Home</a></li>
<li class="submenu_li">
<ul id="subnavi">
<li><a href="...">Submenu2</a></li>
<li class="last_navi_li"><a href="...">Submenu2</a></li>
</ul>
</li>
<li><a href="..">Seite</a></li>
<li><a href="..">Mail</a></li>
<li><a href="..">Schreiben</a></li>
<li><a href="..">Lesen</a></li>
<li class="last_navi_li"><a href=".">Impressum</a></li>
</ul>
</div>
<div id="right">
<div class="article_teaser_right">
<h4>Article Teaser</h4>
<p> <img src="europe-images/rechts.jpg" width="176" height="95" alt="" /> It landipit, sustis aliquat doluptatue tetue feu faccumsan vent lortisit, velestis nonsequam verat ilismod oloboreet ver autpatin eum esse tisim ipis auguer sed modolor iriliquissi.
Min ex euissis do eui blaore ming ex etum dit ex elisi. </p>
</div>
<div class="content_teaser">
<h4>Content Teaser</h4>
<p> It landipit, sustis aliquat doluptatue tetue feu faccumsan vent lortisit, velestis nonsequam verat ilismod oloboreet ver autpatin eum esse tisim ipis auguer sed modolor iriliquissi.
Min ex euissis do eui blaore ming ex etum dit ex elisi. </p>
</div>
</div>
<div id="middle">
<h2>Headline for Article</h2>
<p> Hent il in henis et incinci duissed ea augue conse mod tet nit inci blaore tie con veniamet luptat, veleniam volutat, quam iliquamcommy nonsequ iscinci duiscilisl ulputat. Unt veliqua tummodo luptati onsequi te diam, vulluptat. </p>
<p> Tue consequ atetum ero esto exer at nim eniscilla faccum adionulpute molorpe rcidunt eugue cons adit nulla feuis at nonse minit, quat, coreet nons do dolorero odignim dolore do ex euis ad min henissi bla am dolut ilisis aci tat ing er se tismodiam ver sis amet ute tet ad minit wisl irit eum ip eu feu feu feum il ulputat, velesse dolorpercil ea consequat. Metum incilissi.
Rat. Im quat aliquat utpat aut wissequ atumsan eum quat nibh etummy nit, quis at praesequis ate mincipit ipis do odo conum quatem qui blaor se min ulputem dolobortie consecte ea feum nim ate digna acilit adio del duismod tatissendit, commodolore dolor aliquisi tismod dolorem quam nis dionullut augiam dolor ipisisl iriurem etue ea faccummolor sim velesequis alismolorero con henisci tem veril ip er il dolore minim vercing er si. </p>
<p> </p>
<p> Dunt veliquipit delit utpatin henit iuscilla faccumm odigniat. Ut am, quip ea accumsan elenibh er sustie dipismolent aliquis sequat nonsequipit ad tet illan veniamc onsequat. Ut vulla feum dio er summodions ero od te minis ex et acilit, consequ iscipsum amcore feuipisi blam nim amconsectem zzriliquatue eu feu feumsan eraestio essim nis aut ing ex et lor si.
Rostrud dolorper aut adiamco nsequat wissi.
Cum digna facipit lum dionsequam, quisit laor in vel enit nonum delenisim iuscipsum zzriliq uipisit adion hent incidunt exerosto duisi. </p>
<hr />
<h2>Headline for Article</h2>
<p> Hent il in henis et incinci duissed ea augue conse mod tet nit inci blaore tie con veniamet luptat, veleniam volutat, quam iliquamcommy nonsequ iscinci duiscilisl ulputat. Unt veliqua tummodo luptati onsequi te diam, vulluptat.
Dunt veliquipit delit utpatin henit iuscilla faccumm odigniat. Ut am, quip ea accumsan elenibh er sustie dipismolent aliquis sequat nonsequipit ad tet illan veniamc onsequat. Ut vulla feum dio er summodions ero od te minis ex et acilit, consequ iscipsum amcore feuipisi blam nim amconsectem zzriliquatue eu feu feumsan eraestio essim nis aut ing ex et lor si.
Rostrud dolorper aut adiamco nsequat wissi.
Cum digna facipit lum dionsequam, quisit laor in vel enit nonum delenisim iuscipsum zzriliq uipisit adion hent incidunt exerosto duisi. </p>
</div>
<div id="footer"> </div>
</div>
</div>
</body>
</html>
Related examples in the same category