@font-face { font-family: 'ABeeZee';
             src: url('bilder/font/ABeeZee/ABeeZee-Regular.ttf') format('truetype'); }

@font-face { font-family: 'Signika';
             src: url('bilder/font/Signika/Signika-Regular.ttf') format('truetype'); }	

@font-face { font-family: 'PT_Sans_Caption';
             src: url('bilder/font/PT_Sans_Caption/PT_Sans-Caption-Web-Regular.ttf') format('truetype'); }
			 
*{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body, html{
	margin: 0px;
	padding: 0px;
	font-family: 'ABeeZee',Veranda,Sans-serif;
	font-size: 100%;
	background: url('navy_blue.png');
}

h1, h2, h3, h4, h5, h6, legend, th{
	text-align: center;
	font-family: 'Signika',Veranda, Sans-serif;
	font-weight: bold;
}

h1{
	color: white;
	font-size: 36px;
	-webkit-text-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	-moz-text-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	text-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
}

header{
	vertical-align: middle;
}

legend{
	padding: 5px 10px;
}

a{
	color: #000000;
	font-weight: bold;
	text-decoration: none;
}
a:hover{
	color: #f8b500;
}

table{
	border-collapse: collapse;
	border: 1px solid #DDDDDD;
}

th{
	background: #fceabb;
	background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
	background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 );
	padding: 5px 10px;
	text-align: center;
	border: 1px solid #DDDDDD;
}

tr{
}

td{
	padding: 5px;
	border: 1px solid #DDDDDD;
}
article{
	padding: 0px !important;
	vertical-align: top;
}

#main{
	padding: 0px;
	width: 100%;
	max-width: 600px;
	background: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	/*-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.5);
	box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.5);
	*/
	-webkit-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	-moz-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
}

.quadrat{
	float: left;
	display: inline-block;
	width: 50%;
	text-align: center;
	top: 0px;
}
.quadrat:hover{
	cursor: pointer;
	background-color: #EEEEEE;
}
.bilder{
	height: 150px;
}

#layer{
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	position: fixed;
	z-index: 55555;
	top: 0px;
	left: 0px;
	display: none;
}

#infobox{
	width: 600px;
	-webkit-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	-moz-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
	position: fixed;
	left: 50%;
	top: 100px;
	margin-left: -300px;
	z-index: 99999;
	background: #FFFFFF;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display: none;
}

#infohead{
	-webkit-border-radius: 3px 3px 0px 0px;
	-moz-border-radius: 3px 3px 0px 0px;
	border-radius: 3px 3px 0px 0px;
	font-weight: bold;
	font-size: 20px;
	font-family: 'Signika',Veranda, Sans-serif;
	padding: 10px;
	background: #fceabb;
	background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
	background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 );
}

#infobody{
	padding: 10px;
}

#infonavy{
	text-align: right;
	padding: 10px;
}

#logo{
	width: 100%;
	vertical-align: middle;
	margin: 10px;
}
#leiste{
	padding: 10px 20px 10px 20px;
	background: #fceabb;
	background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
	background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 );
}

.leiste_button{
	-webkit-border-radius: 6px 6px 0px 0px;
	-moz-border-radius: 6px 6px 0px 0px;
	border-radius: 6px 6px 0px 0px;
	padding: 5px 10px 15px 10px;
	font-weight: bold;
}

.leiste_button:hover{
	cursor: pointer;
	padding-bottom: -10px;
}

.aktiv{
	background: white;
	padding-bottom: -10px;
}

#infoclose:hover{
	cursor: pointer;
}

#inhalt{
	padding: 0px !important;
}

#terminliste{
	margin: 20px 0px;
}
.termine{
	margin: 5px;
	padding: 10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border: 1px solid #EEEEEE;
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%);
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
	background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
}
.termin-inhalt{
}
.termin-beschreibung{
	font-weight: bold;
	text-align: center;
	padding-bottom: 10px;
}
.termin-frist{
	text-align: center;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 10px;
	padding: 5px;
	font-size: 80%;
	border: 1px solid #febf01;
	background: #ffff88;
	background: -moz-linear-gradient(top,  #ffff88 0%, #ffff88 100%);
	background: -webkit-linear-gradient(top,  #ffff88 0%,#ffff88 100%);
	background: linear-gradient(to bottom,  #ffff88 0%,#ffff88 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffff88', endColorstr='#ffff88',GradientType=0 );
}

.info, .fehler, .okay{
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 10px;
	padding: 20px;
	font-size: 80%;
}

.info{
	border: 1px solid #febf01;
	background: #ffff88;
	background: -moz-linear-gradient(top,  #ffff88 0%, #ffff88 100%);
	background: -webkit-linear-gradient(top,  #ffff88 0%,#ffff88 100%);
	background: linear-gradient(to bottom,  #ffff88 0%,#ffff88 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffff88', endColorstr='#ffff88',GradientType=0 );
}
.fehler{
	border: 1px solid #ff1a00;
	background: #ff9084;
	background: -moz-linear-gradient(top,  #ff9084 0%, #ff5c49 100%);
	background: -webkit-linear-gradient(top,  #ff9084 0%,#ff5c49 100%);
	background: linear-gradient(to bottom,  #ff9084 0%,#ff5c49 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9084', endColorstr='#ff5c49',GradientType=0 );
}
.okay{
	border: 1px solid #85AD20;
	background: #b6e026;
	background: -moz-linear-gradient(top,  #b6e026 0%, #a5cc26 100%);
	background: -webkit-linear-gradient(top,  #b6e026 0%,#a5cc26 100%);
	background: linear-gradient(to bottom,  #b6e026 0%,#a5cc26 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b6e026', endColorstr='#a5cc26',GradientType=0 );
}

fieldset{
	margin-bottom: 20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.seite{
	width: 20%;
}

.mitte{
	width: 60%;
	text-align: center;
}

.float-left{
	float: left;
}

.clear{
	clear: both;
}

.button{
	color: black;
	background: #fceabb;
	background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
	background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 );
	font-weight: bold;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border: 1px solid #f8b500;
	padding: 5px 10px;
	margin: 2px;
}
.button:hover{
	cursor: pointer;
	background: #f8b500;
}
.button:disabled{
	cursor: not-allowed;
	background: #EEEEEE;
	border: 1px solid #DDDDDD;
	color: #DDDDDD;
}
#status{
	padding: 2px;
}
.link{
	color: black;
}
.link:hover{
	cursor: pointer;
	color: #9CDB15;
}

.textfeld, .textarea{
	font-size: 100%;
	font-family: "Courier New", Courier, monospace;
	border: 1px solid #f8b500;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	padding: 5px;
	margin: 5px 0px;
}
.textfeld{
	width: 200px;
}
.textarea{
	width: 100%;
}
.textfeld:focus, .textarea:focus{
	-webkit-box-shadow: 0px 0px 20px 0px rgba(248,181,0,1);
	-moz-box-shadow: 0px 0px 20px 0px rgba(248,181,0,1);
	box-shadow: 0px 0px 20px 0px rgba(248,181,0,1);
}

.the-icons{
	display: inline-block;
}

footer{
	text-align: center;
	padding: 20px;
	color: grey;
	font-size: 12px;
	background-color: #DDDDDD;
	-webkit-border-radius: 0px 0px 3px 3px;
	-moz-border-radius: 0px 0px 3px 3px;
	border-radius: 0px 0px 3px 3px;
}



/* ----------------  mobil  ------------------- */

@media all and (max-width:600px){
	.bilder{
		width: 95%;
		height: auto;
	}
	.textfeld{
		width: auto;
		min-width: 200px;
	}
	#main{
		margin-top: 0px;
		margin-bottom: 0px;
	}
	.buttontext{
		display: none;
	}
	.quadrat{
		display: block;
		width: 100%;
	}
	#infobox{
		width: 90%;
		-webkit-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
		-moz-box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
		box-shadow: 0px 0px 40px 0px rgba(255,255,255,0.5);
		position: fixed;
		margin-left: auto;
		margin-right: auto;
		z-index: 99999;
		background: #FFFFFF;
		left: 5%;
		top: 20px;
	}
}

/* --------------------- Icons ----------------------------- */
@font-face {
      font-family: 'fontello';
      src: url('./font/fontello.eot?58204035');
      src: url('./font/fontello.eot?58204035#iefix') format('embedded-opentype'),
           url('./font/fontello.woff?58204035') format('woff'),
           url('./font/fontello.ttf?58204035') format('truetype'),
           url('./font/fontello.svg?58204035#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
     
     
    .demo-icon
    {
      font-family: "fontello";
      font-style: normal;
      font-weight: normal;
      speak: none;
     
      display: inline-block;
      text-decoration: inherit;
      width: 1em;
      margin-right: .2em;
      text-align: center;
      /* opacity: .8; */
     
      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;
     
      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;
     
      /* Animation center compensation - margins should be symmetric */
      /* remove if not needed */
      margin-left: .2em;
     
      /* You can be more comfortable with increased icons size */
      /* font-size: 120%; */
     
      /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
     
      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
    }