html {
margin:0px;
padding:0px;
height:100%;
}
body {
margin:0px;
padding:0px;
height:100%;
text-align:center;
position: relative;
overflow: visible;
z-index: 1;
color: #121010;
background-color: #FFF;
font-family: "Century Gothic",Helvetica,Arial,Verdana,sans-serif;
}
.outercontainer {
margin:0px auto;
text-align:left;
width:1200px;
background:url(../images/hg-schatten-mitte.png) repeat-y;
position:relative;
}
.box-oben {
margin:0px auto;
background:url(../images/hg-schatten-oben.png) no-repeat;
width:1200px;
height:94px;
position:relative;
}
.impressum {
margin:0px auto;
background:url(../images/hg-schatten-unten.png) no-repeat bottom left;
width:1200px;
height:100px;
}
#apDivmenue1 {
position:relative;
left:0px;
top:30px;
width:960px;
margin-left: auto;
margin-right: auto;
text-align: left;
font-family: "Century Gothic";
font-size:15px;
z-index:2;
height: 55px;
}
#apDivmenue2 {
position:relative;
left:0px;
top:0px;
width:960px;
text-align: left;
font-family: "Century Gothic";
font-size:15px;
z-index:3;
height:30px;
}
#apDivhauptmenue {
position:relative;
left:0px;
top:0%;
width:380px;
height:400px;
margin-left:auto;
margin-right:0px;
font-family: Asenine;
font-size:20px;
z-index: 4;
background-color: #FFF;
}
#apDivbanner {
position:relative;
left:0px;
top:0px;
width:960px;
height:160px;
margin-left: auto;
margin-right: auto;
font-size:40px;
color: #FFF;
z-index: 4;
overflow: hidden;
background-color: #FFF;
}
#apDivbanner img {
margin-top:0px;
}
#apDivgalerie {
position:relative;
left:0px;
top:0%;
width:960px;
margin-left:auto;
margin-right:0px;
font-family: Asenine;
font-size:20px;
z-index: 4;
background-color: #00DFAA;
overflow: auto;
}
#objectFrame {
width: 500px;
height: 200px;
background-color: #FFF;
}
/* ~~ Element-/Tag-Selektoren ~~ */
ul, ol, dl { /* Aufgrund von Abweichungen zwischen verschiedenen Browsern empfiehlt es sich, die Auffüllung und den Rand in Listen auf 0 einzustellen. Zu Konsistenzzwecken können Sie die gewünschten Werte entweder hier oder in den enthaltenen Listenelementen (LI, DT, DD) eingeben. Beachten Sie, dass die hier eingegebenen Werte hierarchisch auf die .nav-Liste angewendet werden, sofern Sie keinen spezifischeren Selektor festlegen. */
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0; /* Durch Verschieben des oberen Rands wird das Problem behoben, dass Ränder aus dem zugehörigen div-Tag geraten können. Der übrig gebliebene untere Rand hält ihn getrennt von allen folgenden Elementen. */
padding-right: 15px;
padding-left: 15px; /* Durch Hinzufügen der Auffüllung zu den Seiten der Elemente innerhalb der div-Tags anstelle der div-Tags selbst entfallen jegliche Box-Modell-Berechnungen. Alternativ kann auch ein verschachteltes div-Tag mit seitlicher Auffüllung verwendet werden. */
/*font-family: Asenine;
overflow: scroll;*/
}
h1 { font-size:14pt; margin:0px 0px 5px 0px; }
h2 { font-size:12pt; margin:0px 0px 5px 0px; }
a img { /* Dieser Selektor entfernt den standardmäßigen blauen Rahmen, der in einigen Browsern um ein Bild angezeigt wird, wenn es von einem Hyperlink umschlossen ist. */
border: none;
}
/* ~~ Die Reihenfolge der Stildefinitionen für die Hyperlinks der Site, einschließlich der Gruppe der Selektoren zum Erzeugen des Hover-Effekts, muss erhalten bleiben. ~~ */
a:link {
color: #121010;
text-decoration: none; /* Sofern Ihre Hyperlinks nicht besonders hervorgehoben werden sollen, empfiehlt es sich, zur schnellen visuellen Erkennung Unterstreichungen zu verwenden. */
}
a:visited {
color: #121010;
text-decoration: none;
}
a:hover, a:active, a:focus { /* Durch diese Gruppe von Selektoren wird bei Verwendung der Tastatur der gleiche Hover-Effekt wie beim Verwenden der Maus erzielt. */
text-decoration: underline;
}
/* ~~ Dieser Container mit fester Breite umschließt alle anderen Elemente. ~~ */
.container {
width: 1000px;
background: #FFF;
margin: 0 auto; /* Der mit der Breite gekoppelte automatische Wert an den Seiten zentriert das Layout. */
background-color: #0F0;
}
/* ~~ Dies sind die Layoutinformationen. ~~
1) Eine Auffüllung wird nur oben und/oder unten im div-Tag positioniert. Die Elemente innerhalb dieses div-Tags verfügen über eine seitliche Auffüllung. Dadurch müssen Sie keine Box-Modell-Berechnungen durchführen. Zu beachten: Wenn Sie dem div-Tag eine seitliche Auffüllung oder einen Rahmen hinzufügen, werden diese zu der festgelegten Breite addiert und ergeben die *gesamte* Breite. Sie können auch die Auffüllung für das Element im div-Tag entfernen und ein zweites div-Tag ohne Breite und mit der gewünschten Auffüllung im ersten div-Tag einfügen.
*/
.content {
padding: 100px 0;
}
/* ~~ Verschiedene float/clear-Klassen ~~ */
.fltrt { /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
float: right;
margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
float: left;
margin-right: 8px;
}
.clearfloat { /* Diese Klasse kann in einem
-Tag oder leeren div-Tag als letztes Element nach dem letzten fließenden div-Tag (im #container) platziert werden, wenn overflow:hidden im .container entfernt wird. */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
#editor { white-space:pre; }
#aphaupttext {
position:relative;
left:0px;
top:40px;
width:960px;
height:440px;
margin-left:auto;
margin-right:auto;
font-size:14px;
/*background-color: #FFF;*/
font-family: "Century Gothic";
z-index: 5;
text-align: justify;
line-height: 30px;
word-spacing: normal;
}
#Divimpressum {
width: 960px;
height: 30px;
font-family: "Century Gothic";
font-size:14px;
z-index: 6;
position: relative;
margin-left: auto;
margin-right: auto;
}
#Divtrennung {
width: 960px;
height: 3px;
font-family: Asenine;
font-size:20px;
background-color: #FFF;
z-index: 5;
position: relative;
margin-left: auto;
margin-right: auto;
}
#Divtrennung hr {
margin-top:0px;
}
.farbe {
color: #BF2;
}
a:hover {
text-decoration: none;
color: #808080;
}
a:active {
text-decoration: none;
color: #000080;
}
.contentedge {
width:14px;
}
.contenttext {
width:888px;
margin-left:14px;
}
.contenttext p {
margin:0px 0px 30px 0px;
padding:0px;
}
input.btn {
font-family: "Century Gothic";
font-size:12px;
height:24px;
padding:0px 2px 2px 2px;
border:1px solid #cccccc;
}