html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  overflow: hidden; }

html, body {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%; }

.fullcontainer, .votv-yt-controls .votvhd-load-progress, .votv-yt-controls .votvhd-play-progress, .fullsize {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0; }

.display_manager, .display_manager .displayinstance, .no_select, .skin .votvhd-controls {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

#player_container {
  width: 100%;
  height: 100%;
  position: absolute; }

.videoreference img {
  width: 100%;
  height: auto; }

.displayinstance {
  z-index: 5;
  position: absolute;
  display: block; }

.display_manager, .display_manager .displayinstance, .display_manager .displayinstance > iframe, .display_manager .displayinstance > video, .player-instance {
  -moz-transition: all .3s cubic-bezier(.29, .56, 1, .33);
  -o-transition: all .3s cubic-bezier(.29, .56, 1, .33);
  -webkit-transition: all .3s cubic-bezier(.29, .56, 1, .33);
  transition: all .3s cubic-bezier(.29, .56, 1, .33);
  -moz-transition-property: width, height;
  -o-transition-property: width, height;
  -webkit-transition-property: width, height;
  transition-property: width, height; }

.display_manager {
  background-color: #000;
  overflow: hidden; }

.display_manager .displayinstance {
  position: absolute;
  z-index: 5; }

.display_manager .displayinstance.patch iframe {
  height: 400%;
  -moz-transform: translateY(-37.4%);
  -o-transform: translateY(-37.4%);
  -ms-transform: translateY(-37.4%);
  -webkit-transform: translateY(-37.4%);
  transform: translateY(-37.4%);
  -moz-transition-property: width;
  -o-transition-property: width;
  -webkit-transition-property: width;
  transition-property: width; }

.display_manager div.skin {
  right: 0;
  bottom: 0;
  width: 100%;
  box-sizing: border-box; }

.display_manager div.video {
  left: 0;
  right: 0;
  overflow: hidden; }

.display_manager div.vimeo {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.display_manager div.overlay {
  top: 0;
  left: 0;
  right: 0; }

.display_manager div.youtube {
  overflow: hidden; }

.display_manager div.subtitles {
  bottom: 60px;
  font-size: 2em;
  color: #fff;
  text-align: center;
  width: 100%;
  text-shadow: 2px 2px 6px #000; }

.display_manager div.hdflash, .display_manager div.hdflash .over-embed {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute; }

.display_manager div.hdflash .over-embed {
  z-index: 10; }

.display_manager div.pip {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.display_manager div.pip .slideuse {
  width: 100%;
  height: 100%;
  background-color: initial;
  overflow: initial; }

.displayinstance .slide_holder {
  width: 100%;
  height: 100%; }

.toggleSlidePlayer {
  position: absolute;
  width: 100px;
  height: 37px; }

.button-player {
  width: 37px;
  height: 37px;
  background-color: #031f27;
  color: #fff;
  overflow: hidden;
  padding: 6px;
  cursor: pointer; }

.button-player path, .button-player rect {
  fill: #fff; }

.button-player:hover {
  background-color: #fff; }

.button-player:hover path, .button-player:hover rect {
  fill: #031f27; }

.button-player.less {
  padding-top: 9px; }

.button-player.slide {
  width: 48px;
  height: 46px;
  padding: 10px 10px 6px 8px;
  position: absolute; }

.error-overlay {
  background-color: #000;
  color: #fff;
  display: block; }

.error-overlay .content {
  display: block;
  position: absolute;
  top: 8em;
  left: 2em;
  right: 2em; }

.error-overlay .title-error {
  display: block;
  font-size: 3em; }

.error-overlay .description-error {
  display: block;
  font-size: 1.5em;
  padding-top: 1.5em;
  line-height: 1.3em; }

.playpausetoggle {
  moz-transform-origin: preserve-3d;
  -o-transform-origin: preserve-3d;
  -ms-transform-origin: preserve-3d;
  -webkit-transform-origin: preserve-3d;
  transform-origin: preserve-3d;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100; }

.playpausetoggle > div {
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 4em;
  height: 4em;
  border-radius: 50%;
  position: relative;
  border: .3em solid #EFEFEF;
  opacity: .5; }

.playpausetoggle > div::before {
  position: absolute;
  content: "";
  top: .25em;
  left: 1.2em;
  width: 0;
  height: 0;
  border-top: 1.5em solid rgba(255, 255, 255, 0);
  border-bottom: 1.5em solid transparent;
  border-left: 1.5em solid #EFEFEF; }

.playpausetoggle.pause > div::after, .playpausetoggle.pause > div::before {
  position: absolute;
  background: #EFEFEF;
  content: "";
  top: .45em;
  width: .5em;
  height: 2.6em; }

.playpausetoggle.pause > div::before {
  left: 1em;
  border: none; }

.playpausetoggle.pause > div::after {
  right: 1em; }

.display_manager .displayinstance.playbutton {
  position: static;
  position: initial; }

.display_manager div.subtitles, .displayinstance.subtitles, .votvhd-timecode {
  pointer-events: none;
  z-index: 5; }

.displayinstance.title {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  box-sizing: border-box;
  height: 100px;
  background: -moz-linear-gradient(bottom, transparent 0%, rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0.7) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(bottom, transparent 0%, rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0.7) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to top, transparent 0%, rgba(0, 0, 0, 0.1) 30%, rgba(0, 0, 0, 0.7) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  padding: 16px 0 0 18px;
  font-family: Montserrat, Arial, Helvetica, sans-serif; }
.displayinstance.title .title {
  text-transform: uppercase;
  color: white;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  font-weight: 500;
  font-size: 27px; }
.displayinstance.title .subtitle {
  color: white;
  font-weight: 400;
  font-size: 18px;
  padding-top: 10px; }
.width-verysmall .displayinstance.title {
  padding: 12px 0 0 10px; }
.width-verysmall .displayinstance.title .title {
  font-size: 20px; }
.width-verysmall .displayinstance.title .subtitle {
  font-size: 14px;
  padding-top: 8px; }
.width-nano .displayinstance.title {
  padding: 11px 0 0 9px; }
.width-nano .displayinstance.title .title {
  font-size: 15px; }
.width-nano .displayinstance.title .subtitle {
  font-size: 10px;
  padding-top: 8px; }

.displayinstance.counter {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7); }
.displayinstance.counter .libelle-counter {
  font-size: 30px;
  top: 36%; }
.displayinstance.counter .data-counter {
  font-size: 46px;
  top: 46%; }
.displayinstance.counter .libelle-counter, .displayinstance.counter .data-counter {
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  text-align: center;
  position: absolute;
  width: 100%;
  color: white; }
.width-small .displayinstance.counter .libelle-counter {
  font-size: 28px;
  top: 34%; }
.width-small .displayinstance.counter .data-counter {
  font-size: 43px;
  top: 46%; }
.width-verysmall .displayinstance.counter .libelle-counter {
  font-size: 25px;
  top: 32%; }
.width-verysmall .displayinstance.counter .data-counter {
  font-size: 38px;
  top: 46%; }
.width-nano .displayinstance.counter .libelle-counter {
  font-size: 15px;
  top: 30%; }
.width-nano .displayinstance.counter .data-counter {
  font-size: 23px;
  top: 50%; }

.displayinstance.vr {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 5; }
.displayinstance.vr .picto {
  width: 81px;
  position: absolute;
  top: 19px;
  right: 24px; }
.displayinstance.vr .top-control {
  display: block;
  position: absolute;
  height: 33px;
  width: 55px;
  top: 10px;
  left: 50%;
  -moz-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  cursor: pointer; }
.displayinstance.vr .top-control:before, .displayinstance.vr .top-control::before {
  width: 8px;
  height: 36px;
  background-color: white;
  content: '';
  display: block;
  top: -1px;
  left: 14px;
  position: absolute;
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }
.displayinstance.vr .top-control:after, .displayinstance.vr .top-control::after {
  width: 8px;
  height: 36px;
  background-color: white;
  content: '';
  display: block;
  top: -1px;
  right: 14px;
  position: absolute;
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }
.displayinstance.vr .bottom-control {
  display: block;
  position: absolute;
  height: 33px;
  width: 55px;
  bottom: 20px;
  left: 50%;
  -moz-transform: translate(-50%, -40px);
  -o-transform: translate(-50%, -40px);
  -ms-transform: translate(-50%, -40px);
  -webkit-transform: translate(-50%, -40px);
  transform: translate(-50%, -40px);
  cursor: pointer; }
.displayinstance.vr .bottom-control:before, .displayinstance.vr .bottom-control::before {
  width: 8px;
  height: 36px;
  background-color: #fff;
  content: '';
  display: block;
  top: -1px;
  left: 14px;
  position: absolute;
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }
.displayinstance.vr .bottom-control:after, .displayinstance.vr .bottom-control::after {
  width: 8px;
  height: 36px;
  background-color: #fff;
  content: '';
  display: block;
  top: -1px;
  right: 14px;
  position: absolute;
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }
.displayinstance.vr .left-control {
  display: block;
  position: absolute;
  width: 33px;
  height: 52px;
  left: 13px;
  top: 50%;
  -moz-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer; }
.displayinstance.vr .left-control:before, .displayinstance.vr .left-control::before {
  width: 7px;
  height: 26px;
  background-color: white;
  content: '';
  display: block;
  top: 6px;
  left: 12px;
  position: absolute;
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }
.displayinstance.vr .left-control :after, .displayinstance.vr .left-control::after {
  width: 7px;
  height: 26px;
  background-color: white;
  content: '';
  display: block;
  top: 21px;
  right: 14px;
  position: absolute;
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }
.displayinstance.vr .right-control {
  display: block;
  position: absolute;
  width: 33px;
  height: 52px;
  right: 13px;
  top: 50%;
  -moz-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer; }
.displayinstance.vr .right-control:before, .displayinstance.vr .right-control::before {
  width: 7px;
  height: 26px;
  background-color: white;
  content: '';
  display: block;
  top: 6px;
  left: 12px;
  position: absolute;
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }
.displayinstance.vr .right-control:after, .displayinstance.vr .right-control::after {
  width: 7px;
  height: 26px;
  background-color: white;
  content: '';
  display: block;
  top: 21px;
  right: 14px;
  position: absolute;
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

#player_container, .player-viewon {
  font-size: 14px;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

@font-face {
  font-family: Montserrat;
  src: url(../../fonts/montserrat-regular-webfont.eot);
  src: url(../../fonts/montserrat-regular-webfont.eot?#iefix) format("embedded-opentype"), url(../../fonts/montserrat-regular-webfont.woff) format("woff"), url(../../fonts/montserrat-regular-webfont.ttf) format("truetype"), url(../../fonts/montserrat-regular-webfont.svg#montserratregular) format("svg");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: Montserrat;
  src: url(../../fonts/montserrat-bold-webfont.eot);
  src: url(../../fonts/montserrat-bold-webfont.eot?#iefix) format("embedded-opentype"), url(../../fonts/montserrat-bold-webfont.woff) format("woff"), url(../../fonts/montserrat-bold-webfont.ttf) format("truetype"), url(../../fonts/montserrat-bold-webfont.svg#montserratbold) format("svg");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: Merriweather;
  src: url(../../fonts/merriweathersans-light-webfont.eot);
  src: url(../../fonts/merriweathersans-light-webfont.eot?#iefix) format("embedded-opentype"), url(../../fonts/merriweathersans-light-webfont.woff) format("woff"), url(../../fonts/merriweathersans-light-webfont.ttf) format("truetype"), url(../../fonts/merriweathersans-light-webfont.svg#merriweather_sansbook) format("svg");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: Merriweather;
  src: url(../../fonts/merriweathersans-light-webfont.eot);
  src: url(../../fonts/merriweathersans-light-webfont.eot?#iefix) format("embedded-opentype"), url(../../fonts/merriweathersans-light-webfont.woff) format("woff"), url(../../fonts/merriweathersans-light-webfont.ttf) format("truetype"), url(../../fonts/merriweathersans-light-webfont.svg#merriweather_sansbook) format("svg");
  font-weight: 400;
  font-style: normal; }

.t0 {
  -moz-transition-delay: 0s !important;
  -o-transition-delay: 0s !important;
  -webkit-transition-delay: 0s !important;
  transition-delay: 0s !important; }

.t1 {
  -moz-transition-delay: 0.1s !important;
  -o-transition-delay: 0.1s !important;
  -webkit-transition-delay: 0.1s !important;
  transition-delay: 0.1s !important; }

.t2 {
  -moz-transition-delay: 0.2s !important;
  -o-transition-delay: 0.2s !important;
  -webkit-transition-delay: 0.2s !important;
  transition-delay: 0.2s !important; }

.t3 {
  -moz-transition-delay: 0.3s !important;
  -o-transition-delay: 0.3s !important;
  -webkit-transition-delay: 0.3s !important;
  transition-delay: 0.3s !important; }

.t4 {
  -moz-transition-delay: 0.4s !important;
  -o-transition-delay: 0.4s !important;
  -webkit-transition-delay: 0.4s !important;
  transition-delay: 0.4s !important; }

.t5 {
  -moz-transition-delay: 0.5s !important;
  -o-transition-delay: 0.5s !important;
  -webkit-transition-delay: 0.5s !important;
  transition-delay: 0.5s !important; }

.t6 {
  -moz-transition-delay: 0.6s !important;
  -o-transition-delay: 0.6s !important;
  -webkit-transition-delay: 0.6s !important;
  transition-delay: 0.6s !important; }

.t7 {
  -moz-transition-delay: 0.7s !important;
  -o-transition-delay: 0.7s !important;
  -webkit-transition-delay: 0.7s !important;
  transition-delay: 0.7s !important; }

.t8 {
  -moz-transition-delay: 0.8s !important;
  -o-transition-delay: 0.8s !important;
  -webkit-transition-delay: 0.8s !important;
  transition-delay: 0.8s !important; }

.displayinstance.skin {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  box-sizing: border-box;
  overflow: visible; }
.displayinstance.skin .bg {
  height: 88px;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 );
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000',GradientType=0)";
  background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.27) 53%, rgba(0, 0, 0, 0.8) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.27) 53%, rgba(0, 0, 0, 0.8) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.27) 53%, rgba(0, 0, 0, 0.8) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  bottom: 0; }

.votvhd-progress-holder {
  background-color: #101f2d; }

.votvhd-load-progress {
  background: #218a7c; }

.votvhd-play-progress {
  background: #34d9c3; }

.votvhd-seek-handle {
  color: #fff; }

.tooltip {
  color: #fff; }

.tooltip .label {
  background-color: rgba(0, 0, 0, 0.7); }

.progress-timecode {
  color: white; }

[aria-label]:after {
  color: white;
  background-color: rgba(0, 0, 0, 0.7); }

.volume-range::-webkit-slider-thumb {
  background: #ffffff; }

.volume-range::-moz-range-thumb {
  background: #ffffff; }

.volume-range::-ms-thumb {
  background: #ffffff; }

.volume-range::-webkit-slider-runnable-track {
  background: #34d9c3;
  background: repeating-linear-gradient(180deg, #34d9c3, #34d9c3 8px) no-repeat #101f2d; }

.volume-range::-moz-range-progress {
  background-color: #34d9c3; }

.volume-range::-moz-range-track {
  background: #101f2d; }

.volume-range::-ms-track {
  background: #101f2d; }

.volume-range::-ms-fill-lower, .volume-range::-ms-fill-upper {
  background: #34d9c3; }

.volume-range::-ms-fill-upper {
  background: #101f2d; }

.menu-skin > ul > li {
  background-color: #101f2d;
  color: white; }

.menu-skin > ul > li:hover, .menu-skin > ul > li.active {
  color: #101f2d;
  background-color: #34d9c3; }

.fullcontainer, .votv-yt-controls .votvhd-load-progress, .votv-yt-controls .votvhd-play-progress {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0; }

.votv-yt-controls {
  position: absolute;
  bottom: 0px;
  height: 50px;
  left: 0px;
  right: 0px; }
.votv-yt-controls .votvhd-progress-control {
  right: 0px;
  left: 0px;
  position: absolute;
  top: 0px;
  bottom: 30px; }
.votv-yt-controls .votvhd-progress-holder {
  position: absolute;
  top: 9px;
  bottom: 8px;
  left: 0;
  right: 0; }
.votv-yt-controls .votvhd-load-progress {
  -moz-transition: width .2s ease;
  -o-transition: width .2s ease;
  -webkit-transition: width .2s ease;
  transition: width .2s ease; }
.votv-yt-controls .votvhd-play-progress {
  -moz-transition: width .2s ease;
  -o-transition: width .2s ease;
  -webkit-transition: width .2s ease;
  transition: width .2s ease; }
.votv-yt-controls .votvhd-seek-handle {
  position: absolute;
  left: 0;
  right: 0;
  top: -8px;
  bottom: -8px;
  opacity: 0;
  cursor: pointer; }
.votv-yt-controls .votvhd-control-text {
  display: none; }
.votv-yt-controls .votvhd-timecode {
  top: -20px;
  position: absolute;
  display: none;
  -moz-transition: left .2s ease;
  -o-transition: left .2s ease;
  -webkit-transition: left .2s ease;
  transition: left .2s ease; }
.votv-yt-controls .tooltip {
  font-family: Merriweather, "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 14px;
  position: relative;
  display: inline-block;
  margin-left: -50%;
  z-index: 1; }
.votv-yt-controls .tooltip .label {
  display: inline-block;
  padding: 4px 6px;
  text-align: center;
  border-radius: 2px;
  height: 24px;
  min-width: 38px; }
.votv-yt-controls .blank_space {
  display: block;
  height: 12px; }

.votvhd-button {
  height: 38px;
  cursor: pointer;
  display: block;
  padding-top: 8px; }
.votvhd-button .votvhd-icon-container {
  height: 22px; }
.votvhd-button.votvhd-play-pause {
  float: left; }
.votvhd-button.votvhd-play-pause .icon-playpause {
  width: 35px;
  display: block;
  position: relative; }
.votvhd-button.votvhd-play-pause .icon-playpause:before, .votvhd-button.votvhd-play-pause .icon-playpause::before {
  content: "";
  display: block;
  background: white;
  height: 17px;
  width: 2px;
  position: absolute;
  left: 14px;
  top: 3px;
  -moz-transition: transform .3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform .3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform .3s cubic-bezier(0, 0, 0, 1.11);
  transition: transform .3s cubic-bezier(0, 0, 0, 1.11);
  -moz-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -o-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -ms-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -webkit-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  transform: translate(0px, 0px) rotate(0deg) scaleY(1); }
.votvhd-button.votvhd-play-pause:hover .icon-playpause:before, .votvhd-button.votvhd-play-pause:hover .icon-playpause::before {
  border-radius: 0 0 2px 2px;
  -moz-transform: translate(1px, 0px) rotate(0deg) scaleY(0.9);
  -o-transform: translate(1px, 0px) rotate(0deg) scaleY(0.9);
  -ms-transform: translate(1px, 0px) rotate(0deg) scaleY(0.9);
  -webkit-transform: translate(1px, 0px) rotate(0deg) scaleY(0.9);
  transform: translate(1px, 0px) rotate(0deg) scaleY(0.9); }
.votvhd-button.votvhd-play-pause .icon-playpause:after, .votvhd-button.votvhd-play-pause .icon-playpause::after {
  content: "";
  display: block;
  background: white;
  height: 17px;
  width: 2px;
  position: absolute;
  left: 21px;
  top: 3px;
  -moz-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -moz-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -o-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -ms-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  -webkit-transform: translate(0px, 0px) rotate(0deg) scaleY(1);
  transform: translate(0px, 0px) rotate(0deg) scaleY(1); }
.votvhd-button.votvhd-play-pause:hover .icon-playpause:after, .votvhd-button.votvhd-play-pause:hover .icon-playpause::after {
  -moz-transform: translate(-1px, 0px) rotate(0deg) scaleY(0.9);
  -o-transform: translate(-1px, 0px) rotate(0deg) scaleY(0.9);
  -ms-transform: translate(-1px, 0px) rotate(0deg) scaleY(0.9);
  -webkit-transform: translate(-1px, 0px) rotate(0deg) scaleY(0.9);
  transform: translate(-1px, 0px) rotate(0deg) scaleY(0.9); }
.pause .votvhd-button.votvhd-play-pause .icon-playpause:before, .pause .votvhd-button.votvhd-play-pause .icon-playpause::before {
  -moz-transform: translate(4px, -4px) rotate(-45deg) scaleY(0.7);
  -o-transform: translate(4px, -4px) rotate(-45deg) scaleY(0.7);
  -ms-transform: translate(4px, -4px) rotate(-45deg) scaleY(0.7);
  -webkit-transform: translate(4px, -4px) rotate(-45deg) scaleY(0.7);
  transform: translate(4px, -4px) rotate(-45deg) scaleY(0.7); }
.pause .votvhd-button.votvhd-play-pause:hover .icon-playpause:before, .pause .votvhd-button.votvhd-play-pause:hover .icon-playpause::before {
  -moz-transform: translate(4px, -2px) rotate(-60deg) scaleY(0.7);
  -o-transform: translate(4px, -2px) rotate(-60deg) scaleY(0.7);
  -ms-transform: translate(4px, -2px) rotate(-60deg) scaleY(0.7);
  -webkit-transform: translate(4px, -2px) rotate(-60deg) scaleY(0.7);
  transform: translate(4px, -2px) rotate(-60deg) scaleY(0.7); }
.pause .votvhd-button.votvhd-play-pause .icon-playpause:after, .pause .votvhd-button.votvhd-play-pause .icon-playpause::after {
  -moz-transform: translate(-3px, 4px) rotate(45deg) scaleY(0.7);
  -o-transform: translate(-3px, 4px) rotate(45deg) scaleY(0.7);
  -ms-transform: translate(-3px, 4px) rotate(45deg) scaleY(0.7);
  -webkit-transform: translate(-3px, 4px) rotate(45deg) scaleY(0.7);
  transform: translate(-3px, 4px) rotate(45deg) scaleY(0.7); }
.pause .votvhd-button.votvhd-play-pause:hover .icon-playpause:after, .pause .votvhd-button.votvhd-play-pause:hover .icon-playpause::after {
  border-radius: 2px 2px 0 0;
  -moz-transform: translate(-3px, 3px) rotate(60deg) scaleY(0.7);
  -o-transform: translate(-3px, 3px) rotate(60deg) scaleY(0.7);
  -ms-transform: translate(-3px, 3px) rotate(60deg) scaleY(0.7);
  -webkit-transform: translate(-3px, 3px) rotate(60deg) scaleY(0.7);
  transform: translate(-3px, 3px) rotate(60deg) scaleY(0.7); }

.volume-container {
  height: 38px;
  float: left;
  overflow: hidden;
  -moz-transition: width 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: width 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: width 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: width 0.4s cubic-bezier(0, 0, 0, 1.11);
  width: 0;
  display: block;
  position: relative; }

.volume-container.active {
  width: 78px; }

.volume-range-holder {
  padding-top: 14px; }

/* slide de volume */
.volume-range {
  width: 100%;
  margin: 0px 1px;
  -webkit-appearance: none;
  height: 14px;
  background-color: transparent; }

@media all and (-ms-high-contrast: none) {
  .volume-range {
    height: inherit; }
  .volume-range-holder {
    padding-top: 0px; } }

.volume-container {
  display: none\9; }

.volume-range::-webkit-slider-thumb {
  border: none;
  width: 4px;
  height: 14px;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -4px; }

.volume-range::-moz-range-thumb {
  border: none;
  width: 4px;
  height: 14px;
  cursor: pointer;
  border-radius: 0; }

.volume-range::-ms-thumb {
  border: none;
  width: 4px;
  height: 14px;
  cursor: pointer;
  -ms-appearance: none; }

.volume-range::-webkit-slider-runnable-track {
  width: 100%;
  height: 6px;
  cursor: pointer;
  background: #34d9c3;
  background: repeating-linear-gradient(180deg, #34d9c3, #34d9c3 8px) no-repeat #101f2d;
  background-size: 100% 100%;
  border: none; }

.volume-range::-moz-range-track, .volume-range::-moz-range-progress {
  width: 100%;
  height: 6px;
  cursor: pointer;
  border: none; }

.volume-range::-ms-track {
  height: 6px;
  cursor: pointer;
  padding: 0;
  border: none;
  display: block;
  color: transparent; }

.volume-range::-ms-fill-lower, .volume-range::-ms-fill-upper {
  cursor: pointer;
  border: none; }

.votvhd-button.votvhd-stop {
  float: left; }

.votvhd-button.votvhd-stop:hover .icon-stop {
  -moz-transform: scale(0.95);
  -o-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -webkit-transform: scale(0.95);
  transform: scale(0.95); }

.icon-stop {
  width: 43px;
  display: block;
  position: relative;
  -moz-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11); }

.icon-stop .picto {
  border: 2px solid #fff;
  width: 15px;
  height: 15px;
  position: absolute;
  display: block;
  left: 14px;
  top: 4px; }

.volume-component {
  float: left; }

.votvhd-button.votvhd-volume {
  float: left; }

.votvhd-button.votvhd-volume .icon-volume {
  -moz-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11); }

.votvhd-button.votvhd-volume:hover .icon-volume {
  -moz-transform: scaleX(1.07) scaleY(1.07);
  -o-transform: scaleX(1.07) scaleY(1.07);
  -ms-transform: scaleX(1.07) scaleY(1.07);
  -webkit-transform: scaleX(1.07) scaleY(1.07);
  transform: scaleX(1.07) scaleY(1.07); }

.icon-volume {
  width: 40px;
  display: block;
  padding: 3px 0 0 12px; }

.icon-volume .picto {
  width: 20px;
  height: 100%;
  display: block; }

.icon-volume .sound1, .icon-volume .sound2, .icon-volume .sound3, .icon-volume .picto svg {
  width: 100%;
  height: auto;
  display: block;
  width: inherit; }

.icon-volume .sound1, .icon-volume .sound2, .icon-volume .sound3, .icon-volume .no-sound {
  -moz-transition: opacity 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: opacity 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: opacity 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: opacity 0.4s cubic-bezier(0, 0, 0, 1.11); }

.volume1 .icon-volume .sound2, .volume1 .icon-volume .sound3 {
  opacity: 0; }

.volume2 .icon-volume .sound3 {
  opacity: 0; }

.icon-volume .no-sound {
  opacity: 0; }

.mute .icon-volume .sound1 {
  opacity: 0; }

.mute .icon-volume .sound2 {
  opacity: 0; }

.mute .icon-volume .sound3 {
  opacity: 0; }

.mute .icon-volume .no-sound {
  opacity: 1; }

.progress-timecode {
  font-size: 12px;
  font-family: Merriweather, "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-weight: 300;
  text-align: left;
  display: block;
  float: left;
  padding: 14px 10px 5px 10px; }
.small-tc .progress-timecode {
  width: 60px;
  text-align: center; }
.small-tc.duration .progress-timecode {
  width: 110px;
  text-align: center; }
.long-tc .progress-timecode {
  text-align: center;
  width: 84px; }
.long-tc.duration .progress-timecode {
  text-align: center;
  width: 140px; }

.live-button {
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  font-face: 400;
  font-size: 16px;
  color: white;
  display: none;
  float: left;
  text-decoration: none;
  padding: 12px 4px 10px 10px; }
.live .live-button {
  display: block; }
.live-button .live-state, .live-button .backtolive-state {
  text-transform: uppercase;
  position: relative; }
.dvr .live-button .live-state {
  display: none; }
.live-button .live-state:before, .live-button .live-state::before {
  content: "";
  position: absolute;
  background-color: #ed1c24;
  border-radius: 6px;
  width: 6px;
  height: 6px;
  left: -9px;
  top: 6px; }
.live-button .backtolive-state {
  display: none;
  cursor: pointer; }
.dvr .live-button .backtolive-state {
  display: block; }

.votvhd-button.votvhd-fullscreen {
  float: left; }

.votvhd-button.votvhd-fullscreen:hover .icon-fullscreen {
  -moz-transform: scaleX(1.1) scaleY(1.2);
  -o-transform: scaleX(1.1) scaleY(1.2);
  -ms-transform: scaleX(1.1) scaleY(1.2);
  -webkit-transform: scaleX(1.1) scaleY(1.2);
  transform: scaleX(1.1) scaleY(1.2); }

.icon-fullscreen {
  width: 41px;
  display: block;
  position: relative;
  -moz-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11); }

.icon-fullscreen .picto {
  border: 2px solid #fff;
  width: 23px;
  height: 16px;
  position: absolute;
  display: block;
  left: 8px;
  top: 3px; }

.votvhd-button.votvhd-srt {
  float: left; }

.votvhd-button.votvhd-srt .picto {
  -moz-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  height: 100%; }

.votvhd-button.votvhd-srt:hover .picto {
  -moz-transform: scale(1.07);
  -o-transform: scale(1.07);
  -ms-transform: scale(1.07);
  -webkit-transform: scale(1.07);
  transform: scale(1.07); }

.icon-srt {
  width: 41px;
  display: block;
  position: relative; }

.icon-srt .picto {
  width: 24px;
  display: block;
  position: absolute;
  left: 9px;
  top: 3px;
  height: 100%; }

.votvhd-button.votvhd-quality {
  float: left; }

.votvhd-button.votvhd-quality:hover .icon-quality {
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }

.icon-quality {
  width: 39px;
  display: block;
  position: relative;
  -moz-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11); }

.icon-quality .picto {
  width: 19px;
  height: 100%;
  display: block;
  position: absolute;
  left: 10px;
  top: 1px; }

.votvhd-button.votvhd-share {
  float: left; }

.votvhd-button.votvhd-share .picto {
  -moz-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.4s cubic-bezier(0, 0, 0, 1.11);
  height: 100%; }

.votvhd-button.votvhd-share:hover .picto {
  -moz-transform: scale(1.07);
  -o-transform: scale(1.07);
  -ms-transform: scale(1.07);
  -webkit-transform: scale(1.07);
  transform: scale(1.07); }

.icon-share {
  width: 39px;
  display: block;
  position: relative;
  -moz-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: transform 0.3s cubic-bezier(0, 0, 0, 1.11); }

.icon-share .picto {
  width: 18px;
  display: block;
  position: absolute;
  left: 12px;
  top: 1px; }

.displayinstance.skin .votvhd-button:focus, .displayinstance.skin .votvhd-button, .displayinstance.skin .votvhd-progress-holder, .displayinstance.skin a {
  outline: 0; }

.displayinstance.skin .no-focus-outline :focus {
  outline: 0; }

.displayinstance.skin .keyboard-focus :focus {
  outline: rgba(51, 217, 194, 0.7) solid 1px; }

.menu-skin {
  -moz-transform: translatey(-100%);
  -o-transform: translatey(-100%);
  -ms-transform: translatey(-100%);
  -webkit-transform: translatey(-100%);
  transform: translatey(-100%);
  visibility: hidden;
  opacity: 0;
  -moz-transition: visibility 0s linear 1s, opacity 0.5s linear;
  -o-transition: visibility 0s linear 1s, opacity 0.5s linear;
  -webkit-transition: visibility 0s linear 1s, opacity 0.5s linear;
  transition: visibility 0s linear 1s, opacity 0.5s linear;
  z-index: 2;
  position: absolute;
  top: -11px;
  font-family: Merriweather, "Trebuchet MS", Arial, Helvetica, sans-serif; }
.menu-skin > ul {
  font-size: 13px;
  padding: 0;
  margin: 0;
  text-align: center; }
.menu-skin > ul > li {
  -moz-transform: translate(0px, 14px);
  -o-transform: translate(0px, 14px);
  -ms-transform: translate(0px, 14px);
  -webkit-transform: translate(0px, 14px);
  transform: translate(0px, 14px);
  opacity: 0;
  -moz-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -moz-transition-property: opacity, transform;
  -o-transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  transition-property: opacity, transform;
  position: relative;
  height: 21px;
  border-radius: 4px;
  margin-bottom: 2px;
  cursor: pointer; }
.menu-skin > ul > li > a {
  color: inherit;
  text-decoration: none;
  padding: 4px 11px 4px 11px;
  display: block; }
.menu-skin.active {
  visibility: visible;
  transition-delay: 0s;
  -moz-transition: visibility 0s linear 0s, opacity 0s linear;
  -o-transition: visibility 0s linear 0s, opacity 0s linear;
  -webkit-transition: visibility 0s linear 0s, opacity 0s linear;
  transition: visibility 0s linear 0s, opacity 0s linear;
  opacity: 1; }
.menu-skin.active > ul > li {
  -moz-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  opacity: 1;
  -moz-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -moz-transition-property: opacity, transform;
  -o-transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  transition-property: opacity, transform; }
.menu-skin.menu-share {
  right: 185px;
  width: 35px; }
.menu-skin.menu-share > ul > li > a {
  padding: 0; }
.menu-skin.menu-share > ul > li .picto {
  width: 35px;
  height: 21px;
  display: block;
  padding-top: 4px; }
.menu-skin.menu-share > ul > li .picto svg {
  width: auto;
  height: 100%;
  display: block;
  margin: auto; }
.menu-skin.menu-share > ul > li.facebook svg {
  height: 80%; }
.menu-skin.menu-share > ul > li.twitter svg {
  height: 80%; }
.menu-skin.menu-share > ul > li.googleplus svg {
  height: 80%; }

.menu-skin > ul > li:last-child {
  margin-bottom: 0; }

.right-part {
  display: block;
  position: absolute;
  right: 0px; }

[aria-label] {
  position: relative; }

[aria-label]:after {
  content: attr(aria-label);
  visibility: hidden;
  opacity: 0;
  outline: 0;
  position: absolute;
  bottom: 100%;
  font-family: Merriweather, "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-weight: 300;
  left: 5px;
  z-index: 3;
  pointer-events: none;
  padding: 4px 5px;
  line-height: 10px;
  white-space: nowrap;
  text-decoration: none;
  text-indent: 0;
  overflow: visible;
  font-size: 0.9em;
  font-weight: normal;
  text-shadow: 1px 0 1px #888;
  /*border-left: 6px solid #d37092;*/
  -webkit-border-radius: 1px;
  border-radius: 1px;
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  -moz-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -o-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  transition: opacity 0.3s cubic-bezier(0, 0, 0, 1.11);
  -moz-transition-property: opacity, visibility, transform;
  -o-transition-property: opacity, visibility, transform;
  -webkit-transition-property: opacity, visibility, transform;
  transition-property: opacity, visibility, transform;
  -moz-transform: translateY(5px);
  -o-transform: translateY(5px);
  -ms-transform: translateY(5px);
  -webkit-transform: translateY(5px);
  transform: translateY(5px); }

.label-right[aria-label]:after {
  left: auto;
  right: 1px; }

.label-center[aria-label]:after {
  left: 0;
  right: auto;
  -moz-transform: translateY(5px) translateX(-50%);
  -o-transform: translateY(5px) translateX(-50%);
  -ms-transform: translateY(5px) translateX(-50%);
  -webkit-transform: translateY(5px) translateX(-50%);
  transform: translateY(5px) translateX(-50%); }

[aria-label]:focus:after {
  visibility: visible;
  opacity: 1;
  -moz-transform: translateY(0px);
  -o-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -webkit-transform: translateY(0px);
  transform: translateY(0px); }

.label-center[aria-label]:focus:after {
  -moz-transform: translateY(0px) translateX(-50%);
  -o-transform: translateY(0px) translateX(-50%);
  -ms-transform: translateY(0px) translateX(-50%);
  -webkit-transform: translateY(0px) translateX(-50%);
  transform: translateY(0px) translateX(-50%); }

.active[aria-label]:hover:after, .active[aria-label]:focus:after {
  visibility: hidden;
  opacity: 0; }

.hidden {
  display: none; }
