.video.positionimageLeft,
.video.positionimageRight {
  flex-flow: row wrap;
  align-content: flex-start;
}
.video.positionimageLeft .header,
.video.positionimageRight .header,
.video.positionimageLeft .footer,
.video.positionimageRight .footer {
  flex: 1 1 100%;
}
.video.positionimageLeft .media,
.video.positionimageRight .media {
  flex: 1 1 40%;
}
.video.positionimageLeft .content,
.video.positionimageRight .content {
  flex: 0 0 60%;
}
.video.positionimageLeft .footer,
.video.positionimageRight .footer {
  order: 3;
}
.video.positionimageLeft .media {
  order: 1;
}
.video.positionimageLeft .inner {
  order: 2;
}
.video.positionimageRight .media {
  order: 2;
}
.video.positionimageRight .inner {
  order: 1;
}
.video.positionimageBottom .inner {
  order: 1;
}
.video.positionimageBottom .media {
  order: 2;
}
.video.popup .media img,
.video.inline .media img {
  display: block;
  width: 100%;
  height: auto;
}
.video.popup .media a,
.video.inline .media a,
.video.popup .media div,
.video.inline .media div {
  display: block;
  position: relative;
  text-decoration: none;
}
.video.popup .media a:before,
.video.inline .media a:before,
.video.popup .media div:before,
.video.inline .media div:before {
  content: "";
  background: var(--color1);
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.4;
}
.video.popup .media a .playButton,
.video.inline .media a .playButton,
.video.popup .media div .playButton,
.video.inline .media div .playButton {
  display: flex;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: 120px;
  height: 120px;
  position: absolute;
  background: none;
  border: none;
  text-align: center;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  transition: all 0.2s linear;
}
.video.popup .media a .playButton:before,
.video.inline .media a .playButton:before,
.video.popup .media div .playButton:before,
.video.inline .media div .playButton:before {
  transition: all 0.2s linear;
  color: #fff;
  content: "\e037";
  font-family: var(--symbol);
  font-size: 30px;
  display: block;
  -moz-osx-font-smoothing: grayscale;
  background: none;
  width: 50px;
  height: 40px;
  border-radius: var(--borderradius);
  align-items: center;
  display: flex;
  justify-content: center;
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.video.popup .media a .playButton:after,
.video.inline .media a .playButton:after,
.video.popup .media div .playButton:after,
.video.inline .media div .playButton:after {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  content: "";
  background-image: url(../../images/playbutton.svg);
  background-size: 80% auto;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-animation-name: spin;
          animation-name: spin;
  -webkit-animation-duration: 10s;
          animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  animation-direction: reverse;
}
@media (hover: hover) {
  .video.popup .media a:hover .playButton:before,
  .video.inline .media a:hover .playButton:before,
  .video.popup .media div:hover .playButton:before,
  .video.inline .media div:hover .playButton:before {
    background: var(--color2);
  }
}
.video.inline .iframeContainer {
  position: relative;
  height: 0;
  padding-bottom: 56.25%;
}
.video.inline .iframeContainer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video.block {
  padding: 0;
}
.video.block .inner {
  padding: var(--padding);
}
.video.block .footer {
  display: flex;
  justify-content: flex-end;
}
