
/*
 =========================== Projekt =================================
 @CHARSET     "ISO-8859-1";
 @WEBSITE:    http://www.voegel.ch
 @VERSION:    1 (xhtml&php5)
 @DATE:     08.12.2008
 @AUTOR:    Michael Kistler (KZAdesign)

 Verzeichnis: /graphs/ fuer allgemeine Grafiken
 Verzeichnis: /icons/ fuer allgemeine Icons
 Verzeichnis:   /de/icons/ fuer buttons auf deutsch

Standard Font: Verdana



 1. #b4b1b1 lightgray
 2. #514e4e dark gray
 3. #FFDC00 yellow
 4. #cccccc gray
 5.
 6.
 7. #
 8. #
 9. black
10. white
*/

/*
* Variable declaration
*/

/*
 =========== Gemeinsame Formate ===================== 
 */
html,body,div,p,table,td,h1,h2,h3,span,ul,ol,li,a,textarea,form,select,input,fieldset,legend,label {
  font-family: Verdana, Helvetica, "Sans-Serif";
  color:#000000;
  text-align:left;
  font-size:12px;
  line-height:14px;
  border:0;
} 

/*
=========== Globale Tag Selectoren ===============
*/
body 
  {
  background-color:transparent;
  margin:0;
  padding:0;
  color:#000000;
  text-align:center;
  /*background-image:url(/graphs/);*/
  background-image:url(/graphs/bg_voegel.jpg);
  /*background-image:url(<img  src="/phpThumb/phpThumb.php?id=1&amp;kat=bground&amp;w=700" />);*/
  background-position: center top;
  background-repeat: repeat;
  }

img 
  {
  border:0;
  vertical-align:text-bottom;
  }

hr 
  {
  height:1px;
  color:#000000;
  border:;
  border-style:solid;
  border-width:1px 0px 0px 0px;
  width:100%;
  }
  
q   {font-style:italic;}

p   {text-align:left;}

p.justify 
  {
  text-align:justify;
  padding-left:2px;
  padding-right:2px;
  }
  
ul  {
  padding:0;
  margin:0;
  }

li  {
  list-style:none;
  margin:0;
  padding-left:2px;
  }


fieldset 
  {
  color:#000000;
  background-color:#ffffff;
  border-width:1px ;
  border-style:solid;
  border-color:#cccccc;
  padding:1em;
  margin:10px 5px 0 5px;
  }

legend
  {
  color:#000000;
  background-color:#ffffff;
  font-size:1em;
  font-weight:bold;
  letter-spacing:2px;
  padding:0 5px;
  margin:0;
  border:0;
  }
input
  {
    font-family: "Courir New",Veranda, Helvetica, sans-serif;
  }
/*
*
* Links
*
*/
a, a:link, a:visited, a:active, a:hover 
  {
  font-size:12px;
  color:; 
  background-color:transparent;
  text-decoration:none;
  font-weight:bold;
  }



/*
*
* Titel
*
*/

h1  
  {
  color:#cccccc;
  font-size:20px;
  font-weight:bold;
  text-align:left;
  padding:0;
  }
  
  
h2  
  {
  color:#c10b0b;
  padding:10px 0 0 0;
  margin:0;
  height:20px;
  line-height:20px;
  font-size:16px;
  font-weight:bold;
  text-align:left;
  background-color: transparent;
  border-color: #c10b0b;
  border-style: solid;
  border-width: 0 0 0px 0;
  }
  
h3  
  {
  color:#c10b0b;
  padding: 0;
  font-size:14px;
  font-weight:bold;
  text-align:left;
  letter-spacing:+2px;
  }


/*
*
*Formulare
*
*/

/*
*
*spezielle Felder
*
*/


/*
*
* Tabellen
*/

table 
  {
  padding: 0px;
  margin: 5px;
  width:auto;
  
  }
  
th 
  {
  color: #ffffff;
  background-color: #000000;
  font-weight:bold;
  text-align:center;
  padding:1px;
  margin:0;

  }
  
td 
  {
  border-bottom: 1px solid ;
  font-weight: normal;
  text-align: left;
  padding: 1px 3px 1px 3px;
}


thead td  
  {
  color:#000000;
  padding: 0;
  font-size:14px;
  font-weight:bold;
  text-align:left;	
  letter-spacing:+2px;
  }


/* 
* 
* Container 
*
*/

#container
  {
  position:relative;
  top:0;
  left:0;
  color:#000000;
  background-color:;
  text-align:left;
  margin:0 auto;
  padding:0;
  width:900px;
  height:100%;
  border:2px solid #ffffff;
  }
  
#head 
  {
  margin:0;
  width:900px;
  min-height:180px;
  background-color: ;
  text-align:left;
	border-bottom: 1px solid #ffffff;
  }
  
#header
  {
  margin:0;
  width:900px;
  height:20px;
  line-height:20px;
  color: #b4b1b1;
  background-color: transparent;
  text-align:center;
  background-image: url(/graphs/bgh120.png);
  background-repeat: repeat-x;
	border-bottom: 1px solid #ffffff;
  }


* html #head { left:1px; }


#logo
  {
	position:absolute;
	top: 21px;
	left: 715px;
  width:200px;
  height:160px;
	text-align:center;
  background-color:#transparent;
	border-left: 2px solid white;
  }
#logo img
	{
	margin: 10px;
	}

 * html #content {
  z-index:-100;
  } 


/* Korrektur fuer den IE */
  * html #content {
  z-index:-100;
  } 

#foot
{
	border-top:2px solid #ffffff;
	clear:both;
	background-image: url(/graphs/bgh116.png);
	color: gray;
	font-size: 10px;
	padding:0 10px;
	text-align:center;
}


  
/*
* 
* Head Styles 
*
*/
  


/*
* 
* Footer Styles 
*
*/


/* 
*
* Level 1 
*
*/

  ul#level1
    {
    margin: 10px 0 0 0; 
    padding: 0;
    text-align: center;
    width:717px;
    height:40px;
  border-bottom: 1px solid #b4b1b1;
    }

  ul#level1 li 
    {
    list-style: none;
    float: left;  /* ohne width - nach CSS 2.1 erlaubt */
    margin: 0 5px; 
    padding: 0 10px;
position: relative;
    height:40px;
    line-height:23px;
  text-align:center;
  background-color: transparent;
	background-image: url(/graphs/arrowup.png);
	background-position: center bottom;
	background-repeat: repeat;

    }
    
    /* Korrektur fuer den IE */
  * html ul#level1 li 
    { 
    margin-bottom: -4px;
    }

#level1 a, #level1 a:active, #level1 a:link, #level1 a:visited, #level1 a:hover 
{
	font-size:14px;
	display:block;
	color: black;
	height:40px;
	line-height:23px;
}


#level1 a:hover
{
	display:block;
	color: #272727;
	background-image: url(/graphs/bg_a_level1.png);
  background-position: right bottom;
  background-repeat: no-repeat;
	height:35px;
	ine-height:23px;
}

 ul#level1 li span 
{
	display:block;
	color:  #272727;
	font-weight:bold;
	background-image: url(/graphs/bg_span_level1.png);
	background-position: right bottom;
	background-repeat: no-repeat;
	height:35px;
	line-height:23px;
	font-size:16px;
}
/* 
*
*Level 2 
*
*/


ul#level2 
  {
  color:#b4b1b1;
  /*background-color:#272727;*/
  width:700px;
min-height:100px;
  line-height:20px;
  }

ul#level2 li
{
  float:left;
  color:#fff000;
  margin:2px 5px;
width:200px;
height:20px;

}
#level2 a, #level2 a:active, #level2 a:link, #level2 a:visited, #level2 a:hover
  {
display:block;
  color:yellow;
  margin:0;
  font-size:12px;
  font-weight:normal;
padding:0 0 0 0;
  background-color:transparent;
  height:20px;
  width:200px;
  line-height:20px;
 background-image: url(/graphs/bg_a_level2.png);
background-repeat: no-repeat;
background-position: top center;
text-align:center;
  }

#level2 a:hover 
  {
font-weight:bold;
  }
#level2 span
{
	color: gray;
	display:block;
	color:yellow;
	margin:0;
	font-size:12px;
	font-weight:normal;
	background-color:transparent;
	height:20px;
	line-height:20px;
	text-align:center;
	width:200px;
	padding:0;
	margin:0;
	background-image: url(/graphs/bg_span_level2.png);
	background-repeat: no-repeat;
	background-position: top center;
}


/*
*
* Content Styles
*
*/

#content
  {
	float:left;
  margin: 0;
  padding: 1px;
  width:712px;
	border: 1px solid white;
	background-color: white;
  }

#content h1{
  color:#cccccc;
  font-size:12px;
  font-weight:bold;
  text-align:left;
  min-height:20px;
  line-height:20px;
  margin:0;
  padding: 2px 5px;
  background-image: url(/graphs/bgh120.png);
	border: 1px solid black;
  }
  

.clear
  {
  clear:both;
  }


br.clear
  {
  clear:both;
  }

/*
*
* Infos Style
*
*/

#infos 
  {
	margin:0 0 0 720px;
  width:176px;
  background-color: #272727;
	color: #fff;
	padding: 0;
	border: 2px solid white;
  }

#infos h1
{
	margin:10px 0 5px 0;
	padding: 2px;
line-height:18px;
}

#infos h2
{
	color: yellow;
	margin:0;
	padding: 2px;
	font-size:14px;
	line-height:14px;
}

#infos p
{
	color: white;
	padding:2px 5px;
}

#infos a
{
color: orange;
}
img.qi_aktuelles
{
	margin-left:5px;
}

ul.quickinfo li
{
display:block;
	padding:0 5px;
	color: #fff;

}
h2.qi_latest_galerie
{
display:block;
float:none;
height:30px;

}

ul.qi_latest_galerie
{
min-height: 52px;
margin: 10px 0;
float:none;
}
/*
*
* Home
*
*/


div#home_popup
{
	position:absolute;
	left:15px;
top: 220px;
	background-color: white;
	width:650px;
	min-height: 400px;
border:2px solid gray;
}

div#home_popup img
{
float:right;
margin:10px;
}

img.home

{
float: right;
margin:5px;
}


p.home_details
{
padding: 10px;
line-height: 16px;
}


/*
*
* Galerien
*
*/

li.qi_galerie img
{
	float:left;
	margin: 1px;
	border: 1px solid white;
	width:50px;
	height:50px;
	display:block;
}

fieldset#pic img 
{
	border: none;
	margin:10px;
}


fieldset#pic
{
 	border:none;
	padding:0;
	background-image: url(/graphs/bg_gb.png);
	background-repeat: repeat-x;
	background-position: left bottom;
}

fieldset#pic table
{
	margin: 0 auto;
	width. 400px;
}

fieldset#pic td
{
	border: none;
}

fieldset#pic input
{
	margin:0;
	padding:0;
	height:20px;
}

/*
*
*Termine
*
*/

img.termine
{
	border: 1px solid gray;
	float:right;
	margin: 10px 50px 10px 10px;
}

/*
*
* Guggen Infos
*
*/
/*
* Geschichte
*/

p.geschichte, h2.geschichte
{
	padding-left:10px;
}
/*
* Mitglieder
*/
li.qi_mitglieder a
{
	color: orange;
	font-weight: normal;
	font-size:12px;
}

li.qi_mitglieder a:hover
{
	text-decoration: underline;
}

p.mitglieder_all, h2.mitglieder_all
{
	padding-left:10px;
}


ul.mitglieder_liste
{
	width:700px;
	margin: 0 auto;
}
ul.mitglieder_liste li
	{
	float: left;
	width:100px;
	height:150px;
	border: 0px solid gray;
	background-image: url(/graphs/bg_mitglieder.png);
	background-position: bottom center;
	background-repeat: repeat-x;
	margin: 2px;
	text-align:center;
}
ul.mitglieder_liste img
{
	margin: 2px auto;
}

div#mitglieder_popup
{
	position:absolute;
	background-color: white;
	width:700px;
	height: 400px;
}

div#mitglieder_popup ul
{
	margin: 10px auto;
	width:300px;
}
div#mitglieder_popup h2
{
	margin: 10px auto;
	width:300px;
}

div#mitglieder_popup img
{
	border: 2px solid gray;
	margin:5px;
}

div#mitglieder_popup a > img
{
	border: 0px solid gray;
	margin:0px;
}

/*
* Sponsoren
*/
p.sponsoren_all, h2.sponsoren_all
{
	padding-left:10px;
}
div.sponsoren
{
	min-height:200px;
	width:300px;
	float: left;
	background-image: url(/graphs/bg_sponsoren.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin: 5px 0 5px 30px;
	padding: 5px;
}

/*
* Musik
*/

div.musik
{
	min-height:150px;
	width:190px;
	float: left;
	background-image: url(/graphs/bg_sponsoren.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin: 5px 0 5px 15px;
	padding: 5px;
text-align:center;
}

/*
* Kontakt
*/

fieldset.contact
{
	margin:10px;
}

fieldset.contact input, fieldset.contact textarea
{
	border:1px solid gray;
	margin: 2px 5px;
	float: left;
	height:16px;
	line-height:16px;
	width:200px;
	font-family: "Courier New", Monospace, Arial;
}

fieldset.contact label
{
	width:100px;
	float: left;
	height:16px;
	line-height:16px;
	text-align:right;
	font-weight:bold;
}


fieldset.contact textarea
{
	height: 300px;
	width:400px;
	border:1px solid gray;
}

 fieldset.contact input.btnImg /*fieldset input überschreiben*/
{
	width:44px;
	padding:0;
	height:20px;
	border:none;
}






/*
*
* link
*
*/

div.links
{
	min-height:200px;
	width:300px;
	float: left;
	background-image: url(/graphs/bg_links.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin: 5px 0 5px 30px;
	padding: 5px;
}



/*
*
* Gaestebuch
*
*/

fieldset#gb
{
 border:none;
}

fieldset#gb table
{
	margin: 0 auto;
	width. 400px;
}

fieldset#gb td
{
	border: none;
}

fieldset#gb input
{
	margin:0;
	padding:0;
	height:20px;
}

fieldset#gb div
{
	background-image: url(/graphs/bg_gb.png);
	background-repeat: repeat-x;
	background-position: left bottom;
}
fieldset#gb h2
{
	font-size: 12px;
}
fieldset#gb p 
{
	padding: 2px 5px;
}

p.gb_comment
{
	background-color: white;
	border: 1px solid gray;
	background-image: none;
	font-style: italic;
}

/*
* neuer Eintrag
*/
fieldset.gb input, fieldset.gb textarea
{
	border:1px solid gray;
	margin: 2px 5px;
	float: left;
	height:16px;
	line-height:16px;
	width:200px;
	font-family: "Courier New", Monospace, Arial;
}

fieldset.gb label
{
	width:100px;
	float: left;
	height:16px;
	line-height:16px;
	text-align:right;
	font-weight:bold;
}


fieldset.gb textarea
{
	height: 300px;
	width:400px;
	border:1px solid gray;
}

 fieldset.gb input.btnImg /*fieldset input überschreiben*/
{
width:44px;
padding:0;
height:20px;
border:none;
}





 /*
*
*button Definitionen & icons Definitionen
*
*/

input.btnLong,input.btnMini, input.btnShort, input.btnImg, label.btnImg, input.btnIcon, a.btnImgBorder,a.btnImg, a.btnIcon{
	color: #fff;
	background-color: transparent;
	float: left;
	border-width:0;
  	text-align: left;
	cursor: pointer;
	margin:0;
	padding:0;
	display:block;
}

 input.btnIcon, input.btnImg, input.btnShort, input.btnLong, input.btnMini
 	{
	background-repeat: no-repeat;
	width:20px;
	height:20px;
	line-height:1px;
	font-size: 0.1px;
	margin:0;
	}
	
	input.btnImg
	{
	width:44px;
	height:20px;
	padding-left:52px;
	}
	
	input.btnMini
	{
	padding-left: 52px;
	width:50px;
	height:30px;
	color:#fff;
	margin:0;	
	background-color:transparent;
	}
	
	input.btnShort
	{
	padding-left: 152px;
	width:150px;
	height:30px;
	color:#fff;
	margin:0;
	}
	
	input.btnLong{
	padding:202px;
	width:200px;
	border-width:0;
	color:#fff;
	background-color:transparent;
	margin:0;
	}

a.btnImg, a.btnIcon, a.btnImgBorder{
	font-family:"Courier New",Veranda, Helvetica, sans-serif;
	border-width:1px;
	height:20px;
	padding-left: 20px;
	background-repeat: no-repeat;
	color: #000;
	background-color: #fff;
	font-weight:normal;
}
label.btnImg, label.btnIcon{
	font-family:"Courier New",Veranda, Helvetica, sans-serif;
	width: auto;
	font-weight: normal;
	margin:0 10px 0 0;
	padding-right:10px;
	color: #9c9c9c;
	height:20px;
	line-height:20px;
	border-width: 0;
	background-color: #ffffff;
	cursor: pointer;
}

label.btnShort, label.btnLong{
  font-family:"Courier New",Veranda, Helvetica, sans-serif;
	font-size:12px;
	font-weight: normal;
	margin:0 0 2px 0;
	color: #000;
	line-height:20px;
	background-color: #fff;
	cursor: pointer;
	text-align:left;
	float:left;
	width:auto;
}

input.btnIcon {
	border: 0;
}
a.btnImg, a.btnIcon{
	border: 0;
}

