/* CSS Document */
* {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%;
	min-height: 100%;
}

html {
	background: #E9E9E9;
	background: url(../../images/html/background-net-light.jpg) no-repeat center center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

body {
	font-family: 'Open Sans', Arial, sans-serif !important;
	/*font-size: 80%;*/
	font-size: 13px !important;
	/*background-image: url(../../images/html/BV0C2827.jpg);
	background-repeat:no-repeat;
	background-size:cover;*/
	
	/* jpg direkt aufgehellt */
	/*background: rgba(200, 200, 200, 0.8)*/
}

::selection {
	background: rgba(49,39,130,0.20); /* WebKit/Blink Browsers */
	/*color: white;*/
}
::-moz-selection {
	background: rgba(49,39,130,0.20); /* Gecko Browsers */
	/*color: white;*/
}

h1, h2 {
	font-weight: 700;
	color: #312782;
}

p {
	margin: 0.8em 0px;
}

a {
	text-decoration: none;
	/*color: #999;*/
	color: rgba(68,54,180,1.00);
	/*text-shadow: 1px 1px #AAA;*/
}

a:hover {
	color: #E3BE00;
	/*text-shadow: 1px 1px #999;*/
}

input[type=button],
input[type=submit],
button, a.button {
	display: inline-block;
	/*width: auto;*/
	padding: 4px 15px;
	color: #FFF !important;
	font-family: 'Open Sans', Arial, sans-serif !important;
	font-size: 13px;
	text-shadow: 0 -1px rgba(0,0,0,0.40);
	text-decoration: none !important;
	text-align: center;
	background: #312782;
	background: #FFFFFF -webkit-linear-gradient(rgba(49,39,130,0.85), #312782) no-repeat scroll 0 0;
	background: #FFFFFF -moz-linear-gradient(rgba(49,39,130,0.85), #312782) no-repeat scroll 0 0;
	background: #FFFFFF -o-linear-gradient(rgba(49,39,130,0.85), #312782) no-repeat scroll 0 0;
	background: #FFFFFF linear-gradient(rgba(49,39,130,0.85), #312782) no-repeat scroll 0 0;
	border: solid #312782 1px;
	border-radius: 4px;
	box-shadow: 0 1px 0 rgba(255,255,255,0.20) inset, 0 1px 3px rgba(0,0,0,0.20);
	cursor: pointer;
}

input[type=button]:not([disabled]):hover,
input[type=submit]:not([disabled]):hover,
button:not([disabled]):not(.pswp__button):hover,
a.button:not([disabled]):hover {
	background: #312782;
}

input[type=button]:not([disabled]):active,
input[type=submit]:not([disabled]):active,
button:not([disabled]):active,
a.button:not([disabled]):active {
	box-shadow: 0 3px 10px rgba(0,0,0,0.20) inset;
}



#headline-wrap {
	padding-top: 23px;
	padding-left: 5px;
}

#headline-wrap * {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

#volleyball {
	position: relative;
	top: 8px;
	float: left;
}

#headline {
	display: inline-block;
	padding-left: 13px;
	font-size: 26px;
	font-weight: 800;
	text-transform: uppercase;
	text-shadow: 1px 1px 0 #E0B500;
	width: auto;
	float: left;
	cursor: default;
}

#headline:after {
	content: '';
	display: inline-block;
	margin-left: 15px;
	position: relative;
	top: 5px;
	width: 2px;
	height: 30px;
	background: #312782;
}

#subheadline {
	display: inline-block;
	margin-top: 9px;
	margin-left: 14px;
	/*font-size: 150%;*/
	font-size: 19px;
	font-weight: 600;
	/*text-shadow: 1px 1px 0 #E0B500;*/
}

#resp-menu-button {
	display: none;
	float: right;
	margin-top: -5px;
	padding: 0 20px;
	height: 100%;
	line-height: 45px;
	font-size: 180%;
	font-weight: bold;
	text-shadow: 1px 1px 0 #E0B500;
	color: #312782;
	cursor: pointer;
}

#resp-menu-button.clicked {
	background: #999;
	color: white;
	text-shadow: 1px 1px #312782;
	border-left: solid 1px #312782;
	border-bottom: solid 1px #777;
}

#logo {
	position: absolute;
	right: 20px;
	top: 8px;
}

#header-wrap {
	position: absolute;
	min-width: 100%;
	height: 140px;
	background: #FFF143;
	background: #FFF143 url(../../images/html/background_15px.png) repeat scroll 0 0;
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -webkit-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -moz-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -o-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, linear-gradient(#FFF143 0%, #FFDC26 100%);
	z-index: 2;
}

#inner-header-wrap {
	position: relative;
	max-width: 900px;
	height: 100%;
	margin: 0 auto;
	z-index: 5;
}

#nav-wrap {
	position: absolute;
	bottom: 0;
}



/* Navbar configuration */

#nav li {
	list-style: none;
}

#nav #navhome a { /* größe des home-Links anpassen */
	font-size: 18px;
}

#nav li a {
	display: block;
	padding: 0 20px;
	color: white;
	text-shadow: 1px 1px 0 black;
	text-decoration: none;
	font-weight: 600;
	border: solid #555 1px;
	background: #312782;
	background: #7266D1 -webkit-linear-gradient(rgba(49, 39, 130, 0) -100%, #312782) no-repeat scroll 0 0;
	background: #7266D1 -moz-linear-gradient(rgba(49, 39, 130, 0) -100%, #312782) no-repeat scroll 0 0;
	background: #7266D1 -o-linear-gradient(rgba(49, 39, 130, 0) -100%, #312782) no-repeat scroll 0 0;
	background: #7266D1 linear-gradient(rgba(49, 39, 130, 0) -100%, #312782) no-repeat scroll 0 0;
	-webkit-transition: background-color 300ms ease 0;
	-o-transition: background-color 300ms ease 0;
	transition: background-color 300ms ease 0;
	-moz-transition-property: background-color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease;
}

#nav li a:hover {
	background-color: white;
}

.no-opacity #nav li a:hover {
	background-color: #7266D1
}



#nav li:hover ul {
	opacity: 1;
	pointer-events: auto;
}
	
.touch #nav li:hover ul,
.no-opacity #nav li:hover ul {
	display: block;
}



/* Top menu */

#nav li.top-menu {
	float: left;
	margin-left: -1px; /* doppelte Border zwischen <li>s verhindern */
}

#nav li.top-menu a {
	line-height: 45px;
}

#nav li.top-menu.active > a {
	color: #FFF143;
	background: #312782;
	cursor: default;
	pointer-events: none;
	border-bottom-color: #312782;
}

#nav li.top-menu:first-child a {
	border-top-left-radius: 10px;
}

#nav li.top-menu:last-child a {
	border-top-right-radius: 10px;
}



/* Submenu */

#nav ul.dropdown-menu {
	position: absolute;
	z-index: 5;
	-webkit-transition: opacity 300ms ease 0.3s, display 300ms step-end 0;
	-o-transition: opacity 300ms ease 0.3s, display 300ms step-end 0;
	transition: opacity 300ms ease 0.3s, display 300ms step-end 0;
	-moz-transition-property: opacity;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease;
	-moz-transition-delay: 0.3s;
}

#nav ul.dropdown-menu {
	opacity: 0;
	pointer-events: none;
}

#nav li.dropdown-submenu a {
	color: #FFFFFF;
}

#nav li.dropdown-submenu.active > a {
	color: #FFF143;
	background: #312782;
	cursor: default;
	pointer-events: none;
}

.touch #nav ul.dropdown-menu,
.no-opacity ul.dropdown-menu {
	display: none;
}

#nav li.dropdown-submenu {
	margin-top: -1px; /* doppelte Border zwischen <li>s verhindern */
	min-width: 150px;
}

#nav li.dropdown-submenu a {
	line-height: 35px;
	font-size: 11px;
}




#flyInWrap {
	width: 100%;
	position: fixed;
	top: -50px;
	-webkit-transition: top 300ms;
	-moz-transition: top 300ms;
	transition: top 300ms;
}

#flyInBar {
	max-width: 900px;
	margin: 0 auto;
	height: 20px;
	background: yellow;
	background: #FFF143;
	background: #FFF143 url(../../images/html/background_15px.png) repeat scroll 0 0;
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -webkit-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -moz-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -o-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, linear-gradient(#FFF143 0%, #FFDC26 100%);
	border-bottom: solid #312782 5px;
	box-shadow: 0 0 5px rgba(0,0,0,0.50);
}

#flyInNavWrap {
	max-width: 900px;
	height: auto;
	margin: 0 auto;
	position: relative;
	top: -25px;
}

#flyInNav {
	width: auto;
	margin: auto;
	
	position: relative;
	left: 20px;
}

#flyInNav ul#nav > li.top-menu a {
	border-top: none;	
}

#flyInNav ul#nav > li.top-menu:first-child a {
	border-top-left-radius: 0px;
	border-bottom-left-radius: 10px;
}

#flyInNav ul#nav > li.top-menu:last-child a {
	border-top-right-radius: 0px;
	border-bottom-right-radius: 10px;
}




/* Active links */

/*#nav li:not(.dropdown-submenu).active > a,
#nav li.dropdown-submenu.active a {
	color: #FFF143;
	background: #312782;
	cursor: default;
	pointer-events: none;
}

#nav li.top-menu.active a {
	border-bottom-color: #312782;
}*/




span.caret {
	display: inline-block;
	position: relative;
	top: -2px;
	left: 2px;
	width: 0;
	height: 0;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	border-top: 4px solid #FFF;
}

#header-seperator {
	position: absolute;
	bottom: -5px;
	height: 5px;
	width: 100%;
	background: #312782;
	z-index: 2;
}




#straitened-area {
	position: relative;
	margin: 0 auto;
	max-width: 900px;
	min-width: 280px;
/*	height: auto !important;
	height: 100%;*/
	min-height: 100%;
	
	background: rgba(255,255,255,0.90);
	box-shadow: 0 0 8px rgba(0,0,0,0.63); 
}


/* Main area */

#main-wrap {
	position: relative;
	padding-top: 145px;
	padding-bottom: 120px;
	min-height: 100%;
	min-width: 300px;
}

#main-hidden-area {
	height: 145px;
	/*border: solid red 1px;*/
}

#main-wrap h2 {
	font-size: 15px;
	margin-bottom: 5px;
}


#left-bar {
	position: relative;
	float: left;
	width: 160px;
	padding: 30px 20px;
}

#left-bar.fixed {
	position: fixed;
	top: 50px;
}



#main-nav {
}

/*#main-nav h2 {
	color: #555;
}*/

#main-nav a {
	display: block;
	margin: 1px 0;
	padding: 5px 10px;
	background: #EEE;
	background: #E2E2E2;
	background: url(../../images/html/background_15px.png) repeat scroll 0 0 #E2E2E2;
	border-left: solid #312782 3px;
	border-top: solid transparent 1px;
	border-bottom: solid transparent 1px;
	/*color: #312782;*/
	color: #555;
	text-shadow: 1px 1px #FFF;
	font-weight: 700;
	/*font-size: 95%;*/
	font-size: 12px;
}

#main-nav a.submenu {
	position: relative;
	text-indent: 10px;
}

#main-nav a.submenu:before {
	content: '';
	position: absolute;
	left: 8px;
	top: 12px;
	width: 5px;
	height: 5px;
	background: #555;
	box-shadow: 1px 1px 0 white;
}

#main-nav a:not(.active):hover {
	border-left: solid #FFDC26 3px;
	color: #FFDC26;
	text-shadow: 1px 1px #555;
}

#main-nav a:not(.active):hover.submenu:before {
	background: #FFDC26;
	box-shadow: 1px 1px 0 #555;
}

#main-nav a.active {
	color: #312782;
	background: #FFF143;
	background: #FFF143 url(../../images/html/background_15px.png) repeat scroll 0 0;
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -webkit-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -moz-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, -o-linear-gradient(#FFF143 0%, #FFDC26 100%);
	background: url(../../images/html/background_15px.png) repeat scroll 0 0, linear-gradient(#FFF143 0%, #FFDC26 100%);
}

#main-nav a.submenu.active:before {
	background: #312782;
	box-shadow: 1px 1px 0 white;
}

/*#main-nav a:hover.active {
	border-left: solid #FFDC26 3px;
	color: #FFDC26;
	text-shadow: 1px 1px #312782;
}*/

/*#main-nav a.submenu.active:hover:before {
	background: #FFDC26;
	box-shadow: 1px 1px 0 #312782;
}*/

.submenu-select-wrap {
	display: none;
}

.submenu-select-wrap .selectboxit,
.submenu-select-wrap .selectboxit-container {
	width: 100%;
}

.submenu-select-wrap .selectboxit-list {
	margin-top: -1px;
}


#dateWrap {
	margin: 0 auto;
	margin-top: 40px;
	width: 95%;
	color: #555;
	text-align: center;
	font-size: 14px;
}


#dateWrap h2 {
	position: relative;
	padding: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	color: white;
	background: #312782;
	box-shadow: 0 0 3px rgba(0,0,0,0.30);
	font-size: 13px;
	font-weight: 600;
	margin: 0;
}

#dateWrapContent {
	padding: 3px;
	border: solid #312782 1px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 0 0 3px rgba(0,0,0,0.30);
	background: #e2e2e2 url("../../images/html/background_15px.png") repeat scroll 0 0;
	background: url("../../images/html/background_15px.png") repeat scroll 0 0px, rgba(0, 0, 0, 0) linear-gradient(#fff143 0%, #ffdc26 100%) repeat scroll 0 0;
		color: #312782;
}

#dateWrapContent p {
	margin: 3px;
}

#dateContentHeader {
	margin-bottom: 5px;
	font-weight: 700;
	text-shadow: 1px 1px #fff;
}

#dateContent {
	margin-top: 5px;
	font-size: 13px;
	font-weight: 600;
	color: #555;
	text-shadow: 1px 1px #fff;
}




#main {
	margin-left: 180px;
	padding: 30px;
	padding-right: 40px;
}

/*#main * {
	margin: 0;
	padding: 0;
}*/

#main a {
	text-decoration: underline;
}

#main-without-nav {
	width: 700px;
	margin: 0 auto;
	padding-bottom: 200px;
	padding: 30px 20px;
}

img.image-full-width {
	width: 100%;
	margin-top: 10px;
}



.req-symbol {
	color: red;
	padding-left: 1px;
	font-weight: 700;
	font-size: 13px;
}

.footnotes {
	margin-top: 10px;
}


/* Footer area */

#footer-wrap {
	position: absolute;
	bottom: -1px;
	width: 100%;
	height: 100px;
	/*font-size: 90%;*/
	font-size: 12px;
	font-weight: 600;
	color: white;
	background: #312782;
	background: url(../../images/html/background_inv_15px.png) repeat scroll 0 0 #312782;
}

#footer-seperator {
	height: 5px;
	max-width: 900px;
	background: #AAA;
	margin-bottom: 5px;
}


#footer-wrap a {
	color: inherit;
}

#footer-wrap a:hover {
	color: #E3BE00;
}

#footer-links {
	float: left;
}

.footer-link {
	float: left;
	margin-left: 20px;
}

#impressums-link {
	/*float: left;*/
	margin-left: 20px;
}

#datenschutz-link {
	/*float: left;*/
	margin-left: 20px;
}

#tsg-logo-text {
	overflow: hidden;
	padding-right: 8px;
	text-align: right;
}

#tsg-logo-link {
	float: right;
	margin-right: 20px;
}

#tsg-logo {
	height: 80px;
	border: none;
}

.submenu-select {
	width: 100%;
	margin-bottom: 20px;
}


.submenu-select-wrap {
	margin-bottom: 15px;
}



#teams-table td {
	vertical-align: top;
}



.selectboxit-list > .selectboxit-focus > .selectboxit-option-anchor {
	background: #312782;
}

.no-transition {
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}





@media screen and (max-width: 915px){
	
	#headline-wrap {
		padding-top: 10px;
		padding-left: 20px;
	}
	
	#headline:after {
		display: none;
	}
	
	#subheadline {
		display: block;
		clear: both;
		margin-left: 0;
		margin-top: 5px;
	}
	
	#nav-wrap {
		margin-left: 20px;
	}
}

@media screen and (max-width: 750px){
	#logo {
		display: none;
	}
}

@media screen and (max-width: 650px){
	/*#nav-wrap,*/
	#flyInWrap,
	#left-bar,
	#subheadline {
		display: none;
	}
	
	#nav-wrap {
		/*height: 0;*/
	}
	
	.submenu-select-wrap {
		display: block;
		margin-bottom: 35px;
	}
	
	.selectboxit-container {
		/*z-index: 0;*/
	}
	
	#header-wrap {
		position: fixed;
		height: 45px;
	}
	
	#headline-wrap {
		padding-top: 5px;
		line-height: 35px;
	}
	
	#volleyball {
		top: 6px;
	}
	
	#headline {
		font-size: 180%;
		font-weight: 700;
	}
	
	#resp-menu-button {
		display: block;
	}
	
	#resp-menu-background {
		display: none;
		position: fixed;
		height: 100%;
		width: 100%;
		top: 0;
		background: rgba(0,0,0,0.80);
		opacity: 0;
		
		/*-webkit-transition: opacity 300ms ease 0s;
		-moz-transition: opacity 300ms ease 0s;
		-o-transition: opacity 300ms ease 0s;
		transition: opacity 300ms ease 0s;*/
	}
	
	#main {
		margin-left: 0;
		margin-right: 0;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 20px;
	}
	
	#main-wrap {
		padding-top: 50px;
	}
	
	#nav-wrap {
		/*display: none;*/
		position: relative;
		width: 100%;
		margin-left: 0;
		top: 0px;
		overflow: hidden;
	}
	
	#nav-wrap #nav {
		border-bottom: solid #312782 5px;
		margin-top: -150%;
		-webkit-transition: marging-top 300ms ease 0s;
		-moz-transition: marging-top 300ms ease 0s;
		-0-transition: marging-top 300ms ease 0s;
		transition: margin-top 300ms ease 0s;
		z-index: 10;
	}
	
	#nav-wrap #nav li {
		float: none;
		width: 100%;
		margin-left: 0;
	}
	
	#nav-wrap #nav li a {
		color: white;
		text-shadow: 1px 1px 0 #777;
		border: none;
		border-bottom: solid #777 1px;
		background: #999;
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		transition: none;
		cursor: default;
	}
	
/*	#nav-wrap #nav li.top-menu:first-child a {
		border-top: none;
	}*/
	
	#nav-wrap #nav li.top-menu a:hover,
	#nav-wrap #nav li.top-menu.active > a,
	#nav-wrap #nav li.dropdown-submenu.active > a {
		background: #312782;
		cursor: pointer;
	}
	
	#nav-wrap #nav li.top-menu.active > a,
	#nav-wrap #nav li.dropdown-submenu.active > a {
		color: #ffdc26;
	}
	
	#nav-wrap li.top-menu:first-child a {
		border-radius: 0px;
	}
	
	#nav-wrap li.top-menu:last-child a {
		border-radius: 0px;
	}
	
	#nav-wrap #nav ul.dropdown-menu {
		position: static;
		opacity: 1;
		display: none;
		
		
	}
	
	#nav-wrap #nav li.dropdown .caret {
		float: right;
		top: 22px;
		transform: scale(1.5);
	}
	
	#nav-wrap #nav li.dropdown-submenu {
		margin-top: 0;
		overflow: hidden
	}
	
	#nav-wrap #nav li.dropdown-submenu a {
		line-height: 45px;
		background: #CCC;
		color: white;
		/*text-shadow: 1px 1px #FFF;*/
	}
	
	#nav-wrap #nav li.active a {
		pointer-events: auto;
	}
	
	.footer-link {
		float: none;
	}
	
	.footer-link:not(:first-child) {
		margin-top: 3px;
	}
}