body {
  background-color:#606060; 
}
#content {
  background-color: #303030;
  position: absolute;
  /**font-family: Verdana, Geneva, Arial, sans-serif;**/
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  top: 0px;
  left: 0px;
  /* border:2px solid fuchsia; */
}

#playerBackground {
    background-color: #050505;
    position: absolute;
    top:0px;
    margin:0px;
    /* border:2px solid #050505; */
}
#topBanner {
  position: absolute;
  top:0px;
  width: 100%;
  background-color: #000000;
  overflow: hidden;
  /** border:2px solid #F50505; **/
}
#topBannerBackground {
/**  position: absolute;
  top:0px;
  width: 100%;
  background-color: #303030;
  background-repeat:repeat-x;
  **/
}
#topBannerLeft{
  position: absolute;
  top:0px;
  left:0px;
  /** background-color: #394046; **/
  overflow: hidden;
}
#topBannerRight{
  /**
  position: absolute;
  top:0px;
  right:0px;
  background-color: #394046;
  border:2px solid #05F505;
  **/
}
#topBannerRightSpace{
  position:absolute;
  right:0px;
  top:0px;
  padding:0px 10px 0px 20px;
  background-color: #000000;
  text-align:right;
  height: 60px;
  line-height: 60px;
}
#topBannerRightText{
  color:#F0F0F0;
  font-size:12px;
  display: inline-block;
  vertical-align: middle;
  line-height: 16px;
  /**text-shadow: 2px 2px 2px #AAAAAA;
  padding:4px 6px 4px 20px;**/
}
#bottomBanner {
  position: absolute;
  bottom:0px;
  width: 100%;
  background-color: #43072a;
  text-align: right;
  padding:0px;
  overflow: hidden;
}
#bottomBannerLeft{
  overflow: hidden;
}
#bottomBannerRight{
  position: absolute;
  top:2px;
  right:4px;
}

#chaptersLeft {
  position: absolute;
  left:0px; 
  overflow-y:auto;
  overflow-x:hidden;
  background-color: #303030; /*303030  dedfe1 */
  border:0px solid #781b8d; /*303030*/
}
/* following class could be changed depending if touch interface or computer
   GDC 2015: #5a6a7d #687b91
 */
.chapterClass {
  position: relative;
  font-size:12px; /* default?*/
  color:#111111;
  left:0px;
  width: 98%;
  /*background: -webkit-linear-gradient(bottom, #481055, #601671, #481055);  dark light dark  aff25c 781b8d */
  /*background: linear-gradient(to bottom, #481055, #601671, #481055); aff25c  */
  background: -webkit-linear-gradient(bottom, #dde0ea, #eaeaea, #dde0ea); /* dark light dark  aff25c 781b8d */
  background: linear-gradient(to bottom, #dde0ea, #eaeaea, #dde0ea); /*  aff25c  */
  background-color: #9121aa; /** light **/ 
  border:1px solid #340c3d; /** darker **/
  padding:7px;
  margin-right:0px;
  box-sizing: border-box;
  border-radius: 1px;
  /*background-color: #91c94c; */
}
.highlightChapter {
   color:#333333;
   background: -webkit-linear-gradient(bottom, #f7d63c, #f7e695, #f7d63c);  /*  aff25c 23ebcd */
   background: linear-gradient(to bottom, #f7d63c, #f7e695, #f7d63c);   /* aff25c */
   /*background: -webkit-linear-gradient(bottom, #f8c21a, #f8d97a, #f8c21a);    aff25c 23ebcd */
   /*background: linear-gradient(to bottom, #f8c21a, #f8d97a, #f8c21a);    aff25c */
   /* background-color: #c0ff73; */
}

#overlayLayer{
  position: absolute;
  right:30px;
  top:100px;
  width:200px;
  height:200px;
  background-color: #444444;
  z-index:4;
}

::-webkit-scrollbar {
  width: 12px; 
  margin: 3px; 
  /* background-color: #237285; */
}
::-webkit-scrollbar-thumb {
  background-color:#5a5a5a; /*#0f3038; 5a6a7d */
  border-radius: 6px;
}

/*$primary-foreground-color: #ff0000;*/

.video-js {
  /* The base font size controls the size of everything, not just text.
     All dimensions use em-based sizes so that the scale along with the font size.
     Try increasing it to 15px and see what happens. */
  font-size: 18px;
  /* The main font color changes the ICON COLORS as well as the text */
  color: #00bedf;

}
.video-js .vjs-big-play-button {
  font-size: 4em;
}

.vjs-resolution-button {
  color:inherit;
}

.video-js .vjs-volume-level {
  background-color: #FFFFFF;  
}

.vjs-volume-menu-button {
  color: #FFFFFF;
}

.video-js .vjs-progress-control {
  margin-right: 0.5em;
}

.video-js .vjs-play-progress {
  background-color: #00bedf;
  background-color: rgba(0, 190, 223, 0.8);
  /* background-color: rgba(190, 204, 47, 0.8); */
}

/*style color of timecode tooltip*/
.video-js .vjs-play-progress:after {
  background-color: #00bedf;
  background-color: rgba(0, 190, 223, 0.8);
 }

.video-js .vjs-time-control {
  display: inline;
  min-width: 0.5em;
  padding-left: 0.2em;
  padding-right: 0.2em;
}


/*
.video-js .vjs-current-time {
  display: inline;
}
*/