body.timeline #pagewrap {
  overflow: visible; }

@media (min-width: 992px) {
  .frame-type-timeline {
    position: relative;
    display: block;
    height: 100vh;
    width: 100%; }
    @supports (position: sticky) {
    .frame-type-timeline {
      height: 200vh; } } }

.geschichte-container {
  overflow: hidden;
  width: 100%;
  height: 100vh;
  position: relative;
  left: 50%;
  top: 0px;
  -moz-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 0; }
  @supports (position: sticky) {
  @media (min-width: 992px) {
    .geschichte-container {
      position: -webkit-sticky;
      /* Safari */
      position: sticky;
      top: 70px;
      -moz-transform: translateX(0%);
      -o-transform: translateX(0%);
      -ms-transform: translateX(0%);
      -webkit-transform: translateX(0%);
      transform: translateX(0%); } } }

@media @break-md-query {
  .geschichte-container {
    min-height: 650px; } }

.geschichte-inner {
  position: relative;
  display: block;
  height: calc(100% - 70px); }

@-webkit-keyframes radialwipe {
  0% {
    -webkit-clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  16.66% {
    -webkit-clip-path: polygon(50% 50%, 100% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  33.32% {
    -webkit-clip-path: polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  49.98% {
    -webkit-clip-path: polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 0% 100%, 0% 0%, 50% 0%); }

  66.64% {
    -webkit-clip-path: polygon(50% 50%, 0% 100%, 0% 100%, 0% 100%, 0% 100%, 0% 0%, 50% 0%); }

  83.33% {
    -webkit-clip-path: polygon(50% 50%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 50% 0%); }

  100% {
    -webkit-clip-path: polygon(50% 50%, 50% 0%, 50% 0%, 50% 0%, 50% 50%, 50% 0%, 50% 0%); } }

@keyframes radialwipe {
  0% {
    clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  16.66% {
    clip-path: polygon(50% 50%, 100% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  33.32% {
    clip-path: polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 0% 100%, 0% 0%, 50% 0%); }

  49.98% {
    clip-path: polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 0% 100%, 0% 0%, 50% 0%); }

  66.64% {
    clip-path: polygon(50% 50%, 0% 100%, 0% 100%, 0% 100%, 0% 100%, 0% 0%, 50% 0%); }

  83.33% {
    clip-path: polygon(50% 50%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 50% 0%); }

  100% {
    clip-path: polygon(50% 50%, 50% 0%, 50% 0%, 50% 0%, 50% 50%, 50% 0%, 50% 0%); } }

.geschichte-item {
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 10;
  color: rgba(255, 255, 255, 0.5);
  font-size: 1.066666rem;
  font-weight: normal;
  font-style: italic;
  line-height: 2em;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  text-align: left; }
  .geschichte-item .imagecontainer {
    position: relative;
    padding: 0; }
    .geschichte-item .imagecontainer:before {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      background: rgba(0, 0, 0, 0.15);
      z-index: 40; }

@media (min-width: 992px) {
  .geschichte-item.radial {
    -webkit-clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%);
    clip-path: polygon(50% 50%, 50% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%);
    -webkit-animation: radialwipe 0.5s 1 linear forwards;
    animation: radialwipe 0.5s 1 linear forwards; } }

.geschichte-item.act {
  z-index: 100; }

.geschichte-item > div {
  height: 100%; }

.geschichte-item .text {
  width: 100vw;
  position: absolute;
  left: 0;
  bottom: 0;
  margin-bottom: 50px; }
  @media @break-md-query {
  .geschichte-item .text {
    margin-bottom: 80px; } }

.geschichte-item .text > .row {
  margin: 0 auto; }
  @media (min-width: 992px) {
  .geschichte-item .text > .row {
    width: 825px; } }
  @media (min-width: 1302px) {
  .geschichte-item .text > .row {
    width: 1125px; } }
  @media (min-width: 1600px) {
  .geschichte-item .text > .row {
    width: 1300px; } }

.geschichte-item.odd .text {
  left: auto;
  right: 0; }

.geschichte-item.odd .text .row > div {
  float: right;
  width: 100%;
  max-width: 100%;
  flex: auto; }

@media (min-width: 992px) {
    .geschichte-item.odd .text .row {
      padding-left: 550px; } }
  @media (min-width: 1302px) {
  .geschichte-item.odd .text .row {
    padding-left: 770px; } }
  @media (min-width: 1600px) {
  .geschichte-item.odd .text .row {
    padding-left: 900px; } }

.geschichte-item h2 {
  color: #fff;
  font-style: normal;
  font-size: 41px;
  line-height: 1.2em;
  margin-bottom: 1rem; }
  @media (max-width: 767px) {
  .geschichte-item h2 {
    font-size: 1.5rem; } }

.geschichte-item header {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0;
  z-index: 50;
  text-align: center; }
  @media (min-width: 992px) {
  .geschichte-item header {
    top: 150px;
    -moz-transform: translate(-50%, 0%);
    -o-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%); } }
  @media (min-width: 1302px) {
  .geschichte-item header {
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); } }

.geschichte-item header p.subtitle {
  color: #fff;
  font-style: normal;
  font-size: 1rem;
  text-transform: uppercase;
  margin-bottom: 1rem;
  text-align: center; }

.geschichte-item header h2 {
  font-size: 6.66666rem;
  line-height: 1em;
  color: #fff; }

@media (min-width: 992px) {
    .geschichte-item header .subtitle {
      text-align: center; } }

.geschichte-item .text .subtitle {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 100;
  padding-bottom: 1rem; }

.geschichte-item section p {
  font-style: normal;
  color: #fff;
  font-size: 16px; }

.geschichte-link {
  position: absolute;
  left: 0px;
  bottom: 0px;
  height: 80px;
  background: #fff;
  z-index: 100;
  width: 100%;
  border-bottom: 1px solid #dfe5eb; }

.geschichte-link a {
  line-height: 79px;
  width: 100%;
  display: block;
  text-align: center;
  color: red;
  font-size: 0.86666rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 600;
  text-decoration: none; }

.circle-control {
  width: 350px;
  height: 350px;
  position: absolute;
  left: 50%;
  top: 60px;
  -moz-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 100; }
  @media (min-width: 1302px) {
  .circle-control {
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); } }
  .circle-control:after {
    content: "";
    background-image: url(/typo3conf/ext/zz_gowest_theme_pletzer/Resources/Public/Images//geschichte-striche.svg);
    position: absolute;
    height: calc(100% + 4rem);
    width: calc(100% + 4rem);
    background-size: cover;
    opacity: 0.5;
    top: 50%;
    left: calc(50% + 1px);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none; }

.circle-control > * {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }

.circle-control > * svg {
  width: 100%;
  height: 100%;
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg); }

.circle-control .background path {
  stroke: rgba(255, 255, 255, 0.6); }

.circle-control .animatedCircle path {
  stroke: #fff; }

.circle-control ul {
  list-style: none;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 0;
  padding: 0; }

.circle-control ul li {
  position: absolute;
  width: 0px;
  height: 0px;
  cursor: pointer; }

.circle-control ul li:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border: 1px solid rgba(255, 255, 255, 1);
  border-radius: 100%;
  -webkit-transition: 0.2s ease;
  -moz-transition: 0.2s ease;
  -ms-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease; }

.circle-control ul li.act:before {
  background: #fff;
  border-color: #fff; }

@media (max-width: 991.98px) {
  .geschichte-container {
    height: auto;
    overflow: hidden; }
    .geschichte-inner {
      white-space: nowrap;
      widht: 100vw;
      overflow: hidden;
      font-size: 0px; }
    .geschichte-inner, .geschichte-item > div {
      height: auto;
      display: block; }
    .geschichte-item {
      position: relative;
      display: block;
      white-space: normal; }
    .geschichte-item:before {
      content: "";
      display: block;
      padding-top: 100%; }
    .geschichte-item .text {
      position: relative;
      bottom: auto;
      top: 0; }
    .geschichte-item .objectFit img {
      width: 100%;
      height: auto;
      position: relative;
      display: block; }
    .geschichte-link {
      bottom: auto;
      top: 0px;
      position: relative; }
    .geschichte-item .imagecontainer {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%; }
    .geschichte-item .text {
      margin: 0px;
      padding: 2rem 3rem 2rem 2rem; }
    .geschichte-item header {
      top: 50vw; }
    .circle-control {
      display: none; } }
  @media (max-width: 991.98px) and (max-width: 991.98px) {
      .geschichte-item {
        margin-left: 0;
        margin-right: 0; } }