/* arrow */
.frame.arrow {
  display: flex;
  justify-content: center;
  background: rgb(var(--c-neutral-lighter));
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  &.frame-space-after-no-space {
    padding-bottom: 0 !important;
    margin-bottom: -30px;
  }
}

.frame-bg-grey + .frame.arrow {
  background: transparent;
  padding-bottom: var(--p) !important;

  &.frame-space-after-no-space {
    padding-bottom: 0 !important;
  }

  & .arrow__image {
    background: url("../../Images/arrow_down.png") no-repeat;
  }
}

.arrow__image {
  height: 30px;
  width: 140px;
  background: url("../../Images/arrow_white_down.png") no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;

  &::after {
    color: rgb(var(--c-neutral-darker));
    content: "\f322";
    font-family: "FaRegular";
  }
}

/* countdown */
#countdown {
  margin: 0.75rem 0 0.75rem 0;
}

.countdown-part {
  display: inline-block;
  *display: inline;
  zoom: 1;
  margin-right: 0.8em;
  padding-right: 0.8em;
  border-right: 1px solid rgb(var(--c-neutral-light));
  text-align: center;
  text-transform: uppercase;
  color: rgb(var(--c-primary));
  font-size: var(--f-size-l-1);
  line-height: 1;
}

.countdown-text {
  font-size: var(--f-size-l-2);
  color: rgb(var(--c-primary));
  text-transform: uppercase;
  font-weight: normal;
  line-height: 1.4em;
  text-align: center;
  margin-top: 5px;
  display: block;
}

.countdown-part.last {
  margin-right: 0;
  padding-right: 0;
  border-right: none;
}

.countdown-time {
  font-size: var(--f-size-l-5);
  font-family: var(--f-family-2);
  margin-bottom: 0.1em;
}

.content.countdown .grid__col.-w33:nth-child(2) {
  text-align: center;
}

/* pinchzoomer */
.marker,
.zoomHolder img {
  display: block;
}

.fullscreenToggle,
.zoomIn,
.zoomOut {
  background: url("../../Images/pz_sheet.png") no-repeat;
  width: 30px;
  height: 30px;
  overflow: hidden;
  position: relative;
  display: block;
  cursor: pointer;
  z-index: 100;
  margin: 5px 0;
}

.zoomIn {
  background-position: 0 0;
}

.zoomOut {
  background-position: -30px 0;
}

.fullscreenToggle {
  background-position: -60px 0;
  cursor: pointer;
}

.zoomIn.on,
.zoomOut.on {
  opacity: 1;
  -moz-opacity: 1;
  -khtml-opacity: 1;
  cursor: pointer;
}

.zoomIn.off,
.zoomOut.off {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  cursor: auto;
}

.controlHolder {
  border-radius: 5px;
  background: rgb(var(--c-neutral-darkest), 0.4);
  position: absolute;
  right: 10px;
  top: 10px;
  padding: 5px;
  z-index: 100;
}

.fullscreenDiv,
.marker {
  left: 0 !important;
  top: 0 !important;
}

.fullscreenToggle.on {
  background-position: -90px 0;
}

.fullscreenToggle.off {
  background-position: -60px 0;
}

.fullscreenDiv {
  width: auto !important;
  height: auto !important;
  right: 0 !important;
  bottom: 0 !important;
  position: absolute !important;
  background: rgb(var(--c-neutral-lightest));
  z-index: 999999;
  oveflow: hidden;
}

.zoomHolder {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
}

.marker {
  position: absolute !important;
  bottom: auto !important;
  right: auto !important;
}

/* swiper image slider */
.swiper.-image {
  & .swiper-pagination-bullet-active {
    background: rgb(var(--c-primary));
  }

  & .swiper-button-prev,
  & .swiper-button-next {
    background: rgba(var(--c-primary),0.8);
    height: 60px;
    width: 36px;
  }
}