@charset "utf-8";
/* CSS Document */

html, body {
  padding: 0;
  margin: 0;
}

html {
  height: 100%;
  background: #E9E9E9;
  background: url(../../images/html/background-net-2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
  min-height: 100%;
  background: rgba(200,200,200,0.80);
}

#centered-wrapper {
  width: 1000px;
  margin: 0 auto;
  min-height: 100%;
}

#page-wrapper {
  position: relative;
  padding-bottom: 80px;
}

#header {
  height: 80px;
}

#tabs-wrapper {
  position: relative;
  height: 25px;
  background: #E9E9E9;
}

#tabs-wrapper ul {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 24px;
}

#tabs-wrapper ul > li {
  margin-right: -5px;
  padding: 0 10px;
  float: left;
  background: #E9E9E9;
  border: solid #555 1px;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;
}

#tabs-wrapper ul > li.active {
  background: #FFF;
  border-bottom: solid #FFF 1px;
}

#tabs-wrapper ul a {
  padding: 0 15px;
  text-decoration: none;
  color: #555;
}

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 80px;
}

#page-border {
  border: solid #555 1px;
  background: #FFF;
  box-shadow: 0 0 10px rgba(0,0,0,0.50);
}

#page-header {
	position: relative;
	background: rgba(0,33,108,0.50);
	padding: 10px 20px;
	text-transform: none;
	color: white;
	font-weight: bold;
	text-shadow: 1px 1px 0 rgba(0,33,108,0.50)
}

#page-header .sub-header {
	margin-left: 8px;
	color: rgba(255,255,255,0.60);
	text-shadow: none;
	font-weight: normal;
  font-size: 14px;
}

#page-header #year-select {
	position: absolute;
	top: 8px;
	right: 20px;
}

#page {
  padding-top: 10px;
  padding-right: 25px;
  padding-left: 25px;
  padding-bottom: 30px;
}

#form-wrapper {
  width: 355px;
  margin: auto;
  position: relative;
}

#form {
  position: relative;
  top: 120px;
  background: #FFF;
  border: solid #555 1px;
  box-shadow: 0 0 10px rgba(0,0,0,0.50);
}

#form #form-header {
  padding: 10px;
  background: rgba(0,33,108,0.50);
  color: #FFF;
  text-shadow: 0 1px 0 rgba(0,33,108,0.50);
  text-align: center;
  font-size: 16px;
}

#login-form {
  margin: auto;
  width: 300px;
  padding: 20px 25px;
}

#login-form input {
  width: 175px;
  margin: 3px 0;
  margin-left: 10px;
}

#login-form #form-header {
  margin-bottom: 20px;
  color: rgba(0,33,108,1.00);
  font-weight: bold;
  text-align: center;
}

#login-form #submit-button {
  width: 150px;
  margin-top: 20px;
  padding: 5px;
}

#navigation-menu-wrapper {
  height: 25px;
  background: rgba(0,33,108,1.00);
  color: #FFF;
}

#navigation-menu {
  padding: 0 20px;
  list-style: none;
}

#navigation-menu > li {
  float: left;
  padding-right: 7px;
  line-height: 25px;
}

#page h2 {
  position: relative;
  font-size: 16px;
  font-weight: normal;
  color: rgba(0,33,108,1.00);
  text-shadow: 0 1px 0 #FFF;
  background-image:  url(../../images/html/header-line.png);
  background-repeat: repeat-x;
  
  background: #E9E9E9;
  border: solid #AAA 1px;
  border-bottom: none;
  /*border: solid lightgray 1px;*/
  /*border-radius: 7px 7px 0 0;*/
  padding: 5px 10px;
  margin-bottom: 0;
  cursor: pointer;
}

/*#page h2:hover {
  box-shadow: 0 0 3px rgba(189,189,189,1.00) inset;
}*/

#page h2:not(:first-child) {
  margin-top: 30px;
}

#page h2 span {
  /*background: #FFF;*/
  padding-right: 2px;
}

#page h2 .expand-button {
  position: absolute;
  top: 5px;
  right: 10px;
  width: 20px;
  height: 20px;
  /*background: white;*/
  /*border: solid gray 1px;*/
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  
  /*background: red;*/
}

#page h2.expanded .expand-button {
  background-image: url(../../images/html/button-up.png);
}

#page h2.expanded:hover .expand-button {
  background-image: url(../../images/html/button-up-highlighted.png);
}

#page h2.collapsed .expand-button {
  background-image: url(../../images/html/button-down.png);
}

#page h2.collapsed:hover .expand-button {
  background-image: url(../../images/html/button-down-highlighted.png);
}


#page ul.menu {
  padding: 0;
  margin: 0;
  margin-top: 15px;
  height: 35px;
  background: url(../../images/html/menu-background.png) repeat-x;
}

#page ul.menu > li {
  padding: 0;
  margin: 0;
  list-style: none;
  float: left;
  background: white;
  margin-left: 5px;
  margin-top: 0px;
  padding: 7px 10px;
  /*border: solid white 1px;*/
  box-shadow: 0 0 3px #454545;
  /*border-radius: 5px;*/
  color: rgba(0,33,108,1.00);
  /*font-weight: bold;*/
  cursor: pointer;
  text-transform: uppercase;
}

#page ul.menu > li.active {
  background: rgba(0,33,108,1.00);
  color: white;
}

#page ul.menu > li:hover {
  box-shadow: 0 0 5px rgba(0,33,108,1.00);
}


.collapsable-content {
  background: #E9E9E9;
  padding-top: 10px;
  border: solid #AAA 1px;
  border-top: none;
  /*border-radius: 0 0 7px 7px;*/
  padding-bottom: 10px;
}

.collapsable-content.expanded {
  display: block;
}

.collapsable-content.collapsed {
  display: none;
}

#page input {
  font-size: inherit;
}

.anmeldung-wrapper {
  margin: 0 10px 20px 10px;
  font-size: 12px;
}

.anmeldung-header {
  position: relative;
  margin: 0;
  font-size: inherit;
  color: #FFF;
  border: solid #999 1px;
  border-bottom: none;
  background: rgba(0,33,108,0.50);
  padding: 5px 10px;
  border-radius: 7px 7px 0 0;
}

.datum-label {
  font-size: 11px;
  color: rgba(255,255,255,0.60);
  margin-left: 7px;
}

.verein-label {
  font-weight: 600;
  color: #FFF;
  text-shadow: 0 1px 0 rgba(0,33,108,0.50);
}

.option-menu-button {
  position: absolute;
  top: 5px;
  right: 20px;
  width: 25px;
  height: 20px;
  text-align: center;
  font-size: 16px;
  text-shadow: 0 1px 0 rgba(0,33,108,0.50);
  cursor: pointer;
  -webkit-user-select: none;  
  -moz-user-select: none;    
  -ms-user-select: none;      
  user-select: none;
}

.option-menu {
  display: none;
  position: absolute;
  right: -30px;
  width: 200px;
  top: 30px;
  /*border: solid #6275AA 2px;*/
  border-radius: 7px;
  font-size: 12px;
  color: #000;
  text-align: left;
  text-shadow: none;
  list-style: none;
  cursor: default;
  box-shadow: 0 0 15px rgba(0,0,0,1);
  z-index: 2;
}

.option-menu:before {
  content: '';
  display: block;
  position: absolute;
  width: 16px;
  height: 16px;
  top: -8px;
  left: 150px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  background: #E9E9E9;
  /*border: solid #6275AA 2px;*/
  box-shadow: 0 0 15px #000;
}

.option-menu-inner {
  position: relative;
  padding: 5px 10px;
  padding-top: 10px;
  margin: 0;
  background: #E9E9E9;
  border-radius: 7px;
  text-align: left;
  text-shadow: none;
  list-style: none;
  cursor: default;
  color: #000;
  font-size: 12px;
}

.geldeingang-panel {
  margin-bottom: 10px;
  padding: 0 5px;
  line-height: 25px;
}

.sparator {
  margin: 5px;
  height: 1px;
  background: #999;
}

.input-area {
  padding-left: 5px;
}

.option-menu-inner > li {
  line-height: 30px;
  padding: 0 5px;
  border: solid transparent 1px;
  border-radius: 4px;
  text-shadow: 1px 1px 0 #FFF;
}

.option-menu-inner > li:hover {
  border-color: #999;
}

.option-menu-inner > li.clickable {
  cursor: pointer;
}

.option-menu-inner > li.deactivated {
  color: #999;
  cursor: default;
}

.transfer-datum-input{
  margin-left: 3px;
  width: 40px;
  padding: 4px 14px;
  border: solid #999 1px;
  border-radius: 4px;
}

.geldeingang-panel input[type=button] {
  padding: 3px 11px;
  border: solid #999 1px;
  border-radius: 4px;
  cursor: pointer;
}

.geldeingang-panel input[type=button]:hover {
  /*border: solid #FFE500 1px;*/
  box-shadow: 1px 1px 5px rgba(0,0,0,0.1), 0 0 5px #FFE500 inset;
}

.anmeldung-wrapper .content {
  padding: 8px;
  border: solid #999 1px;
  border-bottom: top;
  border-radius: 0 0 7px 7px;
  background: white;
  /*background-image: url(file:///D|/Users/Jens/Documents/Websites/Filstal-Open/images/light-gray-background.png);
  background-repeat: repeat-y;
  background-position: right;*/
}

.anmeldung-wrapper .kontakt-col {
  width: 250px;
}

.anmeldung-wrapper .teams-col {
  width: 330px;
}

.anmeldung-wrapper .anmerkungen-col {
  width: 330px;
}

.anmeldung-wrapper th {
  text-align: left;
}

.anmeldung-wrapper td {
  vertical-align: top;
}