/* FULL SCREEN
----------------------------------------------- */
.jp-video-full {
	position: static;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 !important;	
}

.jp-video-full .jp-jplayer {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 30px;
	height: auto !important;
}

.jp-video-full .jp-interface {
	position: absolute;
	bottom: 0 !important;
	left: 0 !important;
}



/* GENERAL
----------------------------------------------- */
.jp-jplayer {
  width: 0px;
  height: 0px;
  background-color: #000000;
}

.jp-video {
  margin: 0;
  width: 100%;
  max-width: 100%;
  padding: 0;
  font-size: 1em;
  font-family: "Helvetica Neue", Helvetica, Arial, "Nimbus Sans L", sans-serif;
  color: #fff;
  line-height: 1.6;
}
.jp-video a {
  text-decoration: none;
  color: #d2d6db;
}
.jp-video a:hover {
  color: #ffffff;
}
.jp-interface {
  position: relative;
  height: 30px;
  width: 100%;
  background-color: #222222;
  background-repeat: repeat-x;
  background-image: -khtml-gradient(linear, left top, left bottom, from(#3a3b3c), to(#222222));
  background-image: -moz-linear-gradient(#3a3b3c, #222222);
  background-image: -ms-linear-gradient(#3a3b3c, #222222);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3a3b3c), color-stop(100%, #222222));
  background-image: -webkit-linear-gradient(#3a3b3c, #222222);
  background-image: -o-linear-gradient(#3a3b3c, #222222);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a3b3c', endColorstr='#222222', GradientType=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a3b3c', endColorstr='#222222', GradientType=0)";
  background-image: linear-gradient(#3a3b3c, #222222);
  -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  -khtml-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  -o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 0px;
  -khtml-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
}

/* CONTROLS
----------------------------------------------- */
.jp-interface-spacerleft{float: left; width: 1px; height: 28px; background-color: #444; margin: 1px 4px 1px 0;}
.jp-interface-spacer{float: left; width: 1px; height: 28px; background-color: #444; margin: 1px 4px 1px 5px;}
.jp-interface-spacerright{float: left; width: 1px; height: 28px; background-color: #444; margin: 1px 0 1px 4px;}

.jp-controls li,
.jp-toggles li,
.jp-full-screen-container li
{
  list-style-type: none;
  margin-left: 0px;
  line-height: 0px;
}

.jp-controls,
.jp-full-screen-container{
  float: left;
  width: 30px;
  height: 30px;
  list-style-type: none;
  padding: 0;
  margin: 0;
  z-index: 100;
}
.jp-controls li,
.jp-full-screen-container li{
  float: left;
}
.jp-controls a,
.jp-full-screen-container a{
  position: absolute;
  overflow: hidden;
  text-indent: -9999px;
}



.jp-play,
.jp-pause,
.jp-mute,
.jp-unmute,
.jp-full-screen,
.jp-restore-screen {
  z-index: 1;
  outline: none;
  width: 30px;
  height: 30px;
  background-position: 10px center;
  background-repeat: no-repeat;
}
.jp-play:hover,
.jp-pause:hover,
.jp-mute:hover,
.jp-unmute:hover,
.jp-full-screen:hover,
.jp-restore-screen:hover{
  background-position: -23px center;
}
.jp-play {
  background-image: url('images/play.png');
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-play {
    background-image: url('images/play@2x.png');
    background-size: auto auto;
  }
}
.jp-pause {
  display: none;
  background-image: url('images/pause.png');
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-pause {
    background-image: url('images/pause@2x.png');
    background-size: auto auto;
  }
}
.jp-mute {
  background-image: url('images/mute-off.png');
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-mute {
    background-image: url('images/mute-off@2x.png');
    background-size: auto auto;
  }
}
.jp-unmute {
  background-image: url('images/mute-on.png');
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-unmute {
    background-image: url('images/mute-on@2x.png');
    background-size: auto auto;
  }
}

.jp-full-screen {
  background-image: url('images/max.png');
  background-position: 4px center;
  background-repeat: no-repeat;  
}
.jp-full-screen:hover 
{
  background-position: -60px center;    
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-full-screen {
    background-image: url('images/max.png');
    background-size: auto auto;
  }
}
.jp-restore-screen {
  background-image: url('images/min.png');
  background-position: 4px center;
  background-repeat: no-repeat;
}
.jp-restore-screen:hover 
{
  background-position: -60px center;    
}
@media all and (-webkit-min-device-pixel-ratio: 1.5) {
  .jp-restore-screen {
    background-image: url('images/min.png');
    background-size: auto auto;
  }
}




/* PROGRESS BAR
----------------------------------------------- */
.jp-progress 
{
  position: relative;    
  float: left;
  /*padding: 0 95px 0 40px;*/
  margin: 5px 0px;
  width: 505px;
  height: 20px;
}
.jp-seek-bar,
.jp-play-bar {
  width: 0px;
  height: 5px;
  -webkit-border-radius: 0px;
  -khtml-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
}
.jp-seek-bar {
  cursor: pointer;
  position: relative;
  z-index: 999;
  background: #464849;
}
.jp-play-bar {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: progress 0.75s linear infinite;
  -moz-animation: progress 0.75s linear infinite;
  -o-animation: progress 0.75s linear infinite;
  -ms-animation: progress 0.75s linear infinite;
  animation: progress 0.75s linear infinite;
}

.jp-progress .jp-current-time{position: absolute; left: 0; bottom: 0; font-size: 10px; line-height: 10px;}
.jp-progress .jp-duration{position: absolute; right: 0; bottom: 0;font-size: 10px; line-height: 10px;}

/* VOLUME BAR
----------------------------------------------- */
.jp-volume-bar {
  float: left;
  z-index: 99;
  position: relative;
  margin: 12px 0px;
  width: 40px;
  height: 7px;
  cursor: pointer;
  background: #262929;
  -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
  -khtml-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
  -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
  -o-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
  box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
  -webkit-border-radius: 0px;
  -khtml-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  border: solid 1 px lime;
}
.jp-volume-bar-value {
  width: 0px;
  height: 5px;
  margin: 1px;
  -webkit-border-radius: 0px;
  -khtml-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
}
/* Diagonal Background Bars */
.jp-play-bar,
.jp-volume-bar-value {
  -webkit-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3);
  -khtml-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3);
  -moz-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3);
  -o-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3);
  -webkit-background-size: 7px 7px;
  -moz-background-size: 7px 7px;
  -o-background-size: 7px 7px;
  background-size: 7px 7px;
  background-color: #F5811C;
}



.jp-no-solution{display: none; position: absolute; top: 0px; left: 0; padding: 40px;}
.jp-no-solution p{color: #fff;}

.jp-no-solution p a{color: #F5811C; text-decoration: underline;}
.jp-no-solution p a:hover{color: #F5811C;}


/* FULL SCREEN
----------------------------------------------- */
.jp-full-screen-container{float: left;                          
                          width: 30px;
                          height: 30px;
                          }
.jp-full-screen{}
.jp-restore-screen{}


/* PLAYLIST
----------------------------------------------- */
.jp-playlist {
  width: 95%;
  margin: 0 auto;
  font-size: 13px;
  background-color: #3a3b3c;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -khtml-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -o-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -webkit-border-radius: 0;
  -khtml-border-radius: 0;
  -moz-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
.jp-playlist a {
  display: block;
}
.jp-playlist ul {
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
  -khtml-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
  -o-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
}
.jp-playlist li {
  width: 100%;
  padding: 5px 10px;
  border-top: 1px solid #3d3f40;
  border-bottom: 1px solid #323334;
}
.jp-playlist li:first-child {
  border-top: none;
}
.jp-playlist li:last-child {
  border-bottom: none;
}
.jp-free-media {
  float: right;
  filter: alpha(opacity=50);
  -khtml-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  font-size: 10px;
  text-transform: uppercase;
  margin-top: 1px;
  display: block;
}
.jp-free-media:hover {
  filter: alpha(opacity=80);
  -khtml-opacity: 0.8;
  -moz-opacity: 0.8;
  opacity: 0.8;
}
.jp-free-media a {
  display: inline;
}
.jp-playlist-current a {
  font-weight: bold;
  color: white;
}
.jp-playlist-current .jp-free-media a {
  font-weight: normal;
}
/* CSS3 ANIMATINS
----------------------------------------------- */
/* Progress Bar Animation */
@-webkit-keyframes progress {
  0% {
    background-position: 0;
  }
  100% {
    background-position: -7px;
  }
}
@-moz-keyframes progress {
  0% {
    background-position: 0;
  }
  100% {
    background-position: -7px;
  }
}
@-ms-keyframes progress {
  0% {
    background-position: 0;
  }
  100% {
    background-position: -7px;
  }
}
@-o-keyframes progress {
  0% {
    background-position: 0;
  }
  100% {
    background-position: -7px;
  }
}