@charset "UTF-8";
/* @import url('https://fonts.googleapis.com/css?family=Maven+Pro:400,500,700'); */
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,700');
/* Syncopate, Abel, Montserrat */

html, body {
    margin: 0;
    height: 100%;
}

html {
	background-color: #fff;
}

body {
	background-color: #fff;
	background: #fff;
	font-size: 17px;
	padding: 30px!important;
	font-family: "Montserrat", sans-serif;
	color: #000;
}

@media print {
	body {
		font-family: Helvetica;
	}
}

table, td {
	padding:0;
	border-spacing:0;
    border-collapse:separate;
}

.main_menu {
	font-size:18px;
	padding-top:15px;
	font-weight:900;
	color:white;
	text-align:center;
}

h1 {
	font-size: 24px;
	text-transform: uppercase;
	text-align:center;
	margin: 0 auto;
	margin-bottom: 40px;
	padding-bottom: 14px;
	border-bottom: 1px solid #aaa;
	width: 50%;
	/*white-space: nowrap;*/
}

h2 {
	font-size: 22px;
	margin-bottom: 20px;
	padding-bottom: 8px;
}

h3 {
	font-size: 18px;
	margin-bottom: 20px;
	padding-bottom: 8px;
	color: #42acdc;
	text-align:center;
}

h4 {
	font-size: 10px;
	margin-bottom: 5px;
	color: #42acdc;
}

h5 {
	font-size: 14px;
	margin-top: 0px;
	margin-bottom: 10px;
	padding-bottom: 0px;
	color: #42acdc;
	text-align:center;
}

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	color: #111;
}

.box {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 31.303%;
	margin: 0 1% 50px 1%;
}

.box_filter {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 23%;
	margin: 0 1% 0 1%;
}

.box_navigation {
	cursor:pointer;
	color:#fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border:1px solid #ccc;
	border-bottom-style: none;
	padding: 24px;
	-webkit-border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border-radius: 8px;
	font-size: 20px;
	font-weight:500;
}

.box_navigation_h2 {
	margin:0px;
	margin-left:50px;
}

.zoom_linie {
	margin-left:50px;
	height:2px;
	width:100px;
	background-color:#eee;
}

.box_head {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border:2px solid #ccc;
	border-bottom-style: none;
	padding: 10px 24px 10px 24px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	font-size: 20px;
	font-weight:500;
	text-transform: uppercase;
	color:white;
}

.box_body {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border:2px solid #ccc;
	padding: 24px;
	-webkit-border-bottom-right-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	-moz-border-radius-bottomright: 8px;
	-moz-border-radius-bottomleft: 8px;
	border-bottom-right-radius: 8px;
	border-bottom-left-radius: 8px;
}

.hellblau {
	background: #42acdc;
	background: -moz-linear-gradient(top,  #42acdc 0%, #3b9dc6 100%);
	background: -webkit-linear-gradient(top,  #42acdc 0%,#3b9dc6 100%);
	background: linear-gradient(to bottom,  #42acdc 0%,#3b9dc6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42acdc', endColorstr='#3b9dc6',GradientType=0 );
}

.orange {
	background: #ff7300;
}

.dunkelblau {
	background: #3c69ab;
}

.gelb {
	background: #ffcc00;
}

input, select, textarea {
	width:100%;
	padding:3px;
}

input[type='checkbox']{
	margin-left:50%;
}

/* animation: name duration timing-function delay iteration-count direction fill-mode play-state; */
.delayed_icons {
	position:fixed;
	right:10px;
	color:lightgrey;
	font-size:30px;
	opacity: 0;
	-webkit-animation: delayed_icons .5s ease .5s both;
	animation: delayed_icons .5s ease .5s both;
}
@-webkit-keyframes delayed_icons {
	to { opacity: 1; }
}
@keyframes delayed_icons {
	to { opacity: 1; }
}
.delayed_icons:hover {
	color:#42acdc;
	transform: scale(1.2);
}


.content {
	position:relative;
}

.hilfe {
	display:none;
}

/* +++ Zoom Menü +++ */

.zoomIn {
	-webkit-animation: zoomIn .5s ease both;
	animation: zoomIn .5s ease both;
}
@-webkit-keyframes zoomIn {
	to { opacity: 0; -webkit-transform: scale(1.2); }
}
@keyframes zoomIn {
	to { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }
}


.zoomInNeueSeite {
	-webkit-animation: zoomInNeueSeite .5s ease both;
	animation: zoomInNeueSeite .5s ease both;
}
@-webkit-keyframes zoomInNeueSeite {
	from { opacity: 0; -webkit-transform: scale(.8); }
}
@keyframes zoomInNeueSeite {
	from { opacity: 0; -webkit-transform: scale(.8); transform: scale(.8); }
}


.zoomOut {
	-webkit-animation: zoomOut .5s ease both;
	animation: zoomOut .5s ease both;
}
@-webkit-keyframes zoomOut {
	to { opacity: 0; -webkit-transform: scale(.8); }
}
@keyframes zoomOut {
	to { opacity: 0; -webkit-transform: scale(.8); transform: scale(.8); }
}


.zoomOutNeueSeite {
	-webkit-animation: zoomOutNeueSeite .5s ease both;
	animation: zoomOutNeueSeite .5s ease both;
}
@-webkit-keyframes zoomOutNeueSeite {
	from { opacity: 0; -webkit-transform: scale(1.2); }
}
@keyframes zoomOutNeueSeite {
	from { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }
}

.zoom_icon {
	font-size:100px;
}
/* --- Zoom Menü --- */

.button_1 {
	margin-right:20px;
	margin-bottom:10px;
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.button_1:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.button_1:active {
	position:relative;
	top:1px;
}

.login-page {
  width: 320px;
  padding: 8% 0 0;
  margin: auto;
}
.form {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 360px;
  margin: 0 auto 100px;
  padding: 45px;
  text-align: center;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form input {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 14px;
}
.form button {
  text-transform: uppercase;
  outline: 0;
  background: #42acdc;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form button:hover,.form button:active,.form button:focus {
  background: #52bcec;
}
.form .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form .message a {
  color: #42acdc;
  text-decoration: none;
}
.form .register-form {
  display: none;
}
.container {
  position: relative;
  z-index: 1;
  max-width: 300px;
  margin: 0 auto;
}
.container:before, .container:after {
  content: "";
  display: block;
  clear: both;
}
.container .info {
  margin: 50px auto;
  text-align: center;
}
.container .info h1 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 36px;
  font-weight: 300;
  color: #1a1a1a;
}
.container .info span {
  color: #4d4d4d;
  font-size: 12px;
}
.container .info span a {
  color: #000000;
  text-decoration: none;
}
.container .info span .fa {
  color: #EF3B3A;
}

@media print, screen and (max-width: 1366px) {
	.box_navigation_h2 {
		font-size: 19px;
	}
	.zoom_icon {
		font-size:69px;
	}
}

@media print, screen and (max-width: 1280px) {
	.box {
		width: 48%;
		margin: 0 1% 50px 1%;
	}
	.box_navigation_h2 {
		font-size: 20px;
		margin:0px;
		margin-left:50px;
	}
	.zoom_icon {
		font-size:100px;
	}
}

@media print, screen and (max-width: 1024px) {
	.box_filter {
		width: 48%;
		margin: 0 1% 0 1%;
	}
	.box_navigation_h2 {
		font-size: 17px;
		margin-left:0px;
	}
	.zoom_linie {
		margin-left:0px;
	}
}

@media print, screen and (max-width: 640px) {
	.main_menu {
		font-size:13px;
		padding-top:15px;
		font-weight:900;
		color:white;
		text-align:center;
	}
	.box {
		width: 98%;
		margin: 0 1% 30px 1%;
	}
	.box_filter {
		width: 98%;
		margin: 0 1% 0 1%;
	}
	.box_navigation_h2 {
		font-size: 18px;
		margin:0px;
		margin-left:0px;
	}
	.zoom_icon {
		font-size:69px;
	}
	.zoom_linie {
		margin-left:0px;
	}
}

/* -----------------------
  Form
----------------------- */
.form-control {
  border-radius: 0;
}
.form-control:focus {
  box-shadow: none;
}
.form-group {
  position: relative;
  margin-bottom: 25px;
}
.form-group > label {
  margin-left:10px;
  text-transform: uppercase;
  font-size: 10px;
  color: #a1a2a3;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale(1.4);
          transform: scale(1.4);
  pointer-events: none;
  position: relative;
  z-index: 5;
}
.form-group > input {
  width: 100%;
}
.form-group > label {
  transition: -webkit-transform 0.4s;
  transition: transform 0.4s;
  transition: transform 0.4s, -webkit-transform 0.4s;
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale(1.4) translateY(24px);
          transform: scale(1.4) translateY(24px);
}
.form-group.not-empty > label {
  -webkit-transform: none;
          transform: none;
}
/*------------------------------
	Form
------------------------------*/
.form-control {
  border: 0;
}
.form-control,
.form-control:focus,
.form-control:focus:hover {
  outline: none;
}

.searching {
	background: url("images/ui-anim_basic_16x16.gif") right center no-repeat;
}

/*------------------------------
	Diagramme
------------------------------*/

canvas {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}