@charset "UTF-8";
/**
 *	Farben werden immer mit dem Prefix $color_ definiert
 */
meta.foundation-version {
  font-family: "/5.5.3/";
}

meta.foundation-mq-small {
  font-family: "/only screen/";
  width: 0;
}

meta.foundation-mq-small-only {
  font-family: "/only screen and (max-width: 40em)/";
  width: 0;
}

meta.foundation-mq-medium {
  font-family: "/only screen and (min-width:40.0625em)/";
  width: 40.0625em;
}

meta.foundation-mq-medium-only {
  font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/";
  width: 40.0625em;
}

meta.foundation-mq-large {
  font-family: "/only screen and (min-width:64.0625em)/";
  width: 64.0625em;
}

meta.foundation-mq-large-only {
  font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/";
  width: 64.0625em;
}

meta.foundation-mq-xlarge {
  font-family: "/only screen and (min-width:90.0625em)/";
  width: 90.0625em;
}

meta.foundation-mq-xlarge-only {
  font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/";
  width: 90.0625em;
}

meta.foundation-mq-xxlarge {
  font-family: "/only screen and (min-width:120.0625em)/";
  width: 120.0625em;
}

meta.foundation-data-attribute-namespace {
  font-family: false;
}

html, body {
  height: 100%;
}

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

html,
body {
  font-size: 16;
}

body {
  background: #fff;
  color: #222;
  cursor: auto;
  font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  position: relative;
}

a:hover {
  cursor: pointer;
}

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

img {
  -ms-interpolation-mode: bicubic;
}

#map_canvas img,
#map_canvas embed,
#map_canvas object,
.map_canvas img,
.map_canvas embed,
.map_canvas object,
.mqa-display img,
.mqa-display embed,
.mqa-display object {
  max-width: none !important;
}

.left, .form__checkbox {
  float: left !important;
}

.right {
  float: right !important;
}

.clearfix:before, .clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}

.hide {
  display: none;
}

.invisible {
  visibility: hidden;
}

.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  display: inline-block;
  vertical-align: middle;
}

textarea {
  height: auto;
  min-height: 50px;
}

select {
  width: 100%;
}

.row {
  margin: 0 auto;
  max-width: 62.5rem;
  width: 100%;
}
.row:before, .row:after {
  content: " ";
  display: table;
}
.row:after {
  clear: both;
}
.row.collapse > .column,
.row.collapse > .columns {
  padding-left: 0;
  padding-right: 0;
}
.row.collapse .row {
  margin-left: 0;
  margin-right: 0;
}
.row .row {
  margin: 0 -0.625rem;
  max-width: none;
  width: auto;
}
.row .row:before, .row .row:after {
  content: " ";
  display: table;
}
.row .row:after {
  clear: both;
}
.row .row.collapse {
  margin: 0;
  max-width: none;
  width: auto;
}
.row .row.collapse:before, .row .row.collapse:after {
  content: " ";
  display: table;
}
.row .row.collapse:after {
  clear: both;
}

.column,
.columns {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  width: 100%;
  float: left;
}

.column + .column:last-child,
.column + .columns:last-child,
.columns + .column:last-child,
.columns + .columns:last-child {
  float: right;
}
.column + .column.end,
.column + .columns.end,
.columns + .column.end,
.columns + .columns.end {
  float: left;
}

@media only screen {
  .small-push-0 {
	position: relative;
	left: 0;
	right: auto;
  }

  .small-pull-0 {
	position: relative;
	right: 0;
	left: auto;
  }

  .small-push-1 {
	position: relative;
	left: 8.3333333333%;
	right: auto;
  }

  .small-pull-1 {
	position: relative;
	right: 8.3333333333%;
	left: auto;
  }

  .small-push-2 {
	position: relative;
	left: 16.6666666667%;
	right: auto;
  }

  .small-pull-2 {
	position: relative;
	right: 16.6666666667%;
	left: auto;
  }

  .small-push-3 {
	position: relative;
	left: 25%;
	right: auto;
  }

  .small-pull-3 {
	position: relative;
	right: 25%;
	left: auto;
  }

  .small-push-4 {
	position: relative;
	left: 33.3333333333%;
	right: auto;
  }

  .small-pull-4 {
	position: relative;
	right: 33.3333333333%;
	left: auto;
  }

  .small-push-5 {
	position: relative;
	left: 41.6666666667%;
	right: auto;
  }

  .small-pull-5 {
	position: relative;
	right: 41.6666666667%;
	left: auto;
  }

  .small-push-6 {
	position: relative;
	left: 50%;
	right: auto;
  }

  .small-pull-6 {
	position: relative;
	right: 50%;
	left: auto;
  }

  .small-push-7 {
	position: relative;
	left: 58.3333333333%;
	right: auto;
  }

  .small-pull-7 {
	position: relative;
	right: 58.3333333333%;
	left: auto;
  }

  .small-push-8 {
	position: relative;
	left: 66.6666666667%;
	right: auto;
  }

  .small-pull-8 {
	position: relative;
	right: 66.6666666667%;
	left: auto;
  }

  .small-push-9 {
	position: relative;
	left: 75%;
	right: auto;
  }

  .small-pull-9 {
	position: relative;
	right: 75%;
	left: auto;
  }

  .small-push-10 {
	position: relative;
	left: 83.3333333333%;
	right: auto;
  }

  .small-pull-10 {
	position: relative;
	right: 83.3333333333%;
	left: auto;
  }

  .small-push-11 {
	position: relative;
	left: 91.6666666667%;
	right: auto;
  }

  .small-pull-11 {
	position: relative;
	right: 91.6666666667%;
	left: auto;
  }

  .column,
.columns {
	position: relative;
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }

  .small-1 {
	width: 8.3333333333%;
  }

  .small-2 {
	width: 16.6666666667%;
  }

  .small-3 {
	width: 25%;
  }

  .small-4 {
	width: 33.3333333333%;
  }

  .small-5 {
	width: 41.6666666667%;
  }

  .small-6 {
	width: 50%;
  }

  .small-7 {
	width: 58.3333333333%;
  }

  .small-8 {
	width: 66.6666666667%;
  }

  .small-9 {
	width: 75%;
  }

  .small-10 {
	width: 83.3333333333%;
  }

  .small-11 {
	width: 91.6666666667%;
  }

  .small-12 {
	width: 100%;
  }

  .small-offset-0 {
	margin-left: 0 !important;
  }

  .small-offset-1 {
	margin-left: 8.3333333333% !important;
  }

  .small-offset-2 {
	margin-left: 16.6666666667% !important;
  }

  .small-offset-3 {
	margin-left: 25% !important;
  }

  .small-offset-4 {
	margin-left: 33.3333333333% !important;
  }

  .small-offset-5 {
	margin-left: 41.6666666667% !important;
  }

  .small-offset-6 {
	margin-left: 50% !important;
  }

  .small-offset-7 {
	margin-left: 58.3333333333% !important;
  }

  .small-offset-8 {
	margin-left: 66.6666666667% !important;
  }

  .small-offset-9 {
	margin-left: 75% !important;
  }

  .small-offset-10 {
	margin-left: 83.3333333333% !important;
  }

  .small-offset-11 {
	margin-left: 91.6666666667% !important;
  }

  .small-reset-order {
	float: left;
	left: auto;
	margin-left: 0;
	margin-right: 0;
	right: auto;
  }

  .column.small-centered,
.columns.small-centered {
	margin-left: auto;
	margin-right: auto;
	float: none;
  }

  .column.small-uncentered,
.columns.small-uncentered {
	float: left;
	margin-left: 0;
	margin-right: 0;
  }

  .column.small-centered:last-child,
.columns.small-centered:last-child {
	float: none;
  }

  .column.small-uncentered:last-child,
.columns.small-uncentered:last-child {
	float: left;
  }

  .column.small-uncentered.opposite,
.columns.small-uncentered.opposite {
	float: right;
  }

  .row.small-collapse > .column,
.row.small-collapse > .columns {
	padding-left: 0;
	padding-right: 0;
  }
  .row.small-collapse .row {
	margin-left: 0;
	margin-right: 0;
  }
  .row.small-uncollapse > .column,
.row.small-uncollapse > .columns {
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }
}
@media only screen and (min-width:40.0625em) {
  .medium-push-0 {
	position: relative;
	left: 0;
	right: auto;
  }

  .medium-pull-0 {
	position: relative;
	right: 0;
	left: auto;
  }

  .medium-push-1 {
	position: relative;
	left: 8.3333333333%;
	right: auto;
  }

  .medium-pull-1 {
	position: relative;
	right: 8.3333333333%;
	left: auto;
  }

  .medium-push-2 {
	position: relative;
	left: 16.6666666667%;
	right: auto;
  }

  .medium-pull-2 {
	position: relative;
	right: 16.6666666667%;
	left: auto;
  }

  .medium-push-3 {
	position: relative;
	left: 25%;
	right: auto;
  }

  .medium-pull-3 {
	position: relative;
	right: 25%;
	left: auto;
  }

  .medium-push-4 {
	position: relative;
	left: 33.3333333333%;
	right: auto;
  }

  .medium-pull-4 {
	position: relative;
	right: 33.3333333333%;
	left: auto;
  }

  .medium-push-5 {
	position: relative;
	left: 41.6666666667%;
	right: auto;
  }

  .medium-pull-5 {
	position: relative;
	right: 41.6666666667%;
	left: auto;
  }

  .medium-push-6 {
	position: relative;
	left: 50%;
	right: auto;
  }

  .medium-pull-6 {
	position: relative;
	right: 50%;
	left: auto;
  }

  .medium-push-7 {
	position: relative;
	left: 58.3333333333%;
	right: auto;
  }

  .medium-pull-7 {
	position: relative;
	right: 58.3333333333%;
	left: auto;
  }

  .medium-push-8 {
	position: relative;
	left: 66.6666666667%;
	right: auto;
  }

  .medium-pull-8 {
	position: relative;
	right: 66.6666666667%;
	left: auto;
  }

  .medium-push-9 {
	position: relative;
	left: 75%;
	right: auto;
  }

  .medium-pull-9 {
	position: relative;
	right: 75%;
	left: auto;
  }

  .medium-push-10 {
	position: relative;
	left: 83.3333333333%;
	right: auto;
  }

  .medium-pull-10 {
	position: relative;
	right: 83.3333333333%;
	left: auto;
  }

  .medium-push-11 {
	position: relative;
	left: 91.6666666667%;
	right: auto;
  }

  .medium-pull-11 {
	position: relative;
	right: 91.6666666667%;
	left: auto;
  }

  .column,
.columns {
	position: relative;
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }

  .medium-1 {
	width: 8.3333333333%;
  }

  .medium-2 {
	width: 16.6666666667%;
  }

  .medium-3 {
	width: 25%;
  }

  .medium-4 {
	width: 33.3333333333%;
  }

  .medium-5 {
	width: 41.6666666667%;
  }

  .medium-6 {
	width: 50%;
  }

  .medium-7 {
	width: 58.3333333333%;
  }

  .medium-8 {
	width: 66.6666666667%;
  }

  .medium-9 {
	width: 75%;
  }

  .medium-10 {
	width: 83.3333333333%;
  }

  .medium-11 {
	width: 91.6666666667%;
  }

  .medium-12 {
	width: 100%;
  }

  .medium-offset-0 {
	margin-left: 0 !important;
  }

  .medium-offset-1 {
	margin-left: 8.3333333333% !important;
  }

  .medium-offset-2 {
	margin-left: 16.6666666667% !important;
  }

  .medium-offset-3 {
	margin-left: 25% !important;
  }

  .medium-offset-4 {
	margin-left: 33.3333333333% !important;
  }

  .medium-offset-5 {
	margin-left: 41.6666666667% !important;
  }

  .medium-offset-6 {
	margin-left: 50% !important;
  }

  .medium-offset-7 {
	margin-left: 58.3333333333% !important;
  }

  .medium-offset-8 {
	margin-left: 66.6666666667% !important;
  }

  .medium-offset-9 {
	margin-left: 75% !important;
  }

  .medium-offset-10 {
	margin-left: 83.3333333333% !important;
  }

  .medium-offset-11 {
	margin-left: 91.6666666667% !important;
  }

  .medium-reset-order {
	float: left;
	left: auto;
	margin-left: 0;
	margin-right: 0;
	right: auto;
  }

  .column.medium-centered,
.columns.medium-centered {
	margin-left: auto;
	margin-right: auto;
	float: none;
  }

  .column.medium-uncentered,
.columns.medium-uncentered {
	float: left;
	margin-left: 0;
	margin-right: 0;
  }

  .column.medium-centered:last-child,
.columns.medium-centered:last-child {
	float: none;
  }

  .column.medium-uncentered:last-child,
.columns.medium-uncentered:last-child {
	float: left;
  }

  .column.medium-uncentered.opposite,
.columns.medium-uncentered.opposite {
	float: right;
  }

  .row.medium-collapse > .column,
.row.medium-collapse > .columns {
	padding-left: 0;
	padding-right: 0;
  }
  .row.medium-collapse .row {
	margin-left: 0;
	margin-right: 0;
  }
  .row.medium-uncollapse > .column,
.row.medium-uncollapse > .columns {
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }

  .push-0 {
	position: relative;
	left: 0;
	right: auto;
  }

  .pull-0 {
	position: relative;
	right: 0;
	left: auto;
  }

  .push-1 {
	position: relative;
	left: 8.3333333333%;
	right: auto;
  }

  .pull-1 {
	position: relative;
	right: 8.3333333333%;
	left: auto;
  }

  .push-2 {
	position: relative;
	left: 16.6666666667%;
	right: auto;
  }

  .pull-2 {
	position: relative;
	right: 16.6666666667%;
	left: auto;
  }

  .push-3 {
	position: relative;
	left: 25%;
	right: auto;
  }

  .pull-3 {
	position: relative;
	right: 25%;
	left: auto;
  }

  .push-4 {
	position: relative;
	left: 33.3333333333%;
	right: auto;
  }

  .pull-4 {
	position: relative;
	right: 33.3333333333%;
	left: auto;
  }

  .push-5 {
	position: relative;
	left: 41.6666666667%;
	right: auto;
  }

  .pull-5 {
	position: relative;
	right: 41.6666666667%;
	left: auto;
  }

  .push-6 {
	position: relative;
	left: 50%;
	right: auto;
  }

  .pull-6 {
	position: relative;
	right: 50%;
	left: auto;
  }

  .push-7 {
	position: relative;
	left: 58.3333333333%;
	right: auto;
  }

  .pull-7 {
	position: relative;
	right: 58.3333333333%;
	left: auto;
  }

  .push-8 {
	position: relative;
	left: 66.6666666667%;
	right: auto;
  }

  .pull-8 {
	position: relative;
	right: 66.6666666667%;
	left: auto;
  }

  .push-9 {
	position: relative;
	left: 75%;
	right: auto;
  }

  .pull-9 {
	position: relative;
	right: 75%;
	left: auto;
  }

  .push-10 {
	position: relative;
	left: 83.3333333333%;
	right: auto;
  }

  .pull-10 {
	position: relative;
	right: 83.3333333333%;
	left: auto;
  }

  .push-11 {
	position: relative;
	left: 91.6666666667%;
	right: auto;
  }

  .pull-11 {
	position: relative;
	right: 91.6666666667%;
	left: auto;
  }
}
@media only screen and (min-width:64.0625em) {
  .large-push-0 {
	position: relative;
	left: 0;
	right: auto;
  }

  .large-pull-0 {
	position: relative;
	right: 0;
	left: auto;
  }

  .large-push-1 {
	position: relative;
	left: 8.3333333333%;
	right: auto;
  }

  .large-pull-1 {
	position: relative;
	right: 8.3333333333%;
	left: auto;
  }

  .large-push-2 {
	position: relative;
	left: 16.6666666667%;
	right: auto;
  }

  .large-pull-2 {
	position: relative;
	right: 16.6666666667%;
	left: auto;
  }

  .large-push-3 {
	position: relative;
	left: 25%;
	right: auto;
  }

  .large-pull-3 {
	position: relative;
	right: 25%;
	left: auto;
  }

  .large-push-4 {
	position: relative;
	left: 33.3333333333%;
	right: auto;
  }

  .large-pull-4 {
	position: relative;
	right: 33.3333333333%;
	left: auto;
  }

  .large-push-5 {
	position: relative;
	left: 41.6666666667%;
	right: auto;
  }

  .large-pull-5 {
	position: relative;
	right: 41.6666666667%;
	left: auto;
  }

  .large-push-6 {
	position: relative;
	left: 50%;
	right: auto;
  }

  .large-pull-6 {
	position: relative;
	right: 50%;
	left: auto;
  }

  .large-push-7 {
	position: relative;
	left: 58.3333333333%;
	right: auto;
  }

  .large-pull-7 {
	position: relative;
	right: 58.3333333333%;
	left: auto;
  }

  .large-push-8 {
	position: relative;
	left: 66.6666666667%;
	right: auto;
  }

  .large-pull-8 {
	position: relative;
	right: 66.6666666667%;
	left: auto;
  }

  .large-push-9 {
	position: relative;
	left: 75%;
	right: auto;
  }

  .large-pull-9 {
	position: relative;
	right: 75%;
	left: auto;
  }

  .large-push-10 {
	position: relative;
	left: 83.3333333333%;
	right: auto;
  }

  .large-pull-10 {
	position: relative;
	right: 83.3333333333%;
	left: auto;
  }

  .large-push-11 {
	position: relative;
	left: 91.6666666667%;
	right: auto;
  }

  .large-pull-11 {
	position: relative;
	right: 91.6666666667%;
	left: auto;
  }

  .column,
.columns {
	position: relative;
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }

  .large-1 {
	width: 8.3333333333%;
  }

  .large-2 {
	width: 16.6666666667%;
  }

  .large-3 {
	width: 25%;
  }

  .large-4 {
	width: 33.3333333333%;
  }

  .large-5 {
	width: 41.6666666667%;
  }

  .large-6 {
	width: 50%;
  }

  .large-7 {
	width: 58.3333333333%;
  }

  .large-8 {
	width: 66.6666666667%;
  }

  .large-9 {
	width: 75%;
  }

  .large-10 {
	width: 83.3333333333%;
  }

  .large-11 {
	width: 91.6666666667%;
  }

  .large-12 {
	width: 100%;
  }

  .large-offset-0 {
	margin-left: 0 !important;
  }

  .large-offset-1 {
	margin-left: 8.3333333333% !important;
  }

  .large-offset-2 {
	margin-left: 16.6666666667% !important;
  }

  .large-offset-3 {
	margin-left: 25% !important;
  }

  .large-offset-4 {
	margin-left: 33.3333333333% !important;
  }

  .large-offset-5 {
	margin-left: 41.6666666667% !important;
  }

  .large-offset-6 {
	margin-left: 50% !important;
  }

  .large-offset-7 {
	margin-left: 58.3333333333% !important;
  }

  .large-offset-8 {
	margin-left: 66.6666666667% !important;
  }

  .large-offset-9 {
	margin-left: 75% !important;
  }

  .large-offset-10 {
	margin-left: 83.3333333333% !important;
  }

  .large-offset-11 {
	margin-left: 91.6666666667% !important;
  }

  .large-reset-order {
	float: left;
	left: auto;
	margin-left: 0;
	margin-right: 0;
	right: auto;
  }

  .column.large-centered,
.columns.large-centered {
	margin-left: auto;
	margin-right: auto;
	float: none;
  }

  .column.large-uncentered,
.columns.large-uncentered {
	float: left;
	margin-left: 0;
	margin-right: 0;
  }

  .column.large-centered:last-child,
.columns.large-centered:last-child {
	float: none;
  }

  .column.large-uncentered:last-child,
.columns.large-uncentered:last-child {
	float: left;
  }

  .column.large-uncentered.opposite,
.columns.large-uncentered.opposite {
	float: right;
  }

  .row.large-collapse > .column,
.row.large-collapse > .columns {
	padding-left: 0;
	padding-right: 0;
  }
  .row.large-collapse .row {
	margin-left: 0;
	margin-right: 0;
  }
  .row.large-uncollapse > .column,
.row.large-uncollapse > .columns {
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	float: left;
  }

  .push-0 {
	position: relative;
	left: 0;
	right: auto;
  }

  .pull-0 {
	position: relative;
	right: 0;
	left: auto;
  }

  .push-1 {
	position: relative;
	left: 8.3333333333%;
	right: auto;
  }

  .pull-1 {
	position: relative;
	right: 8.3333333333%;
	left: auto;
  }

  .push-2 {
	position: relative;
	left: 16.6666666667%;
	right: auto;
  }

  .pull-2 {
	position: relative;
	right: 16.6666666667%;
	left: auto;
  }

  .push-3 {
	position: relative;
	left: 25%;
	right: auto;
  }

  .pull-3 {
	position: relative;
	right: 25%;
	left: auto;
  }

  .push-4 {
	position: relative;
	left: 33.3333333333%;
	right: auto;
  }

  .pull-4 {
	position: relative;
	right: 33.3333333333%;
	left: auto;
  }

  .push-5 {
	position: relative;
	left: 41.6666666667%;
	right: auto;
  }

  .pull-5 {
	position: relative;
	right: 41.6666666667%;
	left: auto;
  }

  .push-6 {
	position: relative;
	left: 50%;
	right: auto;
  }

  .pull-6 {
	position: relative;
	right: 50%;
	left: auto;
  }

  .push-7 {
	position: relative;
	left: 58.3333333333%;
	right: auto;
  }

  .pull-7 {
	position: relative;
	right: 58.3333333333%;
	left: auto;
  }

  .push-8 {
	position: relative;
	left: 66.6666666667%;
	right: auto;
  }

  .pull-8 {
	position: relative;
	right: 66.6666666667%;
	left: auto;
  }

  .push-9 {
	position: relative;
	left: 75%;
	right: auto;
  }

  .pull-9 {
	position: relative;
	right: 75%;
	left: auto;
  }

  .push-10 {
	position: relative;
	left: 83.3333333333%;
	right: auto;
  }

  .pull-10 {
	position: relative;
	right: 83.3333333333%;
	left: auto;
  }

  .push-11 {
	position: relative;
	left: 91.6666666667%;
	right: auto;
  }

  .pull-11 {
	position: relative;
	right: 91.6666666667%;
	left: auto;
  }
}
[class*=block-grid-] {
  display: block;
  padding: 0;
  margin: 0 -0.625rem;
}
[class*=block-grid-]:before, [class*=block-grid-]:after {
  content: " ";
  display: table;
}
[class*=block-grid-]:after {
  clear: both;
}
[class*=block-grid-] > li {
  display: block;
  float: left;
  height: auto;
  padding: 0 0.625rem 1.25rem;
}

@media only screen {
  .small-block-grid-1 > li {
	list-style: none;
	width: 100%;
  }
  .small-block-grid-1 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-1 > li:nth-of-type(1n+1) {
	clear: both;
  }

  .small-block-grid-2 > li {
	list-style: none;
	width: 50%;
  }
  .small-block-grid-2 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-2 > li:nth-of-type(2n+1) {
	clear: both;
  }

  .small-block-grid-3 > li {
	list-style: none;
	width: 33.3333333333%;
  }
  .small-block-grid-3 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-3 > li:nth-of-type(3n+1) {
	clear: both;
  }

  .small-block-grid-4 > li {
	list-style: none;
	width: 25%;
  }
  .small-block-grid-4 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-4 > li:nth-of-type(4n+1) {
	clear: both;
  }

  .small-block-grid-5 > li {
	list-style: none;
	width: 20%;
  }
  .small-block-grid-5 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-5 > li:nth-of-type(5n+1) {
	clear: both;
  }

  .small-block-grid-6 > li {
	list-style: none;
	width: 16.6666666667%;
  }
  .small-block-grid-6 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-6 > li:nth-of-type(6n+1) {
	clear: both;
  }

  .small-block-grid-7 > li {
	list-style: none;
	width: 14.2857142857%;
  }
  .small-block-grid-7 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-7 > li:nth-of-type(7n+1) {
	clear: both;
  }

  .small-block-grid-8 > li {
	list-style: none;
	width: 12.5%;
  }
  .small-block-grid-8 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-8 > li:nth-of-type(8n+1) {
	clear: both;
  }

  .small-block-grid-9 > li {
	list-style: none;
	width: 11.1111111111%;
  }
  .small-block-grid-9 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-9 > li:nth-of-type(9n+1) {
	clear: both;
  }

  .small-block-grid-10 > li {
	list-style: none;
	width: 10%;
  }
  .small-block-grid-10 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-10 > li:nth-of-type(10n+1) {
	clear: both;
  }

  .small-block-grid-11 > li {
	list-style: none;
	width: 9.0909090909%;
  }
  .small-block-grid-11 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-11 > li:nth-of-type(11n+1) {
	clear: both;
  }

  .small-block-grid-12 > li {
	list-style: none;
	width: 8.3333333333%;
  }
  .small-block-grid-12 > li:nth-of-type(1n) {
	clear: none;
  }
  .small-block-grid-12 > li:nth-of-type(12n+1) {
	clear: both;
  }
}
@media only screen and (min-width:40.0625em) {
  .medium-block-grid-1 > li {
	list-style: none;
	width: 100%;
  }
  .medium-block-grid-1 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-1 > li:nth-of-type(1n+1) {
	clear: both;
  }

  .medium-block-grid-2 > li {
	list-style: none;
	width: 50%;
  }
  .medium-block-grid-2 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-2 > li:nth-of-type(2n+1) {
	clear: both;
  }

  .medium-block-grid-3 > li {
	list-style: none;
	width: 33.3333333333%;
  }
  .medium-block-grid-3 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-3 > li:nth-of-type(3n+1) {
	clear: both;
  }

  .medium-block-grid-4 > li {
	list-style: none;
	width: 25%;
  }
  .medium-block-grid-4 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-4 > li:nth-of-type(4n+1) {
	clear: both;
  }

  .medium-block-grid-5 > li {
	list-style: none;
	width: 20%;
  }
  .medium-block-grid-5 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-5 > li:nth-of-type(5n+1) {
	clear: both;
  }

  .medium-block-grid-6 > li {
	list-style: none;
	width: 16.6666666667%;
  }
  .medium-block-grid-6 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-6 > li:nth-of-type(6n+1) {
	clear: both;
  }

  .medium-block-grid-7 > li {
	list-style: none;
	width: 14.2857142857%;
  }
  .medium-block-grid-7 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-7 > li:nth-of-type(7n+1) {
	clear: both;
  }

  .medium-block-grid-8 > li {
	list-style: none;
	width: 12.5%;
  }
  .medium-block-grid-8 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-8 > li:nth-of-type(8n+1) {
	clear: both;
  }

  .medium-block-grid-9 > li {
	list-style: none;
	width: 11.1111111111%;
  }
  .medium-block-grid-9 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-9 > li:nth-of-type(9n+1) {
	clear: both;
  }

  .medium-block-grid-10 > li {
	list-style: none;
	width: 10%;
  }
  .medium-block-grid-10 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-10 > li:nth-of-type(10n+1) {
	clear: both;
  }

  .medium-block-grid-11 > li {
	list-style: none;
	width: 9.0909090909%;
  }
  .medium-block-grid-11 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-11 > li:nth-of-type(11n+1) {
	clear: both;
  }

  .medium-block-grid-12 > li {
	list-style: none;
	width: 8.3333333333%;
  }
  .medium-block-grid-12 > li:nth-of-type(1n) {
	clear: none;
  }
  .medium-block-grid-12 > li:nth-of-type(12n+1) {
	clear: both;
  }
}
@media only screen and (min-width:64.0625em) {
  .large-block-grid-1 > li {
	list-style: none;
	width: 100%;
  }
  .large-block-grid-1 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-1 > li:nth-of-type(1n+1) {
	clear: both;
  }

  .large-block-grid-2 > li {
	list-style: none;
	width: 50%;
  }
  .large-block-grid-2 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-2 > li:nth-of-type(2n+1) {
	clear: both;
  }

  .large-block-grid-3 > li {
	list-style: none;
	width: 33.3333333333%;
  }
  .large-block-grid-3 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-3 > li:nth-of-type(3n+1) {
	clear: both;
  }

  .large-block-grid-4 > li {
	list-style: none;
	width: 25%;
  }
  .large-block-grid-4 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-4 > li:nth-of-type(4n+1) {
	clear: both;
  }

  .large-block-grid-5 > li {
	list-style: none;
	width: 20%;
  }
  .large-block-grid-5 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-5 > li:nth-of-type(5n+1) {
	clear: both;
  }

  .large-block-grid-6 > li {
	list-style: none;
	width: 16.6666666667%;
  }
  .large-block-grid-6 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-6 > li:nth-of-type(6n+1) {
	clear: both;
  }

  .large-block-grid-7 > li {
	list-style: none;
	width: 14.2857142857%;
  }
  .large-block-grid-7 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-7 > li:nth-of-type(7n+1) {
	clear: both;
  }

  .large-block-grid-8 > li {
	list-style: none;
	width: 12.5%;
  }
  .large-block-grid-8 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-8 > li:nth-of-type(8n+1) {
	clear: both;
  }

  .large-block-grid-9 > li {
	list-style: none;
	width: 11.1111111111%;
  }
  .large-block-grid-9 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-9 > li:nth-of-type(9n+1) {
	clear: both;
  }

  .large-block-grid-10 > li {
	list-style: none;
	width: 10%;
  }
  .large-block-grid-10 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-10 > li:nth-of-type(10n+1) {
	clear: both;
  }

  .large-block-grid-11 > li {
	list-style: none;
	width: 9.0909090909%;
  }
  .large-block-grid-11 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-11 > li:nth-of-type(11n+1) {
	clear: both;
  }

  .large-block-grid-12 > li {
	list-style: none;
	width: 8.3333333333%;
  }
  .large-block-grid-12 > li:nth-of-type(1n) {
	clear: none;
  }
  .large-block-grid-12 > li:nth-of-type(12n+1) {
	clear: both;
  }
}
/* small displays */
@media only screen {
  .show-for-small-only, .show-for-small-up, .show-for-small, .show-for-small-down, .hide-for-medium-only, .hide-for-medium-up, .hide-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .show-for-xxlarge-down {
	display: inherit !important;
  }

  .hide-for-small-only, .hide-for-small-up, .hide-for-small, .hide-for-small-down, .show-for-medium-only, .show-for-medium-up, .show-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xlarge, .hide-for-xlarge-down, .show-for-xxlarge-only, .show-for-xxlarge-up, .show-for-xxlarge, .hide-for-xxlarge-down {
	display: none !important;
  }

  .visible-for-small-only, .visible-for-small-up, .visible-for-small, .visible-for-small-down, .hidden-for-medium-only, .hidden-for-medium-up, .hidden-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xlarge, .visible-for-xlarge-down, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up, .hidden-for-xxlarge, .visible-for-xxlarge-down {
	position: static !important;
	height: auto;
	width: auto;
	overflow: visible;
	clip: auto;
  }

  .hidden-for-small-only, .hidden-for-small-up, .hidden-for-small, .hidden-for-small-down, .visible-for-medium-only, .visible-for-medium-up, .visible-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xlarge, .hidden-for-xlarge-down, .visible-for-xxlarge-only, .visible-for-xxlarge-up, .visible-for-xxlarge, .hidden-for-xxlarge-down {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
  }

  table.show-for-small-only, table.show-for-small-up, table.show-for-small, table.show-for-small-down, table.hide-for-medium-only, table.hide-for-medium-up, table.hide-for-medium, table.show-for-medium-down, table.hide-for-large-only, table.hide-for-large-up, table.hide-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xlarge, table.show-for-xlarge-down, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up, table.hide-for-xxlarge, table.show-for-xxlarge-down {
	display: table !important;
  }

  thead.show-for-small-only, thead.show-for-small-up, thead.show-for-small, thead.show-for-small-down, thead.hide-for-medium-only, thead.hide-for-medium-up, thead.hide-for-medium, thead.show-for-medium-down, thead.hide-for-large-only, thead.hide-for-large-up, thead.hide-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xlarge, thead.show-for-xlarge-down, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up, thead.hide-for-xxlarge, thead.show-for-xxlarge-down {
	display: table-header-group !important;
  }

  tbody.show-for-small-only, tbody.show-for-small-up, tbody.show-for-small, tbody.show-for-small-down, tbody.hide-for-medium-only, tbody.hide-for-medium-up, tbody.hide-for-medium, tbody.show-for-medium-down, tbody.hide-for-large-only, tbody.hide-for-large-up, tbody.hide-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xlarge, tbody.show-for-xlarge-down, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up, tbody.hide-for-xxlarge, tbody.show-for-xxlarge-down {
	display: table-row-group !important;
  }

  tr.show-for-small-only, tr.show-for-small-up, tr.show-for-small, tr.show-for-small-down, tr.hide-for-medium-only, tr.hide-for-medium-up, tr.hide-for-medium, tr.show-for-medium-down, tr.hide-for-large-only, tr.hide-for-large-up, tr.hide-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xlarge, tr.show-for-xlarge-down, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up, tr.hide-for-xxlarge, tr.show-for-xxlarge-down {
	display: table-row;
  }

  th.show-for-small-only, td.show-for-small-only, th.show-for-small-up, td.show-for-small-up, th.show-for-small, td.show-for-small, th.show-for-small-down, td.show-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.hide-for-medium-up, td.hide-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.show-for-medium-down, td.show-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.hide-for-large-up, td.hide-for-large-up, th.hide-for-large, td.hide-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xlarge, td.hide-for-xlarge, th.show-for-xlarge-down, td.show-for-xlarge-down, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up, th.hide-for-xxlarge, td.hide-for-xxlarge, th.show-for-xxlarge-down, td.show-for-xxlarge-down {
	display: table-cell !important;
  }
}
/* medium displays */
@media only screen and (min-width:40.0625em) {
  .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .show-for-medium-only, .show-for-medium-up, .show-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .show-for-xxlarge-down {
	display: inherit !important;
  }

  .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .hide-for-medium-only, .hide-for-medium-up, .hide-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xlarge, .hide-for-xlarge-down, .show-for-xxlarge-only, .show-for-xxlarge-up, .show-for-xxlarge, .hide-for-xxlarge-down {
	display: none !important;
  }

  .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .visible-for-medium-only, .visible-for-medium-up, .visible-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xlarge, .visible-for-xlarge-down, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up, .hidden-for-xxlarge, .visible-for-xxlarge-down {
	position: static !important;
	height: auto;
	width: auto;
	overflow: visible;
	clip: auto;
  }

  .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .hidden-for-medium-only, .hidden-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xlarge, .hidden-for-xlarge-down, .visible-for-xxlarge-only, .visible-for-xxlarge-up, .visible-for-xxlarge, .hidden-for-xxlarge-down {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
  }

  table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.show-for-medium-only, table.show-for-medium-up, table.show-for-medium, table.show-for-medium-down, table.hide-for-large-only, table.hide-for-large-up, table.hide-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xlarge, table.show-for-xlarge-down, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up, table.hide-for-xxlarge, table.show-for-xxlarge-down {
	display: table !important;
  }

  thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.show-for-medium-only, thead.show-for-medium-up, thead.show-for-medium, thead.show-for-medium-down, thead.hide-for-large-only, thead.hide-for-large-up, thead.hide-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xlarge, thead.show-for-xlarge-down, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up, thead.hide-for-xxlarge, thead.show-for-xxlarge-down {
	display: table-header-group !important;
  }

  tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.show-for-medium-only, tbody.show-for-medium-up, tbody.show-for-medium, tbody.show-for-medium-down, tbody.hide-for-large-only, tbody.hide-for-large-up, tbody.hide-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xlarge, tbody.show-for-xlarge-down, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up, tbody.hide-for-xxlarge, tbody.show-for-xxlarge-down {
	display: table-row-group !important;
  }

  tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.show-for-medium-only, tr.show-for-medium-up, tr.show-for-medium, tr.show-for-medium-down, tr.hide-for-large-only, tr.hide-for-large-up, tr.hide-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xlarge, tr.show-for-xlarge-down, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up, tr.hide-for-xxlarge, tr.show-for-xxlarge-down {
	display: table-row;
  }

  th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.show-for-medium-only, td.show-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.show-for-medium, td.show-for-medium, th.show-for-medium-down, td.show-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.hide-for-large-up, td.hide-for-large-up, th.hide-for-large, td.hide-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xlarge, td.hide-for-xlarge, th.show-for-xlarge-down, td.show-for-xlarge-down, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up, th.hide-for-xxlarge, td.hide-for-xxlarge, th.show-for-xxlarge-down, td.show-for-xxlarge-down {
	display: table-cell !important;
  }
}
/* large displays */
@media only screen and (min-width:64.0625em) {
  .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .show-for-xxlarge-down {
	display: inherit !important;
  }

  .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xlarge, .hide-for-xlarge-down, .show-for-xxlarge-only, .show-for-xxlarge-up, .show-for-xxlarge, .hide-for-xxlarge-down {
	display: none !important;
  }

  .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xlarge, .visible-for-xlarge-down, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up, .hidden-for-xxlarge, .visible-for-xxlarge-down {
	position: static !important;
	height: auto;
	width: auto;
	overflow: visible;
	clip: auto;
  }

  .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xlarge, .hidden-for-xlarge-down, .visible-for-xxlarge-only, .visible-for-xxlarge-up, .visible-for-xxlarge, .hidden-for-xxlarge-down {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
  }

  table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.show-for-large-only, table.show-for-large-up, table.show-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xlarge, table.show-for-xlarge-down, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up, table.hide-for-xxlarge, table.show-for-xxlarge-down {
	display: table !important;
  }

  thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.show-for-large-only, thead.show-for-large-up, thead.show-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xlarge, thead.show-for-xlarge-down, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up, thead.hide-for-xxlarge, thead.show-for-xxlarge-down {
	display: table-header-group !important;
  }

  tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.show-for-large-only, tbody.show-for-large-up, tbody.show-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xlarge, tbody.show-for-xlarge-down, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up, tbody.hide-for-xxlarge, tbody.show-for-xxlarge-down {
	display: table-row-group !important;
  }

  tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.show-for-large-only, tr.show-for-large-up, tr.show-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xlarge, tr.show-for-xlarge-down, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up, tr.hide-for-xxlarge, tr.show-for-xxlarge-down {
	display: table-row;
  }

  th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.show-for-large-only, td.show-for-large-only, th.show-for-large-up, td.show-for-large-up, th.show-for-large, td.show-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xlarge, td.hide-for-xlarge, th.show-for-xlarge-down, td.show-for-xlarge-down, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up, th.hide-for-xxlarge, td.hide-for-xxlarge, th.show-for-xxlarge-down, td.show-for-xxlarge-down {
	display: table-cell !important;
  }
}
/* xlarge displays */
@media only screen and (min-width:90.0625em) {
  .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .hide-for-large-only, .show-for-large-up, .hide-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .show-for-xxlarge-down {
	display: inherit !important;
  }

  .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .show-for-large-only, .hide-for-large-up, .show-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xlarge, .hide-for-xlarge-down, .show-for-xxlarge-only, .show-for-xxlarge-up, .show-for-xxlarge, .hide-for-xxlarge-down {
	display: none !important;
  }

  .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .hidden-for-large-only, .visible-for-large-up, .hidden-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xlarge, .visible-for-xlarge-down, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up, .hidden-for-xxlarge, .visible-for-xxlarge-down {
	position: static !important;
	height: auto;
	width: auto;
	overflow: visible;
	clip: auto;
  }

  .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .visible-for-large-only, .hidden-for-large-up, .visible-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xlarge, .hidden-for-xlarge-down, .visible-for-xxlarge-only, .visible-for-xxlarge-up, .visible-for-xxlarge, .hidden-for-xxlarge-down {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
  }

  table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.hide-for-large-only, table.show-for-large-up, table.hide-for-large, table.hide-for-large-down, table.show-for-xlarge-only, table.show-for-xlarge-up, table.show-for-xlarge, table.show-for-xlarge-down, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up, table.hide-for-xxlarge, table.show-for-xxlarge-down {
	display: table !important;
  }

  thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.hide-for-large-only, thead.show-for-large-up, thead.hide-for-large, thead.hide-for-large-down, thead.show-for-xlarge-only, thead.show-for-xlarge-up, thead.show-for-xlarge, thead.show-for-xlarge-down, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up, thead.hide-for-xxlarge, thead.show-for-xxlarge-down {
	display: table-header-group !important;
  }

  tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.hide-for-large-only, tbody.show-for-large-up, tbody.hide-for-large, tbody.hide-for-large-down, tbody.show-for-xlarge-only, tbody.show-for-xlarge-up, tbody.show-for-xlarge, tbody.show-for-xlarge-down, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up, tbody.hide-for-xxlarge, tbody.show-for-xxlarge-down {
	display: table-row-group !important;
  }

  tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.hide-for-large-only, tr.show-for-large-up, tr.hide-for-large, tr.hide-for-large-down, tr.show-for-xlarge-only, tr.show-for-xlarge-up, tr.show-for-xlarge, tr.show-for-xlarge-down, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up, tr.hide-for-xxlarge, tr.show-for-xxlarge-down {
	display: table-row;
  }

  th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.show-for-large-up, td.show-for-large-up, th.hide-for-large, td.hide-for-large, th.hide-for-large-down, td.hide-for-large-down, th.show-for-xlarge-only, td.show-for-xlarge-only, th.show-for-xlarge-up, td.show-for-xlarge-up, th.show-for-xlarge, td.show-for-xlarge, th.show-for-xlarge-down, td.show-for-xlarge-down, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up, th.hide-for-xxlarge, td.hide-for-xxlarge, th.show-for-xxlarge-down, td.show-for-xxlarge-down {
	display: table-cell !important;
  }
}
/* xxlarge displays */
@media only screen and (min-width:120.0625em) {
  .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .hide-for-large-only, .show-for-large-up, .hide-for-large, .hide-for-large-down, .hide-for-xlarge-only, .show-for-xlarge-up, .hide-for-xlarge, .hide-for-xlarge-down, .show-for-xxlarge-only, .show-for-xxlarge-up, .show-for-xxlarge, .show-for-xxlarge-down {
	display: inherit !important;
  }

  .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .show-for-large-only, .hide-for-large-up, .show-for-large, .show-for-large-down, .show-for-xlarge-only, .hide-for-xlarge-up, .show-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .hide-for-xxlarge-down {
	display: none !important;
  }

  .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .hidden-for-large-only, .visible-for-large-up, .hidden-for-large, .hidden-for-large-down, .hidden-for-xlarge-only, .visible-for-xlarge-up, .hidden-for-xlarge, .hidden-for-xlarge-down, .visible-for-xxlarge-only, .visible-for-xxlarge-up, .visible-for-xxlarge, .visible-for-xxlarge-down {
	position: static !important;
	height: auto;
	width: auto;
	overflow: visible;
	clip: auto;
  }

  .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .visible-for-large-only, .hidden-for-large-up, .visible-for-large, .visible-for-large-down, .visible-for-xlarge-only, .hidden-for-xlarge-up, .visible-for-xlarge, .visible-for-xlarge-down, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up, .hidden-for-xxlarge, .hidden-for-xxlarge-down {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
  }

  table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.hide-for-large-only, table.show-for-large-up, table.hide-for-large, table.hide-for-large-down, table.hide-for-xlarge-only, table.show-for-xlarge-up, table.hide-for-xlarge, table.hide-for-xlarge-down, table.show-for-xxlarge-only, table.show-for-xxlarge-up, table.show-for-xxlarge, table.show-for-xxlarge-down {
	display: table !important;
  }

  thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.hide-for-large-only, thead.show-for-large-up, thead.hide-for-large, thead.hide-for-large-down, thead.hide-for-xlarge-only, thead.show-for-xlarge-up, thead.hide-for-xlarge, thead.hide-for-xlarge-down, thead.show-for-xxlarge-only, thead.show-for-xxlarge-up, thead.show-for-xxlarge, thead.show-for-xxlarge-down {
	display: table-header-group !important;
  }

  tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.hide-for-large-only, tbody.show-for-large-up, tbody.hide-for-large, tbody.hide-for-large-down, tbody.hide-for-xlarge-only, tbody.show-for-xlarge-up, tbody.hide-for-xlarge, tbody.hide-for-xlarge-down, tbody.show-for-xxlarge-only, tbody.show-for-xxlarge-up, tbody.show-for-xxlarge, tbody.show-for-xxlarge-down {
	display: table-row-group !important;
  }

  tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.hide-for-large-only, tr.show-for-large-up, tr.hide-for-large, tr.hide-for-large-down, tr.hide-for-xlarge-only, tr.show-for-xlarge-up, tr.hide-for-xlarge, tr.hide-for-xlarge-down, tr.show-for-xxlarge-only, tr.show-for-xxlarge-up, tr.show-for-xxlarge, tr.show-for-xxlarge-down {
	display: table-row;
  }

  th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.show-for-large-up, td.show-for-large-up, th.hide-for-large, td.hide-for-large, th.hide-for-large-down, td.hide-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.show-for-xlarge-up, td.show-for-xlarge-up, th.hide-for-xlarge, td.hide-for-xlarge, th.hide-for-xlarge-down, td.hide-for-xlarge-down, th.show-for-xxlarge-only, td.show-for-xxlarge-only, th.show-for-xxlarge-up, td.show-for-xxlarge-up, th.show-for-xxlarge, td.show-for-xxlarge, th.show-for-xxlarge-down, td.show-for-xxlarge-down {
	display: table-cell !important;
  }
}
/* Orientation targeting */
.show-for-landscape,
.hide-for-portrait {
  display: inherit !important;
}

.hide-for-landscape,
.show-for-portrait {
  display: none !important;
}

/* Specific visibility for tables */
table.hide-for-landscape, table.show-for-portrait {
  display: table !important;
}

thead.hide-for-landscape, thead.show-for-portrait {
  display: table-header-group !important;
}

tbody.hide-for-landscape, tbody.show-for-portrait {
  display: table-row-group !important;
}

tr.hide-for-landscape, tr.show-for-portrait {
  display: table-row !important;
}

td.hide-for-landscape, td.show-for-portrait,
th.hide-for-landscape,
th.show-for-portrait {
  display: table-cell !important;
}

@media only screen and (orientation: landscape) {
  .show-for-landscape,
.hide-for-portrait {
	display: inherit !important;
  }

  .hide-for-landscape,
.show-for-portrait {
	display: none !important;
  }

  /* Specific visibility for tables */
  table.show-for-landscape, table.hide-for-portrait {
	display: table !important;
  }

  thead.show-for-landscape, thead.hide-for-portrait {
	display: table-header-group !important;
  }

  tbody.show-for-landscape, tbody.hide-for-portrait {
	display: table-row-group !important;
  }

  tr.show-for-landscape, tr.hide-for-portrait {
	display: table-row !important;
  }

  td.show-for-landscape, td.hide-for-portrait,
th.show-for-landscape,
th.hide-for-portrait {
	display: table-cell !important;
  }
}
@media only screen and (orientation: portrait) {
  .show-for-portrait,
.hide-for-landscape {
	display: inherit !important;
  }

  .hide-for-portrait,
.show-for-landscape {
	display: none !important;
  }

  /* Specific visibility for tables */
  table.show-for-portrait, table.hide-for-landscape {
	display: table !important;
  }

  thead.show-for-portrait, thead.hide-for-landscape {
	display: table-header-group !important;
  }

  tbody.show-for-portrait, tbody.hide-for-landscape {
	display: table-row-group !important;
  }

  tr.show-for-portrait, tr.hide-for-landscape {
	display: table-row !important;
  }

  td.show-for-portrait, td.hide-for-landscape,
th.show-for-portrait,
th.hide-for-landscape {
	display: table-cell !important;
  }
}
/* Touch-enabled device targeting */
.show-for-touch {
  display: none !important;
}

.hide-for-touch {
  display: inherit !important;
}

.touch .show-for-touch {
  display: inherit !important;
}

.touch .hide-for-touch {
  display: none !important;
}

/* Specific visibility for tables */
table.hide-for-touch {
  display: table !important;
}

.touch table.show-for-touch {
  display: table !important;
}

thead.hide-for-touch {
  display: table-header-group !important;
}

.touch thead.show-for-touch {
  display: table-header-group !important;
}

tbody.hide-for-touch {
  display: table-row-group !important;
}

.touch tbody.show-for-touch {
  display: table-row-group !important;
}

tr.hide-for-touch {
  display: table-row !important;
}

.touch tr.show-for-touch {
  display: table-row !important;
}

td.hide-for-touch {
  display: table-cell !important;
}

.touch td.show-for-touch {
  display: table-cell !important;
}

th.hide-for-touch {
  display: table-cell !important;
}

.touch th.show-for-touch {
  display: table-cell !important;
}

/* Screen reader-specific classes */
.show-for-sr {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  width: 1px;
}

.show-on-focus {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  width: 1px;
}
.show-on-focus:focus, .show-on-focus:active {
  position: static !important;
  height: auto;
  width: auto;
  overflow: visible;
  clip: auto;
}

/* Print visibility */
.print-only,
.show-for-print {
  display: none !important;
}

@media print {
  .print-only,
.show-for-print {
	display: block !important;
  }

  .hide-on-print,
.hide-for-print {
	display: none !important;
  }

  table.show-for-print {
	display: table !important;
  }

  thead.show-for-print {
	display: table-header-group !important;
  }

  tbody.show-for-print {
	display: table-row-group !important;
  }

  tr.show-for-print {
	display: table-row !important;
  }

  td.show-for-print {
	display: table-cell !important;
  }

  th.show-for-print {
	display: table-cell !important;
  }
}
/**
 * InputfieldForm CSS file for FormBuilder with non-Legacy frameworks
 *
 */
.InputfieldForm textarea,
.InputfieldForm .InputfieldMaxWidth {
  width: 100%;
}
.InputfieldForm input[type=text],
.InputfieldForm input[type=password],
.InputfieldForm input[type=date],
.InputfieldForm input[type=datetime],
.InputfieldForm input[type=datetime-local],
.InputfieldForm input[type=month],
.InputfieldForm input[type=week],
.InputfieldForm input[type=email],
.InputfieldForm input[type=number],
.InputfieldForm input[type=search],
.InputfieldForm input[type=tel],
.InputfieldForm input[type=time],
.InputfieldForm input[type=url],
.InputfieldForm input[type=color],
.InputfieldForm select,
.InputfieldForm textarea {
  margin: 0;
}
.InputfieldForm, .InputfieldForm *, .InputfieldForm *:before, .InputfieldForm *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.InputfieldForm .Inputfields {
  height: auto;
  list-style: none;
  padding: 0;
}
.InputfieldForm .Inputfield {
  list-style: none;
  display: block;
}
.InputfieldForm .Inputfield {
  clear: both;
  margin: 0 0 1.5em 0;
}
.InputfieldForm .Inputfield:not(fieldset) {
  padding: 0;
}
.InputfieldForm fieldset,
.InputfieldForm .InputfieldFieldset {
  margin: 0 0 1.5em 0;
  padding-bottom: 0;
}
.InputfieldForm .InputfieldStateCollapsed .InputfieldHeader {
  opacity: 0.5;
}
.InputfieldForm .InputfieldStateCollapsed .InputfieldHeader:after {
  content: " …";
}
.InputfieldForm .InputfieldStateCollapsed .InputfieldContent {
  display: none;
}
.InputfieldForm .InputfieldHidden {
  display: none;
}
.InputfieldForm .description,
.InputfieldForm .notes {
  margin: 0.25em 0;
}
.InputfieldForm .Inputfield:not(.InputfieldStateCollapsed) > .InputfieldHeaderHidden > span {
  display: none;
}

.InputfieldFormWidths {
  /** the following have to do with column widths **********************************************/
}
.InputfieldFormWidths input[type=text],
.InputfieldFormWidths input[type=email],
.InputfieldFormWidths input[type=url],
.InputfieldFormWidths input[type=number],
.InputfieldFormWidths select,
.InputfieldFormWidths textarea {
  width: 100%;
}
.InputfieldFormWidths .InputfieldColumnWidth {
  /* an Inputfield that has a percentage width assigned to it */
  float: left;
  clear: none;
  margin-left: 0;
  margin-right: 0;
}
.InputfieldFormWidths .InputfieldColumnWidth > .InputfieldHeader,
.InputfieldFormWidths .InputfieldColumnWidth > .InputfieldContent {
  padding-left: 1.5em;
}
.InputfieldFormWidths .InputfieldColumnWidthFirst,
.InputfieldFormWidths .InputfieldColumnWidth + .InputfieldSubmit,
.InputfieldFormWidths .InputfieldColumnWidthFirstTmp,
.InputfieldFormWidths .InputfieldColumnWidthFirst.InputfieldStateHidden + .Inputfield {
  /* first Inputfield with a percent width... */
  /* ...or the last percentage-width Inputifeld before the submit button */
  clear: both;
}
.InputfieldFormWidths .InputfieldColumnWidthFirst > .InputfieldHeader,
.InputfieldFormWidths .InputfieldColumnWidthFirst > .InputfieldContent,
.InputfieldFormWidths .InputfieldColumnWidth + .InputfieldSubmit > .InputfieldHeader,
.InputfieldFormWidths .InputfieldColumnWidth + .InputfieldSubmit > .InputfieldContent,
.InputfieldFormWidths .InputfieldColumnWidthFirstTmp > .InputfieldHeader,
.InputfieldFormWidths .InputfieldColumnWidthFirstTmp > .InputfieldContent,
.InputfieldFormWidths .InputfieldColumnWidthFirst.InputfieldStateHidden + .Inputfield > .InputfieldHeader,
.InputfieldFormWidths .InputfieldColumnWidthFirst.InputfieldStateHidden + .Inputfield > .InputfieldContent {
  padding-left: 0;
}
.InputfieldFormWidths .description {
  margin: 0.25em 0;
}
.InputfieldFormWidths .notes {
  margin: 0.25em 0;
}

/*** state toggles *******************************************************/
.InputfieldStateToggle {
  cursor: pointer;
}
.InputfieldStateToggle i.toggle-icon {
  /* the open/close icon that goes with most Inputfields */
  float: right;
  padding-right: 0.25em;
}
.InputfieldStateToggle i.toggle-icon {
  padding-right: 0.5em;
  line-height: 1.7em;
}
.InputfieldStateToggle i + i {
  margin-right: 0.5em;
  margin-left: 0;
}

/*** misc ******************************************************************/
.InputfieldStateRequired > .InputfieldHeader:first-child:after {
  /* Required state: Add asterisk to indicate field is required */
  content: "*";
  margin-left: 0.25em;
  color: red;
}

.FormBuilderFrameworkLegacy .Inputfields > .Inputfield > .InputfieldContent:before,
.FormBuilderFrameworkLegacy .Inputfields > .Inputfield > .InputfieldContent:after, .FormBuilderFrameworkLegacy:after,
.FormBuilderFrameworkDefault .Inputfields > .Inputfield > .InputfieldContent:before,
.FormBuilderFrameworkDefault .Inputfields > .Inputfield > .InputfieldContent:after,
.FormBuilderFrameworkDefault:after {
  content: " ";
  display: table;
}
.FormBuilderFrameworkLegacy .Inputfields > .Inputfield > .InputfieldContent:after, .FormBuilderFrameworkLegacy:after,
.FormBuilderFrameworkDefault .Inputfields > .Inputfield > .InputfieldContent:after,
.FormBuilderFrameworkDefault:after {
  clear: both;
}

.InputfieldSelect ul,
.InputfieldRadios ul,
.InputfieldCheckboxes ul {
  margin: 0;
}
.InputfieldSelect ul li,
.InputfieldRadios ul li,
.InputfieldCheckboxes ul li {
  margin: 0;
}

#wrap_Inputfield- {
  display: none;
}

/****************************************************************************
 * Render Value Mode 
 *
 * Used when only values are being rendered in the form (no inputs)
 *
 */
.InputfieldRenderValueMode .InputfieldSelect li,
.InputfieldRenderValueMode .InputfieldRadios li,
.InputfieldRenderValueMode .InputfieldCheckboxes li {
  margin: 0;
}
.InputfieldRenderValueMode .InputfieldSubmit,
.InputfieldRenderValueMode .InputfieldButton {
  display: none;
}

.pw-no-select {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  /* prevent selection of this element */
}

/*
 *  Owl Carousel - Core
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
}
.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y;
  touch-action: manipulation;
  -moz-backface-visibility: hidden;
  /* fix firefox animation glitch */
}
.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}
.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}
.owl-carousel .owl-item img {
  display: block;
  width: 100%;
}
.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
  display: none;
}
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
  cursor: pointer;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel button.owl-dot {
  background: none;
  color: inherit;
  border: none;
  padding: 0 !important;
  font: inherit;
}
.owl-carousel.owl-loaded {
  display: block;
}
.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}
.owl-carousel.owl-hidden {
  opacity: 0;
}
.owl-carousel.owl-refresh .owl-item {
  visibility: hidden;
}
.owl-carousel.owl-drag .owl-item {
  touch-action: pan-y;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel.owl-grab {
  cursor: move;
  cursor: grab;
}
.owl-carousel.owl-rtl {
  direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
  float: right;
}

/* No Js */
.no-js .owl-carousel {
  display: block;
}

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both;
}
.owl-carousel .owl-animated-in {
  z-index: 0;
}
.owl-carousel .owl-animated-out {
  z-index: 1;
}
.owl-carousel .fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOut {
  0% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
/*
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out;
}

/*
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item {
  /**
	This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
	calculation of the height of the owl-item that breaks page layouts
   */
}
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
  max-height: 0;
}
.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d;
}

/*
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}
.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease;
}
.owl-carousel .owl-video-play-icon:hover {
  transform: scale(1.3, 1.3);
}
.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none;
}
.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
}

.carousel-controlls {
  position: absolute;
  top: 0;
  right: 0.9375rem;
}
.no-js .carousel-controlls {
  display: none;
}

/*!
 * baguetteBox.js
 * @author  feimosi
 * @version %%INJECT_VERSION%%
 * @url https://github.com/feimosi/baguetteBox.js
 */
#baguetteBox-overlay {
  display: none;
  opacity: 0;
  position: fixed;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000000;
  background-color: #222;
  background-color: rgba(0, 0, 0, 0.8);
  transition: opacity 0.5s ease;
}
#baguetteBox-overlay.visible {
  opacity: 1;
}
#baguetteBox-overlay .full-image {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
}
#baguetteBox-overlay .full-image figure {
  display: inline;
  margin: 0;
  height: 100%;
}
#baguetteBox-overlay .full-image img {
  display: inline-block;
  width: auto;
  height: auto;
  max-height: 100%;
  max-width: 100%;
  vertical-align: middle;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
#baguetteBox-overlay .full-image figcaption {
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  line-height: 1.8;
  white-space: normal;
  color: #ccc;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.6);
  font-family: sans-serif;
}
#baguetteBox-overlay .full-image:before {
  content: "";
  display: inline-block;
  height: 50%;
  width: 1px;
  margin-right: -1px;
}

#baguetteBox-slider {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  white-space: nowrap;
  transition: left 0.4s ease, transform 0.4s ease;
}
#baguetteBox-slider.bounce-from-right {
  animation: bounceFromRight 0.4s ease-out;
}
#baguetteBox-slider.bounce-from-left {
  animation: bounceFromLeft 0.4s ease-out;
}

@keyframes bounceFromRight {
  0% {
	margin-left: 0;
  }
  50% {
	margin-left: -30px;
  }
  100% {
	margin-left: 0;
  }
}
@keyframes bounceFromLeft {
  0% {
	margin-left: 0;
  }
  50% {
	margin-left: 30px;
  }
  100% {
	margin-left: 0;
  }
}
.baguetteBox-button#previous-button, .baguetteBox-button#next-button {
  top: 50%;
  top: calc(50% - 30px);
  width: 44px;
  height: 60px;
}

.baguetteBox-button {
  position: absolute;
  cursor: pointer;
  outline: none;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 15%;
  background-color: #323232;
  background-color: rgba(50, 50, 50, 0.5);
  color: #ddd;
  font: 1.6em sans-serif;
  transition: background-color 0.4s ease;
}
.baguetteBox-button:focus, .baguetteBox-button:hover {
  background-color: rgba(50, 50, 50, 0.9);
}
.baguetteBox-button#next-button {
  right: 2%;
}
.baguetteBox-button#previous-button {
  left: 2%;
}
.baguetteBox-button#close-button {
  top: 20px;
  right: 2%;
  right: calc(2% + 6px);
  width: 30px;
  height: 30px;
}
.baguetteBox-button svg {
  position: absolute;
  left: 0;
  top: 0;
}

/*
	Preloader
	Borrowed from http://tobiasahlin.com/spinkit/
*/
.baguetteBox-spinner {
  width: 40px;
  height: 40px;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -20px;
  margin-left: -20px;
}

.baguetteBox-double-bounce1,
.baguetteBox-double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #fff;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  animation: bounce 2s infinite ease-in-out;
}

.baguetteBox-double-bounce2 {
  animation-delay: -1s;
}

@keyframes bounce {
  0%, 100% {
	transform: scale(0);
  }
  50% {
	transform: scale(1);
  }
}
/* Get the bourbon mixin from http://bourbon.io */
/* Reset */
.flip-clock-wrapper * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-clock-wrapper a {
  cursor: pointer;
  text-decoration: none;
  color: #ccc;
}

.flip-clock-wrapper a:hover {
  color: #fff;
}

.flip-clock-wrapper ul {
  list-style: none;
}

.flip-clock-wrapper.clearfix:before,
.flip-clock-wrapper.clearfix:after {
  content: " ";
  display: table;
}

.flip-clock-wrapper.clearfix:after {
  clear: both;
}

.flip-clock-wrapper.clearfix {
  *zoom: 1;
}

/* Main */
.flip-clock-wrapper {
  font: normal 11px "Helvetica Neue", Helvetica, sans-serif;
  -webkit-user-select: none;
}

.flip-clock-meridium {
  background: none !important;
  box-shadow: 0 0 0 !important;
  font-size: 36px !important;
}

.flip-clock-meridium a {
  color: #313333;
}

.flip-clock-wrapper {
  text-align: center;
  position: relative;
  width: 100%;
  margin: 1em;
}

.flip-clock-wrapper:before,
.flip-clock-wrapper:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.flip-clock-wrapper:after {
  clear: both;
}

/* Skeleton */
.flip-clock-wrapper ul {
  position: relative;
  float: left;
  margin: 5px;
  width: 60px;
  height: 90px;
  font-size: 80px;
  font-weight: bold;
  line-height: 87px;
  border-radius: 6px;
  background: #000;
}

.flip-clock-wrapper ul li {
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  line-height: 87px;
  text-decoration: none !important;
}

.flip-clock-wrapper ul li:first-child {
  z-index: 2;
}

.flip-clock-wrapper ul li a {
  display: block;
  height: 100%;
  -webkit-perspective: 200px;
  -moz-perspective: 200px;
  perspective: 200px;
  margin: 0 !important;
  overflow: visible !important;
  cursor: default !important;
}

.flip-clock-wrapper ul li a div {
  z-index: 1;
  position: absolute;
  left: 0;
  width: 100%;
  height: 50%;
  font-size: 80px;
  overflow: hidden;
  outline: 1px solid transparent;
}

.flip-clock-wrapper ul li a div .shadow {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.flip-clock-wrapper ul li a div.up {
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  top: 0;
}

.flip-clock-wrapper ul li a div.up:after {
  content: "";
  position: absolute;
  top: 44px;
  left: 0;
  z-index: 5;
  width: 100%;
  height: 3px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.4);
}

.flip-clock-wrapper ul li a div.down {
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  -o-transform-origin: 50% 0;
  transform-origin: 50% 0;
  bottom: 0;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

.flip-clock-wrapper ul li a div div.inn {
  position: absolute;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 200%;
  color: #ccc;
  text-shadow: 0 1px 2px #000;
  text-align: center;
  background-color: #333;
  border-radius: 6px;
  font-size: 70px;
}

.flip-clock-wrapper ul li a div.up div.inn {
  top: 0;
}

.flip-clock-wrapper ul li a div.down div.inn {
  bottom: 0;
}

/* PLAY */
.flip-clock-wrapper ul.play li.flip-clock-before {
  z-index: 3;
}

.flip-clock-wrapper .flip {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
}

.flip-clock-wrapper ul.play li.flip-clock-active {
  -webkit-animation: asd 0.5s 0.5s linear both;
  -moz-animation: asd 0.5s 0.5s linear both;
  animation: asd 0.5s 0.5s linear both;
  z-index: 5;
}

.flip-clock-divider {
  float: left;
  display: inline-block;
  position: relative;
  width: 20px;
  height: 100px;
}

.flip-clock-divider:first-child {
  width: 0;
}

.flip-clock-dot {
  display: block;
  background: #323434;
  width: 10px;
  height: 10px;
  position: absolute;
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  left: 5px;
}

.flip-clock-divider .flip-clock-label {
  position: absolute;
  top: -1.5em;
  right: -86px;
  color: black;
  text-shadow: none;
}

.flip-clock-divider.minutes .flip-clock-label {
  right: -88px;
}

.flip-clock-divider.seconds .flip-clock-label {
  right: -91px;
}

.flip-clock-dot.top {
  top: 30px;
}

.flip-clock-dot.bottom {
  bottom: 30px;
}

@-webkit-keyframes asd {
  0% {
	z-index: 2;
  }
  20% {
	z-index: 4;
  }
  100% {
	z-index: 4;
  }
}
@-moz-keyframes asd {
  0% {
	z-index: 2;
  }
  20% {
	z-index: 4;
  }
  100% {
	z-index: 4;
  }
}
@-o-keyframes asd {
  0% {
	z-index: 2;
  }
  20% {
	z-index: 4;
  }
  100% {
	z-index: 4;
  }
}
@keyframes asd {
  0% {
	z-index: 2;
  }
  20% {
	z-index: 4;
  }
  100% {
	z-index: 4;
  }
}
.flip-clock-wrapper ul.play li.flip-clock-active .down {
  z-index: 2;
  -webkit-animation: turn 0.5s 0.5s linear both;
  -moz-animation: turn 0.5s 0.5s linear both;
  animation: turn 0.5s 0.5s linear both;
}

@-webkit-keyframes turn {
  0% {
	-webkit-transform: rotateX(90deg);
  }
  100% {
	-webkit-transform: rotateX(0deg);
  }
}
@-moz-keyframes turn {
  0% {
	-moz-transform: rotateX(90deg);
  }
  100% {
	-moz-transform: rotateX(0deg);
  }
}
@-o-keyframes turn {
  0% {
	-o-transform: rotateX(90deg);
  }
  100% {
	-o-transform: rotateX(0deg);
  }
}
@keyframes turn {
  0% {
	transform: rotateX(90deg);
  }
  100% {
	transform: rotateX(0deg);
  }
}
.flip-clock-wrapper ul.play li.flip-clock-before .up {
  z-index: 2;
  -webkit-animation: turn2 0.5s linear both;
  -moz-animation: turn2 0.5s linear both;
  animation: turn2 0.5s linear both;
}

@-webkit-keyframes turn2 {
  0% {
	-webkit-transform: rotateX(0deg);
  }
  100% {
	-webkit-transform: rotateX(-90deg);
  }
}
@-moz-keyframes turn2 {
  0% {
	-moz-transform: rotateX(0deg);
  }
  100% {
	-moz-transform: rotateX(-90deg);
  }
}
@-o-keyframes turn2 {
  0% {
	-o-transform: rotateX(0deg);
  }
  100% {
	-o-transform: rotateX(-90deg);
  }
}
@keyframes turn2 {
  0% {
	transform: rotateX(0deg);
  }
  100% {
	transform: rotateX(-90deg);
  }
}
.flip-clock-wrapper ul li.flip-clock-active {
  z-index: 3;
}

/* SHADOW */
.flip-clock-wrapper ul.play li.flip-clock-before .up .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
  background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
  -webkit-animation: show 0.5s linear both;
  -moz-animation: show 0.5s linear both;
  animation: show 0.5s linear both;
}

.flip-clock-wrapper ul.play li.flip-clock-active .up .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
  background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
  -webkit-animation: hide 0.5s 0.3s linear both;
  -moz-animation: hide 0.5s 0.3s linear both;
  animation: hide 0.5s 0.3s linear both;
}

/*DOWN*/
.flip-clock-wrapper ul.play li.flip-clock-before .down .shadow {
  background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
  background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
  background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
  -webkit-animation: show 0.5s linear both;
  -moz-animation: show 0.5s linear both;
  animation: show 0.5s linear both;
}

.flip-clock-wrapper ul.play li.flip-clock-active .down .shadow {
  background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
  background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
  background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
  background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
  -webkit-animation: hide 0.5s 0.3s linear both;
  -moz-animation: hide 0.5s 0.3s linear both;
  animation: hide 0.5s 0.2s linear both;
}

@-webkit-keyframes show {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@-moz-keyframes show {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@-o-keyframes show {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes show {
  0% {
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@-webkit-keyframes hide {
  0% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
@-moz-keyframes hide {
  0% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
@-o-keyframes hide {
  0% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
@keyframes hide {
  0% {
	opacity: 1;
  }
  100% {
	opacity: 0;
  }
}
/*

Mixins
====

Mixins, etwas was der Perfekte Webdeveloper DJ beherscht

 */
/*

### Font's

Schriften (muessen angepasst werden sollte es Fonts geben)

```

@include font-normal;
@include font-bold;


```

 */
/*

### Hover- und Focus-Styles

Shortcut um Hover- und Focus-Styles an einem Element zu definieren.

```
a,
button {
  @include hover {
	text-decoration: underline;
	}
  }

... wird zu ...

a:hover,
button:hover {
  text-decoration: underline;
  }
```

 */
/*

### Vertical Align

Vertical Algin einfach gemacht ;)

```

@include vertical-align;


```

 */
/*

### Select all input with text

```

@include input-text {
  color: red;
}


```

 */
/*

## Ellipsis

Fuegt eine horizontale Ellipsis ans Textende.

```
.selector {
  @include ellipsis;
  }
```

 */
/*

### Text visuell verbergen

Blendet Text aus, ohne die Zugaenglchkeit fuer Screenreader zu unterminieren.

```
.selector {
  @include hide-text;
  }

.inline-block-selector {
  @include hide-text (inline-block);
  }
```

 */
/*

### Mixin Media-Query

```
.selector {
  @include mediaUp(1200) {
	background-color: blue;
  }
}

.selector {
  @include mediaDown(1200) {
	background-color: blue;
  }
}

.selector {
  @include mediaBetween(800, 1200) {
	background-color: blue;
  }
}
```

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

body {
  padding: 0;
  font-size: 100%;
  min-width: 320px;
  overflow-x: hidden;
}

/* HTML5 fuer alte */
header,
footer,
section,
article,
aside,
figure,
figcaption,
hgroup,
nav,
menu,
picture {
  display: block;
}

input,
select,
textarea,
button {
  font-family: inherit;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Auszug Icomoon */
/* Font wird in fonts.scss eingebettet */
.icon {
  width: 1em;
  height: 1em;
  font-size: 1em;
  font-family: "icomoon";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon:before {
  display: inline-block;
  transition: all 0.3s ease-in-out;
}

.icon--close:before {
  content: "";
}

.icon--arrow-down:before {
  content: "󢖼";
}

.icon--arrow-left:before {
  content: "󢝰";
}

.icon--arrow-right:before {
  content: "󢝱";
}

.icon--arrow-top:before {
  content: "󢝱";
  transform: rotate(-90deg);
}

.icon--calendar:before {
  content: "📆";
}

.icon--clock:before {
  content: "⏰";
}

.icon--external-link:before {
  content: "🔗";
}

.icon--facebook:before {
  content: " ";
}

.icon--home:before {
  content: "⌂";
}

.icon--loupe:before {
  content: "";
}

.icon--mail:before {
  content: "📧";
}

.icon--menu:before {
  content: "☰";
}

.icon--phone:before {
  content: "☎";
}

.icon--pin:before {
  content: "🌐";
}

.icon--twitter:before {
  content: "🐥";
}

.icon--download:before {
  content: "";
}

.icon--arrow-up:before {
  content: "";
}

.icon--arrow-down:before {
  content: "";
}

body {
  color: #333333;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 300;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

.relative {
  position: relative;
  height: 100%;
  width: 100%;
}

.disable-scroll {
  overflow: hidden;
}

.hide {
  display: none;
}

.show {
  display: block;
}

.hidden {
  visibility: hidden;
}

.visibile {
  visibility: visible;
}

.gangnam-style * {
  font-family: "Comic Sans MS" !important;
}

.left, .form__checkbox {
  float: left;
}

.right {
  float: right;
}

.page {
  position: relative;
}
@media only screen and (max-width: 40em) {
  .page--carousel .headline--center,
.page--carousel .block__content {
	text-align: left;
  }
}

.embed_code {
  text-align: center;
}

/**
 *	Rainbow Stuff :)
 *	Ab hier entfernen
 */
@-moz-keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
@-webkit-keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
@-o-keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
@-ms-keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
@-khtml-keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
@keyframes rainbowframe {
  from {
	background-position: top left;
  }
  to {
	background-position: top right;
  }
}
.rainbow {
  background-image: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet, indigo, blue, green, yellow, orange, red);
  background-image: -o-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet, indigo, blue, green, yellow, orange, red);
  background-image: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet, indigo, blue, green, yellow, orange, red);
  -moz-animation: rainbowframe 2.5s forwards linear infinite;
  -webkit-animation: rainbowframe 2.5s forwards linear infinite;
  -o-animation: rainbowframe 2.5s forwards linear infinite;
  -ms-animation: rainbowframe 2.5s forwards linear infinite;
  animation: rainbowframe 2.5s forwards linear infinite;
  background-size: 50% auto;
}

/**
 *	Bis hier Entfernen bzw hier unter weiter coden
 */
.main {
  min-height: 37.5em;
}
.main--home {
  margin-top: 0 !important;
  margin-bottom: 0;
  padding-top: 3.75em;
}

.jumppoint {
  height: 0;
  width: 0;
  position: relative;
  top: -100px;
}

.header {
  height: 6.25em;
}
.header--imprint {
  height: 8.75em;
}
.header__logo {
  margin-top: 1.875rem;
  max-height: 3.75rem;
  transition: 0.3s ease-in-out;
  position: absolute;
  max-width: 11.25rem;
}
.header__logo-link {
  display: block;
}
.header #navigation {
  min-width: 320px;
  height: 6.25em;
}
.header #navigation.headroom {
  z-index: 100;
  position: fixed;
  left: 0;
  right: 0;
  background-color: #FFFFFF;
  transition: top 0.2s ease-in-out;
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
}
.header #navigation.headroom--pinned {
  top: 0;
}
.header #navigation.headroom--unpinned {
  top: -7.5em;
}
@media only screen and (min-width:64.0625em) {
  .header #navigation.headroom--unpinned {
	top: 0;
  }
}
.header #navigation.headroom > .row {
  position: relative;
}
.header #navigation.headroom .headroom__disrupter {
  display: none;
}
@media (min-width: 839px) {
  .header #navigation.headroom .headroom__disrupter {
	font-size: 15px;
	display: block;
	position: absolute;
	top: 0.85em;
	right: 0.85em;
	background: #ea2327;
	color: white;
	font-family: "Titillium Web", sans-serif;
	text-transform: uppercase;
	padding: 0.35em 0.75em;
	text-decoration: none;
	z-index: 10;
	transform: rotate(0deg);
  }
}

.block {
  margin-bottom: 3.75em;
}
.block__content {
  text-align: center;
}
.block__content p:first-child {
  margin-top: 0;
}
.block__content p:last-child {
  margin-bottom: 0;
}
.block__content p strong {
  font-weight: bold;
}
.block__content em {
  color: #5db8e2;
  text-transform: none;
  font-style: normal;
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 660px;
  font-size: 0.9em;
}
.block__content a {
  color: #333333;
  text-decoration: underline;
}
.block__content a:hover, .block__content a:active, .block__content a:focus {
  text-decoration: none;
}
.block__content ul {
  width: 100%;
  max-width: 436px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  list-style-type: none;
  padding: 1rem 1rem 1rem 1.8rem;
}
.block__content li {
  position: relative;
}
.block__content li:before {
  position: absolute;
  top: 0;
  left: -10px;
  content: "-";
}
.block__content hr {
  display: block;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 0 auto;
  width: 100%;
  max-width: 436px;
}
.block__images .block__column {
  padding-bottom: 1em;
  /*@media only screen and (min-width:40.0625em) {
	padding-bottom: 0;
  }*/
  float: left !important;
}
.block__imagelink {
  display: block;
}
.block__image {
  max-width: 100%;
  max-height: 100%;
}
.block__column--center {
  text-align: center;
}
.block__addresse {
  border-top: 0.0625em solid #FFFFFF;
  padding-top: 1em;
  margin-bottom: 2em;
}
.block__addresse-mail {
  color: #FFFFFF;
  text-decoration: none;
}
.block__addresse-mail:hover, .block__addresse-mail:active, .block__addresse-mail:focus {
  text-decoration: underline;
}
.block a.button {
  text-decoration: none;
  color: #FFFFFF;
}
.block--no-bottom-space {
  margin-bottom: 0;
}
.block--site-link:last-child {
  margin-bottom: 0;
}
.block--site-link .column {
  padding-top: 1em;
  padding-bottom: 1em;
}
.block--site-link .owl-stage {
  align-items: stretch;
  display: flex;
}
.block--site-link .owl-item .workshops {
  padding-bottom: 3rem;
}
.block--site-link .owl-item .workshops .button {
  position: absolute;
  bottom: 0;
}
.block .owl-item .person .button {
  margin-top: 1em;
}

.tmpl .main {
  margin-top: 4.375em;
}
.tmpl--basic-page .page {
  margin-top: 0em;
}
.tmpl--basic-page .main {
  margin-top: 0em;
  margin-bottom: 0em;
}
.tmpl--include {
  padding: 4.375em 0em;
}
.tmpl--include-margin {
  padding: 0;
  margin: 4.375em 0em;
}
.tmpl--include-margin .main {
  margin-top: 0em;
}
.tmpl--formular main {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.tmpl--page-formular {
  padding: 8.125em 0;
}
@media only screen and (min-width:64.0625em) {
  .tmpl--page-formular {
	padding: 4.375em 0;
  }
}
.tmpl--page-iframe {
  padding: 0 0;
}
@media only screen and (min-width:64.0625em) {
  .tmpl--page-iframe {
	padding: 0 0;
  }
}

.footer {
  padding: 2.5em 0;
  background-color: #4D4D4D;
  color: #B3B3B3;
}
.footer a {
  color: #FFFFFF;
  text-decoration: none;
  padding: 0 0 0 1em;
  text-transform: uppercase;
}
.footer a:hover, .footer a:active, .footer a:focus {
  text-decoration: underline;
}
@media only screen and (min-width:40.0625em) {
  .footer__nav {
	text-align: right;
  }
}

.aside {
  display: block;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  z-index: 1;
}
@media (min-width: 839px) {
  .aside {
	display: none;
  }
}
.aside__disrupter {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  background: #ea2327;
  color: white;
  font-family: "Titillium Web", sans-serif;
  text-transform: uppercase;
  padding: 0.35em 0.75em;
  text-decoration: none;
}

/*

Formulare und Schaltflaechen
====

*/
/*

## Standart Formular / .form

Beispiel:

```
<form class="form" action="#" method="POST">
  <label for="username" class="form__label">Username</label>
  <input type="text" name="username" class="input input--text form__input">

  <label for="password" class="form__label">Password</label>
  <input type="text" name="password" class="input input--text form__input">
</form>
```

*/
#form .description a {
  color: #333333;
  text-decoration: underline;
}
#form .description a:hover, #form .description a:active, #form .description a:focus {
  text-decoration: none;
}

.form__overlay {
  display: none;
  max-width: 95%;
  margin: 2rem auto;
  background: #E5F4FA;
  position: relative;
}
@media only screen and (min-width:64.0625em) {
  .form__overlay {
	max-width: 60%;
  }
}
.form__wrapper .Inputfield.InputfieldSubmit {
  text-align: right;
  padding: 16px;
}
.form__wrapper .Inputfields {
  height: 100%;
}
.form__wrapper .Inputfields input[type=text],
.form__wrapper .Inputfields input[type=email] {
  font-size: 1rem;
}
.form__wrapper .InputfieldHidden {
  display: block;
}
.form__wrapper .InputfieldHidden.Inputfield_ticketkategorie {
  display: none;
}
.form__wrapper .InputfieldHidden .InputfieldHeader {
  color: #000000;
  left: 1.9375rem;
}
.Inputfield_ticketname .InputfieldHeader {
  display: none;
}

.Inputfield_ticketpreis {
  font-size: 1rem;
}

.button.js-form_open {
  display: none;
}

.button.js-to-workshop {
  margin-top: 0.25rem;
}

.button--speaker {
  font-size: 0.8em !important;
  background-color: #CCCCCC !important;
  width: 100%;
  margin-top: 0.25rem;
}
.button--speaker:hover {
  background-color: #000000 !important;
}

.mfp-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.75);
  z-index: 5000;
  overflow: auto;
  padding: 1rem;
}
.mfp-wrap .form__overlay {
  display: block;
}

.mfp-preloader {
  display: none;
}

.mfp-close {
  position: absolute;
  top: -0.625rem;
  background: transparent none repeat scroll 0% 0%;
  border: medium none;
  font-size: 2rem;
  right: 0;
  cursor: pointer;
}

#FormBuilder_ticketreadynormal_v2 .Inputfield_adresse, #FormBuilder_ticketreadynormal_v2 .Inputfield_angaben_zur_person {
  padding: 0;
  border: 0;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_adresse legend, #FormBuilder_ticketreadynormal_v2 .Inputfield_angaben_zur_person legend {
  margin: 0.5rem 0;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_abweichende_adresse_1 {
  padding: 0;
  border: 0;
  display: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_abweichende_adresse_1 legend {
  display: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_preis {
  padding: 0;
  border: 0;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_preis legend {
  display: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_checkboxen {
  clear: none;
  border: 0;
  padding: 0;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield_checkboxen legend {
  display: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_vor_und_nachname, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_e_mail_adresse, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_institution, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_plz, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_plz_1 {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_vor_und_nachname .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_e_mail_adresse .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_institution .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_plz .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_plz_1 .InputfieldHeader {
  left: 1.25rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_strasse, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_strasse_1 {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_strasse .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_strasse_1 .InputfieldHeader {
  left: 1.25rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_hausnummer, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_hausnummer_1 {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_hausnummer .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_hausnummer_1 .InputfieldHeader {
  left: 1.25rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_ort, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_ort_1 {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_ort .InputfieldHeader, #FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_ort_1 .InputfieldHeader {
  left: 1.25rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_gutscheincode {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_gutscheincode .InputfieldHeader {
  left: 1.25rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.InputfieldCheckbox {
  clear: none;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_agbs_gelesen .InputfieldHeader {
  left: 2.25rem;
  top: 1.75rem;
  color: #000000;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_agbs_gelesen .description {
  top: 1.6875rem;
  position: relative;
  left: 1.4375rem;
  font-size: 0.875rem;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_agbs_gelesen .pw-no-select {
  opacity: 0;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.InputfieldStateError small,
#FormBuilder_ticketreadynormal_v2 .Inputfield.InputfieldStateError strong {
  color: #ea2327;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.InputfieldStateError small {
  display: block !important;
  color: #ea2327;
  font-size: 1em;
}
#FormBuilder_ticketreadynormal_v2 .Inputfield.Inputfield_tax .description {
  border-bottom: 2px solid #000000;
  display: inline-block;
  width: 100%;
}

.Inputfields fieldset:first-child {
  margin-top: 2rem;
}

/*

## User Events

User Events (u-event) sind interaktionen die mit bestimmten aktionen als Feedback agieren
Beispiel:

```
<span class="u-event icn icon--close"></span>
```

*/
.u-event {
  transform: scale(1);
  transition: transform 0.1s ease-in-out;
}
.u-event:active {
  transform: scale 0.9;
}

/*

## Standart Button's / .btn

Beispiel:

```
<table>
<tr><td>.btn</td><td><button class="btn">Button</button></td></tr>
<tr><td>.btn--carousel</td><td><input type="button" class="btn btn--carousel" value="Button"></td></tr>
</table>
```

*/
.btn, .mapping input[type=button], .mapping input[type=submit], .input--submit,
.button {
  background-color: #ea2327;
  color: #FFFFFF;
  font-size: 1em;
  transition: opacity 0.3s ease-in-out, background-color 0.3s ease-in-out;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  opacity: 1;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  display: inline-block;
  padding: 0.5625em 0.78125em;
  border: 0;
}
.btn--active,
.button--active {
  background-color: #000000;
}
.btn:hover, .mapping input[type=button]:hover, .mapping input[type=submit]:hover, .input--submit:hover,
.button:hover {
  background-color: #000000;
}
.btn--carousel,
.button--carousel {
  padding-left: 1em;
  padding-right: 1em;
  margin-left: 1em;
}
.btn--carousel:first-child,
.button--carousel:first-child {
  margin-left: 0;
}
.btn--deactive,
.button--deactive {
  opacity: 0;
}
.btn--invert,
.button--invert {
  background-color: #000000;
}
.btn--invert:hover,
.button--invert:hover {
  background-color: #ea2327;
}
.btn--simple,
.button--simple {
  text-transform: inherit;
  background-color: transparent;
  color: #000000;
}
.btn--simple:hover,
.button--simple:hover {
  background-color: #FFFFFF;
  text-decoration: underline;
}
.btn--block-btn,
.button--block-btn {
  text-decoration: none !important;
  color: #FFFFFF !important;
}
.btn.not-active, .mapping input.not-active[type=button], .mapping input.not-active[type=submit], .not-active.input--submit,
.button.not-active {
  display: none;
}

/*

## Standart Eingabefelder / .input

Beispiel:

```
<table>
  <tr>
	<td>.input</td>
	<td><input type="text" class="input"></td>
  </tr>
  <tr>
	<td>.input--hidden</td>
	<td><input type="hidden" class="input input--hidden"></td>
  </tr>
  <tr>
	<td>.input--text</td>
	<td><input type="text" class="input input--text"></td>
  </tr>
  <tr>
	<td>.input--password</td>
	<td><input type="password" class="input input--password"></td>
  </tr>
  <tr>
	<td>.input--submit</td>
	<td><input type="submit" class="input input--submit"></td>
  </tr>
  <tr>
	<td>.input--button</td>
	<td><input type="button" class="input input--button" value="Button"></td>
  </tr>
  <tr>
	<td>.input--checkbox</td>
	<td><input type="checkbox" class="input input--checkbox"></td>
  </tr>
  <tr>
  <tr>
	<td>.input--date</td>
	<td><input type="date" class="input input--date"></td>
  </tr>
	<td>.input--radio</td>
	<td><input type="radio" class="input input--radio"></td>
  </tr>
  <tr>
	<td>.input--file</td>
	<td><input type="file" class="input input--file"></td>
  </tr>
</table>
```

*/
.input, .mapping input, .Inputfield textarea, .Inputfield input[type=text],
.Inputfield input[type=email] {
  padding: 0.4375em 0.4375em;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 1em;
  color: #4D4D4D;
}
.input--textarea, .Inputfield textarea, .input.InputfieldTextarea, .mapping input.InputfieldTextarea, .Inputfield textarea.InputfieldTextarea, .Inputfield input.InputfieldTextarea[type=text],
.Inputfield input.InputfieldTextarea[type=email] {
  width: 100%;
  border: 0;
  background-color: white;
}
.input--invert {
  background-color: #F2F2F2;
}
.input--number, .input--text, .mapping input[type=text], .mapping input[type=search], .mapping input[type=email], .Inputfield input[type=text],
.Inputfield input[type=email], .input--password, .mapping input[type=password] {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  padding: 0.2058823529em 0.2058823529em;
  width: 100%;
  border-width: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: 0.5882352941em !important;
  transition: border 0.15s ease-in-out;
}
.input--number:focus, .input--text:focus, .mapping input[type=text]:focus, .mapping input[type=search]:focus, .mapping input[type=email]:focus, .Inputfield input[type=text]:focus,
.Inputfield input[type=email]:focus, .input--password:focus, .mapping input[type=password]:focus {
  border-bottom: 2px solid #000000;
}
.js .input--number:focus, .js .input--text:focus, .js .mapping input[type=text]:focus, .mapping .js input[type=text]:focus, .js .mapping input[type=search]:focus, .mapping .js input[type=search]:focus, .js .mapping input[type=email]:focus, .mapping .js input[type=email]:focus, .js .Inputfield input[type=text]:focus, .Inputfield .js input[type=text]:focus,
.js .Inputfield input[type=email]:focus,
.Inputfield .js input[type=email]:focus, .js .input--password:focus, .js .mapping input[type=password]:focus, .mapping .js input[type=password]:focus {
  outline: none;
}
.input--number.error, .input--text.error, .mapping input.error[type=text], .mapping input.error[type=search], .mapping input.error[type=email], .Inputfield input.error[type=text],
.Inputfield input.error[type=email], .input--password.error, .mapping input.error[type=password] {
  border-bottom: 2px solid #ea2327;
}
.input--submit {
  color: #FFFFFF;
}
.Inputfield {
  position: relative;
}
.Inputfield input[type=text],
.Inputfield input[type=email] {
  border-bottom: 2px solid #B3B3B3;
  overflow: hidden;
}
.ticket .Inputfield input[type=text], .footer .Inputfield input[type=text], .block--newsletter .Inputfield input[type=text],
.ticket .Inputfield input[type=email],
.footer .Inputfield input[type=email],
.block--newsletter .Inputfield input[type=email] {
  font-size: 1em !important;
}
.Inputfield textarea {
  border-bottom: 2px solid #B3B3B3;
  overflow: hidden;
}
.Inputfield.Inputfield_bild {
  background-color: #FFFFFF;
  padding: 0.4375em 0.4375em !important;
}
.Inputfield.Inputfield_bild .InputfieldContent {
  padding-top: 0.75em;
}
.ticket .Inputfield.InputfieldSubmit {
  text-align: center;
}

.InputfieldStateError.Inputfield input[type=text], .InputfieldStateError.Inputfield input[type=email] {
  border-bottom: 2px solid #ea2327;
}
.InputfieldStateError .error {
  width: 100%;
  display: block;
}
.InputfieldForm .InputfieldStateError.Inputfield.Inputfield_agbs_gelesen .InputfieldHeader {
  color: #ea2327;
}

.alert-box, .InputfieldStateError .error {
  color: #FFFFFF;
  padding: 1em;
  margin: 0.375em auto;
}
#newsletter .alert-box, #newsletter .InputfieldStateError .error, .InputfieldStateError #newsletter .error {
  padding: 0.85rem;
}
.alert-box.error, .InputfieldStateError .error, .alert-box.alert {
  background-color: #ea2327;
}
.alert-box.success, .InputfieldStateError .success.error {
  background-color: #48B709;
}

.InputfieldPage {
  position: relative;
}

.tmpl--formular .Inputfield.InputfieldText, .tmpl--formular .Inputfield.InputfieldEmail, .tmpl--formular .Inputfield.InputfieldInteger, .tmpl--formular .Inputfield.InputfieldRadios, .tmpl--formular .Inputfield.InputfieldCheckbox, .tmpl--formular .Inputfield.InputfieldCheckboxes, .tmpl--formular .Inputfield.InputfieldPage, .tmpl--formular .Inputfield.InputfieldTextarea, .tmpl--formular .Inputfield.InputfieldSubmit, .tmpl--formular .Inputfield.InputfieldInfo {
  padding: 1.875rem 2.25rem !important;
  position: relative;
}
@media only screen and (min-width:40.0625em) {
  .tmpl--formular .Inputfield.InputfieldText, .tmpl--formular .Inputfield.InputfieldEmail, .tmpl--formular .Inputfield.InputfieldInteger, .tmpl--formular .Inputfield.InputfieldRadios, .tmpl--formular .Inputfield.InputfieldCheckbox, .tmpl--formular .Inputfield.InputfieldCheckboxes, .tmpl--formular .Inputfield.InputfieldPage, .tmpl--formular .Inputfield.InputfieldTextarea, .tmpl--formular .Inputfield.InputfieldSubmit, .tmpl--formular .Inputfield.InputfieldInfo {
	padding: 1.875rem 4.5rem !important;
  }
}

.tmpl--formular .Inputfield.InputfieldText .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldEmail .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldInteger .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldRadios .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldCheckbox .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldCheckboxes .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldPage .InputfieldHeader, .tmpl--formular .Inputfield.InputfieldTextarea .InputfieldHeader {
  z-index: 10;
  font-size: 1.125rem;
  display: inline-block;
  margin-bottom: 1.75rem !important;
}

.tmpl--formular .Inputfield:last-child {
  margin-top: -1.5em !important;
}
.tmpl--formular .Inputfield.InputfieldSubmit, .tmpl--formular .Inputfield.InputfieldInfo {
  background-color: #B3B3B3;
  color: #FFFFFF;
}
.tmpl--formular .Inputfield.InputfieldSubmit a, .tmpl--formular .Inputfield.InputfieldInfo a {
  color: #FFFFFF;
  text-decoration: underline;
}
.tmpl--formular .Inputfield.InputfieldSubmit a:hover, .tmpl--formular .Inputfield.InputfieldInfo a:hover {
  color: #d9d9d9;
}
.tmpl--formular .Inputfield.InputfieldText, .tmpl--formular .Inputfield.InputfieldEmail, .tmpl--formular .Inputfield.InputfieldInteger, .tmpl--formular .Inputfield.InputfieldRadios, .tmpl--formular .Inputfield.InputfieldCheckbox, .tmpl--formular .Inputfield.InputfieldCheckboxes, .tmpl--formular .Inputfield.InputfieldPage, .tmpl--formular .Inputfield.InputfieldTextarea {
  border-right: 20px solid #5db8e2;
  background-color: #FFFFFF;
}
.tmpl--formular .Inputfield.InputfieldText input[type=text],
.tmpl--formular .Inputfield.InputfieldText input[type=email],
.tmpl--formular .Inputfield.InputfieldText textarea, .tmpl--formular .Inputfield.InputfieldEmail input[type=text],
.tmpl--formular .Inputfield.InputfieldEmail input[type=email],
.tmpl--formular .Inputfield.InputfieldEmail textarea, .tmpl--formular .Inputfield.InputfieldInteger input[type=text],
.tmpl--formular .Inputfield.InputfieldInteger input[type=email],
.tmpl--formular .Inputfield.InputfieldInteger textarea, .tmpl--formular .Inputfield.InputfieldRadios input[type=text],
.tmpl--formular .Inputfield.InputfieldRadios input[type=email],
.tmpl--formular .Inputfield.InputfieldRadios textarea, .tmpl--formular .Inputfield.InputfieldCheckbox input[type=text],
.tmpl--formular .Inputfield.InputfieldCheckbox input[type=email],
.tmpl--formular .Inputfield.InputfieldCheckbox textarea, .tmpl--formular .Inputfield.InputfieldCheckboxes input[type=text],
.tmpl--formular .Inputfield.InputfieldCheckboxes input[type=email],
.tmpl--formular .Inputfield.InputfieldCheckboxes textarea, .tmpl--formular .Inputfield.InputfieldPage input[type=text],
.tmpl--formular .Inputfield.InputfieldPage input[type=email],
.tmpl--formular .Inputfield.InputfieldPage textarea, .tmpl--formular .Inputfield.InputfieldTextarea input[type=text],
.tmpl--formular .Inputfield.InputfieldTextarea input[type=email],
.tmpl--formular .Inputfield.InputfieldTextarea textarea {
  background-color: #F2F2F2;
}
.tmpl--formular .Inputfield.InputfieldText ul, .tmpl--formular .Inputfield.InputfieldText li, .tmpl--formular .Inputfield.InputfieldEmail ul, .tmpl--formular .Inputfield.InputfieldEmail li, .tmpl--formular .Inputfield.InputfieldInteger ul, .tmpl--formular .Inputfield.InputfieldInteger li, .tmpl--formular .Inputfield.InputfieldRadios ul, .tmpl--formular .Inputfield.InputfieldRadios li, .tmpl--formular .Inputfield.InputfieldCheckbox ul, .tmpl--formular .Inputfield.InputfieldCheckbox li, .tmpl--formular .Inputfield.InputfieldCheckboxes ul, .tmpl--formular .Inputfield.InputfieldCheckboxes li, .tmpl--formular .Inputfield.InputfieldPage ul, .tmpl--formular .Inputfield.InputfieldPage li, .tmpl--formular .Inputfield.InputfieldTextarea ul, .tmpl--formular .Inputfield.InputfieldTextarea li {
  list-style: none;
}
.tmpl--formular .Inputfield.InputfieldText li, .tmpl--formular .Inputfield.InputfieldEmail li, .tmpl--formular .Inputfield.InputfieldInteger li, .tmpl--formular .Inputfield.InputfieldRadios li, .tmpl--formular .Inputfield.InputfieldCheckbox li, .tmpl--formular .Inputfield.InputfieldCheckboxes li, .tmpl--formular .Inputfield.InputfieldPage li, .tmpl--formular .Inputfield.InputfieldTextarea li {
  position: relative;
}
.tmpl--formular .Inputfield input[type=checkbox],
.tmpl--formular .Inputfield input[type=radio],
.tmpl--formular .Inputfield .icheckbox,
.tmpl--formular .Inputfield .iradio {
  position: relative;
  display: inline-block;
}
.tmpl--formular .Inputfield input[type=checkbox] ~ span,
.tmpl--formular .Inputfield input[type=radio] ~ span,
.tmpl--formular .Inputfield .icheckbox ~ span,
.tmpl--formular .Inputfield .iradio ~ span {
  cursor: pointer;
}
.tmpl--formular .Inputfield .icheckbox,
.tmpl--formular .Inputfield .iradio {
  height: 1.1em;
  width: 1.1em;
  margin-right: 0.5em;
  top: 2px;
}
@media only screen and (min-width:40.0625em) {
  .tmpl--formular .Inputfield .InputfieldRadiosStacked li,
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked li,
.tmpl--formular .Inputfield .InputfieldRadiosColumns li,
.tmpl--formular .Inputfield .InputfieldCheckboxesColumns li {
	padding: 0 !important;
  }
}
.tmpl--formular .Inputfield .InputfieldRadiosStacked:after,
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked:after,
.tmpl--formular .Inputfield .InputfieldRadiosColumns:after,
.tmpl--formular .Inputfield .InputfieldCheckboxesColumns:after {
  clear: both;
  content: "";
  display: block;
}
.tmpl--formular .Inputfield .InputfieldRadiosColumns,
.tmpl--formular .Inputfield .InputfieldCheckboxesColumns {
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
  padding: 0.5em 0;
  text-align: center;
}
@media only screen and (max-width: 40em) {
  .tmpl--formular .Inputfield .InputfieldRadiosColumns label,
.tmpl--formular .Inputfield .InputfieldCheckboxesColumns label {
	min-width: 1.875rem;
  }
}
.tmpl--formular .Inputfield .InputfieldRadiosStacked input[type=checkbox],
.tmpl--formular .Inputfield .InputfieldRadiosStacked input[type=radio],
.tmpl--formular .Inputfield .InputfieldRadiosStacked .icheckbox,
.tmpl--formular .Inputfield .InputfieldRadiosStacked .iradio,
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked input[type=checkbox],
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked input[type=radio],
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked .icheckbox,
.tmpl--formular .Inputfield .InputfieldCheckboxesStacked .iradio {
  margin-left: -24px;
}
@media only screen and (max-width: 40em) {
  .tmpl--formular .InputfieldContent .InputfieldRadiosColumns li,
.tmpl--formular .InputfieldContent .InputfieldCheckboxesColumns li {
	width: 25% !important;
	float: none !important;
	clear: both;
	margin: 0 auto !important;
	text-align: left;
  }
}
.tmpl--formular .InputfieldRadios ul li label, .tmpl--formular .InputfieldCheckboxes ul li label {
  white-space: initial !important;
}
@media only screen and (min-width:64.0625em) {
  .tmpl--formular .InputfieldRadios ul li label, .tmpl--formular .InputfieldCheckboxes ul li label {
	white-space: nowrap !important;
  }
}

.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldRadiosColumns,
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldCheckboxesColumns {
  text-align: left;
}
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldRadiosColumns li,
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldCheckboxesColumns li {
  width: 205px !important;
}
@media only screen and (min-width:40.0625em) {
  .tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldRadiosColumns li,
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldCheckboxesColumns li {
	width: 12.5% !important;
  }
}
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldRadiosColumns li:last-child,
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldCheckboxesColumns li:last-child {
  width: 205px !important;
}
@media only screen and (min-width:40.0625em) {
  .tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldRadiosColumns li:last-child,
.tmpl--formular #FormBuilder_debriefing2017 .Inputfield .InputfieldCheckboxesColumns li:last-child {
	width: 205px !important;
  }
}

.tmpl--formular fieldset {
  padding: 0;
  border: 0;
}
.tmpl--formular fieldset legend {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 1.25em;
  padding-bottom: 1rem;
  padding-left: 2.25rem;
}
@media only screen and (min-width:40.0625em) {
  .tmpl--formular fieldset legend {
	padding-left: 4.5rem;
  }
}

.tmpl--formular fieldset .Inputfield:last-child {
  margin-top: 0 !important;
}

.Inputfield_workshops > .InputfieldContent > .Inputfields {
  display: flex;
  flex-flow: wrap;
}
.Inputfield_workshops > .InputfieldContent > .Inputfields > .Inputfield {
  flex-basis: 100%;
}
@media only screen and (min-width:40.0625em) {
  .Inputfield_workshops > .InputfieldContent > .Inputfields > .Inputfield {
	flex-basis: 50%;
  }
}

.mapping i, .i, .iradio, .icheckbox {
  cursor: pointer;
  height: 18px;
  width: 18px;
  margin-top: 1px;
  border: 1px solid grey;
}
.mapping i.disabled, .disabled.i, .disabled.iradio, .disabled.icheckbox {
  opacity: 0.7 !important;
  cursor: inherit !important;
}
.mapping i:after, .i:after, .iradio:after, .icheckbox:after {
  opacity: 0;
  background-color: grey;
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  content: " ";
  display: block;
}
.mapping i.checked:after, .checked.i:after, .checked.iradio:after, .checked.icheckbox:after {
  opacity: 1;
}

.iradio {
  border-radius: 50%;
}
.iradio:after {
  border-radius: 50%;
}

#FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen {
  margin-bottom: 3rem;
  overflow: hidden;
}
#FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen .InputfieldHeader > span {
  display: inline-block;
  color: #333333 !important;
}
#FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen .InputfieldContent label span a {
  color: #333333;
}
#FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen .InputfieldContent label span a:hover, #FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen .InputfieldContent label span a:active, #FormBuilder_ticketorder #wrap_Inputfield_agbs_gelesen .InputfieldContent label span a:focus {
  text-decoration: none;
}
#FormBuilder_ticketorder .error {
  color: #ea2327;
  background: transparent;
  font-size: 1rem;
}
#FormBuilder_ticketorder #wrap_ticketorder_submit table {
  width: 100%;
  max-width: 420px;
}
#FormBuilder_ticketorder #wrap_ticketorder_submit tbody tr:nth-child(4) {
  border-top: 1px solid #ffffff;
  font-weight: bold;
}
#FormBuilder_ticketorder #wrap_ticketorder_submit td:nth-child(2) {
  width: 100px;
  text-align: right;
}
#FormBuilder_ticketorder #wrap_ticketorder_submit .InputfieldContent {
  margin-top: 1.5rem;
}

.alert-box.success, .InputfieldStateError .success.error {
  background: #ffffff;
  color: #333333;
  overflow: hidden;
  padding: 2rem 2.3rem 3rem;
}
@media only screen and (min-width:40.0625em) {
  .alert-box.success, .InputfieldStateError .success.error {
	padding: 4rem 4.5rem 5rem;
  }
}

#FormBuilder_feedback2018,
#FormBuilder_feedback2019 {
  /* Kommentar-Feld folgt */
}
#FormBuilder_feedback2018 #wrap_Inputfield_workshops,
#FormBuilder_feedback2018 #wrap_Inputfield_tagungsformat,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_verbessern,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_anmeldung,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_anmeldung_kommentar,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_information,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_information_kommentar,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_zeit,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_zeit_kommentar,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_sonstiges,
#FormBuilder_feedback2018 #wrap_Inputfield_wo_erfahren,
#FormBuilder_feedback2019 #wrap_Inputfield_workshops,
#FormBuilder_feedback2019 #wrap_Inputfield_tagungsformat,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_verbessern,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_anmeldung,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_anmeldung_kommentar,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_information,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_information_kommentar,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_zeit,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_zeit_kommentar,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_sonstiges,
#FormBuilder_feedback2019 #wrap_Inputfield_wo_erfahren {
  margin-bottom: 0 !important;
  padding-bottom: 0.5rem !important;
}
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_anmeldung_kommentar label,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_information_kommentar label,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_zeit_kommentar label,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_sonstiges_kommentar label,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_anmeldung_kommentar label,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_information_kommentar label,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_zeit_kommentar label,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_sonstiges_kommentar label {
  display: none !important;
}
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_verbessern label,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_verbessern label {
  margin-bottom: 0 !important;
}
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_verbessern .InputfieldContent,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_verbessern .InputfieldContent {
  display: none;
}
#FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote li,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_anmeldung li,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_information li,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_zeit li,
#FormBuilder_feedback2018 #wrap_Inputfield_bereiche_sonstiges li,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote li,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_anmeldung li,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_information li,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_zeit li,
#FormBuilder_feedback2019 #wrap_Inputfield_bereiche_sonstiges li {
  min-width: 130px !important;
}
@media (min-width: 641px) {
  #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote ul,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote ul {
	padding-left: calc( 50% - 65px) !important;
  }
}
@media (min-width: 1025px) {
  #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote ul,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote ul {
	padding-left: 0 !important;
  }
}
@media (min-width: 641px) {
  #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote li,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote li {
	display: block !important;
	text-align: left;
	float: none;
  }
}
@media (min-width: 1025px) {
  #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote li,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote li {
	float: left;
	min-width: 1px !important;
	width: 7.69% !important;
	text-align: center;
  }
}
@media (min-width: 1025px) {
  #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote li:first-child, #FormBuilder_feedback2018 #wrap_Inputfield_gesamtnote li:last-child,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote li:first-child,
#FormBuilder_feedback2019 #wrap_Inputfield_gesamtnote li:last-child {
	width: 15.38% !important;
  }
}

/*

Typografie
====

Allgemeine Angaben zur Typografie.

Font  sind genau 84,21052631578947% vom orginal aus dem Dokument!
<table>
<tr><th>typy</th></th>indesign pt</th><th>inpixcel</th><th>umgerechnet</th></tr>
<tr><td>klein</td><td>12 pt</td><td>16px</td><td>13.47</td></tr>
<tr><td>normal</td><td>14 pt</td><td>19px</td><td>16</td></tr>
<tr><td>normal semihead</td><td>18 pt</td><td>4px</td><td>20.21</td></tr>
<tr><td>headline</td><td>29 pt</td><td>8px</td><td>32</td></tr>
</table>
(einfach * rechen ^^ 0,8421052631578947)
-> Zu finden in den Mixins

*/
/*

## Ueberschriften

```
<h1 class="headline headline--primary">&lt;h1&gt; The quick brown fox &hellip;</h1>
<h2 class="headline headline--secondary">&lt;h2&gt; The quick brown fox &hellip;</h2>
<h3 class="headline headline--tertiary">&lt;h3&gt; The quick brown fox &hellip;</h3>
<h4 class="headline headline--quaternary">&lt;h4&gt; The quick brown fox &hellip;</h4>
<h5 class="headline headline--quinary">&lt;h5&gt; The quick brown fox &hellip;</h5>
<h6 class="headline headline--senary">&lt;h6&gt; The quick brown fox &hellip;</h6>
```

*/
.headline, .mapping h1,
.mapping h3,
.mapping h4,
.mapping h5,
.mapping h6 {
  margin-top: 0;
}

.headline--primary, .mapping h1 {
  font-size: 2.125em;
  margin-bottom: 1.1764705882em;
}

.article__title, .headline--secondary, .mapping h2 {
  font-size: 1.625em;
  margin-bottom: 1.5384615385em;
}

.headline--tertiary, .mapping h3 {
  font-size: 1.3125em;
}

.schema--6 .block__headline, .headline--quaternary, .mapping h4 {
  font-size: 1em;
}

.headline--quinary, .mapping h5 {
  font-size: 0.8125em;
}

.headline--senary {
  font-size: 0.625em;
}

.headline--primary, .mapping h1 {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  text-transform: uppercase;
}
.headline--secondary, .mapping h2 {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  text-transform: uppercase;
}
.headline--tertiary, .mapping h3 {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
}
.headline--center {
  text-align: center;
}

/*

## Standard-Fliesstext

```
<p class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel,
et praesentium commodi ullam magnam quia repellendus voluptatibus vitae tempore
voluptatum illo natus dolor fugiat nihil officiis, eligendi eum optio aperiam.</p>
<div class="texts">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel,
  et praesentium commodi ullam magnam quia repellendus voluptatibus vitae tempore
  voluptatum illo natus dolor fugiat nihil officiis, eligendi eum optio aperiam.</p>
</div>
```

 */
.text {
  color: #333333;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 300;
}

/*

## Textlink

```
<p><a class="link" href=".">Ein normaler Text-Link.</a></p>
<p><a class="link link--hover" href=".">Ein normaler Text-Link. Status: Hover</a></p>
<p><a class="link link--active" href=".">Ein normaler Text-Link. Status: Active</a></p>
<p><a class="link link--focus" href=".">Ein normaler Text-Link. Status: Focus</a></p>
<div class="links">
<a href=".">Ein normaler Text-Link in einem links container.</a>
</div>
```

*/
.link, .mapping a, .editor a, .article__content a {
  color: #333333;
  text-decoration: none;
  background-color: transparent;
  transition: color 0.3s ease-in-out, background 0.3s ease-in-out;
}
.link:hover, .mapping a:hover, .editor a:hover, .article__content a:hover, .link--hover {
  color: #253E66;
  background-color: transparent;
}
.link:focus, .mapping a:focus, .editor a:focus, .article__content a:focus, .link--focus {
  color: #253E66;
  background-color: transparent;
}
.link--active {
  color: #253E66;
  background-color: transparent;
}

.is-dark .link, .is-dark .mapping a, .mapping .is-dark a {
  color: #FFFFFF;
}
.is-dark .link:hover, .is-dark .mapping a:hover, .mapping .is-dark a:hover {
  color: #cccccc;
}

/*

## Text variationen

```
<ul>
  <li><i class="i">Lorem ipsum dolor sit amet</i></li>
  <li><em class="em">Lorem ipsum dolor sit amet</em></li>
  <li><b class="b">Lorem ipsum dolor sit amet</b></li>
  <li><strong class="strong">Lorem ipsum dolor sit amet</strong></li>
</ul>
```

*/
.mapping i, .i, .icheckbox, .iradio {
  font-style: italic;
}

.mapping em, .em {
  font-style: italic;
}

.b {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
}

.strong {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
}

/*

Class: carousel
====

*/
.carousel > .persons,
.carousel > .sponsoren {
  float: left;
  width: 100%;
  padding: 0 20px;
}
@media only screen and (min-width:40.0625em) {
  .carousel > .persons,
.carousel > .sponsoren {
	width: 50%;
  }
}
@media only screen and (min-width:64.0625em) {
  .carousel > .persons,
.carousel > .sponsoren {
	width: 25%;
  }
}

/*

Class: rvideo
====

```
<div class="row">
  <div class="column small-12 medium-6 large-4">
	<div class="rvideo">
	  <iframe width="560" height="315" src="https://www.youtube.com/embed/iNJdPyoqt8U" frameborder="0" allowfullscreen></iframe>
	</div>
  </div>
  <div class="column small-12 medium-6 large-4">
	<div class="rvideo">
	  <iframe width="560" height="315" src="https://www.youtube.com/embed/iNJdPyoqt8U" frameborder="0" allowfullscreen></iframe>
	</div>
  </div>
  <div class="column small-12 medium-6 large-4">
	<div class="rvideo">
	  <iframe width="560" height="315" src="https://www.youtube.com/embed/iNJdPyoqt8U" frameborder="0" allowfullscreen></iframe>
	</div>
  </div>
</div>
```
*/
.rvideo {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.rvideo iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.socialmedia {
  position: fixed;
  top: 65%;
}
@media (min-width: 1025px) {
  .socialmedia {
	top: 50%;
  }
}
.socialmedia.left, .socialmedia.form__checkbox {
  left: 0;
  height: 182px;
  margin-top: -91px;
}
.socialmedia.right {
  right: 0;
  height: 365px;
  margin-top: -182px;
}
.socialmedia.right span {
  transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
}
.socialmedia__link {
  color: #fff;
  text-decoration: none;
  display: block;
  background: #ea2327;
  color: #fff;
  width: 37px;
  text-align: center;
  display: flex;
  align-items: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.12);
  margin-top: 1px;
}
@media (min-width: 1025px) {
  .socialmedia__link {
	height: 79px;
  }
}
.socialmedia__link--facebook {
  background: #0866FF;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  height: 59px;
}
.socialmedia__link--twitter {
  background: #000;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  height: 59px;
  border: 1px solid #999;
  border-left: none;
}
.socialmedia__link--nanootv {
  background: #fff url("../images/icon_nanoo.png") center center no-repeat;
  background-size: 75%;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  height: 59px;
}
.socialmedia__link--rb {
  background: #ea2327;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  height: 120px;
  flex-direction: column;
  font-size: 1em;
}
.socialmedia__link--rb span {
  position: relative;
  top: 49px;
  display: block;
  width: 120px;
}
.socialmedia__svg {
  width: 24px;
  display: block;
  margin: 0 auto;
}
.socialmedia .icon {
  font-size: 1.875em;
}

.loginbox {
  background-color: #FFFFFF;
  margin-top: 1rem;
  padding: 2rem;
  max-width: 640px;
}
.loginbox__login_forgot {
  display: none;
}
.loginbox--forgot .loginbox__login_form {
  display: none;
}
.loginbox--forgot .loginbox__login_forgot {
  display: block;
}
.loginbox.popup {
  display: none;
}
.mfp-content .loginbox {
  display: block;
  margin: 50vh auto 0;
  transform: translateY(-50%);
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.17);
}
.loginbox .popupbox__column {
  float: left;
  width: 100%;
}
@media (min-width: 640px) {
  .loginbox .popupbox__column {
	width: 50%;
  }
}
@media (min-width: 640px) {
  .loginbox .popupbox__column--left {
	padding-right: 1rem;
  }
}
@media (min-width: 640px) {
  .loginbox .popupbox__column--right {
	padding-left: 1rem;
  }
}
.loginbox #login_form {
  position: relative;
  margin-top: 1.5rem;
}
.loginbox .loginbox__forgot {
  bottom: 0;
  right: 0;
}
.loginbox .mapping h2 {
  margin-bottom: 1rem;
}
.loginbox .mapping p {
  margin-top: 0.5rem;
}
.loginbox .mapping strong {
  font-weight: bold;
}
.loginbox .input--margintop {
  margin-top: 1rem;
  padding: 0.6rem;
}
.loginbox .anmelden-registrieren {
  display: none;
}
.loginbox .anmelden-registrieren.active {
  display: block;
}
.loginbox .headline--register {
  margin-top: 2rem !important;
}
@media (min-width: 640px) {
  .loginbox .headline--register {
	margin-top: 0 !important;
  }
}
@media (max-width: 639px) {
  .loginbox .loginbox__forgot {
	position: relative;
	margin-top: 0.5rem;
  }
}

/*

Navigation
====

*/
/*

## Navigations element

Beispiel:

```
<nav class="nav">
  <a class="nav__link" href=".">example</a>
  <a class="nav__link nav__link--active" href=".">example Active</a>
  <a class="nav__link" href=".">example</a>
  <a class="nav__link" href=".">example</a>
</nav>
```

 */
.nav {
  background-color: rgba(255, 255, 255, 0);
  transition: background-color 0.3s ease-in-out, height 0s 0.3s ease-in-out, opacity 0.3s ease-in-out, top 0s 0.3s, bottom 0s 0.3s, right 0s 0.3s, left 0s 0.3s;
  height: 0;
  opacity: 0;
  margin-top: 0;
  overflow: hidden;
}
@media only screen and (max-width:839px) {
  .nav {
	top: 100px;
	bottom: 0;
	left: 0;
	right: 0;
	position: fixed;
	pointer-events: none;
	/*  be sure */
  }
}
@media only screen and (min-width:840px) {
  .nav {
	height: auto;
	opacity: 1;
	display: block;
	margin-top: 3.75em;
	text-align: right;
  }
}
.nav__logout, .nav__login {
  display: none;
  /* activated with js */
}
@media only screen and (max-width:839px) {
  .nav__logout, .nav__login {
	width: 100%;
	text-align: center;
  }
}
@media only screen and (min-width:840px) {
  .nav__logout, .nav__login {
	position: absolute;
	top: 0;
	right: 0;
  }
}
.nav__link {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  color: #000000;
  padding: 0.5em 0.25em;
  transition: background-color 0.3s ease-in-out;
  display: block;
  text-align: center;
}
@media only screen and (min-width:64.0625em) {
  .nav__link {
	padding: 0.5em 0.5em;
  }
}
@media only screen and (min-width:840px) {
  .nav__link {
	text-align: left;
	display: inline-block;
  }
}
.nav__link:hover, .nav__link.active {
  background-color: #E5F4FA;
}
@media only screen and (min-width:840px) {
  .nav__footer {
	display: none;
  }
}
.nav--fadeing, .nav--active {
  position: fixed;
  top: 100px;
  bottom: 0;
  left: 0;
  right: 0;
}
.nav--active {
  height: calc(100% - 100px);
  padding-block: 1rem;
  transition: background-color 0.3s ease-in-out, height 0s 0s ease-in-out, opacity 0.3s ease-in-out;
  pointer-events: all;
  /*  be sure */
  margin-top: 0;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.9);
  display: block;
  overflow-y: scroll;
}

/*

## BURGER

```
<a href="#" id="burger" class="burger"><span>Menu</span></a>
```

*/
.burger {
  float: right;
  display: block;
  width: 1.875em;
  height: 1.875em;
  position: relative;
  margin-top: 3.75em;
}
@media only screen and (min-width:840px) {
  .burger {
	display: none;
  }
}
.burger span {
  position: absolute;
  top: 50%;
  left: 0;
  background-color: #000000;
  display: block;
  width: 100%;
  height: 3px;
  margin-top: -2px;
  user-select: none;
  font-size: 0;
  transition: background-color 0.3s;
}
.burger span:before, .burger span:after {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000;
  content: "";
  transition: transform 0.3s;
}
.burger span:before {
  transform: translateY(-250%);
}
.burger span:after {
  transform: translateY(250%);
}
.burger--active span {
  background-color: transparent;
}
.burger--active span:before {
  transform: translateY(0) rotate(45deg);
}
.burger--active span:after {
  transform: translateY(0) rotate(-45deg);
}

/*

## Footer Navigations element

Beispiel:

```
<nav class="nav-footer">
  <a class="nav-footer__link" href=".">example</a>
  <a class="nav-footer__link nav-footer__link--active" href=".">example Active</a>
  <a class="nav-footer__link" href=".">example</a>
  <a class="nav-footer__link" href=".">example</a>
</nav>
```

*/
.loginbox {
  position: relative;
}
.loginbox__forgot, .loginbox__back {
  position: absolute;
  right: 2rem;
  bottom: 2rem;
  display: block;
  color: #000000;
  text-decoration: none;
}
.loginbox__forgot:hover, .loginbox__back:hover {
  text-decoration: underline;
}
.loginbox--forgot .loginbox__forgot {
  display: none;
}
.loginbox__back {
  display: none;
}
.loginbox--forgot .loginbox__back {
  display: block;
}

/*

Class: textcarousel
====

*/
.textcarousel {
  font-size: 1em;
  position: relative;
  overflow: hidden;
  height: 15.75em;
}
@media only screen and (min-width:40.0625em) {
  .textcarousel {
	font-size: 1.625em;
	height: 8.8461538462em;
  }
}
.textcarousel__item {
  transition: bottom 0.5s ease-in-out, opacity 0.5s ease-in-out;
  opacity: 0;
  bottom: 8%;
  left: 0;
  right: 0;
}
@media only screen and (min-width:40.0625em) {
  .textcarousel__item {
	bottom: 15%;
  }
}
.textcarousel__item p {
  margin: 0;
}
.textcarousel__item--active {
  bottom: 8%;
  opacity: 1;
  position: absolute;
}
@media only screen and (min-width:40.0625em) {
  .textcarousel__item--active {
	bottom: 15%;
  }
}
.textcarousel__item--remove {
  bottom: -100%;
  opacity: 0;
  position: absolute;
}
.textcarousel__item--next {
  bottom: 100%;
  position: absolute;
}
.textcarousel__quelle {
  font-size: 0.75em;
  font-style: italic;
}
@media only screen and (min-width:40.0625em) {
  .textcarousel__quelle {
	font-size: 0.6153846154em;
  }
}

/*

Stage
====

*/
.stage {
  display: flex;
  max-height: 33.75em;
  overflow: hidden;
  justify-content: center;
  position: relative;
  color: #FFFFFF;
}
.stage__redlink {
  position: absolute;
  display: block;
  right: 0;
  top: 260px;
  width: 180px;
  max-width: 286px;
}
@media (min-width: 445px) {
  .stage__redlink {
	top: 292px;
	width: 180px;
  }
}
@media (min-width: 550px) {
  .stage__redlink {
	top: 311px;
	width: 180px;
  }
}
@media (min-width: 640px) {
  .stage__redlink {
	width: 33%;
	top: 100px;
  }
}
@media (min-width: 1025px) {
  .stage__redlink {
	top: 0;
  }
}
.stage__redlink img {
  width: 100%;
}
.stage__video {
  display: none;
  width: 100%;
  min-width: 100%;
  min-height: 100%;
  align-self: center;
}
@media only screen and (min-width: 1402px) {
  .stage__video {
	/* -moz-transform: translateY(-30%); */
	-ms-transform: translateY(-20%);
  }
}
.stage__figure {
  min-height: 35em;
  width: 100%;
  height: 100%;
  margin: 0;
  align-self: center;
  background-position: 70% center;
  background-size: cover;
}
@media only screen and (min-width:64.0625em) {
  .stage__figure {
	background-position: center center;
  }
}
@media only screen and (min-width:64.0625em) {
  .stage__figure--hasVideo .stage__video {
	display: block;
  }
}
.stage__text {
  font-size: 125%;
  position: absolute;
  left: 0;
  bottom: 0;
  line-height: 1em;
  text-transform: uppercase;
  top: 6.25em;
}
@media only screen and (min-width: 445px) {
  .stage__text {
	font-size: 1.625em;
  }
}
@media only screen and (min-width: 500px) {
  .stage__text {
	font-size: 1.875em;
  }
}
@media only screen and (min-width:40.0625em) {
  .stage__text {
	top: 2.6315789474em;
	font-size: 2.375em;
  }
}
@media only screen and (min-width: 800px) {
  .stage__text {
	font-size: 3em;
  }
}
@media only screen and (min-width:64.0625em) {
  .stage__text {
	top: 2.6em;
	font-size: 3.125em;
  }
}
.stage__text > p {
  margin: 0;
}
.stage__text small {
  font-size: 0.5em;
  font-style: normal;
  display: block;
  margin-top: 0.75em;
  line-height: 135%;
}
.stage__logo {
  display: none;
}
@media only screen and (min-width:40.0625em) {
  .stage__logo {
	display: block;
	height: 50%;
	margin-top: 4%;
	margin-left: -20px;
  }
}
.stage__img {
  align-self: center;
  min-width: 100%;
  min-height: 100%;
}
.stage__caption {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.stage__caption .row,
.stage__caption .column {
  height: 100%;
}
.stage__caption-text {
  position: absolute;
  bottom: 5%;
  left: 0em;
  z-index: 70;
  right: 0em;
}

.sponsor__content {
  text-align: center;
  border: 1px solid #eee;
  position: relative;
  padding-top: 120px;
}
.sponsor__content img {
  width: auto;
  height: auto;
  max-width: auto;
  min-width: auto;
  width: 100%;
  max-height: 100%;
  max-width: 250px;
}
.sponsor__content.lorem-sponsor img {
  width: auto;
  height: 90px;
}
@media (min-width: 1025px) {
  .sponsor__content.lorem-sponsor img {
	height: 82px;
  }
}
.sponsor__content.sponsor-bsv img {
  width: auto;
  height: 100px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-bsv img {
	height: 90px;
  }
}
.sponsor__content.sponsor-apple img {
  width: auto;
  height: 70px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-apple img {
	height: 60px;
  }
}
.sponsor__content.sponsor-dataquest img {
  width: auto;
  height: 43px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-dataquest img {
	height: 40px;
  }
}
.sponsor__content.tpc img {
  width: auto;
  height: 50px;
}
@media (min-width: 1025px) {
  .sponsor__content.tpc img {
	height: 44px;
  }
}
.sponsor__content.sponsor-swisslos-kanton-aargau img {
  width: auto;
  height: 50px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-swisslos-kanton-aargau img {
	height: 44px;
  }
}
.sponsor__content.sponsor-bbb img {
  width: auto;
  height: 70px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-bbb img {
	height: 61px;
  }
}
.sponsor__content.sponsor-megatron img {
  width: auto;
  /*height: 70px;
  @media (min-width: 1025px) {
	height: 90px;
  }*/
  height: 70px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-megatron img {
	height: 60px;
  }
}
.sponsor__content.sponsor-nanootv img {
  width: auto;
  height: 26px;
}
.sponsor__content.sponsor-bnbaden img {
  width: auto;
  height: 39px;
}
.sponsor__content.sponsor-lernetz img {
  width: auto;
  height: 36px;
}
@media (min-width: 1025px) {
  .sponsor__content.sponsor-lernetz img {
	height: 32px;
  }
}
.sponsor__box {
  display: block;
  /*position: absolute;*/
  top: 0.5rem;
  left: 0.5rem;
  bottom: 0.5rem;
  right: 0.5rem;
}
.sponsor__table {
  display: table;
  height: 100%;
  width: 100%;
  padding: 10px 20px;
}
.sponsor__cell {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.sponsor__content {
  background-color: transparent;
  border: 0;
}

/*

Class: schema
====

*/
.schema--image {
  color: #FFFFFF;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.schema--image__overlay {
  padding: 3.125em 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.schema--2, .schema--3 {
  background-color: #E5F4FA;
  margin: 0;
}
.schema--3 .headline--center,
.schema--3 .block__content {
  text-align: left;
}
.schema--4 {
  background-color: #CCCCCC;
}
.schema--5, .schema--6 {
  background-color: #4D4D4D;
  color: #FFFFFF;
  margin: 0;
}
.schema--6 .block__content {
  text-align: left;
}
.schema--6 a {
  color: #FFFFFF;
  text-decoration: none;
}
.schema--6 a:hover, .schema--6 a:active, .schema--6 a:focus {
  text-decoration: underline;
}

/*

Class: person
====

*/
.persons {
  position: static;
}

.person {
  width: 100%;
  border: 20px solid #ffffff;
  background-color: #ffffff;
}
.person__header {
  line-height: 1.2;
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
  color: #333;
  padding: 10px 0 0;
}
.person__image {
  width: 100%;
  height: auto;
}
.person__content {
  position: relative;
}
.person__headline {
  margin-bottom: 0;
  margin: 0;
  font-size: 1rem;
}
.person__details p {
  margin: 10px 0;
}
.person__container {
  max-width: 240px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width:40.0625em) {
  .person__container {
	max-width: 500px;
  }
}
@media only screen and (min-width:64.0625em) {
  .person__container {
	max-width: 9999px;
  }
}
.person__container .row {
  display: flex;
  flex-flow: row wrap;
}
.person__container .row .column {
  border-top: 1px solid #CCCCCC;
}
.person__container .row .column:nth-of-type(1) {
  border-top: 0;
}
@media only screen and (min-width:40.0625em) {
  .person__container .row .column:nth-of-type(2) {
	border-top: 0;
  }
}
@media only screen and (min-width:64.0625em) {
  .person__container .row .column:nth-of-type(3),
.person__container .row .column:nth-of-type(4) {
	border-top: 0;
  }
}

/*

Tickets
====

*/
/*

## Ticket Element

Beispiel:

```
<div class="ticket">
  <header class="ticket__header">Early Bird Ticket<span class="ticket__date">18.06.2015</span></header>
  <ul class="ticket__list">
	<li class="ticket__list-item row"><div class="column small-8 medium-7 large-8 ticket__list-item-left">LehrerInnen</div><div class="ticket__list-item-right column small-4 medium-5 large-4">CHF <span class="ticket__price">149,-</span></div></li>
	<li class="ticket__list-item row"><div class="column small-8 medium-7 large-8 ticket__list-item-left">ReferendarInnen, LehramtsanwaerterInnen,  StudentInnen,</div><div class="ticket__list-item-right column small-4 medium-5 large-4">CHF <span class="ticket__price">74,50</span></div></li>
	<li class="ticket__list-item row"><div class="column small-8 medium-7 large-8 ticket__list-item-left">Freie Wirtschaft</div><div class="ticket__list-item-right column small-4 medium-5 large-4">CHF <span class="ticket__price">209,-</span></div></li>
	<li class="ticket__list-item row"><div class="column small-8 medium-7 large-8 ticket__list-item-left">Kooperationspartner, Medienpartner,  Sponsoren</div><div class="ticket__list-item-right column small-4 medium-5 large-4">CHF <span class="ticket__price">119,20</span></div></li>
  </ul>
  <div class="ticket__link-wrap">
	<a class="btn btn--ticket ticket__link" href="http://portal.nanoo.tv/startseite/">Ticket Kaufen</a>
  </div>
</div>
```

 */
.ticket {
  margin-bottom: 1em;
  position: relative;
  overflow: hidden;
  background-color: #E5F4FA;
  color: #000000;
}
.ticket__header {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 1.25em;
  text-transform: uppercase;
  text-align: center;
  color: #FFFFFF;
  background-color: #5db8e2;
  padding: 0.85em 0;
}
.ticket__header--simple {
  font-size: 1rem;
  text-transform: inherit;
}
.ticket__date {
  display: block;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 0.8em;
  padding: 0.3125em 3.25em 0.25em;
  background-color: #5db8e2;
  color: #FFFFFF;
  position: relative;
  top: 0;
}
.ticket__date #ticket-counter span {
  display: inline-block;
  background-color: #666;
  border-radius: 3px;
  padding: 1px 5px;
  position: relative;
  margin: 0 1px;
}
.ticket__date #ticket-counter span:after {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  left: 0;
  height: 1px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}
.ticket__list {
  list-style: none;
  padding-left: 0;
  margin: 0 0 0.25rem;
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 300;
}
.ticket__list-item {
  padding: 0.5rem 1rem 0.25rem;
  border-top: 1px solid #ffffff;
  display: block;
}
@media only screen and (min-width:40.0625em) {
  .ticket__list-item {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
  }
}
.ticket__list-item-right, .ticket__list-item-left {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.ticket__price {
  font-family: "Titillium Web", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 1.25em;
}
.ticket__link-wrap {
  text-align: center;
  padding-bottom: 1em;
}
.ticket__currency {
  font-size: 10px;
}
@media only screen and (min-width:40.0625em) {
  .ticket__currency {
	font-size: inherit;
  }
}
.ticket__flex {
  min-height: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ticket__flex.title {
  font-size: 0.8rem;
}
@media only screen and (min-width:40.0625em) {
  .ticket__flex.title {
	font-size: inherit;
  }
}
.ticket__flex.align-left {
  text-align: left;
}
.ticket__flex.align-right {
  text-align: right;
}

/*

Class: Info
====

*/
.info {
  padding: 0.4375em;
}
.info__link {
  text-decoration: none;
  color: #FFFFFF;
}
.info__link:hover, .info__link:focus {
  text-decoration: underline;
}
.info--normal {
  color: #4D4D4D;
  background-color: #B3B3B3;
}
.info--error {
  color: #FFFFFF;
  background-color: #ea2327;
}
/*

Programmliste
====

*/
/*

## Programmliste

Beispiel:

```

```

 */
.programmlist {
  list-style: none;
  padding: 0;
  margin: 1em;
}
@media only screen and (min-width:40.0625em) {
  .programmlist {
	margin: 4.5em;
  }
}
.programmlist__item {
  border-top: 0.0625em solid #FFFFFF;
  color: #FFFFFF;
  padding: 0.375em 0;
}

/*

Contentbereiche / Artikel
====

*/
/*

## Standart Artikel

Beispiel:

```
<article class="article">
  <header class="article__header">
	<h2 class="article__title">article-title</h2>
  </header>
  <div class="article__content">
	<p><strong class="strong">Lorem ipsum dolor sit amet,</strong> consectetur adipisicing elit. Eius deserunt rem obcaecati commodi harum a blanditiis iusto at hic non ipsa, eveniet laboriosam voluptates atque repellat, reprehenderit mollitia eligendi ut.</p>
  </div>
  <footer class="article__footer">
	<time class="time">10.02.2015</time>
  </footer>
</article>
```

*/
/*

Class: workshop
====

*/
.workshop {
  width: 100%;
  margin-left: 1px;
  background: #fff;
  cursor: pointer;
  position: relative;
  border-bottom: 1px solid #ccc;
  /*
	.icon--close:before {
	content: "\e600";
  }
  .icon--arrow-down:before {
	content: "\e25bc";
  }
  */
}
.block--site-link .workshop__column {
  padding: 0;
}
.workshop__jumplink {
  position: absolute;
  top: -100px;
  height: 0;
  width: 0;
}
.workshop:hover, .workshop--open {
  background: #E5F4FA;
}
.workshop:after {
  transition: all 0.3s ease-out;
  transform-origin: center center;
  transform: rotate(180deg);
  width: 1em;
  height: 1em;
  font-size: 2em;
  font-family: "icomoon";
  speak: none;
  position: absolute;
  right: 10px;
  top: 30px;
  margin-top: -0.5em;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  color: #000;
  -webkit-font-smoothing: antialiased;
  content: "󢖼";
}
.workshop:hover:after, .workshop--open:after {
  transform: rotate(0);
}
.workshop__images {
  width: 140px;
}
.workshop__image {
  height: 60px;
  width: auto;
  margin-bottom: 4px;
}
.workshop__counter {
  width: 60px;
}
.workshop__counter > span {
  text-align: center;
  display: block;
  text-transform: uppercase;
}
.workshop__counter > span.counter span {
  display: inline-block;
  background-color: #666;
  color: #FFFFFF;
  border-radius: 3px;
  padding: 1px 5px;
  position: relative;
  margin: 0 1px;
}
.workshop__counter > span.counter span:after {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  left: 0;
  height: 1px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}
.workshop__header {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 0.9375em 3.75em 0.9375em 1.875em;
}
@media only screen and (min-width:40.0625em) {
  .workshop__header {
	flex-direction: row;
	justify-content: space-between;
  }
}
.workshop__headline {
  margin: 0 0 0.3125em 0;
}
@media only screen and (min-width:40.0625em) {
  .workshop__headline {
	width: 30%;
  }
}
.workshop__headline-inner {
  background: #fff;
  padding: 0 0.3125em;
}
@media only screen and (min-width:40.0625em) {
  .workshop__headline-inner {
	display: inline-block;
  }
}
.workshop__speaker {
  width: 100%;
}
.workshop__speaker-list {
  padding: 0;
  list-style: none;
  margin-right: 30px;
}
.workshop__title {
  font-weight: bold;
  margin-top: 1rem;
}
@media only screen and (min-width:40.0625em) {
  .workshop__title {
	width: calc( 100% - 200px );
	margin-top: 0;
  }
}
.workshop__maintitle {
  color: #5db8e2;
  font-size: 1.2em;
}
.workshop__content {
  opacity: 0;
  max-height: 0;
  transition: all 0.5s ease-out;
  overflow: hidden;
  padding-left: 1.875em;
  padding-right: 1.875em;
  padding-bottom: 0.9375em;
}
.workshop--open .workshop__content {
  max-height: 800px;
  opacity: 1;
}
.workshop__summary strong {
  font-weight: bold;
}
.workshop__summary a {
  color: inherit;
  text-decoration: underline;
}
.workshop__summary a:hover {
  text-decoration: none;
}
.workshop table {
  width: auto !important;
  margin-right: 30px;
}
.workshop table a {
  color: #999;
}
.workshop table td {
  padding: 10px;
  border-bottom: 1px solid rgba(204, 204, 204, 0.4);
  vertical-align: top;
}
.workshop table td:first-child {
  width: 20%;
}
.workshop table tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.62);
}

.banner {
  background-color: #cccccc;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 250px;
  max-height: 33vh;
  width: 100%;
  margin-bottom: 3rem;
}
@media (min-width: 1025px) {
  .banner {
	height: 160px;
	max-height: 25vh;
	background-position: center;
  }
}

.placeholder {
  content: "";
  height: 9rem;
  width: 100%;
  display: block;
}
@media (min-width: 1025px) {
  .placeholder {
	height: 3rem;
  }
}
#page-startseite .placeholder {
  display: none;
}

.flipclock-container {
  position: relative;
  text-align: center;
  margin-bottom: 1rem;
  height: 3rem;
}
@media only screen and (min-width:40.0625em) {
  .flipclock-container {
	height: 4rem;
  }
}

.flipclock {
  display: inline-block;
  width: auto;
}

.flip-clock-wrapper {
  font-size: 20px;
  transform: scale(0.4);
  top: -70px;
  width: 694px;
  position: absolute;
  left: 50%;
  margin-left: -347px;
  display: block;
}
@media only screen and (min-width:40.0625em) {
  .flip-clock-wrapper {
	font-size: 14px;
	transform: scale(0.5);
	top: -54px;
  }
}

.flip-clock-divider .flip-clock-label {
  text-transform: uppercase;
  font-family: "Titillium Web", sans-serif;
}

/*

Mapping
====

*/
/*

## Mapping

wird im main als letztes includiert.
Mappt alle bem klassen auf die html attrribute unter der klasse .mapping

```
<pre>
.mapping { //inhalt von wysiwyg

  > *:first-child {
	margin-top: 0;
	padding-top: 0;
  }
  > *:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
  }
  p {
	@extend .text !optional;
  }
  a {
	@extend .link !optional;
	max-width: 100%;
  }
  ul {
	@extend .list !optional;
	@extend .list--bullet !optional;
	li {
	  @extend .list__item !optional;
	  @extend .list__item--bullet !optional;
	}
  }
  ol {
	@extend .list !optional;
	@extend .list--number !optional;
	li {
	  @extend .list__item !optional;
	  @extend .list__item--number !optional;
	}
  }
  table {
	@extend .table !optional;
	tr {
	  @extend .table__tr !optional;
	}
	td {
	  @extend .table__td !optional;
	}
	th {
	  @extend .table__th !optional;
	}
	tbody {
	  @extend .table__tbody !optional;
	}
	thead {
	  @extend .table__thead !optional;
	}
  }
  pre {
	overflow-x: auto;
  }
  h1,h3,h4,h5,h6 {
	@extend .headline !optional;
  }
  h1 {
	@extend .headline--1 !optional;
  }
  h2 {
	@extend .headline--2 !optional;
  }
  h3 {
	@extend .headline--3 !optional;
  }
  h4 {
	@extend .headline--4 !optional;
  }
  h5 {
	@extend .headline--5 !optional;
  }

  input {
	@extend .input !optional;
	&[type=text],
	&[type=search],
	&[type=email] {
	  @extend .input--text !optional;
	}
	&[type=password] {
	  @extend .input--password !optional;
	}
	&[type=submit] {
	  @extend .btn !optional;
	  @extend .btn--submit !optional;
	}
	&[type=button] {
	  @extend .btn !optional;
	}
  }

  i {
	@extend %__i;
  }
  em {
	@extend %__em;
  }

  //wordpress stuff
  .alignleft {
	float: left;
	&.wp-caption {
	  margin-left: 0;
	}
  }
  .alignnone {
	margin: 0 auto;
  }
  .alignright {
	float: right;
	&.wp-caption {
	  margin-right: 0;
	}
  }
  //wordpress stuff end
}
</pre>
```

*/
.mapping > *:first-child {
  margin-top: 0;
  padding-top: 0;
}
.mapping > *:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}
.mapping a {
  max-width: 100%;
}
.mapping pre {
  overflow-x: auto;
}
.mapping .alignleft {
  float: left;
}
.mapping .alignleft.wp-caption {
  margin-left: 0;
}
.mapping .alignnone {
  margin: 0 auto;
}
.mapping .alignright {
  float: right;
}
.mapping .alignright.wp-caption {
  margin-right: 0;
}

.block-banners_item {
  background: #f2f2f2;
  gap: 1rem;
  padding-top: 4rem;
  text-align: center;
}
.block-banners_item + .block-banners_item {
  margin-top: 2rem;
}
.block-banners_content {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-inline: auto;
  max-width: 62.5rem;
  padding-inline: 0.625rem;
}
.block-banners_title {
  margin: unset;
}
.block-banners_text {
  margin-bottom: 0.5rem;
}
.block-banners_text * {
  margin: unset;
}
.block-banners_text * + * {
  margin-top: 1rem;
}
.block-banners_button {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
  line-height: 2.625rem;
  margin-bottom: 4rem;
  padding-inline: 0.75rem;
  text-transform: uppercase;
  text-decoration: none;
}
.block-banners_image {
  aspect-ratio: 5/1;
  margin-top: -2rem;
  object-fit: contain;
  width: min(100%, 160rem);
  margin-inline: auto;
}

.block-stores {
  margin-bottom: 3.75em;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-inline: 0.625rem;
  gap: 0.5rem;
}
.block-stores_label {
  display: inline-block;
  padding: 0.4375rem 0.625rem;
  line-height: 1.5rem;
  background: #000;
  border: 0.0625rem solid #a6a6a6;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
  border-radius: 0.375rem;
}

.nav-ptl {
  background: #fff;
  padding-inline: 0.5rem;
}
@media (max-width: 839px) {
  .nav-ptl {
	padding-top: 0.5rem;
  }
}
.nav-ptl_layout {
  display: flex;
  justify-content: flex-end;
  margin-inline: auto;
  width: min(100%, 61.25rem);
}
.nav-ptl_login {
  color: #5481c2;
}

.banner-ptl {
  display: flex;
  margin-bottom: 6em;
}
.banner-ptl_image {
  margin-inline: auto;
  object-fit: cover;
  width: min(100%, 160rem);
}

::selection {
  background-color: #5db8e2;
}

.MarkupGoogleMap {
  background-color: #646161;
}

.js-slide {
  display: none;
  overflow: hidden;
}

#wrap_Inputfield_rabatt {
  display: none;
}

.block--newsletter .Inputfield_e_mail_adresse {
  width: 100% !important;
}

.emailme {
  text-align: center;
}

.Inputfield_workshops_runde_1 input:disabled + span,
.Inputfield_workshops_runde_1 .iradio.disabled + span,
.Inputfield_workshops_runde_1 .icheckbox.disabled + span,
.Inputfield_workshops_runde_2 input:disabled + span,
.Inputfield_workshops_runde_2 .iradio.disabled + span,
.Inputfield_workshops_runde_2 .icheckbox.disabled + span,
.Inputfield_workshops_runde_3 input:disabled + span,
.Inputfield_workshops_runde_3 .iradio.disabled + span,
.Inputfield_workshops_runde_3 .icheckbox.disabled + span,
.Inputfield_workshops_runde_4 input:disabled + span,
.Inputfield_workshops_runde_4 .iradio.disabled + span,
.Inputfield_workshops_runde_4 .icheckbox.disabled + span {
  color: #999;
}
.Inputfield_workshops_runde_1 input:disabled + span:before,
.Inputfield_workshops_runde_1 .iradio.disabled + span:before,
.Inputfield_workshops_runde_1 .icheckbox.disabled + span:before,
.Inputfield_workshops_runde_2 input:disabled + span:before,
.Inputfield_workshops_runde_2 .iradio.disabled + span:before,
.Inputfield_workshops_runde_2 .icheckbox.disabled + span:before,
.Inputfield_workshops_runde_3 input:disabled + span:before,
.Inputfield_workshops_runde_3 .iradio.disabled + span:before,
.Inputfield_workshops_runde_3 .icheckbox.disabled + span:before,
.Inputfield_workshops_runde_4 input:disabled + span:before,
.Inputfield_workshops_runde_4 .iradio.disabled + span:before,
.Inputfield_workshops_runde_4 .icheckbox.disabled + span:before {
  content: "Leider voll - ";
  display: inline-block;
  margin-right: 0.25em;
}
.Inputfield_workshops_runde_1 #Inputfield_workshops_runde_3_1193:disabled + span:before,
.Inputfield_workshops_runde_2 #Inputfield_workshops_runde_3_1193:disabled + span:before,
.Inputfield_workshops_runde_3 #Inputfield_workshops_runde_3_1193:disabled + span:before,
.Inputfield_workshops_runde_4 #Inputfield_workshops_runde_3_1193:disabled + span:before {
  content: "keine Anmeldung notwendig - " !important;
}