/***********************
    FILE
************************
Author:        Benjamin Stellmacher
<benjamin.stellmacher@hellgrau.com>
Description:    Contains global  definitions
***********************/

/***********************
    DOCUMENT
***********************/

/* Global White  Space Reset  */


* {
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-size: 15px;
	font-weight: normal;
	font-family: 'Roboto';
}

*::after, *::before {
	box-sizing:border-box;
}

html,body {
	width:100%;
	height:100%;
}

body {
	margin:0;
	text-align:center;
	color:#58585a;
	background:#eee url(../images/background.jpg) no-repeat scroll center top;
	-webkit-overflow-scrolling: touch;
	overflow-x: hidden;
}

#wrapper {
	position:relative;
	overflow:auto;
	width:100%;
	height:100%;
}

#main {
	margin:0 auto;
	max-width:1000px;
	text-align:left;
	color:#58585a;
	background:#fff;
}

header #layer .unslider {
	height:288px;
}


/***********************
  GENERAL  DEFINITIONS
***********************/

h1,h2,h3,p,div,span,a,form,label,input,select,textarea,ul,ol,li {
	font-family:Open Sans, Arial, Verdana, sans-serif;
}

h1 {
  font-size: 20px;
  font-weight:bold;
 }

h2 {
  font-size: 20px;
  font-weight:normal;
  margin: 0 0 20px 0;
}

h3, h4, h5 {
	font-size: 15px;
	font-weight: bold;
	margin: 0 0 10px 0;
}

/* text  elements */
div,span,p,li {
  margin:0px;
}

p {
  margin: 0 0 20px 0;
}

p b {
  font-weight: bold;
}

li a,
ol a,
p a {
  color:#008bd0;
  text-decoration: underline;
}

#content ul li,
#content ol li {
	margin:0 0 10px 15px;
}

a.download {
	padding-left:16px;
	background:transparent url(../images/icon-download.png) no-repeat;
}

a:hover {
	color:#33bed0;
}


/* forms */
fieldset	{ border: none;  }

/* links */
img		{
	border: none;
}
a img	{ border: none; }
a     { text-decoration: underline; }

a.button {
	color: #fff !important;
	padding: 5px 10px;
	background-color: #008bd0;
	text-decoration: none;
}

/* utility */
.bold, strong	{ font-weight: bold; }
.underline  	{ text-decoration: underline; }
.notice    		{ font-weight: bold; color:  #f00; }

.pre    	{ white-space:  pre; }
.no-indent  { text-indent: 0px; }
.no-break  	{ white-space: nowrap; }

.float-left    	{ float: left; margin: 0 5px 0 0; }
.float-right  	{ float: right; margin: 0 0 0 5px;  }
.float-none    	{ float: none; }
.clear      	{ clear: both; }
.clearright    	{ clear: right;  }
.clearleft    	{ clear: left; }
.centered    	{ text-align: center; }


/***********************
  MAIN
***********************/

/***********************
  LOGIN BAR
***********************/

#login {
	padding:10px 30px 10px 5%;
	width:100%;
	color:#58585a;
	background: #d5ecf8;
}

#login::after {
	display:table;
	content: " ";
	clear: both;
}

#login span {
	position:relative;
	top:2px;
}

#login a {
	float:right;
	margin-left:10px;
	padding:1px 6px;
	font-weight:normal;
	color:#fff;
	text-decoration: none;
	/*border:1px solid #008bd0;*/
	background:#008bd0;
	/*background: #58585a;*/
	cursor:pointer;
}

#login a:hover {
	/*color:#fff;
	border:1px solid #008bd0;*/
}

/***********************
  HEADER
***********************/

header {
	margin:0 auto 0 0;
	padding:18px 0 0 0;
	max-width: 1000px; /*970px;*/
	background: #fff url("../images/header_2.jpg") no-repeat scroll right top;
}

header::after {
	display:table;
	content: " ";
	clear: both;
}

header #topBar {
	padding-bottom:10px;
}

header #topBar::after {
	display:table;
	content: " ";
	clear: both;
}

header #logo {
	margin-left:50px;
	float:left;
	width:29%;
	height:auto;
}
/*
@media only screen and (max-width:980px) {
	header #logo {
		margin-left:45px;
		width:40%;
		height:40%;
	}
}

@media only screen and (max-width:768px) {
	header #logo {
		margin-left:35px;
		width:50%;
		height:50%;
	}
}

@media only screen and (max-width:360px) {
	header #logo {
		margin-left:20px;
		width:60%;
		height:60%;
	}
}
*/
/* Top Navigation */
header #topNav {
	float:right;
	margin-right: 30px;
}

header #topNav ul li {
	display:inline;
	list-style:none;
}

header #topNav ul li a {
	padding:0 0;
	color:#008bd0;
	text-decoration:none;
	font-size: 14px;
}

header #topNav ul li::before {
	content: " | ";
	color:#008bd0;
}

header #topNav ul li.first::before {
	content: "";
}

header #topNav ul li a:hover {
	color:#33bef3;
}

/* Image Layer */
header #layer {
	position:relative;
}

header #layer .deco {
	position:absolute;
	right:0px;
	bottom:0px;
	width:auto;
	height:80%;
	z-index:9932;
}

header #layer .border {
	position:absolute;
	bottom:0;
	left:0;
	display:block;
	width:3%;
	height:100%;
	background:#008bd0;
	z-index:9998;
}

header #layer .border.black {
	height:30%;
	background:#58585a;
	z-index:9999;
}

/* Image Slider */
header #layer .Wallop img {
	display:block !important;
}

header #layer .Wallop-nav {
	padding-top:10px;
}

/* Text Block on Image Slider */
header #layer .title {
	position:absolute;
	bottom:0px;
	padding:20px 20px 0 50px;
	width:100%;
	height:30%;
	color:#fff;
	background:rgba(0,0,0,0.5);
	font-size: 20px;
}

@media only screen and (max-width:980px) {
	header #layer .title {
		padding:10px 30px 0 45px;
		font-size:18px;
	}
}

@media only screen and (max-width:768px) {
	header #layer .title {
		padding:5px 10px 0 35px;
		font-size:13px;
	}
}

@media only screen and (max-width:360px) {
	header #layer .title {
		padding:2px 5px 0 20px;
		font-size:11px;
	}
}

header #layer .Wallop-nav ol {
	text-align:center;
}

header #layer .Wallop-nav ol li {
	display: inline-block;
	float: none;
	width: 6px;
	height: 6px;
	margin: 0px 4px;
	padding: 3px;
	background: transparent none repeat scroll 0% 0%;
	border-radius: 5px;
	overflow: hidden;
	text-indent: -999em;
	border: 2px solid #008bd0;
	cursor: pointer;
	opacity: 0.4;
}

header #layer .Wallop-nav ol li.active {
	background: #008bd0 none repeat scroll 0% 0%;
	cursor: default;
	opacity: 1;
}

/***********************
  NAV
***********************/

#navbar::before {
	display:table;
	content:" ";
	clear:both;
}

#navbar {
  display:table;
  position:relative;
  margin:0px 0 0 0;
  padding:0 50px;
  width:100%;
  background:#008bd0;
  overflow:visible;
}

#navbar ul {
	display:table-row;
}

#navbar li {
  position:relative;
	display: inline-block;
	padding-right: 40px;
  line-height:36px;
}

#navbar li a {
  margin:0;
  padding:0;
  color:#fff;
  line-height:28px;
  text-decoration:none;
}

#navbar > ul > li > a {
}

#navbar li:hover,
#navbar li.active {
}

#navbar li:hover a,
#navbar li.active a {
  color:#fff;
}

/* Level 2 */
#navbar li ul.lvl2 {
  display:none;
  width:auto;
  list-style:none;
  z-index:9999;
}

#navbar li ul.lvl2 li {
  float:none;
  display:block;
  position:relative;
  background: rgba(9,9,9,0.5);
  border-bottom:1px solid #008bd0;
}

#navbar li ul.lvl2 li a {
	padding:0 10px;
	color:#fff;
	white-space:nowrap;
}

#navbar li ul.lvl2 li:hover,
#navbar li ul.lvl2 li.active {
  	background:#fff;
	color:#008bd0;
}

#navbar li ul.lvl2 li:hover a,
#navbar li ul.lvl2 li.active a {
  	color:#008bd0;
}

#navbar li:hover ul.lvl2,
#navbar li.over ul.lvl2 {
	display:block;
	position:absolute;
	top:36px;
	left:-10px;
}

/* Level 3 */
#navbar li ul.lvl3 {
  	display:none;
  	list-style:none;
}

#navbar li ul.lvl3 li a {
  display:block;
  width:auto;
  color:#fff;
}

#navbar li ul.lvl2 li:hover ul.lvl3 a,
#navbar li ul.lvl2 li.active ul.lvl3 a {
  color:#fff;
}

#navbar li ul.lvl2 li ul.lvl3 li:hover a,
#navbar li ul.lvl2 li ul.lvl3 li.active a {
  color:#008bd0;
}

#navbar ul.lvl2 li:hover ul.lvl3 li a {
  white-space:nowrap;
}

#navbar ul.lvl2 li:hover ul.lvl3 {
  display:block;
  position:absolute;
  top:0px;
  left:100%;
  width:auto !important;
}

/***********************
  Mobile Nav
***********************/
#mobile-nav {
	display:none;
}

header #mobile-nav {
	float:right;
	cursor:pointer;
}

header #mobile-nav span {
	padding:5px;
	color:#fff;
	border:1px solid #008bd0;
	border-radius:5px;
	background:#008bd0;
}

@media screen and (max-width: 768px) {
	#navbar ul {
		display:none;
	}

	#navbar {
		height:20px;
	}

	#mobile-nav {
		display:block;
		margin-right:30px;
	}

	#topNav {
		display:none;
	}
}

@media screen and (max-width: 360px) {
	#navbar {
		height:10px;
	}

	#mobile-nav {
		margin-right:20px;
	}
}

#jPanelMenu-menu {
	background-color:#008bd0;
	background-image:none;
}

#jPanelMenu-menu ul li {
	list-style:none;
	text-align:left;
}

#jPanelMenu-menu ul li a {
	display:block;
	padding:10px 0 10px 10px;
	color:#fff;
	text-decoration:none;
	border-bottom:1px solid #fff;
}

/* Level 2 */
#jPanelMenu-menu li ul.lvl2 li a {
	padding-left:20px;
	white-space:nowrap;
	color:#008bd0;
	background-color:#D5ECF8;
}

#jPanelMenu-menu li ul.lvl2 li:hover > a,
#jPanelMenu-menu li ul.lvl2 li.active > a {
  	color:#33bed0;
}

/* Level 3 */

#jPanelMenu-menu li ul.lvl3 li a {
	padding-left:30px;
	white-space:nowrap;
	color:#008bd0;
	background-color:#fff;
	border-bottom:1px solid #008bd0;
}

#jPanelMenu-menu ul.lvl2 li:hover ul.lvl3 li a {
  white-space:nowrap;
}

/***********************
  CONTENT
***********************/

#content {
  padding:0 30px 40px 50px;
  max-width:1000px;
  background:#fff;
}

@media only screen and (max-width:980px) {
	#content {
		padding: 0 30px 20px 45px;
	}
}

@media only screen and (max-width:768px) {
	#content {
		padding: 0 25px 20px 35px;
	}
}

@media only screen and (max-width:360px) {
	#content {
		padding: 0 20px 20px 20px;
	}
}

#content::after {
	display:table;
	content:" ";
	clear:both;
}

#content #breadcrumb {
  margin:10px 0 40px 0;
  width:100%;
  list-style:none;
  z-index:1;
}

#content #breadcrumb li {
  margin:0;
  padding:0;
  display:inline;
  text-decoration:none;
  color:#58585a;
  z-index:1;
  font-size: 13px;
}

#content #breadcrumb li a {
  text-decoration:underline;
  color:#008bd0;
  z-index:1;
  font-size: 13px;
}

#content #breadcrumb .spot {
  font-size: 13px;
}

/* left */
#col-left {
  float:left;
  width:70%;
  padding-right:30px;
  padding-bottom:30px;
}

@media only screen and (max-width:768px) {
	#col-left {
	  width:100%;
	}
}

@media only screen and (max-width:360px) {
	#col-left {
	  padding-right:0;
	}
}

/* right */
#col-right {
  margin:0;
  float:left;
  width:30%;
  color:#58585a;
}

#col-right::after {
	display:table;
	content:" ";
	clear:both;
}

@media only screen and (max-width:768px) {
	#col-right {
	  width:100%;
	}
}

#col-right h1 {
}

#col-right h2 {
  /*color:#008bd0;*/
}

#col-right p {
  margin:0 0 10px;
  color:#58585a;
}

#col-right img {
  margin:10px 0;
}

#col-right a {
	color:#008bd0;
}

#col-right a:hover {
	color:#33BDF3;
}

#col-right .content-element {
  padding:10px 20px;
  background:#d5ecf8;
}

#col-right hr {
	display: block;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-left: auto;
	margin-right: auto;
	border-style: solid;
	border-width: 1px;
	border-color:#008bd0;
	border-color:#58585a;
}

#col-right .csc-menu li {
	margin:0 0 8px 0;
	list-style:none;
}


/***********************
  SEARCH
***********************/
form#mailform {
	margin:20px 0 0 0;
}
#col-left div.csc-header h1 {
	margin: 0 0 0 0;
}
#col-left div.csc-mailform-field label {
	float:left;
	margin: 0 10px 0 0;
	width:100px;
}
#col-left div.csc-mailform-field {
	margin: 0 0 10px 0;
}
#col-left div.csc-mailform-field input,
#col-left div.csc-mailform-field select {
	padding:2px 4px;
	width:200px;
	border:1px solid #008bd0;
	background:#fff;
}
#col-left div.csc-mailform-field select {
	padding:2px 0;
	width:210px;
}
#col-left div.csc-mailform-field input.csc-mailform-submit {
	width:auto;
	color:#fff;
	background:#008bd0;
	cursor:pointer;
}
#col-left h3.csc-searchResultHeader a {
	color:#008bd0;
	text-decoration:none;
}

/***********************
  LOGIN
***********************/

.tx-felogin-pi1 {
	padding:10px;
	background:#D5ECF8;
}

.tx-felogin-pi1 form {
	padding:10px 0;
}

.tx-felogin-pi1 form fieldset div {
	padding:5px 0;
}

.tx-felogin-pi1 form legend {
	display:none;
}

.tx-felogin-pi1 form input {
	border:none;
	padding:3px;
}

.tx-felogin-pi1 form input[type=submit] {
	color:#fff;
	background:#008bd0;
	cursor:pointer;
}

.tx-srfeuserregister-pi1 legend {
    padding:0;
}

.tx-srfeuserregister-pi1 p {
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
    text-indent: 0;
}

/***********************
  TABLE
***********************/

table.contenttable {
	margin:20px 0 0 0;
	background: transparent;
	border-collapse: collapse;
}

table.contenttable td,
table.contenttable th {
}

table.contenttable th {
	padding:2px 4px;
	font-weight: bold;
	color: #008bd0;
	border-bottom: 1px solid #58585a;
	text-align: left;
}

table.contenttable td {
	margin:0;
	padding:2px 4px;
	border-bottom: 1px solid #58585a;
	vertical-align: top;
}

div.responsiv-table {
	width: 100%;
	min-width: 200px;
	overflow: auto;
}


/* Ganz ohne linien */

/* Gitter */

/* Bild vergr��erung */

/* E-Mail versand geht nicht */

/***********************
  FOOTER
***********************/

footer {
	display:block;
	position:relative;
	padding-left:30px;
	max-width: 1000px;
	background:#d5ecf8 url(../images/schilf.png) no-repeat scroll right bottom;
}

footer img {
	width:auto;
}

footer a {
	text-decoration:none;
	color:#008BD0;
}

footer a:hover {
	color:#33BDF3;
}

footer .content {
	height:100%;
}

footer .content > .border-deco {
	position:absolute;
	top:0px;
	left:0px;
	width:30px;
	height:100%;
	background-color:#008BD0;
}

footer #service {
	padding:10px 10px 10px 20px;
	height:80%;
	box-sizing: border-box;
}

footer #service li {
	list-style:none;
}

footer #address {
	padding: 5px 5px 5px 20px;
	height:20%;
	background: rgba(0,0,0,0.2);
}

@media only screen and (max-width: 999px) {
	footer #address {
		display:none;
	}
}

footer #address * {
}

footer #address .border-deco {
	position:absolute;
	bottom:0px;
	left:0px;
	width:30px;
	height:20%;
	background-color:#58585a;
}

footer .toTop {
	position:absolute;
	top:10px;
	right:30px;
	cursor:pointer;
	z-index:9933;
}

footer .deco {
	position:absolute;
	right:0px;
	bottom:0px;
	width:auto;
	height:100%;
	z-index:9930;
}

footer .content::after {
	display:table;
	content:" ";
	clear:both;
}

footer::after {
	display:table;
	content:" ";
	clear:both;
}

@media only screen and (max-width: 768px) {

	footer #address,
	footer #service
	{
		width:100%;
	}
}






div.csc-textpic-center .csc-textpic-center-outer {
    float: none;
    position: relative;
    right: none;
}

div.csc-textpic-center .csc-textpic-center-inner {
    float: none;
    position: relative;
    right: none;
}

dl.csc-menu dt a {
	color: #008bd0;
}

dl.csc-menu dd {
	margin-bottom: 10px;
}


/***********************
  RSS FEED DISPLAY
***********************/

#content .tx-rssdisplay {}

#content .tx-rssdisplay h3 {
}

#content .tx-rssdisplay .tx-rssdisplay-item-title {
	display: block;
}

#content .tx-rssdisplay h3 a {
	display: block;
	font-size: 15px;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding-right: 40px;
	color: #585858;
	text-decoration: none;
	background-image: url(../images/icon-arrow-down.png);
	background-repeat: no-repeat;
	background-position: center right;
	transition: all 0.5s ease-in;
}

#content .tx-rssdisplay h3.active a {
	background-image: url(../images/icon-arrow-up.png);
}

#content .tx-rssdisplay .tx-rssdisplay-list {
	margin: 0;
	padding: 0;
}

#content .tx-rssdisplay .tx-rssdisplay-list .tx-rssdisplay-item {
	margin: 0 0 30px 0;
	padding: 0;
	list-style: none;
}

#content .tx-rssdisplay .tx-rssdisplay-list .tx-rssdisplay-item table {
	transition: all 0.5s ease-in;
}

#content .tx-rssdisplay .tx-rssdisplay-list .tx-rssdisplay-item table td,
#content .tx-rssdisplay .tx-rssdisplay-list .tx-rssdisplay-item table th {
	padding: 4px 10px;
}

#content .tx-rssdisplay .tx-rssdisplay-list .tx-rssdisplay-item table a {
	padding: 4px 10px;
	color: #fff;
	text-decoration: none;
	background: #008bd0;
	cursor: pointer;
}

.tx-felogin-pi1 label {
    display: block;
}

div.csc-textpic .csc-textpic-imagewrap img {
    border: none;
    display: block;
}

div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
    margin-bottom: 0px;
}

div.csc-textpic .csc-textpic-imagewrap figure,
div.csc-textpic figure.csc-textpic-imagewrap {
    margin: 0;
    display: table;
}

#tx_indexedsearch {
    margin: 20px 0 0 0;
}

ul.tx-indexedsearch-browsebox {
    margin: 0 0 20px 0;
}

ul.tx-indexedsearch-browsebox li {
    display: inline-block;
    list-style: none;
    margin: 0 10px 0 0 !important;
    padding: 0 !important;
}

.csc-space-before-extra-small {
    padding-top: 10px !important;
}
.csc-space-before-small {
    padding-top: 20px !important;
}
.csc-space-before-medium {
    padding-top: 30px !important;
}
.csc-space-before-large {
    padding-top: 40px !important;
}
.csc-space-before-extra-large {
    padding-top: 50px !important;
}

.csc-space-after-extra-small {
    padding-bottom: 10px !important;
}
.csc-space-after-small {
    padding-bottom: 20px !important;
}
.csc-space-after-medium {
    padding-bottom: 30px !important;
}
.csc-space-after-large {
    padding-bottom: 40px !important;
}
.csc-space-after-extra-large {
    padding-bottom: 50px !important;
}

#content header {
    background: none;
}

.frame-type-felogin_login {
    padding: 10px;
    background: #D5ECF8;
}

.frame-type-felogin_login form fieldset label {
    padding-top: 10px;
    display: block;
}

.frame-type-felogin_login form fieldset label input {
    display: block;
    border: 0;
    padding: 3px;
}

.frame-type-felogin_login form fieldset input[type="submit"] {
    color: #fff;
    background: #008bd0;
    cursor: pointer;
    border: 0;
    padding: 3px;
    margin-top: 10px;
}

.frame-type-felogin_login form + a {
    display: block;
    color: #008bd0;
    margin-top: 25px;
    margin-bottom: 20px;
}

.frame-type-felogin_login form + a:hover {
    color: #33bed0;
}

#col-right figure.image {
    display: table;
}