html {
  box-sizing: border-box
}

*, *:before, *:after {
  box-sizing: inherit
}

/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */

html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}

body {
  margin: 0
}

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
  display: block
}

audio, canvas, progress, video {
  display: inline-block
}

progress {
  vertical-align: baseline
}

audio:not([controls]) {
  display: none;
  height: 0
}

[hidden], template {
  display: none
}

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects
}

a:active, a:hover {
  outline-width: 0
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted
}

dfn {
  font-style: italic
}

mark {
  background: #ff0;
  color: #000
}

small {
  font-size: 80%
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}

sub {
  bottom: -0.25em
}

sup {
  top: -0.5em
}

figure {
  margin: 1em 40px
}

img {
  border-style: none;
  height: auto;
  max-width: 100%;
}

svg:not(:root) {
  overflow: hidden
}

code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible
}

button, input, select, textarea {
  font: inherit;
  margin: 0
}

optgroup {
  font-weight: bold
}

button, input {
  overflow: visible
}

button, select {
  text-transform: none
}

button, html [type=button], [type=reset], [type=submit] {
  -webkit-appearance: button
}

button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0
}

button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: .35em .625em .75em
}

legend {
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal
}

textarea {
  overflow: auto
}

[type=checkbox], [type=radio] {
  padding: 0
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px
}

[type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit
}

/* End extract */

/* Biehl Webdesign UG (haftungsbeschränkt) */

html, body {
  font-family: Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
}

#fixed-part {
  position: fixed;
  z-index: 100;
  width: 100%;
}

#scrolling-part {
  position: relative;
  width: 100%;
  overflow: hidden;
}

html {
  overflow-x: hidden
}

/* Font-Sizes */

h1 {
  font-size: 36px;
}

h2 {
  font-size: 30px
}

h3 {
  font-size: 24px
}

h4 {
  font-size: 20px
}

h5 {
  font-size: 18px
}

h6 {
  font-size: 16px
}

button {
  font-size: 16px
}

p {
  font-size: 18px;
}

.bwd-menu-text {
  font-size: 16px !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  margin: 6px 0
}

button {
  cursor: pointer;
  padding: 8px;
}

.bwd-wide {
  letter-spacing: 4px
}

hr {
  border: 0;
  border-top: 1px solid #eee;
  margin: 20px 0
}

.bwd-image {
  max-width: 100%;
  height: auto
}

img {
  vertical-align: middle
}

a {
  color: inherit
}

.bwd-table, .bwd-table-all {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  display: table
}

.bwd-table-all, .bwd-table-all tr td {
  border: 1px solid #ccc
}

.bwd-bordered tr, .bwd-table-all tr {
  border-bottom: 1px solid #ddd
}

.bwd-striped tbody tr:nth-child(even) {
  background-color: #f1f1f1
}

.bwd-table-all tr:nth-child(odd) {
  background-color: #fff
}

.bwd-table-all tr:nth-child(even) {
  background-color: #f1f1f1
}

.bwd-hoverable tbody tr:hover, .bwd-ul.bwd-hoverable li:hover {
  background-color: #ccc
}

.bwd-centered tr th, .bwd-centered tr td {
  text-align: center
}

.bwd-table td, .bwd-table th, .bwd-table-all td, .bwd-table-all th {
  padding: 8px 8px;
  display: table-cell;
  text-align: center;
  vertical-align: center;
}

.bwd-table th:first-child, .bwd-table td:first-child, .bwd-table-all th:first-child, .bwd-table-all td:first-child {
  padding-left: 16px
}

.bwd-btn, .bwd-button {
  border: none;
  display: inline-block;
  padding: 8px 16px;
  vertical-align: middle;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background-color: inherit;
  text-align: center;
  cursor: pointer;
  white-space: nowrap
}

.bwd-btn:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.bwd-btn, .bwd-button {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.bwd-disabled, .bwd-btn:disabled, .bwd-button:disabled {
  cursor: not-allowed;
  opacity: 0.3
}

.bwd-disabled *, :disabled * {
  pointer-events: none
}

.bwd-btn.bwd-disabled:hover, .bwd-btn:disabled:hover {
  box-shadow: none
}

.bwd-ul {
  list-style-type: none;
  padding: 0;
  margin: 0
}

.bwd-ul li {
  padding: 8px 16px;
  border-bottom: 1px solid #ddd
}

.bwd-ul li:last-child {
  border-bottom: none
}

.bwd-tooltip, .bwd-display-container {
  position: relative
}

.bwd-tooltip .bwd-text {
  display: none
}

.bwd-tooltip:hover .bwd-text {
  display: inline-block
}

.bwd-ripple:active {
  opacity: 0.5
}

.bwd-ripple {
  transition: opacity 0s
}

.bwd-input {
  padding: 8px;
  display: block;
  border: none;
  border-bottom: 1px solid #ccc;
  width: 100%
}

.bwd-select {
  padding: 9px 0;
  width: 100%;
  border: none;
  border-bottom: 1px solid #ccc
}

.bwd-dropdown-click, .bwd-dropdown-hover {
  position: relative;
  display: inline-block;
  cursor: pointer
}

.bwd-dropdown-hover:hover .bwd-dropdown-content {
  display: block
}

.bwd-dropdown-hover:first-child, .bwd-dropdown-click:hover {
  background-color: #ccc;
  color: #000
}

.bwd-dropdown-hover:hover>.bwd-button:first-child, .bwd-dropdown-click:hover>.bwd-button:first-child {
  background-color: #ccc;
  color: #000
}

.bwd-dropdown-content {
  cursor: auto;
  color: #000;
  background-color: #fff;
  display: none;
  position: absolute;
  min-width: 160px;
  margin: 0;
  padding: 0;
  z-index: 1
}

.bwd-check, .bwd-radio {
  width: 24px;
  height: 24px;
  position: relative;
  top: 6px
}

.bwd-sidebar {
  height: 100%;
  width: 200px;
  background-color: #fff;
  position: fixed !important;
  z-index: 1;
  overflow: auto
}

.bwd-bar-block .bwd-dropdown-hover, .bwd-bar-block .bwd-dropdown-click {
  width: 100%
}

.bwd-bar-block .bwd-dropdown-hover .bwd-dropdown-content, .bwd-bar-block .bwd-dropdown-click .bwd-dropdown-content {
  min-width: 100%
}

.bwd-bar-block .bwd-dropdown-hover .bwd-button, .bwd-bar-block .bwd-dropdown-click .bwd-button {
  width: 100%;
  text-align: left;
  padding: 8px 16px
}

.bwd-main, #main {
  transition: margin-left .4s
}

.bwd-modal {
  z-index: 3;
  display: none;
  padding-top: 100px;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4)
}

.bwd-modal-content {
  margin: auto;
  background-color: #fff;
  position: relative;
  padding: 0;
  outline: 0;
  width: 600px
}

.bwd-bar {
  width: 100%;
  overflow: hidden
}

.bwd-center .bwd-bar {
  display: inline-block;
  width: auto
}

.bwd-bar .bwd-bar-item {
  padding: 8px 16px;
  float: left;
  width: auto;
  border: none;
  display: block;
  outline: 0
}

.bwd-bar .bwd-dropdown-hover, .bwd-bar .bwd-dropdown-click {
  position: static;
  float: left
}

.bwd-bar .bwd-button {
  white-space: normal
}

.bwd-bar-block .bwd-bar-item {
  width: 100%;
  display: block;
  padding: 8px 16px;
  text-align: left;
  border: none;
  white-space: normal;
  float: none;
  outline: 0
}

.bwd-bar-block.bwd-center .bwd-bar-item {
  text-align: center
}

.bwd-block {
  display: block;
  width: 100%
}

.bwd-responsive {
  display: block;
  overflow-x: auto
}

.bwd-container:after, .bwd-container:before, .bwd-panel:after, .bwd-panel:before, .bwd-row:after, .bwd-row:before, .bwd-row-padding-8:after, .bwd-row-padding-8:before, .bwd-row-padding-4:after, .bwd-row-padding-4:before, .bwd-cell-row:before, .bwd-cell-row:after, .bwd-clear:after, .bwd-clear:before, .bwd-bar:before, .bwd-bar:after {
  content: "";
  display: table;
  clear: both
}

.bwd-col, .bwd-half, .bwd-third, .bwd-twothird, .bwd-threequarter, .bwd-quarter {
  float: left;
  width: 100%
}

.bwd-col.s1 {
  width: 8.33333%
}

.bwd-col.s2 {
  width: 16.66666%
}

.bwd-col.s3 {
  width: 24.99999%
}

.bwd-col.s4 {
  width: 33.33333%
}

.bwd-col.s5 {
  width: 41.66666%
}

.bwd-col.s6 {
  width: 49.99999%
}

.bwd-col.s7 {
  width: 58.33333%
}

.bwd-col.s8 {
  width: 66.66666%
}

.bwd-col.s9 {
  width: 74.99999%
}

.bwd-col.s10 {
  width: 83.33333%
}

.bwd-col.s11 {
  width: 91.66666%
}

.bwd-col.s12 {
  width: 99.99999%
}

.bwd-margin-left-s12 {
  margin-left: 100%
}

.bwd-margin-left-s11 {
  margin-left: 91.66666667%
}

.bwd-margin-left-s10 {
  margin-left: 83.33333333%
}

.bwd-margin-left-s9 {
  margin-left: 75%
}

.bwd-margin-left-s8 {
  margin-left: 66.66666667%
}

.bwd-margin-left-s7 {
  margin-left: 58.33333333%
}

.bwd-margin-left-s6 {
  margin-left: 50%
}

.bwd-margin-left-s5 {
  margin-left: 41.66666667%
}

.bwd-margin-left-s4 {
  margin-left: 33.33333333%
}

.bwd-margin-left-s3 {
  margin-left: 25%
}

.bwd-margin-left-s2 {
  margin-left: 16.66666667%
}

.bwd-margin-left-s1 {
  margin-left: 8.33333333%
}

.bwd-margin-left-s0 {
  margin-left: 0
}

@media (min-width:601px) {
  .bwd-col.m1 {
    width: 8.33333%
  }
  .bwd-col.m2 {
    width: 16.66666%
  }
  .bwd-col.m3, .bwd-quarter {
    width: 24.99999%
  }
  .bwd-col.m4, .bwd-third {
    width: 33.33333%
  }
  .bwd-col.m5 {
    width: 41.66666%
  }
  .bwd-col.m6, .bwd-half {
    width: 49.99999%
  }
  .bwd-col.m7 {
    width: 58.33333%
  }
  .bwd-col.m8, .bwd-twothird {
    width: 66.66666%
  }
  .bwd-col.m9, .bwd-threequarter {
    width: 74.99999%
  }
  .bwd-col.m10 {
    width: 83.33333%
  }
  .bwd-col.m11 {
    width: 91.66666%
  }
  .bwd-col.m12 {
    width: 99.99999%
  }
  .bwd-margin-left-m12 {
    margin-left: 100%
  }
  .bwd-margin-left-m11 {
    margin-left: 91.66666667%
  }
  .bwd-margin-left-m10 {
    margin-left: 83.33333333%
  }
  .bwd-margin-left-m9 {
    margin-left: 75%
  }
  .bwd-margin-left-m8 {
    margin-left: 66.66666667%
  }
  .bwd-margin-left-m7 {
    margin-left: 58.33333333%
  }
  .bwd-margin-left-m6 {
    margin-left: 50%
  }
  .bwd-margin-left-m5 {
    margin-left: 41.66666667%
  }
  .bwd-margin-left-m4 {
    margin-left: 33.33333333%
  }
  .bwd-margin-left-m3 {
    margin-left: 25%
  }
  .bwd-margin-left-m2 {
    margin-left: 16.66666667%
  }
  .bwd-margin-left-m1 {
    margin-left: 8.33333333%
  }
  .bwd-margin-left-m0 {
    margin-left: 0
  }
}

@media (min-width:993px) {
  .bwd-col.l1 {
    width: 8.33333%
  }
  .bwd-col.l2 {
    width: 16.66666%
  }
  .bwd-col.l3 {
    width: 24.99999%
  }
  .bwd-col.l4 {
    width: 33.33333%
  }
  .bwd-col.l5 {
    width: 41.66666%
  }
  .bwd-col.l6 {
    width: 49.99999%
  }
  .bwd-col.l7 {
    width: 58.33333%
  }
  .bwd-col.l8 {
    width: 66.66666%
  }
  .bwd-col.l9 {
    width: 74.99999%
  }
  .bwd-col.l10 {
    width: 83.33333%
  }
  .bwd-col.l11 {
    width: 91.66666%
  }
  .bwd-col.l12 {
    width: 99.99999%
  }
  .bwd-margin-left-l12 {
    margin-left: 100%
  }
  .bwd-margin-left-l11 {
    margin-left: 91.66666667%
  }
  .bwd-margin-left-l10 {
    margin-left: 83.33333333%
  }
  .bwd-margin-left-l9 {
    margin-left: 75%
  }
  .bwd-margin-left-l8 {
    margin-left: 66.66666667%
  }
  .bwd-margin-left-l7 {
    margin-left: 58.33333333%
  }
  .bwd-margin-left-l6 {
    margin-left: 50%
  }
  .bwd-margin-left-l5 {
    margin-left: 41.66666667%
  }
  .bwd-margin-left-l4 {
    margin-left: 33.33333333%
  }
  .bwd-margin-left-l3 {
    margin-left: 25%
  }
  .bwd-margin-left-l2 {
    margin-left: 16.66666667%
  }
  .bwd-margin-left-l1 {
    margin-left: 8.33333333%
  }
  .bwd-margin-left-l0 {
    margin-left: 0
  }
}

.bwd-content {
  max-width: 980px;
  margin: auto
}

.bwd-rest {
  overflow: hidden
}

.bwd-cell-row {
  display: table;
  width: 100%
}

.bwd-cell {
  display: table-cell
}

.bwd-cell-top {
  vertical-align: top
}

.bwd-cell-middle {
  vertical-align: middle
}

.bwd-cell-bottom {
  vertical-align: bottom
}

.bwd-hide {
  display: none !important
}

.bwd-show-block, .bwd-show {
  display: block !important
}

.bwd-show-inline-block {
  display: inline-block !important
}

@media (max-width:600px) {
  .bwd-modal-content {
    margin: 0 10px;
    width: auto !important
  }
  .bwd-modal {
    padding-top: 30px
  }
  .bwd-dropdown-hover.bwd-mobile .bwd-dropdown-content, .bwd-dropdown-click.bwd-mobile .bwd-dropdown-content {
    position: relative
  }
  .bwd-hide-small {
    display: none !important
  }
  .bwd-mobile {
    display: block;
    width: 100% !important
  }
  .bwd-bar-item.bwd-mobile, .bwd-dropdown-hover.bwd-mobile, .bwd-dropdown-click.bwd-mobile {
    text-align: center
  }
  .bwd-dropdown-hover.bwd-mobile, .bwd-dropdown-hover.bwd-mobile .bwd-btn, .bwd-dropdown-hover.bwd-mobile .bwd-button, .bwd-dropdown-click.bwd-mobile, .bwd-dropdown-click.bwd-mobile .bwd-btn, .bwd-dropdown-click.bwd-mobile .bwd-button {
    width: 100%
  }
}

@media (max-width:768px) {
  .bwd-modal-content {
    width: 500px
  }
  .bwd-modal {
    padding-top: 50px
  }
}

@media (min-width:993px) {
  .bwd-modal-content {
    width: 900px
  }
  .bwd-hide-large {
    display: none !important
  }
  .bwd-sidebar.bwd-collapse {
    display: block !important
  }
}

@media (max-width:992px) and (min-width:601px) {
  .bwd-hide-medium {
    display: none !important
  }
}

@media (max-width:992px) {
  .bwd-sidebar.bwd-collapse {
    display: none
  }
  .bwd-main {
    margin-left: 0 !important;
    margin-right: 0 !important
  }
}

.bwd-top, .bwd-bottom {
  position: fixed;
  width: 100%;
  z-index: 1
}

.bwd-top {
  top: 0
}

.bwd-bottom {
  bottom: 0
}

.bwd-overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2
}

.bwd-display-topleft {
  position: absolute;
  left: 0;
  top: 0
}

.bwd-display-topright {
  position: absolute;
  right: 0;
  top: 0
}

.bwd-display-bottomleft {
  position: absolute;
  left: 0;
  bottom: 0
}

.bwd-display-bottomright {
  position: absolute;
  right: 0;
  bottom: 0
}

.bwd-display-middle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%)
}

.bwd-display-middle.bwd-size-half {
  width: 50%;
  height: 50%;
}

.bwd-display-left {
  position: absolute;
  top: 50%;
  left: 0%;
  transform: translate(0%, -50%);
  -ms-transform: translate(-0%, -50%)
}

.bwd-display-right {
  position: absolute;
  top: 50%;
  right: 0%;
  transform: translate(0%, -50%);
  -ms-transform: translate(0%, -50%)
}

.bwd-display-topmiddle {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%)
}

.bwd-display-bottommiddle {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%)
}

.bwd-display-container:hover .bwd-display-hover {
  display: block
}

.bwd-display-container:hover span.bwd-display-hover {
  display: inline-block
}

.bwd-display-hover {
  display: none
}

.bwd-display-position {
  position: absolute
}

.bwd-circle {
  border-radius: 50%
}

.bwd-round-small {
  border-radius: 2px
}

.bwd-round-medium {
  border-radius: 4px
}

.bwd-round-large {
  border-radius: 8px
}

.bwd-round-xlarge {
  border-radius: 16px
}

.bwd-round-xxlarge {
  border-radius: 32px
}

.bwd-border-none {
  border-style: none;
}

.bwd-border-solid {
  border-style: solid;
}

.bwd-border-dotted {
  border-style: dotted;
}

.bwd-border-dashed {
  border-style: dashed;
}


.bwd-height-50 {
  height: 50px !important;
}

.bwd-height-100 {
  height: 100px !important;
}

.bwd-height-150 {
  height: 150px !important;
}

.bwd-height-200 {
  height: 200px !important;
}

.bwd-height-250 {
  height: 250px !important;
}

.bwd-height-300 {
  height: 300px !important;
}

.bwd-height-350 {
  height: 350px !important;
}

.bwd-height-400 {
  height: 400px !important;
}

.bwd-height-450 {
  height: 450px !important;
}

.bwd-height-500 {
  height: 500px !important;
}

.bwd-height-550 {
  height: 550px !important;
}

.bwd-height-600 {
  height: 600px !important;
}

.bwd-height-650 {
  height: 650px !important;
}

.bwd-height-700 {
  height: 700px !important;
}

.bwd-height-750 {
  height: 750px !important;
}

.bwd-background-image {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.bwd-container, .bwd-panel {
  padding: 0.01em 16px
}

.bwd-no-shadow {
  box-shadow: 0;
}

.bwd-card, .bwd-card-2 {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
}

.bwd-card-4, .bwd-hover-shadow:hover, .bwd-shadow {
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19)
}

.bwd-spin {
  animation: bwd-spin 2s infinite linear
}

.image-hover {
  transition: transform .3s ease-out;
  display: inline-block;
}

.image-hover:hover {
  transform: translate(0, -5px);
}

@keyframes bwd-spin {
  0% {
    transform: rotate(0deg)
  }
  100% {
    transform: rotate(359deg)
  }
}

.bwd-animate-fading {
  animation: fading 10s infinite
}

@keyframes fading {
  0% {
    opacity: 0
  }
  50% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

.bwd-animate-opacity {
  animation: opac 0.8s
}

@keyframes opac {
  from {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

.bwd-animate-top {
  position: relative;
  animation: animatetop 0.4s
}

@keyframes animatetop {
  from {
    top: -300px;
    opacity: 0
  }
  to {
    top: 0;
    opacity: 1
  }
}

.bwd-animate-left {
  position: relative;
  animation: animateleft 0.4s
}

@keyframes animateleft {
  from {
    left: -300px;
    opacity: 0
  }
  to {
    left: 0;
    opacity: 1
  }
}

.bwd-animate-right {
  position: relative;
  animation: animateright 0.4s
}

@keyframes animateright {
  from {
    right: -300px;
    opacity: 0
  }
  to {
    right: 0;
    opacity: 1
  }
}

.bwd-animate-bottom {
  position: relative;
  animation: animatebottom 0.4s
}

@keyframes animatebottom {
  from {
    bottom: -300px;
    opacity: 0
  }
  to {
    bottom: 0;
    opacity: 1
  }
}

.bwd-animate-zoom {
  animation: animatezoom 0.6s
}

@keyframes animatezoom {
  from {
    transform: scale(0)
  }
  to {
    transform: scale(1)
  }
}

.bwd-animate-input {
  transition: width 0.4s ease-in-out
}

.bwd-animate-input:focus {
  width: 100% !important
}

.bwd-opacity-1, .bwd-hover-opacity-1:hover {
  opacity: 1
}

.bwd-opacity-90, .bwd-hover-opacity-90:hover {
  opacity: 0.9
}

.bwd-opacity-80, .bwd-hover-opacity-80:hover {
  opacity: 0.8
}

.bwd-grayscale, .bwd-hover-grayscale:hover {
  filter: grayscale(100%)
}

.bwd-blur, .bwd-hover-blur:hover {
  filter: blur(4px);
}

.bwd-filter-none, .bwd-hover-filter-none:hover {
  filter: none
}

.bwd-overflow-hidden {
  overflow: hidden;
}

.bwd-overflow-visible {
  overflow: visible;
}

.bwd-sepia, .bwd-hover-sepia:hover {
  filter: sepia(100%)
}

.bwd-hover-scale-125, .bwd-hover-scale-11 {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
}

.bwd-scale-11, .bwd-hover-scale-11:hover {
  -webkit-transition: all 400ms ease-in-out;
  -webkit-transform: scale(1.1);
  -ms-transition: all 400ms ease-in-out;
  -ms-transform: scale(1.1);
  -moz-transition: all 400ms ease-in-out;
  -moz-transform: scale(1.1);
  transition: all 400ms ease-in-out;
  transform: scale(1.1);
}

.bwd-scale-125, .bwd-hover-scale-125:hover {
  -webkit-transition: all 400ms ease-in-out;
  -webkit-transform: scale(1.25);
  -ms-transition: all 400ms ease-in-out;
  -ms-transform: scale(1.25);
  -moz-transition: all 400ms ease-in-out;
  -moz-transform: scale(1.25);
  transition: all 400ms ease-in-out;
  transform: scale(1.25);
}

.bwd-hover-translate-up {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
}

.bwd-translate-up, .bwd-hover-translate-up:hover {
  transform: translate(-10px, 0px);
  -ms-transform: translate(-10px, 0px);
  -webkit-transform: translate(-10px, 0px);
}

.bwd-font-size-10 {
  font-size: 10px !important
}

.bwd-font-size-12 {
  font-size: 12px !important
}

.bwd-font-size-15 {
  font-size: 15px !important
}

.bwd-font-size-18 {
  font-size: 18px !important
}

.bwd-font-size-24 {
  font-size: 24px !important
}

.bwd-font-size-36 {
  font-size: 36px !important
}

.bwd-font-size-48 {
  font-size: 48px !important
}

.bwd-font-size-64 {
  font-size: 64px !important
}

.bwd-text-align-left {
  text-align: left !important
}

.bwd-text-align-right {
  text-align: right !important
}

.bwd-text-align-justify {
  text-align: justify !important
}

.bwd-text-align-center {
  text-align: center !important
}

.bwd-text-decoration-none, .bwd-hover-text-decoration-none {
  text-decoration: none !important;
}

.bwd-text-decoration-underline, .bwd-hover-text-decoration-underline {
  text-decoration: underline !important;
}

.bwd-text-decoration-dotted, .bwd-hover-text-decoration-dotted {
  text-decoration: dotted !important;
}

.bwd-border-0 {
  border: 0 !important
}

.bwd-border-width-1 {
  border-width: 1px;
}

.bwd-border-width-2 {
  border-width: 2px;
}

.bwd-border {
  border: 1px solid #ccc !important
}

.bwd-border-top {
  border-top: 1px solid #ccc !important
}

.bwd-border-bottom {
  border-bottom: 1px solid #ccc !important
}

.bwd-border-left {
  border-left: 1px solid #ccc !important
}

.bwd-border-right {
  border-right: 1px solid #ccc !important
}

.bwd-topbar {
  border-top: 6px solid #ccc !important
}

.bwd-bottombar {
  border-bottom: 6px solid #ccc !important
}

.bwd-leftbar {
  border-left: 6px solid #ccc !important
}

.bwd-rightbar {
  border-right: 6px solid #ccc !important
}

.bwd-section, .bwd-code {
  margin-top: 16px !important;
  margin-bottom: 16px !important
}

.bwd-margin-0 {
  margin: 0 !important;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-margin-start: 0;
  -webkit-margin-end: 0;
}

.bwd-margin-4 {
  margin: 4px !important
}

.bwd-margin-8 {
  margin: 8px !important
}

.bwd-margin-16 {
  margin: 16px !important
}

.bwd-margin-24 {
  margin: 24px !important
}

.bwd-margin-top-8 {
  margin-top: 8px !important
}

.bwd-margin-top-16 {
  margin-top: 16px !important
}

.bwd-margin-top-24 {
  margin-top: 24px !important
}

.bwd-margin-top-32 {
  margin-top: 32px !important
}

.bwd-margin-top-48 {
  margin-top: 48px !important
}

.bwd-margin-top-64 {
  margin-top: 64px !important
}

.bwd-margin-bottom-16 {
  margin-bottom: 16px !important
}

.bwd-margin-bottom-32 {
  margin-bottom: 32px !important
}

.bwd-margin-left {
  margin-left: 16px !important
}

.bwd-margin-right {
  margin-right: 16px !important
}

.bwd-padding-0 {
  padding: 0 !important
}

.bwd-row-padding-4 {
  padding-left: 4px !important;
  padding-right: 4px !important
}

.bwd-row-padding-8 {
  padding-left: 8px !important;
  padding-right: 8px !important
}

.bwd-row-padding-16 {
  padding-left: 16px !important;
  padding-right: 16px !important
}

.bwd-padding-topbottom-8 {
  padding-top: 8px !important;
  padding-bottom: 8px !important
}

.bwd-padding-topbottom-16 {
  padding-top: 16px !important;
  padding-bottom: 16px !important
}

.bwd-padding-topbottom-24 {
  padding-top: 24px !important;
  padding-bottom: 24px !important
}

.bwd-padding-topbottom-32 {
  padding-top: 32px !important;
  padding-bottom: 32px !important
}

.bwd-padding-topbottom-48 {
  padding-top: 48px !important;
  padding-bottom: 48px !important
}

.bwd-padding-topbottom-64 {
  padding-top: 64px !important;
  padding-bottom: 64px !important
}

.bwd-left {
  float: left !important
}

.bwd-right {
  float: right !important
}

.bwd-button:hover {
  color: #000 !important;
  background-color: #ccc !important
}

.bwd-transparent, .bwd-hover-none:hover {
  background-color: transparent !important
}

.bwd-color-transparent, .bwd-hover-color-transparent:hover {
  color: #000 !important;
}

.bwd-hover-none:hover {
  box-shadow: none !important
}

/* Colors */

/* Material Background-Color from https://material-ui.com/style/color/  */

/* client colors  */

/* primary */

.bwd-background-color-primary, .bwd-hover-background-color-primary:hover {
  color: #000;
  background-color: #c0887d !important;
}

.bwd-background-color-primary-light, .bwd-hover-background-color-primary-light:hover {
  color: #000;
  background-color: #f4b8ac !important;
}

.bwd-background-color-primary-dark, .bwd-hover-background-color-primary-dark:hover {
  color: #FFF;
  background-color: #8e5b51 !important;
}


/* secondary */

.bwd-background-color-secondary, .bwd-hover-background-color-secondary:hover {
  color: #FFF;
  background-color: #c60e3b !important;
}

.bwd-background-color-secondary-light, .bwd-hover-background-color-secondary-light:hover {
  color: #000;
  background-color: #ff5265 !important;
}

.bwd-background-color-secondary-dark, .bwd-hover-background-color-secondary-dark:hover {
  color: #FFF;
  background-color: #8e0016 !important;
}


/* fixed colors */


/* greysclae */

.bwd-background-color-black, .bwd-hover-background-color-black:hover {
  color: #FFF;
  background-color: #000 !important;
}

.bwd-background-color-darkGrey, .bwd-hover-background-color-darkGrey:hover {
  color: #FFF;
  background-color: #424242 !important;
}

.bwd-background-color-grey, .bwd-hover-background-color-grey:hover {
  color: #000;
  background-color: #9E9E9E !important;
}

.bwd-background-color-lightGrey, .bwd-hover-background-color-lightGrey:hover {
  color: #000;
  background-color: #E0E0E0 !important;
}

.bwd-background-color-blueGrey, .bwd-hover-background-color-blueGrey:hover {
  color: #000;
  background-color: #607D8B !important;
}

.bwd-background-color-white, .bwd-hover-background-color-white:hover {
  color: #000;
  background-color: #FFF !important;
}

.bwd-background-color-red, .bwd-hover-background-color-red:hover {
  color: #FFF;
  background-color: #F44336 !important;
}

.bwd-background-color-pink, .bwd-hover-background-color-pink:hover {
  color: #FFF;
  background-color: #E91E63 !important;
}

.bwd-background-color-purple, .bwd-hover-background-color-purple:hover {
  color: #FFF;
  background-color: #9C27B0 !important;
}

.bwd-background-color-deepPurple, .bwd-hover-background-color-deepPurple:hover {
  color: #FFF;
  background-color: #673AB7 !important;
}

.bwd-background-color-indigo, .bwd-hover-background-color-indigo:hover {
  color: #FFF;
  background-color: #3F51B5 !important;
}

.bwd-background-color-blue, .bwd-hover-background-color-blue:hover {
  color: #FFF;
  background-color: #2196F3 !important;
}

.bwd-background-color-lightBlue, .bwd-hover-background-color-lightBlue:hover {
  color: #000;
  background-color: #03A9F4 !important;
}

.bwd-background-color-cyan, .bwd-hover-background-color-cyan:hover {
  color: #000;
  background-color: #00BCD4 !important;
}

.bwd-background-color-teal, .bwd-hover-background-color-teal:hover {
  color: #FFF;
  background-color: #009688 !important;
}

.bwd-background-color-green, .bwd-hover-background-color-green:hover {
  color: #000;
  background-color: #4CAF50 !important;
}

.bwd-background-color-lightGreen, .bwd-hover-background-color-lightGreen:hover {
  color: #000;
  background-color: #8BC34A !important;
}

.bwd-background-color-lime, .bwd-hover-background-color-lime:hover {
  color: #000;
  background-color: #CDDC39 !important;
}

.bwd-background-color-yellow, .bwd-hover-background-color-yellow:hover {
  color: #000;
  background-color: #FFEB3B !important;
}

.bwd-background-color-amber, .bwd-hover-background-color-amber:hover {
  color: #000;
  background-color: #FFC107 !important;
}

.bwd-background-color-orange, .bwd-hover-background-color-orange:hover {
  color: #000;
  background-color: #FF9800 !important;
}

.bwd-background-color-deepOrange, .bwd-hover-background-color-deepOrange:hover {
  color: #FFF;
  background-color: #FF5722 !important;
}

.bwd-background-color-brown, .bwd-hover-background-color-brown:hover {
  color: #FFF;
  background-color: #795548 !important;
}


/* client colors  */


/* primary */

.bwd-color-primary, .bwd-hover-color-primary:hover {
  color: #c0887d !important;
}

.bwd-color-primary-light, .bwd-hover-color-primary-light:hover {
  color: #f4b8ac !important;
}

.bwd-color-primary-dark, .bwd-hover-color-primary-dark:hover {
  color: #8e5b51 !important;
}


/* secondary */

.bwd-color-secondary, .bwd-hover-color-secondary:hover {
  color: #c60e3b !important;
}

.bwd-color-secondary-light, .bwd-hover-color-secondary-light:hover {
  color: #ff5265 !important;
}

.bwd-color-secondary-dark, .bwd-hover-color-secondary-dark:hover {
  color: #8e0016 !important;
}


/* fixed colors */


/* greysclae */

.bwd-color-black, .bwd-hover-color-black:hover {
  color: #000 !important;
}

.bwd-color-darkGrey, .bwd-hover-color-darkGrey:hover {
  color: #424242 !important;
}

.bwd-color-grey, .bwd-hover-color-grey:hover {
  color: #9E9E9E !important;
}

.bwd-color-lightGrey, .bwd-hover-color-lightGrey:hover {
  color: #E0E0E0 !important;
}

.bwd-color-blueGrey, .bwd-hover-color-blueGrey:hover {
  color: #607D8B !important;
}

.bwd-color-white, .bwd-hover-color-white:hover {
  color: #FFF !important;
}

.bwd-color-red, .bwd-hover-color-red:hover {
  color: #F44336 !important;
}

.bwd-color-pink, .bwd-hover-color-pink:hover {
  color: #E91E63 !important;
}

.bwd-color-purple, .bwd-hover-color-purple:hover {
  color: #9C27B0 !important;
}

.bwd-color-deepPurple, .bwd-hover-color-deepPurple:hover {
  color: #673AB7 !important;
}

.bwd-color-indigo, .bwd-hover-color-indigo:hover {
  color: #3F51B5 !important;
}

.bwd-color-blue, .bwd-hover-color-blue:hover {
  color: #2196F3 !important;
}

.bwd-color-lightBlue, .bwd-hover-color-lightBlue:hover {
  color: #03A9F4 !important;
}

.bwd-color-cyan, .bwd-hover-color-cyan:hover {
  color: #00BCD4 !important;
}

.bwd-color-teal, .bwd-hover-color-teal:hover {
  color: #009688 !important;
}

.bwd-color-green, .bwd-hover-color-green:hover {
  color: #4CAF50 !important;
}

.bwd-color-lightGreen, .bwd-hover-color-lightGreen:hover {
  color: #8BC34A !important;
}

.bwd-color-lime, .bwd-hover-color-lime:hover {
  color: #CDDC39 !important;
}

.bwd-color-yellow, .bwd-hover-color-yellow:hover {
  color: #FFEB3B !important;
}

.bwd-color-amber, .bwd-hover-color-amber:hover {
  color: #FFC107 !important;
}

.bwd-color-orange, .bwd-hover-color-orange:hover {
  color: #FF9800 !important;
}

.bwd-color-deepOrange, .bwd-hover-color-deepOrange:hover {
  color: #FF5722 !important;
}

.bwd-color-brown, .bwd-hover-color-brown:hover {
  color: #795548 !important;
}

.bwd-color-grey, .bwd-hover-color-grey:hover {
  color: #9E9E9E !important;
}

.bwd-color-darkGrey, .bwd-hover-color-darkGrey:hover {
  color: #424242 !important;
}

.bwd-color-lightGrey, .bwd-hover-color-lightGrey:hover {
  color: #E0E0E0 !important;
}

.bwd-color-blueGrey, .bwd-hover-color-blueGrey:hover {
  color: #607D8B !important;
}

.bwd-color-black, .bwd-hover-color-black:hover {
  color: #000 !important;
}


/* client colors  */


/* primary */

.bwd-border-color-primary, .bwd-hover-border-color-primary:hover {
  border-color: #c0887d !important;
}

.bwd-border-color-primary-light, .bwd-hover-border-color-primary-light:hover {
  border-color: #f4b8ac !important;
}

.bwd-border-color-primary-dark, .bwd-hover-border-color-primary-dark:hover {
  border-color: #8e5b51 !important;
}


/* secondary */

.bwd-border-color-secondary, .bwd-hover-border-color-secondary:hover {
  border-color: #c60e3b !important;
}

.bwd-border-color-secondary-light, .bwd-hover-border-color-secondary-light:hover {
  border-color: #ff5265 !important;
}

.bwd-border-color-secondary-dark, .bwd-hover-border-color-secondary-dark:hover {
  border-color: #8e0016 !important;
}


/* fixed border-colors */


/* greysclae */

.bwd-border-color-black, .bwd-hover-border-color-black:hover {
  border-color: #000 !important;
}

.bwd-border-color-darkGrey, .bwd-hover-border-color-darkGrey:hover {
  border-color: #424242 !important;
}

.bwd-border-color-grey, .bwd-hover-border-color-grey:hover {
  border-color: #9E9E9E !important;
}

.bwd-border-color-lightGrey, .bwd-hover-border-color-lightGrey:hover {
  border-color: #E0E0E0 !important;
}

.bwd-border-color-blueGrey, .bwd-hover-border-color-blueGrey:hover {
  border-color: #607D8B !important;
}

.bwd-border-color-white, .bwd-hover-border-color-white:hover {
  border-color: #FFF !important;
}

.bwd-border-color-red, .bwd-hover-border-color-red:hover {
  border-color: #F44336 !important;
}

.bwd-border-color-pink, .bwd-hover-border-color-pink:hover {
  border-color: #E91E63 !important;
}

.bwd-border-color-purple, .bwd-hover-border-color-purple:hover {
  border-color: #9C27B0 !important;
}

.bwd-border-color-deepPurple, .bwd-hover-border-color-deepPurple:hover {
  border-color: #673AB7 !important;
}

.bwd-border-color-indigo, .bwd-hover-border-color-indigo:hover {
  border-color: #3F51B5 !important;
}

.bwd-border-color-blue, .bwd-hover-border-color-blue:hover {
  border-color: #2196F3 !important;
}

.bwd-border-color-lightBlue, .bwd-hover-border-color-lightBlue:hover {
  border-color: #03A9F4 !important;
}

.bwd-border-color-cyan, .bwd-hover-border-color-cyan:hover {
  border-color: #00BCD4 !important;
}

.bwd-border-color-teal, .bwd-hover-border-color-teal:hover {
  border-color: #009688 !important;
}

.bwd-border-color-green, .bwd-hover-border-color-green:hover {
  border-color: #4CAF50 !important;
}

.bwd-border-color-lightGreen, .bwd-hover-border-color-lightGreen:hover {
  border-color: #8BC34A !important;
}

.bwd-border-color-lime, .bwd-hover-border-color-lime:hover {
  border-color: #CDDC39 !important;
}

.bwd-border-color-yellow, .bwd-hover-border-color-yellow:hover {
  border-color: #FFEB3B !important;
}

.bwd-border-color-amber, .bwd-hover-border-color-amber:hover {
  border-color: #FFC107 !important;
}

.bwd-border-color-orange, .bwd-hover-border-color-orange:hover {
  border-color: #FF9800 !important;
}

.bwd-border-color-deepOrange, .bwd-hover-border-color-deepOrange:hover {
  border-color: #FF5722 !important;
}

.bwd-border-color-brown, .bwd-hover-border-color-brown:hover {
  border-color: #795548 !important;
}

.bwd-border-color-grey, .bwd-hover-border-color-grey:hover {
  border-color: #9E9E9E !important;
}

.bwd-border-color-darkGrey, .bwd-hover-border-color-darkGrey:hover {
  border-color: #424242 !important;
}

.bwd-border-color-lightGrey, .bwd-hover-border-color-lightGrey:hover {
  border-color: #E0E0E0 !important;
}

.bwd-border-color-blueGrey, .bwd-hover-border-color-blueGrey:hover {
  border-color: #607D8B !important;
}

.bwd-border-color-black, .bwd-hover-border-color-black:hover {
  border-color: #000 !important;
}

.bwd-min-height-300 {
  min-height: 300px;
}

/* responsive Menu */

.menubar-demo {
  margin: 0px auto;
  padding: 0px !important;
  font-size: 13px;
}

.menubar-navigation {
  display: inline-block;
}

a.menubar-backLink {
  float: right;
  margin-bottom: 10px;
}

.menubar-sub-menu, .menubar-ace-responsive-menu {
  margin: 0px;
  padding: 0px;
}

.menubar-ace-responsive-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  float: left;
  text-align: left;
  /*width:100%;*/
}

.menubar-ace-responsive-menu li {
  list-style: none;
}

.menubar-ace-responsive-menu li ul {
  display: none;
}

.menubar-ace-responsive-menu>li {
  display: block;
  margin: 0;
  padding: 0;
  border: 0px;
  float: left;
}

.menubar-ace-responsive-menu>li>a {
  display: block;
  position: relative;
  margin: 0;
  border: 0px;
  padding: 18px 20px 18px 12px;
  text-decoration: none;
  font-size: 16px;
  font-weight: 300;
}

.menubar-ace-responsive-menu li ul.menubar-sub-menu li a i {
  padding-right: 10px;
}

.menubar-ace-responsive-menu li .menubar-menu-active {
  position: relative;
}

.menubar-ace-responsive-menu li a i {
  padding-right: 5px;
}

.menubar-ace-responsive-menu>li>a i {
  font-size: 16px;
  line-height:1.5 !important;
  text-shadow: none;
}

.bwd-menu-text {
  height: 24px !important;
  padding: 0;
  margin: 0;
  text-shadow: none;
}

.menubar-ace-responsive-menu>li>ul.menubar-sub-menu {
  display: none;
  list-style: none;
  clear: both;
  margin: 0;
  position: absolute;
}

.menubar-ace-responsive-menu li ul.menubar-sub-menu>li {
  width: 185px;
}

.menubar-ace-responsive-menu li ul.menubar-sub-menu li a {
  display: block;
  margin: 0px 0px;
  padding: 12px 20px 12px 15px;
  text-decoration: none;
  font-size: 13px;
  font-weight: normal;
  background: none;
}

.menubar-ace-responsive-menu>li>ul.menubar-sub-menu>li {
  position: relative;
}

.menubar-ace-responsive-menu>li>ul.menubar-sub-menu>li ul.menubar-sub-menu {
  position: absolute;
  left: 185px;
  top: 0px;
  display: none;
  list-style: none;
}

.menubar-ace-responsive-menu>li>ul.menubar-sub-menu>li ul.menubar-sub-menu>li ul.menubar-sub-menu {
  position: absolute;
  left: 185px;
  top: 0px;
  display: none;
  list-style: none;
}

/* Menu Toggle Btn
----------------------------------------*/

.menubar-menu-toggle {
  display: none;
  float: left;
  width: 100%;
}

.menubar-menu-toggle h3 {
  float: left;
  padding: 0px 10px;
  font-weight: 600;
  font-size: 16px;
  margin-top: 1em;
  margin-bottom: 1em;
}

.menubar-menu-toggle .menubar-icon-bar {
  display: block !important;
  width: 18px;
  height: 2px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  margin: 3px;
}

.menubar-menu-toggle #menu-btn {
  float: right;
  padding: 8px;
  border-radius: 5px;
  cursor: pointer;
  margin: 10px;
}

.menubar-hide-menu {
  display: none;
}

.menubar-logo-container {
  display: block;
  width: 100%;
  overflow: hidden;
}

/* responsive */

@media screen and (max-width: 601px) {
  .menubar-logo-container {
    display: none;
  }
  .menubar-navigation {
    display: block;
  }
  .menubar-demo {
    text-align: left;
  }
  .menubar-ace-responsive-menu {
    float: left;
    width: 100%;
  }
  .menubar-ace-responsive-menu>li {
    float: none;
  }
  .menubar-ace-responsive-menu>li>a i {
    padding-right: 10px;
  }
  .menubar-ace-responsive-menu>li>a>.menubar-arrow {
    float: right;
  }
  li.menubar-menu-active>a>.menubar-arrow {
    transform: rotate(180deg);
    rotation-point: 50% 50%;
  }
  .menubar-ace-responsive-menu li ul.menubar-sub-menu>li {
    width: 100%;
  }
  .menubar-ace-responsive-menu li ul.menubar-sub-menu li ul.menubar-sub-menu li a {
    padding-left: 30px;
  }
  .menubar-ace-responsive-menu li ul.menubar-sub-menu li ul.menubar-sub-menu li ul.menubar-sub-menu li a {
    padding-left: 50px;
  }
  .menubar-ace-responsive-menu>li>ul.menubar-sub-menu {
    position: static;
  }
  .menubar-ace-responsive-menu>li>ul.menubar-sub-menu>li ul.menubar-sub-menu {
    position: static;
  }
  .menubar-ace-responsive-menu>li>ul.menubar-sub-menu>li ul.menubar-sub-menu>li ul.menubar-sub-menu {
    position: static;
  }
}

/* Extrastyles für Elemente */

hr {
  display: block;
  border: none;
  outline: none;
  height: 1px;
  width: 100%;
  margin: 0 auto 15px;
  clear: both;
}

/* Style the tab */

.tab {
  overflow: hidden;
  border-bottom: 1px solid #ccc;
  background-color: #eeee;
}

/* Style the buttons inside the tab */

.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

/* Change background color of buttons on hover */

.tab button:hover {
  background-color: #fff;
  color: #0095eb;
}

/* Create an active/current tablink class */

.tab button.active-tab {
  background-color: #fff;
  color: #0095eb;
}

/* Style the tab content */

.tabcontent {
  display: none;
  padding: 6px 12px;
  /*border: 1px solid #ccc;
    border-top: none;*/
}

/* accordion styles */

.accordion {
  outline: none;
  transition: 0.4s;
}

.active-accordion, .accordion:hover {
  background-color: #ccc;
}

.accordion:after {
  content: '\25BC';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active-accordion:after {
  content: "\25B2";
}

.panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

/* timeline styles */

/* The actual timeline (the vertical ruler) */

.timeline {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

/* The actual timeline (the vertical ruler) */

.timeline::after {
  content: '';
  position: absolute;
  width: 6px;
  background-color: white;
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -3px;
}

/* Container around content */

.timeline-container {
  padding: 10px 40px;
  position: relative;
  background-color: inherit;
  width: 50%;
}

/* The circles on the timeline */

.timeline-container::after {
  content: '';
  position: absolute;
  width: 25px;
  height: 25px;
  right: -17px;
  background-color: white;
  border: 4px solid #FF9F55;
  top: 15px;
  border-radius: 50%;
  z-index: 1;
}

/* Place the timeline-container to the left */

.timeline-left {
  left: 0;
}

/* Place the timeline-container to the right */

.timeline-right {
  left: 50%;
}

/* Add arrows to the left timeline-container (pointing right) */

.timeline-left::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  right: 30px;
  border: medium solid white;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent white;
}

/* Add arrows to the right timeline-container (pointing left) */

.timeline-right::before {
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  left: 30px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */

.timeline-right::after {
  left: -16px;
}

/* The actual content */

.timeline-content {
  padding: 20px 30px;
  background-color: white;
  position: relative;
  border-radius: 6px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */

@media screen and (max-width: 600px) {
  /* Place the timelime to the left */
  .timeline::after {
    left: 31px;
  }
  /* Full-width containers */
  .timeline-container {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
  }
  /* Make sure that all arrows are pointing leftwards */
  .timeline-container::before {
    left: 60px;
    border: medium solid white;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
  }
  /* Make sure all circles are at the same spot */
  .timeline-left::after, .timeline-right::after {
    left: 15px;
  }
  /* Make all right containers behave like the left ones */
  .timeline-right {
    left: 0%;
  }
}

/* flatbox */

.flatbox div .flatbox-sitemenu {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  -webkit-transform: translate(-50%, -100%);
}

.flatbox:hover div .flatbox-sitemenu {
  transform: translate(-50%, -0%);
  -ms-transform: translate(-50%, -0%);
  -webkit-transform: translate(-50%, -0%);
}

.flatbox div img {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
}

.flatbox:hover div img {
  transform: translate(-10px, 0px);
  -ms-transform: translate(-10px, 0px);
  -webkit-transform: translate(-10px, 0px);
}

/* Trailerbox */

.trailer-box div div img {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  opacity: 1;
}

.trailer-box:hover div img {
  opacity: 0.9;
}

.trailer-box div div p, .trailer-box div div h2 {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
}

.trailer-box:hover div div p, .trailer-box:hover div div h2 {
  transform: translate(0px, -30px);
  -ms-transform: translate(0px, -30px);
  -webkit-transform: translate(0px, -30px);
}

.trailer-box div div hr {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  -ms-transform: scaleX(0);
  /* IE 9 */
  -webkit-transform: scaleX(0);
  /* Safari */
  transform: scaleX(0);
  /* Standard syntax */
}

.trailer-box:hover div div hr {
  -ms-transform: scaleX(1);
  /* IE 9 */
  -webkit-transform: scaleX(1);
  /* Safari */
  transform: scaleX(1);
  /* Standard syntax */
}

/* zoom Box */

.zoom-box div img {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  opacity: 1;
  -webkit-transition: all 200ms ease-in-out;
  -webkit-transform: scale(1);
  -ms-transition: all 200ms ease-in-out;
  -ms-transform: scale(1);
  -moz-transition: all 200ms ease-in-out;
  -moz-transform: scale(1);
  transition: all 200ms ease-in-out;
  transform: scale(1);
}

.zoom-box:hover div img {
  opacity: 0.7;
  -webkit-transition: all 200ms ease-in-out;
  -webkit-transform: scale(1.1);
  -ms-transition: all 200ms ease-in-out;
  -ms-transform: scale(1.1);
  -moz-transition: all 200ms ease-in-out;
  -moz-transform: scale(1.1);
  transition: all 200ms ease-in-out;
  transform: scale(1.1);
}

.zoom-box div div p {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
  opacity: 0;
}

.zoom-box:hover div div p {
  transform: translate(0px, -30px);
  -ms-transform: translate(0px, -30px);
  -webkit-transform: translate(0px, -30px);
  opacity: 1
}

.zoom-box div div hr {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  -ms-transform: scaleX(0);
  /* IE 9 */
  -webkit-transform: scaleX(0);
  /* Safari */
  transform: scaleX(0);
  /* Standard syntax */
}

.zoom-box:hover div div hr {
  -ms-transform: scaleX(1);
  /* IE 9 */
  -webkit-transform: scaleX(1);
  /* Safari */
  transform: scaleX(1);
  /* Standard syntax */
}

/* story board */

.story-board img, .story-board h2 {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  opacity: 0.8;
}

.story-board:hover img, .story-board:hover h2 {
  opacity: 1;
}

.story-board hr {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  -ms-transform: scaleX(0);
  /* IE 9 */
  -webkit-transform: scaleX(0);
  /* Safari */
  transform: scaleX(0);
  /* Standard syntax */
  transform-origin: 0% 50%;
}

.story-board:hover hr {
  -ms-transform: scaleX(1);
  /* IE 9 */
  -webkit-transform: scaleX(1);
  /* Safari */
  transform: scaleX(1);
  /* Standard syntax */
}

/* Swiper models */

.swiper-container[data-slider-model="cube"] {
  width: 300px;
  height: 300px;
  /*position: absolute;*/
  left: 50%;
  top: 50%;
  margin-left: -150px;
  margin-top: -150px;
}

.swiper-container[data-slider-model="cube"] .swiper-wrapper .swiper-slide {
  background-position: center;
  background-size: cover;
}

.swiper-container[data-slider-model="coverflow"] {
  width: 100%;
  padding-top: 50px;
  padding-bottom: 50px;
}

.swiper-container[data-slider-model="coverflow"] .swiper-wrapper .swiper-slide {
  background-position: center;
  background-size: cover;
  /*width: 300px;*/
  width: 80%;
  margin-left: 10%;
  height: 300px;

}

.swiper-container[data-slider-model="vertical-slides"] {
  width: 100%;
  height: 300px;
  margin-left: auto;
  margin-right: auto;
}

/* Kontaktformular */

.form-control {
  padding: 13px 13px 13px 50px !important;
  background-color: transparent;
  border-radius: 4px;
  border: 2px solid #fff;
  height: auto;
  color: #fff;
  width: 100%;


  /* form Icon */
  background-size: 20px auto;
  background-position: 15px 12px;
  background-repeat: no-repeat;
}








.referencen-grid div,
.referencen-grid img {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}

.referencen-grid:hover img {
  filter: blur(3px);
  opacity: 0.7;
}


.referencen-grid div {
  opacity: 0;
}


.referencen-grid:hover div {
  opacity: 1;
}

.referencen-grid hr {
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  -ms-transform: scaleX(0);
  /* IE 9 */
  -webkit-transform: scaleX(0);
  /* Safari */
  transform: scaleX(0);
  /* Standard syntax */
}

.referencen-grid:hover hr {
  -ms-transform: scaleX(1);
  /* IE 9 */
  -webkit-transform: scaleX(1);
  /* Safari */
  transform: scaleX(1);
  /* Standard syntax */
}


/*

Material Design Icons
(für Ladezeit ganz unten)
*/

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('../font/MaterialIcons-Regular.eot');
  /* For IE6-8 */
  src: local('Material Icons'), local('MaterialIcons-Regular'), url('../font/MaterialIcons-Regular.woff2') format('woff2'), url('../font/MaterialIcons-Regular.woff') format('woff'), url('../font/MaterialIcons-Regular.ttf') format('truetype');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}