﻿/*
 Stylesheet: C:\sofodev\Mediasite\7_0_9\Server\Player\Player\Javascript\Players\MiniPlayer\MiniPlayer.less
 Theme: [default]
*/
@-moz-document url-prefix() {
    :focus {
        /* Really don't want to change the default browser focus outline, but Firefox has a stupid default. */
        outline-width: 3px;
        outline-style: solid;
        outline-color: #2964a2;
    }
}
#MediaWrapper 
{
  /* allows element to be focusable.  This is the VIDEO elements parent - BUG41678: Player - With embedded PiP, cannot use keyboard after focus is lost once */
  width: 100%;
  height: 100%;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}
.hide-text {
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
.input-block-level {
  display: block;
  width: 100%;
  min-height: 28px;
  /* Make inputs at least the height of their button counterpart */

  /* Makes inputs behave like true block-level elements */

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
html,
body {
  font-family: Arial, Verdana, Sans-Serif;
  overflow: hidden;
  color: white;
  background: #333333;
  background: -moz-linear-gradient(top, #333333 0%, #444444 25%, #555555 40%, #555555 60%, #444444 75%, #333333 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(25%, #444444), color-stop(40%, #555555), color-stop(60%, #555555), color-stop(75%, #444444), color-stop(100%, #333333));
  height: 100%;
  width: 100%;
  font-size: 10px;
}
body.useBigControls {
  font-size: 15px;
}
button {
  display: block;
  cursor: pointer;
  margin: 0 auto;
  padding: 0;
  border: 0;
}
#content {
  position: absolute;
  height: 100%;
  width: 100%;
}
#errorArea {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 100%;
  background: black;
}
#errorMessage {
  font-size: 1.2em;
  font-weight: bold;
  text-align: center;
  padding: .4em;
}
#errorDetails {
  padding: .5em;
}
#mediaElementArea {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #333333;
}
#MediaElement, .MediaElement {
  position: absolute;
  width: 100%;
  height: 100%;
}
#currentSlideArea {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: black;
  width: 100%;
  height: 100%;
}
#playStatusSlideArea {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: black;
  width: 100%;
  height: 100%;
  filter: alpha(opacity=100);
}
#currentSlideAreaSlideImage {
  position: absolute;
}
#playStatusSlideArea img {
  position: absolute;
  width: 100%;
  height: 100%;
}
#progressArea {
  position: absolute;
  bottom: 0;
  height: 1em;
  width: 100%;
  border-top: 1px solid #666666;
  z-index: 2;
  cursor: pointer;
  background-color: #151515;
  background-color: #191919;
  background-image: -moz-linear-gradient(top, #292929, black);
  background-image: -ms-linear-gradient(top, #292929, black);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#292929), to(black));
  background-image: -webkit-linear-gradient(top, #292929, black);
  background-image: -o-linear-gradient(top, #292929, black);
  background-image: linear-gradient(top, #292929, black);
  background-repeat: repeat-x;
}
.noMainControls #progressArea {
  display: none;
}
.noScrubbing #progressArea {
  cursor: auto;
}
#progress {
  width: 0px;
  height: 100%;
  background: #6db3f2;
  background: -moz-linear-gradient(top, #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6db3f2), color-stop(50%, #54a3ee), color-stop(51%, #3690f0), color-stop(100%, #1e69de));
  filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 )";
}
#mediaState {
  margin: .5em auto 0;
  color: white;
  font-size: 1em;
  -moz-border-radius: .6em;
  border-radius: .6em;
  padding: .7em .5em;
  text-align: center;
}
#slideNumberArea,
#positionArea {
  position: absolute;
  bottom: 1.1em;
  color: white;
  z-index: 3;
  font-size: 1em;
  height: 2em;
  white-space: nowrap;
}
.noMainControls #slideNumberArea,
.noMainControls #positionArea {
  bottom: 0;
}
#slideNumberArea {
  display: none;
  -moz-border-radius-topright: .6em;
  border-top-right-radius: .6em;
  left: 0;
}
#positionArea {
  right: 0;
  -moz-border-radius-topleft: .6em;
  border-top-left-radius: .6em;
}
#slideNumberText,
#position {
  display: block;
  margin: .5em .5em 0 .4em;
}
/* image buttons */

#playPause button {
  width: 60px;
  height: 60px;
}
#playButton {
  background: url('images/sprites.png') no-repeat 0 -95px;
}
#pauseButton {
  background: url('images/sprites.png') no-repeat 0 -35px;
}
#mediaSelectButton {
  width: 13px;
  height: 11px;
  background: url('images/sprites.png') no-repeat 0 0;
  margin: 3px;
}
#slideAdvance button {
  width: 18px;
  height: 24px;
}
#previousSlideButton {
  background: url('images/sprites.png') no-repeat 0 -155px;
}
#nextSlideButton {
  background: url('images/sprites.png') no-repeat 0 -11px;
}
#popout {
  width: 13px;
  height: 11px;
  background: url('images/sprites.png') no-repeat 0 -179px;
  margin: 3px;
}
#playPause {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10em;
  height: 10em;
  margin: -5em 0 0 -5em;
  z-index: 2;
}
#mediaSelectWrapper {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  padding: .5em;
  border-bottom-right-radius: .6em;
  -moz-border-radius-bottomright: .6em;
}
#popoutWrapper {
  position: absolute;
  z-index: 2;
  right: 0;
  top: 0;
  padding: .5em;
  border-bottom-left-radius: .6em;
  -moz-border-radius-bottomleft: .6em;
}
#nextSlide {
  position: absolute;
  width: 20px;
  height: 25px;
  padding: 1em .5em;
  top: 50%;
  right: 0;
  margin: -2em 0 -2em 0;
  border-top-left-radius: .6em;
  -moz-border-radius-topleft: .6em;
  border-bottom-left-radius: .6em;
  -moz-border-radius-bottomleft: .6em;
}
#previousSlide {
  position: absolute;
  width: 20px;
  height: 25px;
  padding: 1em .5em;
  top: 50%;
  left: 0;
  margin: -2em 0 -2em 0;
  border-top-right-radius: .6em;
  -moz-border-radius-topright: .6em;
  border-bottom-right-radius: .6em;
  -moz-border-radius-bottomright: .6em;
}
.overlayTransparency {
  *zoom: 1;
  background-color: black;
  opacity: 0.7;
  filter: alpha(opacity=70);
}
