/* 
CSS-Design der Website http://www.gartennetz-bw.de bzw. http://www.gartenroute-bw.de
Autor: Holger Strunk (http://www.strunkdesign.de)
*/


/* Grundelemente */

html {
  font-family: Sans-Serif;
  height: 101%;
  font-size: 10pt;
  color: black;
  background-color: #c2d3df;
  background-image: url(../Ressourcen/Grafik/Farbverlauf.png);
  background-repeat: repeat-x;
}
body {
  margin-top: 0px;
  padding: 0px;
}
img {
  border: none;
}
input, textarea {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 10pt;
  color: black;
  background-color: #eee;
  width: 100%;
  padding: 3px;
  border: 1px solid gray;
}


/* Textelemente */

h1,h2,h3,h4,h5{
  color: black;
  margin-bottom: 5px;
}
h1{
  font-size: 16pt;
}
h2{
  font-size: 12pt;
  margin-top: 25px;
}
h3{
  font-size: 11pt;
  margin-top: 25px;
}
a:link {
  color: black;
  background-color: inherit;
  text-decoration: none;
}
a:visited {
  color: black;
  background-color: inherit;
  text-decoration: none;
}
a:focus {
  color: black;
  background-color: inherit;
  text-decoration: none;
}
a:hover {
  color: black;
  background-color: inherit;
  text-decoration: underline;
}
a:active {
  color: black;
  background-color: inherit;
  text-decoration: none;
}


/* Haupt-Layout */

#Hauptrahmen{
  position: relative;
  margin-top: 0px;
  padding-top: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 900px;
  min-height: 600px;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Banner.png);
  background-repeat: no-repeat;
}
#Banner{
  position: absolute;
  top: 0px;
  left: 20px;
  margin: 0px;
  width: 860px;
  height: 120px;
}
#Bannerbild {
  position: absolute;
  top: 20px;
  background-image: url(../Ressourcen/Bilder/Banner-Hintergrund_0.jpg);
  background-repeat: no-repeat;
  width: 860px;
  height: 120px;
}
#BannerOverlay {
  position: absolute;
  top: 20px;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Banner_Overlay.png);
  background-repeat: no-repeat;
  width: 860px;
  height: 120px;
}
#Bannerlogos {
  position: absolute;
}
#Bannerlogo_GA {
  position: absolute;
  top: 32px;
  margin-left: 10px;
}
#Bannerlogo_TMC {
  position: absolute;
  top: 62px;
  margin-left: 785px;
}
#Bannerschrift {
  position: absolute;
  top: 55px;
  margin-left: 180px;
}
#Inhaltsrahmen{
  position: absolute;
  top: 140px;
  left: 0px;
  width: 900px;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Inhalt.png);
  background-repeat: repeat-y;
}
#Fuss{
  clear: both;
  position: relative;
  top: 16px;
  width: 900px;
  height: 16px;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Fuss.png);
  background-repeat: no-repeat;
}
#Hinweis {
  position: absolute;
  width: 800px;
  height: 28px;
  left: 50px;
  z-index: -1;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Hinweise.png);
  background-repeat: no-repeat;
  padding: 8px;
  font-size: 8pt;
  text-align: center;
  color: #333;
}
#Sponsoren {
  position: absolute;
  top: 140px;
  margin-left: 635px;
  background-image: url(../Ressourcen/Grafik/Hintergrund-Sponsoren.png);
  background-repeat: no-repeat;
  width: 290px;
  height: 400px;
  cursor: pointer;
  padding-top: 25px;
  padding-left: 70px;
}
#Sponsorenhinweis {
  position: relative;
  width: 160px;
  font-size: 9pt;
}
#Navigationsrahmen{
  position: absolute;
  left: 20px;
  width: 200px;
}
#Inhalt{
  position: relative;
  left: 200px;
  width: 670px;
  min-height: 700px;
}
.button {
  height: 23px;
  margin: 0px;
  margin-top: 10px;
  margin-bottom: 10px;
  background: url(../Ressourcen/Grafik/Button_rechts.png) right no-repeat;
  width: auto;
  float: left;
  cursor: pointer !important;
}
.button input {
  height: 23px;
  background: url(../Ressourcen/Grafik/Button_links.png) left  no-repeat;
  border: none;
  overflow: visible;
  display: inline;
  margin: 0px;
  padding: 0px 13px 2px 13px;
  font-size: 11px;
  cursor: pointer !important;
}
.button_gruen {
  height: 23px;
  margin: 0px;
  margin-top: 10px;
  margin-bottom: 10px;
  background: url(../Ressourcen/Grafik/Button-gruen_rechts.png) right no-repeat;
  width: auto;
  float: left;
  cursor: pointer !important;
}
.button_gruen input {
  height: 23px;
  background: url(../Ressourcen/Grafik/Button-gruen_links.png) left  no-repeat;
  border: none;
  overflow: visible;
  display: inline;
  margin: 0px;
  padding: 0px 13px 2px 13px;
  font-size: 11px;
  cursor: pointer !important;
}
.button_rot {
  height: 23px;
  margin: 0px;
  margin-top: 10px;
  margin-bottom: 10px;
  background: url(../Ressourcen/Grafik/Button-rot_rechts.png) right no-repeat;
  width: auto;
  float: left;
  cursor: pointer !important;
}
.button_rot input {
  height: 23px;
  background: url(../Ressourcen/Grafik/Button-rot_links.png) left  no-repeat;
  border: none;
  overflow: visible;
  display: inline;
  margin: 0px;
  padding: 0px 13px 2px 13px;
  font-size: 11px;
  cursor: pointer !important;
}
.Navigation {
  position: absolute;
  height: 60px;
  width: 175px;
  left: -30px;
  padding: 14px 0px 0px 40px;
  cursor: pointer;
}
#Kategorie_0 {
  background-image: url(../Ressourcen/Grafik/Kategorie_0.png);
  background-repeat: no-repeat;
  top: 0px;
  left: -60px;
  padding-top: 22px;
}
#Kategorie_1 {
  background-image: url(../Ressourcen/Grafik/Kategorie_1.png);
  background-repeat: no-repeat;
  top: 60px;
}
#Kategorie_2 {
  background-image: url(../Ressourcen/Grafik/Kategorie_2.png);
  background-repeat: no-repeat;
  top: 120px;
  padding-top: 22px;
}
#Kategorie_3 {
  background-image: url(../Ressourcen/Grafik/Kategorie_3.png);
  background-repeat: no-repeat;
  top: 180px;
}
#Kategorie_4 {
  background-image: url(../Ressourcen/Grafik/Kategorie_4.png);
  background-repeat: no-repeat;
  top: 240px;
}
#Kategorie_5 {
  background-image: url(../Ressourcen/Grafik/Kategorie_5.png);
  background-repeat: no-repeat;
  top: 300px;
  padding-top: 22px;
}
#Kategorie_6 {
  background-image: url(../Ressourcen/Grafik/Kategorie_6.png);
  background-repeat: no-repeat;
  top: 420px;
  padding-top: 22px;
}
#Kategorie_7 {
  background-image: url(../Ressourcen/Grafik/Kategorie_7.png);
  background-repeat: no-repeat;
  top: 480px;
  padding-top: 22px;
}
#Broschuere {
  background-image: url(../Ressourcen/Grafik/Kategorie_0.png);
  background-repeat: no-repeat;
  top: 560px;
}
#Kategorie_8 {
  background-image: url(../Ressourcen/Grafik/Kategorie_0.png);
  background-repeat: no-repeat;
  top: 680px;
}
#Kategorie_9 {
  background-image: url(../Ressourcen/Grafik/Kategorie_6.png);
  background-repeat: no-repeat;
  top: 360px;
}
#Veranstaltungen {
  background-image: url(../Ressourcen/Grafik/Kategorie_0.png);
  background-repeat: no-repeat;
  top: 620px;
}
#KategorieOverlay {
  position: absolute;
  left: 95px;
  top: 0px;
  height: 740px;
  width: 400px;
  background-image: url(../Ressourcen/Grafik/Kategorie-Overlay.png);
  background-repeat: no-repeat;
}
.KategorieInhalte {
  display: none;
}
#aktualisierteTabelle tbody tr {
  cursor: pointer;
}
#Garten {
  display: none;
}
.Garten_Datentabelle{
  border: 1px solid gray;
  border-top: 0px;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.Garten_Datentabelle tr {
  vertical-align: top;
}
.Gartenbezeichner {
  font-size: 8pt;
  color: gray;
  padding-bottom: 2px;
}
.Garten_Datenfeld {
  padding: 5px;
}
#Garten_Datenfeld_Stadt {
  border-right: 1px solid gray;
}
#Garten_Beschreibung {
  padding-top: 5px;
  clear: both;
  margin-bottom: 10px;
}
#Garten_Bilder {
  margin-top: 15px;
}
.Gartenbild {
  float: left;
  margin: 0px 10px 5px 0px;
}
#Garten_Website {
  margin-top: 10px;
  margin-bottom: 10px;
}
#Stadtfilter {
  margin: 10px 0px 15px 0px;
}
#Stadtfilter_Bezeichner {
  display: inline;
}
.mehr {
  cursor: pointer;
  display: inline;
  color: gray;
  font-size: 80%;
}
.weniger {
  cursor: pointer;
  display: none;
  color: gray;
  font-size: 80%;
}
.unsichtbar {
	display: none !important;
}
.versteckt {
  display: none;
  margin-top: 12px;
}
#Zufallsbilder {
	position: absolute;
	right: -170px;
	background-color: white;
	padding: 0 16px;
}
#Zufallsbilder img {
	display: block;
	margin: 18px auto;
	width: 120px;
	box-shadow: 0 0 8px rgba(0, 0, 0, .3);
}

/* Einzelelemente */

#map_canvas { 
  height: 100%
}
#GoogleKarte {
  position: relative;
  top: 0px;
  left: 0px;
  width: 670px; 
  height: 500px;
  margin-bottom: 5px;
}
#Impressum {
  border-top: 1px solid gray;
  margin-top: 60px;
}
#Kleingedrucktes {
  position: relative;
  color: #333;
  font-size: 8pt;
  margin-top: 20px;
  border-top: 1px solid gray;
  padding-top: 5px;
}
#Sortierhinweis {
  position: relative;
  font-size: 8pt;
  color: gray;
  margin: 0px 0px -10px 0px;
  width: 100%;
  height: 14px;
}
#Sortierhinweis_Text {
  position: absolute;
  top: 0px;
  right: 12px;
}
#Sortierhinweis_Zeichen {
  position: absolute;
  top: 0px;
  left: 660px;
}
#Sortierhinweis_Overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: white;
}
#Sponsor_Synphon img {
	width: 170px;
	height: auto;
	margin: 10px 0;
}
#Garten_Navigationshinweis {
  color: gray;
  cursor: pointer;
  position: relative;
  font-size: 8pt;
  top: -57px;
}
#Impressum_GA {
}
#Impressum_TMC {
}
#Impressum_Strunk {
  /**/
}
#W3C {
  display: none;
  margin-top: 20px;
}



/* Tablesorter */

table.tablesorter {
  margin:10px 0pt 15px;
  width: 100%;
  text-align: left;
  color: inherit;
  background-color: #ddd;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
  color: inherit;
  background-color: #e3e3e3;
  border: 1px solid #FFF;
  padding: 4px;
  padding-right: 20px;
}
table.tablesorter thead tr .header {
  /* background-image: url(../Ressourcen/Grafik/Tabellensortierung.gif);*/
  background-repeat: no-repeat;
  background-position: center right;
  cursor: pointer;
}
table.tablesorter tbody td {
  color: black;
  padding: 4px;
  background-color: #FFF;
  vertical-align: top;
}
table.tablesorter tbody tr.odd td {
  color: inherit;
  background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
  background-image: url(../Ressourcen/Grafik/Tabellensortierung-aufsteigend.gif);
}
table.tablesorter thead tr .headerSortDown {
  background-image: url(../Ressourcen/Grafik/Tabellensortierung-absteigend.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
  color: inherit;
  background-color: #d2e4d1;
}



/* temporäre Elemente */

#FontSwitch {
  position: absolute;
  color: orange;
  background-color: gray;
  padding: 2px 10px 2px 10px;
  cursor: pointer;
}