/* Farbschema
--------------------------------------------------------------------------------------- */

/*
# Farbton (Hintergrund): #cc9966
# Farbton (Hüllenhintergrund): #ffcc99
# Farbton (Text, h3): #774c20
# Farbton (Dunkleres Braun, Schrift, h2): #ffcc99
# Farbton (Braun, Links im Fliesstext, Schrift, #metainformation, msiteinformation): #663333
# Farbton (Text): #000
*/

/* Reset
--------------------------------------------------------------------------------------- */

* {
padding: 0;
margin: 0;
border: 0;
}

/* Globals und Typo 
--------------------------------------------------------------------------------------- */

html {


/* Wahlweise Grid-Hintergrund
Rasterhintergrund, der die Breite bis 100 Pixel und eine Höhe bis 950 Pixel anzeigt. Die Breite von 960 Pixel ist markiert. Der Hintergrund ist transparent, muss also nicht nur mit #fff verwendet werden. Es wird eine Schriftgröße von 75% oder 12px festgelegt.
background: #fff url(http://www.opern24.de/bilder/grid.png) top left no-repeat;
*/
background: #cc9966;
font-size: 75%;
}

html>body {
font-size: 14px;
}

body {
/* Wahlweise Linienhintergrund
Linienhintergrund abgestimmt auf eine Schriftgröße von 12px.
background: transparent url(http://www.opern24.de/bilder/line-height.gif) top left;
*/
background: #cc9966;
font-size: 14px;
line-height: 1.43em;
font-family: Georgia, "Times New Roman", Times, serif;
text-align:center;
}

h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dt, dd, ol, ul, li,
fieldset, label, legend, table, caption, tbody, tfoot, thead, tr, th {
text-align: left;
}

ol {
padding-left: 20px;
}

a:link {
color: #B11F32;
text-decoration: none;
border-bottom: none;
}

a:visited {
color: #5B2C26;
text-decoration: none;
border-bottom: none;
}

a:hover {
text-decoration: underline;
border-bottom: none;
}

#hauptinformation a:link, #nebeninformation a:link {
border-bottom: 1px solid #B11F32;
}

#hauptinformation a:visited, #nebeninformation a:visited {
border-bottom: 1px solid #5B2C26;
}

#hauptinformation a:hover, #nebeninformation a:hover {
text-decoration: none;
border-bottom: 1px solid #000;
background: #FFF1DB;
}

a.randlos {
border-bottom: none !important;
}

/* Macht die gepunktete Linie um geklickte Links unsichtbar
--------------------------------------------------------------------------------------- */

a:focus {
outline: none;
}

/* Vertikaler Rhythmus basierend auf 14px Basisgröße für den Fließtext
--------------------------------------------------------------------------------------- */

p {
font-family: Georgia, "Times New Roman", Times, serif;
margin-top: 1.43em;
margin-bottom: 0.65em;
}

h1 {
padding: 61px 0 29px 20px;
margin: 0;
}

h1 span {
display: none;
}

h2 {
font: 1.43em/1.1em Georgia, "Times New Roman", Times, serif;
margin-top: 1.43em;
margin-bottom: 0.65em;
}

#metainformation h2 {
background: #ffebcc;
font: normal 2.3em/1 Georgia, "Times New Roman", Times, serif;
color: #774C20;
padding: 50px 20px 5px 20px;
width: 960px;
w\idth: 960px;
float: left;
margin: 0;
}

#metainformation h2 span {
font: italic 0.5em/1 Georgia, "Times New Roman", Times, serif;
display: block;
float: left;
padding: 10px 20px 10px 0;
color: #C8945C;
letter-spacing: 0.3em;
}

h3 {
font: 1.29em/1.2em Georgia, "Times New Roman", Times, serif;
margin-top: 1.43em;
margin-bottom: 0.65em;
color: #774C20;
border-bottom: 1px dotted #cc9966;
}

h4 {
font: 1.14em/1.42em Georgia, "Times New Roman", Times, serif;
margin-top: 1.43em;
margin-bottom: 0.65em;
}

/* Bilder und verlinkte Bilder ohne Rahmen 
--------------------------------------------------------------------------------------- */

img, a img {
border: none;
}

/* Links- bzw. Rechtsausrichtung für Elemente
--------------------------------------------------------------------------------------- */

.link {
float: left;
margin: 0 0.5em 0 0;
}

.rechts {
float: right;
margin: 0 0 0 0.5em;
}

/* Layoutelemente
Verwenden Sie overflow: hidden; um nötige Foats aufzulösen.
--------------------------------------------------------------------------------------- */

#wrapper {
margin: 0 auto;
width: 960px;
background: #FFEBCC url(http://www.opern24.de/bilder/wrapper-bg.jpg) 585px 320px no-repeat;
}

#metainformation {
background: #663333 url(http://www.opern24.de/bilder/header.jpg) top left no-repeat;
overflow: hidden;
position: relative;
width: 960px;
}

#navigation {
background: #582007 url(http://www.opern24.de/bilder/nav-bg.jpg) top left repeat-x;
float: left;
width: 960px;
w\idth: 960px;
padding: 0 0 0 20px;
}

#navigation li {
float: left;
list-style-type: none;
}

#navigation li a, #navigation li a:visited {
background: #CF9B5F url(http://www.opern24.de/bilder/nav-bg.jpg) bottom left repeat-x;
color: #ffcc99;
float: left;
margin: 0;
padding: 15px;
text-align: center;
text-transform: uppercase;
border-left: 1px solid #663333;
border-right: 1px solid #ffcc99;
position: relative;
z-index: 1000;
}

#navigation li a:hover {
background: #58210c url(http://www.opern24.de/bilder/nav-hover.jpg) bottom left repeat-x;
text-decoration: underline;
}

#navigation li a.active {
background: #FFEBCC url(http://www.opern24.de/bilder/nav-active.jpg) top left repeat-x;
color: #000;
text-decoration: underline;
}

body#start a#homenav, body#dummy a#dummynav-1, body#dummy a#dummynav-2, body#dummy a#dummynav-3, body#dummy a#dummynav-4 { 
background: #FFEBCC url(http://www.opern24.de/bilder/nav-active.jpg) top left repeat-x;
color: #000;
text-decoration: underline;
}

#teaserfoto {
background: transparent url(http://www.opern24.de/bilder/teaser.png) top left no-repeat;
width: 208px;
height: 297px;
position: absolute;
top: -30px;
left: 610px;
z-index: 999;
}

#hauptinformation {
clear: both;
float: left;
width: 550px;
padding: 0 0 20px 20px;
}

/* Details */

.intro {
float: left;
width: 329px;
}

.intro-s {
float: right;
width: 201px;
}

.initial {
display: block;
float: left;
margin: 2px 0 0 0;
padding: 0 5px 0 0;
text-indent: -6000px;
}

.l {
background: transparent url(http://www.opern24.de/bilder/l.jpg) top left no-repeat;
width: 75px;
height: 66px;
}

div.trenner {
background: transparent url(http://www.opern24.de/bilder/trenner.gif) 50% 50% no-repeat;
height: 36px;
clear: both;
padding: 10px;
}

div.trenner hr {
display: none
}

.illustrativ {
background: #CC9966;
border: 1px solid #FFF6E8;
padding: 10px;
text-decoration: none;
}

.illustrativ a {
text-decoration: none;
}

.liste li {
background: transparent url(http://www.opern24.de/bilder/bullet.jpg) 0 8px no-repeat;
padding: 5px 0 5px 20px;
border-bottom: 1px solid #ffcc99;
list-style-type: none;
}

#nebeninformation {
float: right;
width: 310px;
padding: 0 20px 20px 0;
}

#nebeninformation ul li {
list-style-type: none;
border-bottom: 1px solid #cc9966;
padding: 15px 0;
overflow: hidden;
}

#nebeninformation p {
margin: 0;
padding: 0;
}

#suchen input {
background: #fff;
padding: 5px;
color: #774C20;
border: 2px solid #cc9966;
font: 1.1em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
margin: 3px 3px 3px 0;
width: 200px;
w\idth: 220px;
float: left;
}

#suchen p {
font: 0.9em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
color: #774C20;
padding: 10px 0 0 0;
}

#suchen input.button {
margin: 0;
padding: 0;
background: none;
border: none;
float: right;
width: 43px;
height: 35px;
}

p.angebot {
color: #663333;
background: #f3debd;
padding: 10px !important;
margin: 20px 20px 0 20px;
border-top: 1px solid #f3debd;
border-left: 1px solid #f3debd;
border-right: 1px solid #f3debd;
}

.angebot .foto {
padding: 0 15px 15px 0;
float: left;
}

.angebot strong {
font: 1.5em/1em Georgia, "Times New Roman", Times, serif;
color: #ae620e;
display: block;
margin: 0 0 5px 0;
}

.details {
clear: both;
float: right;
background: #f3debd url(bilder/verlauf-angebot.jpg) bottom left repeat-x;
padding: 10px 20px !important;
margin: 0 0 20px 0;
border-left: 1px solid #f3debd;
border-right: 1px solid #f3debd;
}

.details a:link, .details a:visited {
color: #aa0034;
}

.vcard {
margin: 10px 0;
}

.vcard img {
display: none;
}

#siteinformation {
clear: both;
background: #5e2f2f url(bilder/footer-bg.jpg) top left repeat-x;
padding: 20px;
font: 0.8em/1em;
color: #ffcc99;
}

#supernav { 
clear: both; 
margin: 50px 0; 
padding: 10px; 
width: 400px; 
background: #fff; 
color: #111; 
text-align: left;
}

#shop td, #shop p {
font: 0.9em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
color: #774C20;
padding: 2px;
margin: 0;
}

#shop i {
font: 1em Georgia, "Times New Roman", Times, serif;
color: #ffcc99;
font-style: normal;
padding: 8px 3px;
display: block
}

#shop .thead {
background: #67332C;
}

#shop .tbody1 {
background: #fff;
}

#shop .navi {
font: 0.8em Georgia, "Times New Roman", Times, serif;
}

#shop a:link, #shop a:visited, #shop a:hover {
border-bottom: none 0;
}

#shop .tbody1 input, #shop .tbody2 input, #shop .tbody0 input, #shop select {
background: #fff;
padding: 3px;
color: #774C20;
border: 2px solid #cc9966;
font: 1.1em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
margin: 3px 3px 3px 0;
}

#shop a:hover {
text-decoration: underline;
}