main {
        background: white;
        border-color: #8a9da8;
        height: 100%;
        width: 100%;
        overflow: hidden;
}

/* Zentrieren von Formularen*/
#links {
width: 50%;
float: left;
}
#rechts {
width: 50%;
float: right;
}
#zentriert {
text-align: center;
}
#rechts2 {
float: right;
}

h2 {
        display: block;
        font-size: 14pt;
        margin-top: 0.67em;
        margin-bottom: 0.2em;
        margin-left: 0;
        margin-right: 0;
        font-weight: bold;
 }

 h3 {
        display: block;
        font-size: 24pt;
        margin-top: 0.67em;
        margin-bottom: 0.67em;
        margin-left: 0;
        margin-right: 0;
        font-weight: bold;
 }

 h4 {
        display: block;
        font-size: 24pt;
        margin-top: 0.67em;
        margin-bottom: 0.67em;
        margin-left: 0;
        margin-right: 0;
        font-weight: normal;
 }

 h5 {
  display: block;
  color: #a94442;
  font-size: 14px;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: normal;
}

h6 {
  display: block;
  color: #005e16;
  font-size: 14px;
  margin-top: 0.0;
  margin-bottom: 0.0;
  margin-left: 0;
  margin-right: 0;
  font-weight: normal;
}

h1 {
  display: block;
  color: #000;
  font-size: 14px;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: normal;
}

table,
th,
td{
        border-collapse: collapse;
        padding: 0.3em 0.3em 0.3em 0.3em;
        font-size: 24pt;
}

table {
        width: 100%;
        min-width: 800px;
        margin-left: auto; margin-right: auto;
}
/* Überschriften der Tabellenspalten */
th,
caption {
        background-color: #666;
        color: #fff;
        border: 1px solid #000;
        text-align: left;
        ;
}

td {
        background-image: linear-gradient(#f9f9f9, #e3e3e3);
        border-left: 1px solid #666;
        border-right: 1px solid #666;
}

tfoot {
        border-bottom: 1px solid #666;
}
/* Überschrift */
caption {
        font-size: 1.5em;
        border-radius: 1em 1em 0 0;
        padding: 1.4em 0.5em 1.4em 0.5em; /*oben, rechts, unten, links*/
}
/* 3. und 4. Spalte rechtsb�ndig */

td:nth-of-type(3),
td:nth-of-type(4),
td:nth-of-type(5),
td:nth-of-type(6),
td:nth-of-type(7) {
        text-align: center;
}

/* Einfache Tabelle unsichtbar*/
#table_hidden {
  width: 100%;
  min-width: 800px;
  text-align: left;
  border: none; /* Äußerer Rahmen */
}
#table_hidden td {
  border: none;/* Hat keine Auswirkungen bei Tabledata */
  padding: 0px;
  border-left: 0px;
  border-right: 0px;
  padding-left: 0;
  padding-top: 0.3em;
  padding-bottom: 0.3em;
  font-size: 14pt;
  text-align: left;/* Ausrichtung innerhalb der Zellen */
  background-image: none;
  vertical-align:middle;
}
#table_hidden tr {
  border: none;/* Linien zwischen den Tabellenzeilen */
  padding: 0px;
  border-left: 0px;
  border-right: 0px;
  padding: 0px 0px 0px 0px;
  font-size: 14pt;
  text-align: left;/* Hat keine AUswirkungen bei Tablerow */
}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/* Einfache Tabelle sichtbar*/
#table_simple {
  width: 100%;
  min-width: 300px;
  text-align: left;
  border: 1px solid #000; /* Äußerer Rahmen */
}
#table_simple td {
  border: 1px solid #000;/* Spaltenlinien*/
  padding: 0.3em 0.3em 0.3em 0.3em;
  font-size: 14pt;
  text-align: left;/* Ausrichtung innerhalb der Zellen */
  vertical-align:middle;
}
#table_simple tr {
  border: 1px solid #000;/* Linien zwischen den Tabellenzeilen */
  background-image: linear-gradient(#f9f9f9, #e3e3e3);
}
#table_simple th,
caption {
        background-color: #666;
        color: #fff;
        text-align: left;
        font-size: 14pt;
        ;
}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/* Buttons */
#buttonchange{
 background:url(pics/change.png) no-repeat center;
 display: inline-flex;
 width:80px;
 height:48px;
 border:0;
}
#buttonchange:hover{
 background:url(pics/change_mouseover.png) no-repeat center;
 display: inline-flex;
 width:80px;
 height:48px;
 border:0;
}

#buttondelete{
 background:url(pics/delete.png) no-repeat center;
 display: inline-flex;
 width:80px;
 height:48px;
 border:0;
}
#buttondelete:hover{
 background:url(pics/delete_mouseover.png) no-repeat center;
 display: inline-flex;
 width:80px;
 height:48px;
 border:0;
}

#buttonplus{
 background:url(pics/plus.png) no-repeat center;
 display: inline-flex;
 width:48px;
 height:48px;
 border:0;
 margin-left: auto;
 margin-right: auto;
}
#buttonplus:hover{
 background:url(pics/plus_mouseover.png) no-repeat center;
 display: inline-flex;
 width:48px;
 height:48px;
 border:0;
 margin-left: auto;
 margin-right: auto;
}
#buttonaccount{
  background:url(pics/account.png) no-repeat center;
  display: inline-flex;
  width:48px;
  height:48px;
  border:0;
 }
 #buttonaccount:hover{
  background:url(pics/account_mouseover.png) no-repeat center;
  display: inline-flex;
  width:48px;
  height:48px;
  border:0;
 }
 #buttonstatistik{
  background:url(pics/statistik.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:48px;
  border:0;
 }
 #buttonstatistik:hover{
  background:url(pics/statistik_mouseover.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:48px;
  border:0;
 }
 #buttoninfo{
  background:url(pics/info.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:48px;
  border:0;
 }
 #buttoninfo:hover{
  background:url(pics/info_mouseover.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:48px;
  border:0;
 }

 #buttonsort{
  background:url(pics/sort.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:40px;
  border:0;
 }
 #buttonsort:hover{
  background:url(pics/sort_mouseover.png) no-repeat center;
  display: inline-flex;
  width:80px;
  height:40px;
  border:0;
 }

.Button1 {
	background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
	background-color:#ededed;
	border-radius:6px;
	border:1px solid #000000;
	display:inline-block;
	cursor:pointer;
	color:#000000;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.Button1:hover {
	background:linear-gradient(to bottom, #005e16 5%, #ededed 100%);
	background-color:#dfdfdf;
}
.Button1:active {
	position:relative;
	top:1px;
}
/* ----------------------- */


/* Eingabefelder */
.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #005e16;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 94, 22, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 94, 22, .6);
}
.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: #999;
}
.form-control::-webkit-input-placeholder {
  color: #999;
}
.form-control::-ms-expand {
  background-color: transparent;
  border: 0;
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  background-color: #eee;
  opacity: 1;
}
.form-control[disabled],
fieldset[disabled] .form-control {
  cursor: not-allowed;
}

.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #a94442;
  font-size: 14px;
}

.form-group {
  margin-bottom: 0px;
}

.has-error .form-control {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.has-error .form-control:focus {
  border-color: #843534;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483;
}

/* Popup box */
.box {
        width: 90%;
        margin: 0 auto;
        background: rgba(255,255,255,0.2);
        padding: 35px;
        border: 2px solid #fff;
        border-radius: 20px/50px;
        background-clip: padding-box;
        text-align: center;
      }
      
      .button {
        font-size: 1em;
        padding: 10px;
        color: #fff;
        border: 2px solid #005e16;
        border-radius: 20px/50px;
        text-decoration: none;
        cursor: pointer;
        transition: all 0.3s ease-out;
      }
      .button:hover {
        background: #005e16;
      }
      
      .overlay {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, 0.7);
        transition: opacity 500ms;
        visibility: hidden;
        opacity: 0;
      }
      .overlay:target {
        visibility: visible;
        opacity: 1;
      }
      
      .popup {
        margin: 70px auto;
        padding: 20px;
        background: #fff;
        border-radius: 5px;
        width: 90%;
        position: relative;
        transition: all 5s ease-in-out;
      }
      
      .popup h2 {
        margin-top: 0;
        color: #333;
        font-family: Tahoma, Arial, sans-serif;
      }
      .popup .close {
        position: absolute;
        top: 20px;
        right: 30px;
        transition: all 200ms;
        font-size: 30px;
        font-weight: bold;
        text-decoration: none;
        color: #333;
      }
      .popup .close:hover {
        color: #005e16;
      }
      .popup .content {
        height: 100%;
        overflow: auto;
      }
      
/* Popup box */

.testcolors {
color:#00BFFF;
color:#00FF00;
color:#FFBF00;
color:#BF00FF;
color:#FF0000;
}

/* Bilder vorladen für Hower Effekte*/
.verstecktesBild{
  display: none;
  width: 0px;
  height: 0px;
  border: 0px;
  }

/*Dropdown Button **********************************************************/
.dropbtn {
  background:url(pics/sort.png) no-repeat center;
  font-size: 24pt;
  display: inline-flex;
  width:40px;
  height:40px;
  border:0;
  cursor: pointer;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  right: 0;
  background-color: #f9f9f9;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  font-size: 24pt;
}

.dropdown-content a {
  color: black;
  padding: 30px 30px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background:url(pics/sort_mouseover.png) no-repeat center;
}
/*Dropdown Button **********************************************************/