.ijs-videocontent {
width: 100%;
height: 100%;
background-color: #a11;
}

.ijs-display-button div { background-position: -100px -75px; }
.ijs-display-button ul { width: 20em; left: -8.5em; /* Width of menu - width of button / 2 */ }

.ijs-displaybar-hidden {
  visibility: hidden;
}

.ijs-slide-div {
  width: 100%; height: 100%;
}
/*
.ijs-slide-video {
  width: auto; height: 100%;max-width: 100%;
}

.ijs-slide-image {
  width: auto; height: 100%;max-width: 100%;
}
*/
.ijs-slide-video {
  width: auto; height: 100%;max-height: 100%; max-width: 100%;vertical-align: middle;margin: auto;display: none;cursor: pointer;
}

.ijs-slide-image {
  width: auto; height: 100%;max-height: 100%; max-width: 100%;border: 0px;vertical-align: middle;margin: auto;cursor: pointer;
}

.ijs-slide-video-hidden {
  width: auto; height: 100%;max-height: 100%; max-width: 100%;vertical-align: middle;margin: auto;display: none;cursor: pointer;
}

.ijs-slide-image-hidden{
  width: auto; height: 100%;max-height: 100%; max-width: 100%;  
  border: 0px;vertical-align: middle;margin: auto;display: none;cursor: pointer;
}

.ijs-displaybar {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; 
  left: 35%;
  width: 450; 
  height: 70px; 
  top: -90px;
  visibility: hidden;
  z-index: 100;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;

}

.ijs-displaybar-image {
top: 0px;
outline: none;
position: relative;
float: left;
text-align: center;
margin: 0;
padding: 0;
cursor: pointer;
width: 80px;
height: 60px;
}

.ijs-displaybar-image:hover{
  -webkit-filter: drop-shadow(0px 0px 10px #fff); filter: drop-shadow(0px 0px 10px #fff)
}

.ijs-preview-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 240px; height: 180px; top: 300px;
  visibility: hidden;
  z-index: 100;
  top: -220px;
  color: #fff; font-weight: bold;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-tag-display-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 240px; height: 150px; top: 300px;
  visibility: hidden;
  z-index: 100;
  top: -180px;
  color: #fff; 
  font-family: Arial, Helvetica, sans-serif;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-question-display-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 240px; height: 150px; top: 300px;
  visibility: hidden;
  z-index: 100;
  top: -180px;
  color: #fff; 
  font-family: Arial, Helvetica, sans-serif;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-preview-image {
width: 100%; height: auto;
}

.ijs-preview-overlay {
	/*display:none;*/
	position:absolute;
	width:100%;
	height:20%;
	top:80%;
	background:#111;
	opacity: 0.9;
	color: #fff;
}

.ijs-timeline-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; left: 10%; width: 80%; height: 50px; top: 50%;
  visibility: visible;
  z-index: 100;

  color: #fff; font-weight: bold;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.9;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-timeline-canvas {
position: absolute;top: 0px;left: 0px; width: 100%;height: 100%;cursor: pointer;z-index: 90;
}

.ijs-thumbnail-holder {
  position: absolute;left: 0px; width: 100%;height: 200px;background:#f11;z-index: 100;
}

.ijs-slide-hidden {
   position: absolute;visibility: hidden;
}

.ijs-slide-left-large {
  position: absolute;left: 0%; width: 70%;height: 100%; max-height: 100%; margin:auto;text-align:center;vertical-align:middle;
}

.ijs-slide-right-large {
   position: absolute; left: 30%;width: 70%; height: 100%; max-height: 100%; margin:auto;text-align:center;vertical-align:middle;	// replaced height auto  100%
}

.ijs-slide-left-50-percent {
  position: absolute; left: 0%;width: 70%; height: auto; max-height: 100%;margin:auto;text-align:center;transform: rotateY(-25deg);
}

.ijs-slide-right-50-percent {
 position: absolute;left: 30%;width: 70%; height: auto;max-height: 100%;margin:auto;text-align:center;transform: rotateY(-25deg);
}

.ijs-slide-alone {
   /*position: relative;width: auto; height: 100%;margin:0;*/
   
  width: 100%;
  height: 100%;
  overflow: auto;
  margin: auto;
  position: absolute;
  text-align:center;

   /*display: block;width: auto; height: 100%;margin:auto;*/ 
}

.ijs-video-left-small{
  position: absolute; top: 0; left: 0; width: 30%; height: 100%; 
}

.ijs-video-right-small{
  position: absolute; top: 0; left: 70%; width: 30%; height: 100%; 
}

.ijs-video-left-50-percent{
  position: absolute; top: 0; left: 0%; width: 30%; height: 100%;perspective: 400px; transform: rotateY(25deg);
}

.ijs-video-right-50-percent{
  position: absolute; top: 0; left: 70%; width: 30%; height: 100%; perspective: 400px;transform: rotateY(25deg);
}

.ijs-video-alone {
  visibility: hidden;position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
}

.ijs-video-hidden {
  visibility: hidden;position:absolute;
}

.vjs-logo-hidden {
  position: absolute; top: 5px; left: 5px; 
  visibility: hidden;
}

.vjs-logo-left {
  position: absolute; top: 5px; left: 5px; 
  visibility: visible;
  z-index: 100;
}


.ijs-tag {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; left: 10%;width: 400px; height: 150px; top: 50%;
  z-index: 100;
  visibility: hidden;
  color: #fff; font-weight: bold;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-tag-form {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; left: 5%;width: 90%; height: 10%; top: 80%;
  z-index: 100;
visibility: hidden;
  color: #fff; font-weight: bold;
  overflow: hidden;
  overflow-y: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

/*
.ijs-info-button, .ijs-tag-button, .ijs-search-button, .ijs-stats-button, .ijs-share-button, .ijs-cut-button, .ijs-hqsq-button {
  outline: none;
  position: relative;
  float: right;
  text-align: center;
  margin: 0;
  padding: 0;
 width: 4em;
  top: 4px;
  cursor: pointer;
}
*/
.ijs-controlbar-button {
  outline: none;
  position: relative;
  float: right;
  text-align: center;
  padding: 0;
  top: 4px;
  cursor: pointer;
  margin-left:10px;
}

.ijs-chapters-button {
  background-image: url(images/h20index.png);
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  
}

.ijs-sq-button {
  background-image: url(images/sq.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;

}

.ijs-hq-button {
  background-image: url(images/hq.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;

}

.ijs-tag-button {
  background-image: url(images/tag.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  display: none;
}

.ijs-question-button {
  background-image: url(images/h20poll.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  display: none;
}

.ijs-cut-button {
  background-image: url(images/h20cut.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  display: none;
}

.ijs-search-button {
  background-image: url(images/h20search.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;

}


.ijs-viewselector-button {
  background-image: url(images/viewselector.png);
  background-repeat: no-repeat;
  width: 27px;
  height: 20px;
}

/* FontAwsome button icons */
.ijs-info-button:before {
  font-family: VideoJS;
  font-size: 1.5em;
  line-height: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}

.ijs-controlbar-button:hover {
  -webkit-filter: drop-shadow(0px 0px 10px #fff); filter: drop-shadow(0px 0px 10px #fff)

}
/*
.ijs-tag-button:hover,.ijs-info-button:hover, .ijs-search-button:hover, .ijs-stats-button:hover, .ijs-share-button:hover, .ijs-chapters-button:hover, .ijs-cut-button:hover, .ijs-hqsq-button:hover, .ijs-viewselector-button:hover{
  -webkit-filter: drop-shadow(0px 0px 10px #fff); filter: drop-shadow(0px 0px 10px #fff)
}
*/


.vjs-tag-middle {
  position: absolute; top: 100; left: 25%; width: 50%; height: 50%;
	margin: 0 auto; padding: 0; cursor: pointer;
	opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
  overflow: auto;
}

.vjs-tag-visible {
  margin: 0 25%; padding: 0; cursor: pointer;
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 50%; height: 50%; top: 25%;
  visibility: visible;
  z-index: 100;

  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-search-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 300px; height: 80px; left: 20%;
  visibility: hidden;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.8;
  top: -100px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-tag-form-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 500px; height: 300px; left: 20%;
  visibility: hidden;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.95;
  top: -355px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-jingle-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 100%; height: 100%; left: 0;top: 0;
  z-index: 500;
}

.ijs-cut-form-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 500px; height: 270px; left: 20%;
  visibility: hidden;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.95;
  top: -355px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-cut-container{
	width: 90%;
	height: 80px;
	opacity: 0.95;
	top: 100px;
}

.ijs-cut-sequence{
  position: absolute; width: 80px; height: 60px;top: 100px;
  background-color: #555;
  cursor: pointer;
}


.ijs-question-form-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 500px; height: 350px; left: 20%;
  visibility: hidden;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.95;
  top: -405px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-chapter-form-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 500px; height: 300px; left: 20%;
  visibility: hidden;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.95;
  top: -355px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}


.ijs-info-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 60%; height: 40%; left: 20%; top: 20%;
  visibility: hidden;
  z-index: 350;
	outline: none;
  color: #fff; font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.9;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-chapters-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; 
  width: 250px; 
  height: 120px; 
  left: 20%;
  display: none;
  z-index: 350;
  outline: none;
  color: #fff; font-weight: bold;
  overflow-x: hidden;
  overflow-y: auto;
  cursor: default;
  opacity: 0.9;
  top: -140px;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-chapters-panel ul li {
  list-style: none;
  margin: 0;
  padding: 0.3em 0 0.3em 0;
  line-height: 1.4em;
  font-size: 1.2em;
  font-weight: normal;
  text-align: left;
}

.ijs-chapters-panel ul li:hover{

 background-color: rgb(255, 255, 255);
  background-color: rgba(255, 255, 255, 0.75);
  color: #111;
  outline: 0;
cursor: pointer;
  -webkit-box-shadow: 0 0 1em rgba(255, 255, 255, 1);
     -moz-box-shadow: 0 0 1em rgba(255, 255, 255, 1);
          box-shadow: 0 0 1em rgba(255, 255, 255, 1);
}

.ijs-stats-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 200px; height: 100px; left: 20%; top: 20%;
  visibility: hidden;
  z-index: 100;
outline: none;
  color: #fff; 
  font-weight: bold;
  overflow: hidden;
  cursor: default;
  opacity: 0.8;
  background-color: #111;
  border: 2px solid #333;
  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
}

.ijs-displaybar-view-1 {
  top: 0px;
  background-image: url(images/view1.png);
  background-repeat: no-repeat;
background-size: cover;
}

.ijs-displaybar-view-2 {
  top: 0px;
  background-image: url(images/view2.png);
  background-repeat: no-repeat;
  background-size: cover;
}

.ijs-displaybar-view-3 {
  top: 0px;
  background-image: url(images/view3.png);
  background-repeat: no-repeat;
  background-size: cover;
}

.ijs-displaybar-view-switch {
  top: 0px;
  background-image: url(images/switch.png);
  background-repeat: no-repeat;
  background-size: cover;
}

.ijs-annotation-info {
  position: absolute;
  background-image: url(images/info_blue.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 200;
  text-decoration: none;
  outline: none;
  border: 0;
}

.ijs-annotation-alert {
  position: absolute;
  background-image: url(images/important_red.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
  
}


.ijs-annotation-question {
  position: absolute;
  background-image: url(images/question_orange.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
}

.ijs-annotation-video {
  position: absolute;
  background-image: url(images/video16x16.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
}

.ijs-annotation-audio {
  position: absolute;
  background-image: url(images/audio16x16.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
}
.ijs-annotation-link {
  position: absolute;
  background-image: url(images/link16x16.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  top: -16px;
  left: 10px;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
}

/* Form box */

div.ijsBox{
margin:0 auto;
width:100%;
height:100%;
background:#222;
position:relative;
top:0px;
border:1px solid #262626;
}

div.ijsBox .ijsPanelTitle{
font-size: 1.4em;
text-align: center;
color: #eee;
}

div.ijsBox label{
width:100%;
display: block;
background:#1C1C1C;
border-top:1px solid #262626;
border-bottom:1px solid #161712;
padding:10px 0 10px 0;
text-align: center;
}
div.ijsBox label span{
display: block;
color:#bbb;
font-size:12px;
float:left;
width:100px;
text-align:right;
padding:5px 20px 0 0;
}

div.ijsBox .ijsInputText{
padding:10px 10px;
width:300px;
background:#262626;
color: #eeeeee;
border-bottom: 1px double #171717;
border-top: 1px double #171717;
border-left:1px double #333;
border-right:1px double #333;
}

div.ijsBox .message{
padding:7px 7px;
width:350px;
background:#262626;
border-bottom: 1px double #171717;
border-top: 1px double #171717;
border-left:1px double #333;
border-right:1px double #333;
overflow:hidden;
height:150px;
}

.ijsButton
{
margin-left: 5px;
position: relative;
display: inline-block;
padding: 7px 15px;
font-size: 13px;
font-weight: bold;
color: #333;
text-shadow: 0 1px 0 rgba(255,255,255,0.9);
white-space: nowrap;
background-color: #eaeaea;
background-image: -moz-linear-gradient(#fafafa, #eaeaea);
background-image: -webkit-linear-gradient(#fafafa, #eaeaea);
background-image: linear-gradient(#fafafa, #eaeaea);
background-repeat: repeat-x;
border-radius: 3px;
border: 1px solid #ddd;
border-bottom-color: #c5c5c5;
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
vertical-align: middle;
cursor: pointer;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-appearance: none;
outline: none;
}

.ijsButton:hover
{
background-color: #cacaca;
background-image: -moz-linear-gradient(#dadada, #cacaca);
background-image: -webkit-linear-gradient(#dadada, #cacaca);
background-image: linear-gradient(#dadada, #cacaca);
border: 1px solid #bbb;
border-bottom-color: #a5a5a5;
}

.ijsButton.ijsButtonSave
{
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
background-color: #60b044;
background-image: -moz-linear-gradient(#8add6d, #60b044);
background-image: -webkit-linear-gradient(#8add6d, #60b044);
background-image: linear-gradient(#8add6d, #60b044);
background-repeat: repeat-x;
border-color: #5ca941;
}

.ijsButton.ijsButtonSave:hover
{
background-color: #409024;
background-image: -moz-linear-gradient(#6abd4d, #409024);
background-image: -webkit-linear-gradient(#6abd4d, #409024);
background-image: linear-gradient(#6abd4d, #409024);
border-color: #3c8921;
}

.ijsButton.ijsButtonDelete
{
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
background-color: #b03333;
background-image: -moz-linear-gradient(#dd6d6d, #b03333);
background-image: -webkit-linear-gradient(#dd6d6d, #b03333);
background-image: linear-gradient(#dd6d6d, #b03333);
background-repeat: repeat-x;
border-color: #a95c41;
display: none;
}

.ijsButton.ijsButtonDelete:hover
{
background-color: #901111;
background-image: -moz-linear-gradient(#bb4d4d, #901111);
background-image: -webkit-linear-gradient(#bb4d4d, #901111);
background-image: linear-gradient(#bb4d4d, #901111);
border-color: #893c21;
}

.ijsButtonEditOverlay {
	/*display:none;*/
	position:absolute;
	top:80%;
	left:50%;
	z-index: 300;
	display: none;
}

.ijsButtonTagEdit {
	/*display:none;*/
	position:absolute;
	top:80%;
	left:50%;
	z-index: 300;
}

.ijsButtonChapterCreate {
	/*display:none;*/
	position:absolute;
	top:80%;
	left:5%;
	z-index: 300;
}

.ijsButtonChapterEdit {
	/*display:none;*/
	position:absolute;
	top:80%;
	left:50%;
	z-index: 300;
}

#ijsExtractProgress .ui-progressbar-value{
  background-color: #ccc;  
}

.ijs-progress-bar{
visibility: hidden;
}

.ijs-progress-bar2{
  background-image: url(images/progressbar.gif);
  background-repeat: no-repeat;
  width: 220px;
  height: 19px;
  left: 25%;
  z-index: 300;
  text-decoration: none;
  outline: none;
  border: 0;
  text-align: center;
  display: none;
}

.ijs-settings-off-button {
  background-image: url(images/settingsoff.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;

}

.ijs-settings-on-button {
  background-image: url(images/settingson.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
}

.ijs-add-chapter-button {
  background-image: url(images/h20stylo.png);
  background-repeat: no-repeat;
  width: 22px;
  height: 22px;
  display: none;
}

.ijs-jingle-panel {
  /*margin: 0 50%; padding: 0; */
  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
  position: absolute; width: 100%; height: 100%; left: 0;top: 0;
  z-index: 500;background-color: #000;
}

.ijs-jingle-panel-hidden {
   position: absolute; width: 100%; height: 100%; left: 0;top: 0;
  z-index: 500;background-color: #000;visibility: hidden; 
}

.ijs-multilingual-button {
  background-image: url(images/world.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  z-index: 600;
}

.ijs-displayaction-button {
  background-image: url(images/eye20x20.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  z-index: 600;
}


/* -------------------------------------------------- */

.ijs-display-action {
  position: absolute;
  left: 0;
  bottom: 0em;
  opacity: 1;
  height:100%;
  transition: opacity .2s ease;
  -webkit-transition: opacity .2s ease;
  -moz-transition: opacity .2s ease;
  width: 5px;
  border-radius: 30%;
  background-color: red  
}

.ijs-display-action:hover{

  cursor:pointer;
  -webkit-transform:scale(1.3, 1.3);
  -moz-transform:scale(1.3, 1.3);
  -o-transform:scale(1.3, 1.3);
  -ms-transform:scale(1.3, 1.3);
  transform:scale(1.3, 1.3);
}

.vjs-tip {
  visibility: hidden;
  display: block;
  opacity: 0.8;
  padding: 5px;
  font-size: 10px;
  position: absolute;
  bottom: 14px;
  z-index: 100000;
}
.vjs-tip-arrow {
  background: url(data:image/gif;base64,R0lGODlhCQAJAIABAAAAAAAAACH5BAEAAAEALAAAAAAJAAkAAAIRjAOnwIrcDJxvwkplPtchVQAAOw==) no-repeat top left;
  bottom: 0;
  left: 50%;
  margin-left: -4px;
  background-position: bottom left;
  position: absolute;
  width: 9px;
  height: 5px;
}
.vjs-tip-inner {
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  padding: 5px 8px 4px 8px;
  background-color: black;
  color: white;
  max-width: 200px;
  text-align: center;
}

.vjs-break-overlay{
  visibility: hidden; 
  position: absolute;
  z-index: 100000;
}

.vjs-break-overlay-text{
  padding: 9px;
  text-align: center;
  
}