 g/* Skins for Digital video player >= 2.1 */


/* layer view common */
#digitalVideoPlayerLayer .volume {
  bottom: 28px;
}

#digitalVideoPlayerLayer .layerMode .volume {
  bottom: 21px;
}

#digitalVideoPlayerLayer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1005;
  text-align: center;
  vertical-align: middle;
}

#digitalVideoPlayerLayer.white {
  background: #fff;
}

#digitalVideoPlayerLayer.black {
  background: #000;
}

#digitalVideoPlayerLayer .layerLayer {
  background: url(../img/video_player/layer_bg.png );
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#digitalVideoPlayerLayer .outer {
  position: absolute;
  background-color: #fff;
  padding: 15px 15px 15px 15px;
}

#digitalVideoPlayerLayer .outerNoControls {
  position: absolute;
  background-color: #fff;
  padding: 15px;
}

#digitalVideoPlayerLayer.white .outer, #digitalVideoPlayerLayer.black .outer {
  padding: 0;
}

#digitalVideoPlayerLayer .outer .video {
  position: relative;
  width: 100%;
  height: 100%;
}




/*
Skin "digitalVideoPlayer"
*/
.digitalVideoPlayerSkin {
  position: relative;
  overflow: hidden;
}

.digitalVideoPlayerSkin .mainFrame {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: black;
}

.digitalVideoPlayerSkin video {
  display: block;
  position: relative;
  cursor: default;
  width: 100%;
  height: 100%;
}

.digitalVideoPlayerSkin .aperture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  display: none;
}

.digitalVideoPlayerSkin .layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}

.digitalVideoPlayerSkin div.playPause {
  position: absolute;
  left: 50%;
  margin-left: -36px;
  top: 50%;
  margin-top: -36px;
  width: 72px;
  height: 72px;
  display: none;
}

.digitalVideoPlayerSkin div.playPause div.play, .digitalVideoPlayerSkin div.playPause div.pause, .digitalVideoPlayerSkin div.playPause div.replay {
  position: relative;
  display: block;
  width: 72px;
  height: 72px;
  background: url(digital/player.png ) no-repeat 0 -306px;
}

.digitalVideoPlayerSkin div.playPause div.pause {
  background-position: 0 -195px;
}

.digitalVideoPlayerSkin div.playPause div.replay {
  background-position: 0 -379px;
  cursor: pointer;
}

.digitalVideoPlayerSkin .controlsFrame {
  position: absolute;
  bottom: -38px;
  left: 0;
  width: 100%;
  z-index: 10;
  visibility: hidden;
}

.digitalVideoPlayerSkin .controls {
  position: relative;
  padding-top: 6px;
  left: 0;
  width: 100%;
  overflow: hidden;
  background: #fff;
  height: 32px;
  z-index: 10;
}

.digitalVideoPlayerSkin .controls .button {
  display: block;
  border: 0;
  margin: 4px 3px;
  height: 18px;
  width: 18px;
  background: url(digital/player.png ) no-repeat;
}

.digitalVideoPlayerSkin .controls > .left .button {
  float: left;
}

.digitalVideoPlayerSkin .controls > .right .button, .controls > .right .time  {
  float: right;
}

.digitalVideoPlayerSkin .layerMode .controls {
  height: 26px;
}

.digitalVideoPlayerSkin .layerMode.fullscreen-mode .controls {
  height: 32px;
}

.digitalVideoPlayerSkin .standardMode .controls > .left {
  padding-left: 7px;
}

.digitalVideoPlayerSkin .standardMode .controls > .right {
  padding-right: 7px;
}

.digitalVideoPlayerSkin .layerMode .controls > .left {
  padding-left: 0;
}

.digitalVideoPlayerSkin .layerMode .controls > .left a:first-child {
  margin-left: 0;
}

.digitalVideoPlayerSkin .layerMode .controls > .right {
  padding-right: 0;
}

.digitalVideoPlayerSkin .layerMode .controls > .right a:first-child {
  margin-right: 0;
}

.digitalVideoPlayerSkin .layerMode.fullscreen-mode .controls > .left {
  padding-left: 7px;
}

.digitalVideoPlayerSkin .layerMode.fullscreen-mode .controls > .right {
  padding-right: 7px;
}

.digitalVideoPlayerSkin .controls .play {
  background-position: 0 -287px
}
.digitalVideoPlayerSkin .controls .play:hover {
  background-position: 0 -268px
}

.digitalVideoPlayerSkin .controls .play.replay {
  background-position: 0 -784px
}
.digitalVideoPlayerSkin .controls .play.replay:hover {
  background-position: 0 -803px
}

.digitalVideoPlayerSkin .controls .pause {
  background-position: 0 -176px;
}
.digitalVideoPlayerSkin .controls .pause:hover {
  background-position: 0 -157px;
}

.digitalVideoPlayerSkin .controls a.download {
  background-position: 0 -100px;
}
.digitalVideoPlayerSkin .controls a.download:hover {
  background-position: 0 -81px;
}

.digitalVideoPlayerSkin .controls .fullscreen {
  background-position: 0 -138px
}
.digitalVideoPlayerSkin .controls .fullscreen:hover {
  background-position: 0 -119px
}

.digitalVideoPlayerSkin .fullscreen-mode .controls .fullscreen {
  background-position: 0 -670px
}
.digitalVideoPlayerSkin .fullscreen-mode .controls .fullscreen:hover {
  background-position: 0 -689px
}

.digitalVideoPlayerSkin .controls .sound {
  background-position: 0 -509px
}
.digitalVideoPlayerSkin .controls .sound:hover {
  background-position: 0 -490px
}

.digitalVideoPlayerSkin .controls a.soundOff {
  background-position: 0 -547px;
}
.digitalVideoPlayerSkin .controls .soundOff:hover {
  background-position: 0 -528px;
}

.digitalVideoPlayerSkin .controls a.skip {
  background-position: 0 -471px;
}

.digitalVideoPlayerSkin .controls a.skip:hover {
  background-position: 0 -452px;
}

.digitalVideoPlayerSkin .controls .subtitles {
  background-position: 0 -708px;
}
.digitalVideoPlayerSkin .controls .subtitles:hover {
  background-position: 0 -727px;
}

.digitalVideoPlayerSkin .controls .subtitles.off {
  background-position: 0 -746px;
}

.digitalVideoPlayerSkin .controls .subtitles.off:hover {
  background-position: 0 -765px;
}

.digitalVideoPlayerSkin .controls > .left {
  position: relative;
  float: left;
}

.digitalVideoPlayerSkin .controls > .right {
  position: relative;
  float: right;
}

.digitalVideoPlayerSkin .controls .middle {
  position: static;
  width: 100%;
}

.digitalVideoPlayerSkin .controls > .middle .progressBar {
  position: relative;
  height: 26px;
  overflow: hidden;
  padding: 0 5px;
}

.digitalVideoPlayerSkin .controls > .middle .standard {
  height: 26px;
  position: relative;
  background: url(digital/progressbar.png ) repeat scroll 0 0 transparent;
}

.digitalVideoPlayerSkin .controls > .middle .standard .left {
  background: url(digital/player.png ) no-repeat scroll 0 0 transparent;
  height: 22px;
  width: 4px;
  left: 0;
  position: relative;
  background-position: -5px -27px;
}

.digitalVideoPlayerSkin .controls > .middle .played {
  width: 18px;
  height: 18px;
  position: relative;
  bottom: 22px;
  left: 0;
  background: url(digital/progressbar-h.png ) repeat scroll left center transparent;
  min-width: 18px;
  visibility: hidden;
}

.digitalVideoPlayerSkin .controls > .middle .played a {
  display: block;
  height: 18px;
  width: 18px;
  outline: medium none;
  position: absolute;
  right: 0;
  top: 0;
}

/*
the "button-bg" style is only necessary if the button should have a shadow
otherwise add the background directly to the ".played a" style
*/
.digitalVideoPlayerSkin .controls > .middle .played .buttonBg {
  width: 26px;
  height: 26px;
  position: absolute;
  top: -4px;
  right: -4px;
  background: url(digital/player.png ) no-repeat scroll 0 -54px transparent;
}

.digitalVideoPlayerSkin .controls > .middle .played .left {
  background: url(digital/player.png) no-repeat scroll 0 0 transparent;
  height: 22px;
  left: 0;
  position: relative;
  top: -4px;
  width: 4px;
}

.digitalVideoPlayerSkin .controls > .middle .standard .right {
  background: url(digital/player.png ) no-repeat scroll 0 -27px transparent;
  height: 26px;
  position: absolute;
  right: 0;
  top: 0;
  width: 4px;
}

.digitalVideoPlayerSkin .controls .time {
  font-family: arial, helvetica, sans-serif;
  font-size: 12px;
  line-height: 18px;
  height: 18px;
  padding: 0 5px;
  margin: 4px 0 0 0;
  text-align: left;
}

.digitalVideoPlayerSkin .controls .time span {
  color: #1C69D4;
  font-size: 12px;
  line-height: 18px;
}

.digitalVideoPlayerSkin .subtitlesLayer {
  font-family: BMWType_Bold, Arial, sans-serif;
  position: relative;
  width: 100%;
  font-size: 13px;
  line-height: 16px;
  color: white;
  text-align: center;
  overflow: hidden;
  cursor: default;
  display: none;
}

.digitalVideoPlayerSkin .controlsFrame .noControls {
  bottom: -10px;
}

.digitalVideoPlayerSkin .subtitlesLayer .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: alpha(opacity = 40);
}

.digitalVideoPlayerSkin .subtitlesLayer .foreground {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 10px 0 10px 0;
}

.digitalVideoPlayerSkin .volume {
  position: absolute;
  bottom: 28px;
  right: 0;
  height: 102px;
  width: 22px;
  background: url(digital/player.png ) no-repeat 0 -566px;
  display: none;
  z-index: 15;
}

.digitalVideoPlayerSkin .volume div.current {
  position: absolute;
  bottom: 0;
  height: 100px;
  width: 22px;
  overflow: hidden;
  background: url(digital/sound_slider.png ) no-repeat bottom;
}

.digitalVideoPlayerSkin .volume div.current a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  background: url(digital/player.png ) no-repeat -2px -56px;
}

.digitalVideoPlayerSkin .volume div.current div {
  position: absolute;
  top: 0;
  left: 0;
  height: 2px;
  width: 22px;
  background: url(digital/player.png ) no-repeat 0 -625px;
  display: block;
}

.digitalVideoPlayerSkin .thumbs {
  position: relative;
  display: none;
  overflow: hidden;
  vertical-align: middle;
  text-align: center;
  overflow: hidden;
  z-index: 1100;
  width: 100%;
}

.digitalVideoPlayerSkin .fullscreen-mode .thumbs {
  display: none !important;
}

.digitalVideoPlayerSkin .thumbs a {
  position: relative;
  cursor: pointer;
  background: #000;
  display: inline-block;
}

.digitalVideoPlayerSkin .thumbs img {
  position: relative;
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity = 60);
}

.digitalVideoPlayerSkin .thumbs img:hover, .digitalVideoPlayerSkin .thumbs img.active {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity = 100);
}


#digitalVideoPlayerLayer.digitalVideoPlayerSkin .outer a.close {
  display: block;
  position: absolute;
  top: 21px;
  right: 21px;
  width: 18px;
  height: 18px;
  background: url(../img/digital/icons.png ) -570px -60px;
  z-index: 1010;
}

#digitalVideoPlayerLayer.digitalVideoPlayerSkin .outer a.close:hover {
  background-position: -570px -90px;
  cursor: pointer;
}

#digitalVideoPlayerLayer.digitalVideoPlayerSkin .outer a.closeFullscreen {
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 18px;
  height: 18px;
  background: url(../img/digital/icons.png ) -570px -60px;
}


/*
Skin "bmwVideoPlayer"
*/

.bmwVideoPlayerSkin {
  position: relative;
  overflow: hidden;
}

.bmwVideoPlayerSkin .mainFrame {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: black;
}

.bmwVideoPlayerSkin video {
  display: block;
  position: relative;
  cursor: default;
  width: 100%;
  height: 100%;
}

.bmwVideoPlayerSkin .aperture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  display: none;
}

.bmwVideoPlayerSkin .layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}

.bmwVideoPlayerSkin div.playPause {
  position: absolute;
  left: 50%;
  margin-left: -36px;
  top: 50%;
  margin-top: -36px;
  width: 72px;
  height: 72px;
  display: none;
}

.bmwVideoPlayerSkin div.playPause div.play, .bmwVideoPlayerSkin div.playPause div.pause, .bmwVideoPlayerSkin div.playPause div.replay {
  position: relative;
  display: block;
  width: 72px;
  height: 72px;
  background: url(bmw/player.png ) no-repeat 0 -306px;
}

.bmwVideoPlayerSkin div.playPause div.pause {
  background-position: 0 -195px;
}

.bmwVideoPlayerSkin div.playPause div.replay {
  background-position: 0 -379px;
  cursor: pointer;
}

.bmwVideoPlayerSkin .controlsFrame {
  position: absolute;
  bottom: -38px;
  left: 0;
  width: 100%;
  z-index: 10;
  visibility: hidden;
}

.bmwVideoPlayerSkin .controls {
  position: relative;
  padding-top: 6px;
  left: 0;
  width: 100%;
  overflow: hidden;
  background: #fff;
  height: 32px;
  z-index: 10;
}

.bmwVideoPlayerSkin .controls .button {
  display: block;
  border: 0;
  margin: 4px 3px;
  height: 18px;
  width: 18px;
  background: url(bmw/player.png ) no-repeat;
}

.bmwVideoPlayerSkin .controls > .left .button {
  float: left;
}

.bmwVideoPlayerSkin .controls > .right .button, .controls > .right .time  {
  float: right;
}

.bmwVideoPlayerSkin .layerMode .controls {
  height: 26px;
}

.bmwVideoPlayerSkin .layerMode.fullscreen-mode .controls {
  height: 32px;
}

.bmwVideoPlayerSkin .standardMode .controls > .left {
  padding-left: 7px;
}

.bmwVideoPlayerSkin .standardMode .controls > .right {
  padding-right: 7px;
}

.bmwVideoPlayerSkin .layerMode .controls > .left {
  padding-left: 0;
}

.bmwVideoPlayerSkin .layerMode .controls > .left a:first-child {
  margin-left: 0;
}

.bmwVideoPlayerSkin .layerMode .controls > .right {
  padding-right: 0;
}

.bmwVideoPlayerSkin .layerMode .controls > .right a:first-child {
  margin-right: 0;
}

.bmwVideoPlayerSkin .layerMode.fullscreen-mode .controls > .left {
  padding-left: 7px;
}

.bmwVideoPlayerSkin .layerMode.fullscreen-mode .controls > .right {
  padding-right: 7px;
}

.bmwVideoPlayerSkin .controls .play {
  background-position: 0 -287px
}
.bmwVideoPlayerSkin .controls .play:hover {
  background-position: 0 -268px
}

.bmwVideoPlayerSkin .controls .play.replay {
  background-position: 0 -709px
}
.bmwVideoPlayerSkin .controls .play.replay:hover {
  background-position: 0 -728px
}

.bmwVideoPlayerSkin .controls .pause {
  background-position: 0 -176px;
}
.bmwVideoPlayerSkin .controls .pause:hover {
  background-position: 0 -157px;
}

.bmwVideoPlayerSkin .controls a.download {
  background-position: 0 -100px;
}
.bmwVideoPlayerSkin .controls a.download:hover {
  background-position: 0 -81px;
}

.bmwVideoPlayerSkin .controls .fullscreen {
  background-position: 0 -138px
}
.bmwVideoPlayerSkin .controls .fullscreen:hover {
  background-position: 0 -119px
}

.bmwVideoPlayerSkin .fullscreen-mode .controls .fullscreen {
  background-position: -19px -138px;
}
.bmwVideoPlayerSkin .fullscreen-mode .controls .fullscreen:hover {
  background-position: -19px -119px;
}

.bmwVideoPlayerSkin .controls .sound {
  background-position: 0 -509px
}
.bmwVideoPlayerSkin .controls .sound:hover {
  background-position: 0 -490px
}

.bmwVideoPlayerSkin .controls a.soundOff {
  background-position: 0 -547px;
}
.bmwVideoPlayerSkin .controls .soundOff:hover {
  background-position: 0 -528px;
}

.bmwVideoPlayerSkin .controls a.skip {
  background-position: 0 -471px;
}

.bmwVideoPlayerSkin .controls a.skip:hover {
  background-position: 0 -452px;
}

.bmwVideoPlayerSkin .controls .subtitles {
  background-position: -19px -471px;
}
.bmwVideoPlayerSkin .controls .subtitles:hover {
  background-position: -38px -471px;
}

.bmwVideoPlayerSkin .controls .subtitles.off {
  background-position: -19px -452px;
}

.bmwVideoPlayerSkin .controls .subtitles.off:hover {
  background-position: -38px -452px;
}

.bmwVideoPlayerSkin .controls > .left {
  position: relative;
  float: left;
}

.bmwVideoPlayerSkin .controls > .right {
  position: relative;
  float: right;
}

.bmwVideoPlayerSkin .controls .middle {
  position: static;
  width: 100%;
}

.bmwVideoPlayerSkin .controls > .middle .progressBar {
  position: relative;
  height: 26px;
  overflow: hidden;
  padding: 0 5px;
}

.bmwVideoPlayerSkin .controls > .middle .standard {
  height: 26px;
  position: relative;
  background: url(bmw/progressbar.png ) repeat scroll 0 0 transparent;
}

.bmwVideoPlayerSkin .controls > .middle .standard .left {
  background: url(digital/player.png ) no-repeat scroll 0 0 transparent;
  height: 22px;
  width: 4px;
  left: 0;
  position: relative;
  background-position: -5px -27px;
}

.bmwVideoPlayerSkin .controls > .middle .played {
  width: 18px;
  height: 18px;
  position: relative;
  bottom: 22px;
  left: 0;
  background: url(bmw/progressbar-h.png ) repeat scroll left center transparent;
  min-width: 18px;
  visibility: hidden;
}

.bmwVideoPlayerSkin .controls > .middle .played a { /* button ohne schatten */
  display: block;
  height: 18px;
  width: 18px;
  outline: medium none;
  position: absolute;
  right: 0;
  top: 0;
  background: url(bmw/player.png ) no-repeat scroll 0 -58px transparent;
}


.bmwVideoPlayerSkin .controls > .middle .played .left {
  background: url(bmw/player.png ) no-repeat scroll 0 0 transparent;
  height: 22px;
  left: 0;
  position: relative;
  top: -4px;
  width: 4px;
}

.bmwVideoPlayerSkin .controls > .middle .standard .right {
  background: url(bmw/player.png ) no-repeat scroll 0 -27px transparent;
  height: 26px;
  position: absolute;
  right: 0;
  top: 0;
  width: 4px;
}

.bmwVideoPlayerSkin .controls .time {
  font-family: arial, helvetica, sans-serif;
  font-size: 12px;
  line-height: 18px;
  height: 18px;
  padding: 0 5px;
  margin: 4px 0 0 0;
  text-align: left;
}

.bmwVideoPlayerSkin .controls .time span {
  color: #0044cc;
  font-size: 12px;
  line-height: 18px;
}

.bmwVideoPlayerSkin .subtitlesLayer {
  font-family: BMWType_Bold, Arial, sans-serif;
  position: relative;
  width: 100%;
  font-size: 13px;
  line-height: 16px;
  color: white;
  text-align: center;
  overflow: hidden;
  cursor: default;
  display: none;
}

.bmwVideoPlayerSkin .controlsFrame .noControls {
  bottom: -10px;
}

.bmwVideoPlayerSkin .subtitlesLayer .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: alpha(opacity = 40);
}

.bmwVideoPlayerSkin .subtitlesLayer .foreground {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 10px 0 10px 0;
}

.bmwVideoPlayerSkin .volume {
  position: absolute;
  bottom: 28px;
  right: 0;
  height: 102px;
  width: 20px;
  background: url(bmw/player.png) no-repeat 0 -566px;
  display: none;
  z-index: 15;
}

.bmwVideoPlayerSkin .volume div.current {
  position: absolute;
  bottom: 0;
  height: 100px;
  width: 20px;
  overflow: hidden;
  background: url(bmw/sound_slider.png) no-repeat bottom;
}

.bmwVideoPlayerSkin .volume div.current a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 13px;
  background: url(bmw/player.png) no-repeat 1px -61px;
}

.bmwVideoPlayerSkin .volume div.current div {
  position: absolute;
  top: 0;
  left: 0;
  height: 2px;
  width: 20px;
  background: url(bmw/player.png) no-repeat 0 -625px;
  display: block;
}

.bmwVideoPlayerSkin .thumbs {
  position: relative;
  display: none;
  overflow: hidden;
  vertical-align: middle;
  text-align: center;
  overflow: hidden;
  z-index: 1100;
  width: 100%;
}

.bmwVideoPlayerSkin .fullscreen-mode .thumbs {
  display: none !important;
}

.bmwVideoPlayerSkin .thumbs a {
  position: relative;
  cursor: pointer;
  background: #000;
  display: inline-block;
}

.bmwVideoPlayerSkin .thumbs img {
  position: relative;
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity = 60);
}

.bmwVideoPlayerSkin .thumbs img:hover, .bmwVideoPlayerSkin .thumbs img.active {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity = 100);
}

#digitalVideoPlayerLayer.bmwVideoPlayerSkin .outer a.close {
  display: block;
  position: absolute;
  top: 21px;
  right: 21px;
  width: 15px;
  height: 15px;
  background: url(../img/standard_elements/close_light.gif ) 0 0;
  z-index: 1010;
}

#digitalVideoPlayerLayer.bmwVideoPlayerSkin .outer a.close:hover {
  background-position: 0 -50px;
  cursor: pointer;
}

#digitalVideoPlayerLayer.bmwVideoPlayerSkin .outer a.closeFullscreen {
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 15px;
  height: 15px;
  background: url(../img/standard_elements/close_light.gif ) 0 0;
}