/* 
united: eine Stylesheet fuer alle
avion42 - 02.12.2005
*/

html, body {
margin: 0; 
padding: 0;
background: #714E45;
font: small/1.6em georgia, 'times new roman', serif; 
text-align: center;
color: #330000;
font-size: x-small; /* IE5 Win */
voice-family: "\"}\""; 
voice-family: inherit;
font-size: small;
}
html>body { /* be nice to Opera */
font-size: small;
}

/* LINKS 
-----------------------*/

a:link {
font-weight: bold;
color: #772D2F;
}

#nav a { /*linkfarbe im header breadcrumb navigation */
color: #fff;
}

#sidebar a:link, #sidebar a:visited, #footer a:link, a:visited {
color: #c28651;
font-weight: normal;
}

abbr, acronym {
font-style: normal;
border-bottom: 1px dotted;
}

abbr:hover, acronym:hover {
cursor: help;
}


/* LAYOUT 
------------------------------------------ */

#container {
position: relative;
top: 0;
margin: 0 auto;
padding: 0;
width: 700px;
text-align: left;
font-size: 90%;
background: #fff;
border-left: 2px solid #C28651;
border-right: 2px solid #C28651;
}

#header {
background: #330000 url(avion.jpg) bottom right no-repeat;
height: 240px;
color: #fff;
padding: 0;
margin: 0;
}

#index #header {
height: 280px;
}

#nav { /*header auf den Folgeseiten - breadcrumb */
background: #c28651;
margin: 0 auto;
padding: 0 5px;
font-size: 95%;
color: #fff;
font-family: 'trebuchet ms', arial, sans-serif;
}


#content { 
float: left; /* content-spalte floatet nach links und die sidebar sitzt daneben */
margin: 0;
padding: 0;
width: 66%;
text-align: left;
background: #fff;
border-top: 2px solid #C28651;
line-height: 1.5em;

}

#sidebar { 
position: relative;
border-left: 2px solid #C28651;
border-top: 2px solid #C28651;
padding-bottom: 10px;
margin-left: 66%; 
background: #8d4524;
color: #fff;
text-align: left;
line-height: 1.3em;
}


#footer {
clear: left;
border-top: 2px solid #C28651;
width: 704px;
margin: 0 auto;
padding: 10px 0;
text-align: center;
color: #fff;
font-family: 'trebuchet ms', arial, sans-serif;
font-size: 85%;
color: #c28651;
}



/* ausgeblockter Info-Text bei Links zu webstandards */

#info { 
font-size: 95%;
float: right; 
width: 34%;
border-left: 2px solid #C28651;
border-bottom: 2px solid #C28651;
margin: 0 0 4% 8%;
padding-bottom: 10px;
background: #8D4524;
color: #fff;
text-align: left;
}
#info h4 {
margin-top: 15px;
border-bottom: 1px dotted;
padding-bottom: 5px;
text-align: left;
line-height: 110%;
font-size: 90%;
text-transform: uppercase;
font-weight: bold;
margin-bottom: 3px;
}
h4 em { font-size: 220%; font-weight: normal; }

#info p {
font-family: 'trebuchet ms', arial, helvetica, sans-serif;
line-height: 1.3em;
text-align: left;
}
#info a:link, a:visited { color: #c28651; }





/* UEBERSCHRIFTEN 
------------------------------------------------------ */


h1 {
font-style: italic;
font-size: 340%;
margin: 0; /* muss 0 sein, sonst verschiebt sich header */
padding: 20px 20px 20px 20px;
}
h1 a:link, h1 a:visited, h1 a:active, h1 a:hover { 
text-decoration: none; 
color: #fff; 
}

#index h1 {
padding-top: 90px;
}

h1, h2, h4 {
line-height: 1.1em;
font-weight: normal;
}

h2 {
margin: 20px 0;
padding: 0;
clear: left;
font-size: 230%;
color: #7e2a25;
}
h2 em {
display: block;
font-size: 68%;
font-weight: bold;
}

#index h2 { /* h2 auf der Welcome und anderen index-seiten */
margin: 30px 20px 0 20px;
padding: 0;
line-height: 1em;
}

h3 { /* 2. Ebene Zwischenueberschriften */
font-size: 100%;
margin-top: 1em;
margin-bottom: 1em;
}


h3#readon { /* unter einem Text */
margin-top: 3em;
padding-top: 2em;
border-top: 1px dotted #C28651;
}


/* Ueberschriften in ausgelagerten boxen im Text */
h4 {
margin: 0.7em;
padding: 0;
font-size: 100%;
font-weight: bold;
}


#sidebar h4 { /* sidebar */
margin: 20px 10px 10px 10px;
padding-bottom: 5px;
border-bottom: 1px dotted;
text-align: left;
font-size: 100%; /* font-size sidebar wirkt auch */
text-transform: uppercase;
font-family: georgia, 'times new roman', serif;
}


/* SCHRIFTEN UND ABSTAENDE 
----------------------------------------- */

h2, h3, p, #dellinks, dl, ul, ol, pre, table, address { /* Abstand - Rand */
margin-left: 10%;
margin-right: 10%;
}

p {
text-align: justify;
padding: 0;
}

p, dd {
margin-top: 1em;
margin-bottom: 1em;
}

p.vorspann {
margin-top: 3.0em;
font-weight: bold;
}


#index p, #index dl {
margin: 0 20px;
padding: 0;
}
#index dt {
margin-top: 20px;
}
#index dd {
margin: 0;
}


#sidebar {
font: 92% 'trebuchet ms', arial, helvetica, sans-serif;
}

#sidebar p, #sidebar blockquote { 
text-align: left;
margin: 10px; 
padding: 0;
background: #8d4524; /* entgegen dem blockquote im text */
}

#sidebar p {
margin: 0 10px;
padding: 0;
}


/* LISTEN 
------------------------------------- */


#toc { /*table of content am Anfang des Textes */
padding-top: 1px;
margin-top: 2.5em;
font-weight: bold;
color: #772d2f; 
clear: left;
}


/* fuer Abstaende links siehe h2, h3, p ... */ 


ul, ol {
padding: 0;
clear: left;
position: relative;
}

li {
clear: left; 
margin-bottom: 8px;
line-height: 1.4em;
margin-left: 8%; /* schon 10% durch ul und ol + noch 8% fuer li */
}

ul li, #dellinks li {
list-style: none;
background: url(li-brown.gif) 0 2px no-repeat;
padding-left: 20px;
}

#dellinks li {
margin-left: 0; /* soll nicht 16% einrücken sondern nur 8% von ul */
}

/* Links von delicious */
#dellinks {
padding: 0;
margin-top: 0;
margin-bottom: 0;
padding-bottom: 20px;
font-family: 'trebuchet ms', arial, helvetica, sans-serif;
font-size: 95%;
line-height: 1.3em;
}

dl, dt, dd {
padding: 0;
}

dt {
margin-top: 2em;
font-weight: bold;
}

dd {
margin-left: 8%; /* schon 8 durch dl + noch 8% fuer dd */
}

dl#beispiele strong {
color: #666;
}


/* love declarations */
ul#declarations {
background: url(images/i-love-css-big.jpg) 100% 0 no-repeat;
}

#sidebar ul {
margin: 0 10px;
padding: 0;
clear: none; /* entgegen allg. ul */
}

#sidebar li {
clear: none;
list-style: none;
margin: 0 0 3px 0;
padding: 0 0 0 15px; /* fuer grafik */
background: #8D4524 url(li.gif) 0 2px no-repeat;
}


/* BILDER
-----------------------------------------------*/

img {
margin: 0 15px 5px 0;
padding: 3px;
float: left; 
border: 1px solid #ccc;
}

img.noborder {
border: 0;
float: none;
}

img.love-img {
float: left; 
border: 0; 
padding: 0 0 0 0; 
margin: 5px 10px 0 0;
}


/* Bild mit Bildunterzeile */

dl.bild { /* im bild muss mit style die width stehen */
float: left;
margin-left: 5%; /* fuer ie only */
margin-right: 1.5em;
padding: 0; 
background: #fff;
}

html>body dl.bild {
margin-left: 10%;
}
dl.bild img {
float: none;
display: block;
margin: 0;
}
dl.bild dt {
margin: 0;
padding: 0;
background: #fff;
}
dl.bild dd {
margin: 3px 0 0 0;
padding: 0 4px;
font-family: 'trebuchet ms', arial, helvetica, sans-serif;
font-size: 95%;
line-height: 1.3em;
background: #e2e2e2;
color: #333;
}

dl.bild dd.credit {
background: #fff;
color: #c2c2c2;
text-align: right;
margin-bottom: 1.5em;
}
.credit a:link, .credit a:visited {
color: #c2c2c2;
}


/* Icons in der sidebar */


#firefox { /* icon */
float: none;
display: block;
border: none;
margin: 0.5em 0 20px 0;
}

.xml { /* icon */
float: none;  /* entgegen norm images */
display: inline;
margin: 0;
padding: 0;
border: none;
vertical-align: text-bottom; 
padding-left: 5px;
}



/* ZITATE
-----------------------------------------------------------*/

blockquote {
margin-left: 10%;
margin-right: 8%;
background: transparent url(startquote.gif) left top no-repeat;
text-align: left;
}

blockquote p {
padding: 0 60px 0 10px;
margin-bottom: 5px;
line-height: 1.3em;
font-size: 130%;
color: #666;
background: transparent url(endquote.gif) right bottom no-repeat;
text-align: left;
}

cite {
color: #666;
font-family: 'trebuchet ms', arial, geneva, sans-serif; 
font-style: normal;
font-size: 95%;
}

#beispiele cite { /* default-formatierung */
color: #000;
font-family: georgia, 'times new roman', serif; 
font-style: italic;
font-size: 100%;
}

/* AUSLAGERUNGEN 
----------------------------------------------- */

div.ausgelagert {
float: left;
position: relative;
margin: 0.5em 3% 3% 2.9em;
width: 30%;
font-size: 95%;
line-height: 1.4em;
font-family: 'trebuchet ms', arial;
border-top: 5px solid #C28651;
border-right: 5px solid #C28651;
border-bottom: 1px dotted #C28651;
border-left:  1px dotted #C28651;
}
html>body .ausgelagert {
margin-left: 10%;
}

div.ausgelagert p {
text-align: left;
margin: 0.7em;
padding: 0;
}

div.ausgelagert cite {
font-size: 100%;
}

/* TABELLEN 
------------------------------------------------- */

table {
clear: left;
margin-bottom: 10px;
border-collapse: collapse;
}

th {
text-align: left;
padding: .3em;
border-bottom: 5px solid #C28651;
}

td {
padding: .3em;
border: 1px dotted #C28651;
}





/* SONDERZEICHEN 
------------------------------------------------- */

code, kbd { 
font-size: 120%;
color: #333;
}

pre {
margin-top: 0;
margin-bottom: 0;
padding: 0;
}


kbd {
padding: 0 4px;
border: 1px outset #ccc;
}



/* CREATIVE COMMONS
--------------------------------------------------*/

p#cc {
margin-top: 50px;
padding-bottom: 20px;
margin-bottom: 0;
font-family: 'trebuchet ms' arial, geneva, sans-serif;
font-size: 95%;
color: #666;
text-align: left;
line-height: 1.1em;
width: 440px; 
}

#index p#cc {
width: 330px; /* mehr Text auf der welcome */
}

#cc img {
border: 0;
padding: 0;
margin: 0;
float: left;
display: block;
margin-right: 0.8em;
}

