/*! Copyright - 2016 Connatix Ltd. Build Date: 12/9/2016, 4:04:40 PM */
@font-face {
  font-family: 'cnxrenderer';
  src: url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.eot?18667759');
  src: url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.eot?18667759#iefix') format('embedded-opentype'), url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.woff2?115566778899') format('woff2'), url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.woff?115566778899') format('woff'), url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.ttf?115566778899') format('truetype'), url('https://a.connatix.com/Renderer/Fonts/cnxrenderer.svg?18667759#cnxrenderer') format('svg');
  font-weight: normal;
  font-style: normal;
}
body [class*='cnxpl-']:before {
  font-family: "cnxrenderer";
}
body [class*='cnxpl-'] {
  font-family: "cnxrenderer";
}
body .cnxpl-button:before {
  font-family: "cnxrenderer";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em !important;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  font-size: 12px;
  /* fix buttons height, for twitter bootstrap */
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
body .cnxpl-play:before {
  content: "\e809";
}
body .cnxpl-mute:before {
  content: '\e800';
}
body .cnxpl-unmute:before {
  content: '\e801';
}
body .cnxpl-resize:before {
  content: '\e803';
}
body .cnxpl-pause:before {
  content: '\e80a';
}
body .cnxpl-full-screen {
  width: 100%!important;
  height: 100%!important;
  padding: 0!important;
}
body .cnxpl-root-container {
  -webkit-font-smoothing: antialiased;
}
body .cnxpl-root-container -webkit-full-screen {
  width: 100%;
  height: 100%;
}
body .cnxpl-root-container .cnxpl-gradient-bottom-content {
  bottom: 0;
  z-index: 20;
  background-position: bottom;
  height: 98px;
  width: 100%;
  position: absolute;
  background-repeat: repeat-x;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
  -moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  pointer-events: none;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
}
body .cnxpl-root-container .cnxpl-gradient-bottom-ad {
  bottom: 0;
  z-index: 20;
  background-position: bottom;
  height: 32px;
  width: 100%;
  position: absolute;
  background-color: #14a3ec;
  background-repeat: repeat-x;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
  pointer-events: none;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
}
body .cnxpl-root-container .cnxpl-control-bar-container {
  max-height: 98px;
  display: none;
}
body .cnxpl-root-container .cnxpl-control-bar-container.cnxpl-show {
  display: block;
}
body .cnxpl-bottom {
  bottom: 0;
  left: 3%;
  height: 36px;
  width: 94%;
  z-index: 61;
  padding-top: 3px;
  text-align: left;
  direction: ltr;
  position: absolute;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
  -moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
}
body .cnxpl-bottom .cnxpl-progress-bar-container {
  display: block;
  position: absolute;
  width: 100%;
  height: 5px;
  bottom: 36px;
  cursor: pointer;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 31;
  outline: none;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-bar-pading {
  position: absolute;
  width: 100%;
  height: 16px;
  bottom: 0;
  z-index: 28;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list {
  z-index: 39;
  background: rgba(255, 255, 255, 0.2);
  height: 100%;
  -moz-transform: scaleY(0.6);
  -ms-transform: scaleY(0.6);
  -webkit-transform: scaleY(0.6);
  transform: scaleY(0.6);
  -moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  -ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  position: relative;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list.cnxpl-in-ad {
  display: none;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-play-progress {
  left: 0px;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 34;
  background-color: #14a3ec;
  transform-origin: 0 0;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-hover-progress {
  z-index: 35;
  background: rgba(0, 0, 0, 0.125);
  opacity: 0;
  background: rgba(255, 255, 255, 0.5);
  -moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  -webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 100%;
  /*-moz-transform-origin: 0 0;
                        -ms-transform-origin: 0 0;
                        -webkit-transform-origin: 0 0;*/
  opacity: 1;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-scrubber-container {
  position: absolute;
  top: -4px;
  left: -6.5px;
  z-index: 43;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-scrubber-container .cnxpl-scrubber-button {
  height: 13px;
  width: 13px;
  background-color: #f12b24;
  border-radius: 6.5px;
  -moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  -ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-scrubber-container .cnxpl-scrubber-button .cnxpl-scrubber-pull-indicator {
  position: absolute;
  z-index: 42;
  bottom: 16.9px;
  left: 6.5px;
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-scrubber-container .cnxpl-scrubber-button .cnxpl-scrubber-pull-indicator:before {
  display: block;
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  opacity: 0;
  width: 6.5px;
  height: 6.5px;
  border-style: solid;
  border-width: 2px 0 0 2px;
  border-color: #eaeaea;
  -moz-transition: all .2s;
  -webkit-transition: all .2s;
  transition: all .2s;
}
body .cnxpl-bottom .cnxpl-progress-bar-container .cnxpl-progress-bar .cnxpl-progress-list .cnxpl-scrubber-container .cnxpl-scrubber-button .cnxpl-scrubber-pull-indicator:after {
  display: block;
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  opacity: 0;
  width: 6.5px;
  height: 6.5px;
  border-style: solid;
  border-width: 2px 0 0 2px;
  border-color: #eaeaea;
  -moz-transition: all .2s;
  -webkit-transition: all .2s;
  transition: all .2s;
}
body .cnxpl-bottom .cnxpl-buttons-container {
  height: 36px;
  line-height: 36px;
  text-align: left;
  direction: ltr;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-button {
  float: left;
  cursor: pointer;
  color: white;
  width: 26px;
  font-size: 14px;
  height: 100%;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-button-right {
  float: right;
  cursor: pointer;
  color: white;
  width: 26px;
  height: 100%;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-play-button.cnxpl-in-ad {
  display: none;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-time-container {
  float: left;
  color: white;
  font-size: 12px;
  padding-left: 1px;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel {
  float: left;
  display: inline-block;
  width: 0px;
  margin-right: 3px;
  height: 100%;
  line-height: 36px;
  transition: margin 0.2s cubic-bezier(0.4, 0, 1, 1), width 0.2s cubic-bezier(0.4, 0, 1, 1);
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel.cnxpl-show {
  display: inline-block;
  width: 52px;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel:hover {
  display: inline-block;
  width: 52px;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel .cnxpl-volume-slider {
  height: 100%;
  position: relative;
  overflow: hidden;
  color: #eee;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel .cnxpl-volume-slider .cnxpl-volume-slider-handle {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  cursor: pointer;
  border-radius: 6px;
  margin-top: -6px;
  background: #fff;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel .cnxpl-volume-slider .cnxpl-volume-slider-handle:before {
  left: -58px;
  background: #fff;
  content: '';
  position: absolute;
  display: block;
  top: 50%;
  height: 3px;
  margin-top: -2px;
  width: 64px;
}
body .cnxpl-bottom .cnxpl-buttons-container .cnxpl-volume-panel .cnxpl-volume-slider .cnxpl-volume-slider-handle:after {
  left: 6px;
  background: rgba(255, 255, 255, 0.2);
  content: '';
  position: absolute;
  display: block;
  top: 50%;
  height: 3px;
  margin-top: -2px;
  width: 64px;
}