/* CSS Document www.bokamo.de */
/* 
Alle Container sind mit float ausgerichtet
Vorsicht mit absoluter Positionierung und
fester Höhenangabe. Immer vorher testen. 
*/
/* by www.pkdesign.de */


/***********************************************/
/* Allgemeine Einstellungen der Seite          */
/***********************************************/
/* Seitendefinition */	
html, body { 
	margin: 0; 
	padding: 0; 
	height: 100%;
	background-color: black;
	background-image:  url(../images/hg_body.jpg);
	background-position: top;
	background-repeat: repeat-x;  
} 

/* Standardlinks */
a:link {color: #cd5c5c; text-decoration: none; font-size: 11px; font-weight: bold; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
a:visited{color: #cd5c5c; text-decoration: none; font-size: 11px; font-weight: bold; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}
a:hover {color: #708090; text-decoration: none; font-size: 11px; font-weight: bold; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}

/* Link im Footer */
a.foot:link {color: #b28452; text-decoration: none; font-size: 11px; font-weight: normal;}
a.foot:visited{color: #b28452; text-decoration: none; font-size: 11px; font-weight: normal;}
a.foot:hover {color: #f8ca96; text-decoration: none; font-size: 11px; font-weight: normal;}

/* Link normal Grau (Seite Badmitglieder) */
a.norm:link {color: #696969; text-decoration: none; font-size: 11px; font-weight: bold;}
a.norm:visited{color: #696969; text-decoration: none; font-size: 11px; font-weight: bold;}
a.norm:hover {color: #8b0000; text-decoration: none; font-size: 11px; font-weight: bold;}

/* Bilder/Grafiken */
img{
	border: 0px;
}

/* Überschrift */
h1{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 18px;	
	color: #778899;
}

/* Überschrift */
h2{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;	
	color: #778899;
}

/* Überschrift */
h3{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;	
	color: #778899;
}

/* Überschrift spez. fuer Bandmitglieder im Container oben links */
h4{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #313a42;
	margin: 0 0 8px 0;
}

/* Standardschrift und Zeilendurchschuss allgemein für Container */
div{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: black;
	line-height: 16px;
}


/***********************************************/
/* Einstellung der Container auf der Seite     */
/***********************************************/
/* Übercontainer für Kopf, Inhalt und Footer */
#container-page { 
	width: 100%; 
	background: transparent; 
	position: relative; 
	min-height: 100%; 
	height: auto !important; 
	height: 100%;
	margin: 0px;
	padding: 0px;
} 

/* Container aussen mit Inhalt */
#container-content { 
	padding-bottom: 230px; /* Höhe des Fusskontainer */ 
} 

/* Container für Kopf */
#container-kopf {
	width: 980px;
	height: 190px;
	margin: auto;
	background-color: transparent;
	background-image: url(../images/hg_kopf.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

/* Oberes Menü, Impressum, Kontakt, Home */
#container-menue-oben {
	float: right;
	padding-right: 140px;
	margin-top: 0px;
	height: 35px;
	width: 90%;
	text-align: right;
}

/* Button News-Aktuelles */
#butt-news {
	float: left;
	margin-left: 140px;
	margin-top: 60px;
}

/* Menü auf der Startseite 
   NUR für STARTSEITE */
#container-menue-haupt-start {
	float: right;
	display: block;
	width: 215px;
	height: 150px;
	margin-right: 70px;
	margin-top: 70px;	
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #f5f5f5;
}

/* Menü auf Folgeseiten */
#hauptmenue {
	display: block;
	width: 900px;
	height: 50px;
}

/* Container für Inhalt mit Hintergrund
   NUR für STARTSEITE und NEWSLETTER */
#container-inhalt-start {
	width: 980px;
	height: 600px;
	padding: 0px 0px 30px 0px;
	margin: auto;
	background-color: black;
	background-image: url(../images/hg_inhalt_start.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

/* Container für Inhalt mit Hintergrund */
#container-inhalt {
	width: 980px;
	padding: 0px 0px 30px 0px;
	margin: auto;
	background-color: black;
	background-image: url(../images/hg_inhalt.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

/* Container für Inhalt innen */
#container-inhalt-innen {
	width: 900px;
	padding: 0px;
	margin: auto;
	background-color: transparent;
}

/* Container rechts für Seitenname */
#container-seitenname {
	float: right;
	width: 405px;
}

/* Container links */
#container-klein-left {
	float: left;
	height: 253px;
	width: 401px;
	margin: 0px 0px 0px 30px;
	background-image: url(../images/hg_klein_blank.jpg);
	background-repeat: no-repeat;
	background-position: top;
}

/* Container links innen - Textcontainer */
#container-klein-left-inner {
	padding: 30px 30px 30px 30px;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;
}

/* Container rechts - Bild */
#container-klein-right {
	float: left;
	height: 253px;
	width: 401px;
	margin: 0px 0px 0px 30px;
}

/* Container mit Text z.B. impressum.shtml */
#container-text {
	width: 780px;
	margin: auto;
	min-height: 350px;
	background-color: #dcdcdc;
	background-image: url(../images/hg_grau.jpg);
	background-repeat: repeat;
	border-top: 9px solid #fcfcfc;
	border-right: 9px solid #fcfcfc;
	border-bottom: 9px solid #e4e4e4;
	border-left: 9px solid #e4e4e4;
	padding: 20px 15px 15px 20px;
	font-size: 13px;
	font-family: "Courier New", Courier, monospace;
}

/* Container Vorbestellung Zeit
	   	NUR für STARTSEITE */
#container-vorbestell {
	float: right;
	width: 390px;
	height: 320px;
	margin: 66px 52px 0px 0px;
	background-image: url(../images/hg_bestell_zeit.png);
	background-position: top;
	background-repeat: no-repeat;	
}
/* Tabelle mit Formular */
#tab-vorbestell {
	margin: 110px 0px 0px 60px;
}
/* Formularfelder */
#tab-vorbestell input {
	padding: 0px 0px 0px 10px;
	border-top: 0px;
	border-right: 0px;
	border-bottom: 1px solid #8b4513;
	border-left: 0px;
	background-color: transparent;
}
/* Titelfelder Formular name, strasse etc. */
.tdk {
	text-align: right;
	font-size: 9px;
	font-weight: bold;
}
/* Sendebutton */
.formbutton {
	border-top: 0px;
	border-right: 0px;
	border-bottom: 3px solid #8b4513;
	border-left: 0px;
	font-weight: bold;
	color: #8b4513;
}

/* Container mit Newsletter
	   NUR für STARTSEITE */
#container-newsletter {
	float: left; 
	width: 326px;
	height: 289px;
	margin: 70px 0px 0px 80px;
	padding: 70px 0px 0px 0px;
	background-image: url(../images/hg_newsletter.png);
	background-position: top;
	background-repeat: no-repeat;
}

/* Tabelle Newsletter 
	   NUR für STARTSEITE */
#container-newsletter table {
	width: 75%;
}

/* Tabelle Newsletter 
	   NUR für STARTSEITE */
#container-newsletter td {
	font-family: "MS Sans Serif", Geneva, sans-serif;
	font-size: 12px;
	padding: 3px;
	text-align: center;
}

/* Tabelle Newsletter 
	   NUR für STARTSEITE */
#container-newsletter input {
	border-top: 1px solid #b47e18;
	border-right: 2px solid #b47e18;
	border-bottom: 2px solid #b47e18;
	border-left: 1px solid #b47e18;
	padding: 3px;
	background-image: url(../images/hg_input_newsletter.jpg);
	background-repeat: repeat-x;
	background-position: top left;
	
}

/* Übercontainer für Footer */
#container-footer-breit { 
	width: 100%; 
	position: absolute; 
	bottom: 0 !important; 
	bottom: -1px; 
	height: 230px; /* Eine Höhe mit padding-bottom: in #container-content */
	background-color: transparent;
	background-image: url(../images/hg_footer_breit.jpg);
	background-position: top;
	background-repeat: repeat-x;
} 

/* Zentrierter Footer */
#container-footer {
	width: 900px;
	height: 230px; /* Eine Höhe mit padding-bottom: in #container-content */
	margin: auto;
	background-color: black;
	background-image: url(../images/hg_footer.jpg);
	background-position: bottom;
	background-repeat: no-repeat;
} 


/***********************************************/
/* Gästebuch                                   */
/***********************************************/
/* Container Eure Meinung ist uns wichtig */
#gast-meinung {
	float: left;
	height: 253px;
	width: 401px;
	margin: 0px 0px 0px 30px;
	background-image: url(../images/hg_gast_meinung.jpg);
	background-repeat: no-repeat;
	background-position: top;
}

/* Container Eure Meinung ist uns wichtig - Textcontainer */
#gast-meinung-inner {
	padding: 55px 30px 30px 30px;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;
}

/* Gästebucheinträge Navigation | meinungem.tpl */
#gast-navleiste {
	width: 80%;
	margin: auto;
	padding: 2px;
	text-align: center;
	background-image: url(../images/hg_gast_navleiste.jpg);
	background-repeat: repeat;
	background-position: right;
	border: 7px solid #fcfcfc;
}

/* Gästebucheinträge Ansicht Container | meinungem.tpl */
#gast-items {
	width: 80%;
	margin: auto;
	padding: 2px;
	background-image: url(../images/hg_grau.jpg);
	background-repeat: repeat;	
	border: 7px solid #fcfcfc;
}

/* Tabelle Darstellung Gästebucheinträge */
#gast-eintrag-show {
	width: 100%;
	margin-top: 15px;
}

/* Name schrieb am: | meinungsitem.tpl */
.gast-eintrag-kopf {
	font-size: 11px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: black;
}

/* E-mailbutton und Homebutton | meinungsitem.tpl */
.gast-eintrag-kopf-inet {
	width: 13%;
	text-align: right;
	background-image: url(../images/hg_gast_eintrag_kopf_inet.png);
	background-position: right;
	background-repeat: no-repeat;
}

/* Text vom User | meinungsitem.tpl */
.gast-meinung-text {
	background-color: transparent;
	font-size: 13px;
	padding: 8px;
	font-family: "Courier New", Courier, monospace;
	border-bottom: 1px dotted #696969 ;
}

/* Container  | meinungsform.tpl*/
#container-gastform-ueber {
	margin: auto;
	width: 757px;
	height: 299px;
	background-image: url(../images/hg_gast_form_ueber.png);
}

/* Tabelle für Formular  | meinungsform.tpl*/
#gastform-tab {
margin: auto;
border: 7px solid #eaeaea;
background-color: #dcdcdc;
background-image: url(../images/hg_grau_gastform.jpg);
background-position: top left;
background-repeat: no-repeat;
}

/* Tabellenzelle für Formularfelder  | meinungsform.tpl*/
.gastform-input {
	width: 345px;
	text-align: right;
}

/* Formularfelder  | meinungsform.tpl*/
.gastform-input input, textarea {
	width: 340px;
	background-color: #e4e4e4;
	border: 1px solid #848484;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;
	background-image: url(../images/hg_input.jpg);
	background-position: top left;
	background-repeat: no-repeat;	
}

/* Text neben Formularfelder  | meinungsform.tpl*/
.gastform-text {
	width: 154px;
	text-align: left;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
}

/* Button Senden und Löschen  | meinungsform.tpl*/
.gastform-input-senden input {
	width: 340px;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;	
}

/* Fehlerausgabe bei falschem Code  | meinungsform.tpl*/
.errorcode {
	font-size: 11px;
	font-family: "Courier New", Courier, monospace;	
	color: #b22222		
}


/***********************************************/
/* Sonstige                                    */
/***********************************************/
/* Fehlermeldung Newsletter */
.errorline {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #f5f5f5;
	background-color: #a52a2a;
}

/* Danke Newsletter */
.dankeline {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #f5f5f5;
	font-weight: bold;
}


/***********************************************/
/* Bandmitglieder                              */
/***********************************************/
/* Fusscontainer mit Links der Badmitglieder */
#bandmitglieder {
	border-top: 1px dotted #000;
} 

/***********************************************/
/* Album-Seite | im Moment für ZEIT            */
/* Andere/Neue seiten evtl. anpassen           */
/***********************************************/
/* Linker Container mit den Titeln */
#container-album-left {
	float: left;
	width: 430px;
	height: 625px;
	margin: 10px 0px 0px 10px;
	background-image: url(../images/hg_album_left.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

/* Rechter Container mit Album */
#container-album-right {
	float: right;
	width: 430px;
	height: 625px;
	margin: 10px 10px 0px 0px;
	background-image: url(../images/hg_album_right.jpg);
	background-position: top;
	background-repeat: no-repeat;
}

/* Button Hörproben */
#butt-hoerproben {
	margin: 35px 0px 0px 150px;	
}

/* Button Album kaufen */
#album-kaufen-butt {
	margin: 50px 0px 0px 65px;	
}

/* Tabelle auf Albumseite links mit Warenkorb,Text und Titel */
#album-titel {
	float: left;
	width: 80%;
	height: 300px;
	margin: 70px 0px 0px 30px;
}

#album-titel td {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: black;
	font-size: 11px;
	text-align: right;
	font-weight: bold;
	padding-right: 10px;
	line-height: 12px;
}
/* Erklaerung unter den Titeln */
#legende {
	float: right;
	margin-top: 70px;
	margin-right: 55px;	
}