/*!

Default styles for videojs-record vGENERATED_AT_BUILD

*/

/* Icons

--------------------------------------------------------------------------------

The control icons are from a custom font. Font icons allow for easy scaling and

coloring of icons.

*/


@font-face {

  font-family: videojs-record;

  src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAARUAAoAAAAABuwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAAA9AAAAD0AAABWOp9HUWNtYXAAAAE0AAAAOgAAAUriFxC2Z2x5ZgAAAXAAAADNAAABKHtQINdoZWFkAAACQAAAAC4AAAA2BTdHq2hoZWEAAAJwAAAAGgAAACQAYQA3aG10eAAAAowAAAAOAAAAGAEgAABsb2NhAAACnAAAAA4AAAAOARgAtG1heHAAAAKsAAAAHwAAACABEwAwbmFtZQAAAswAAAE2AAACXplCUC5wb3N0AAAEBAAAAE0AAABuZWTrn3icY2BkMGCcwMDKwMEgx6DIwMDABqXFGZgYeBiABCszA1YQkOaawuDwkfEjK4MBkMsCJhkYGEEEAMhBBW8AAAB4nGNgYGBmgGAZBkYGEHAB8hjBfBYGDSDNBqQZGZgYGD6y/v8PUvCREUTzM0DVAwEjG8OIBwBzoga8AAB4nD1P22rDMAyVUuFr8IpxPJeyMezilC3swUnWh9H//60qpa0uB0lIOhzoYLMJvuEIBeBSxiJL/sDwj2sd59gus5DD3K64yJAZ23AW1JMgchoJHad2tFeqElEi6oyUptvKPZEi4u/44JhAMUMWIba/pSZtrbd22sBbeO2d2He8Nw+lT+mUnvMz/MIbz1f5vsaQx/J4Y4yNSNppXZUxCqOVmju+2L14CQIc+Da0Ja9PfZumHxxlXVrw/V3SFzEK7ZPo3V0Nxyd6DzergxO0AAAAeJxjYGRgYADitLKumfH8Nl8ZuBkMgCIMl761aiDTDDoMekCSg4EJxAEAIUsJKgAAeJxjYGRgYDAAYhYwycCgw8DIgArYAA6OAJkAAHicYzBgYGDAggEOuAEhAAAAAAAAADIARgBSAG4AlAAAeJxjYGRgYGBjUGFgZgABJiDmAkIGhv9gPgMADLUBRAB4nH2QP2rDMBjFn/OvNIZSKO2UQVDoUmInGUPnBDpmyO7YsmNjW0ZWArlBD9IT9BAde5Ceoi+qlmSwBNLvve99n0AA7vEND+fl4c6e59XDDdU/90mPjgfkZ8dD+Jg7HtF/czzGK94d+3jAgRO8wS2dCT4c95j/dNyn/+V4QP5xPMQTfh2PMPHgeIytN3Hs48XTxzyRqminWsZKJxuZHcroyrxUW6nbXNViHswuC2tZSx0ZmYjdSbTHbGFMKlKtKrFStZFlqUSjVSFjE+yNaZZhmDo/iFWFI3IkkFAo0GIKTY6pNN0NOeNflIiou5JdtS1Z082pawj+f4BZZ8eaXNuuCIZ3wq4dTjxb9mVY0DVIqVNmFCrSyk4/p0tuRaextcLONXxzb7saLBFyp1f5wL5e/QF7nXD2AAB4nH3HMQqAMAxG4aRql/YqPVRIAzqUlN8geHsHwdE3fY8S/ZeJOPHCK2+cS7frUGvTMCpMHb2dIYjyjc8ydw9vsMBdX6sMgxA9BCcXRQAAAA==) format("woff"), url(data:application/x-font-ttf;charset=utf-8;base64,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) format("truetype");

  font-weight: normal;

  font-style: normal; }



.vjs-icon-device-perm {

  font-family: videojs-record;

  font-weight: normal;

  font-style: normal; }

.vjs-icon-device-perm:before {

  content: '\f101'; }




.vjs-icon-record-stop {

  font-family: videojs-record;

  font-weight: normal;

  font-style: normal;

  border:none !important;
  }

.vjs-icon-record-stop:before {

  content: '\f103'; }



.vjs-icon-photo-retry {

  font-family: videojs-record;

  font-weight: normal;

  font-style: normal; }

.vjs-icon-photo-retry:before {

  content: '\f104'; }



.vjs-icon-photo-camera {

  font-family: videojs-record;

  font-weight: normal;

  font-style: normal; }

.vjs-icon-photo-camera:before {

  content: '\f105';}



/* Area containing the recorder elements.

--------------------------------------------------------------------------------

*/

.vjs-record {

  display: inline-block;

  vertical-align: middle;

  background-repeat: no-repeat;

  background-position: 50% 50%;

  background-size: contain;

  cursor: default;

  margin: 0px;

  padding: 0px;

  position: absolute;

  top: 0px;

  right: 0px;

  bottom: 0px;

  left: 0px;

  height: 100%; }



/* Device Button (large centered button at startup)

--------------------------------------------------------------------------------

*/

.vjs-device-button.vjs-control, .vjs-.vjs-control {

  font-size: 3em;

  position: absolute;

  z-index: 2;

  /* Center it vertically */

  top: 50%;

  /* Center it horizontally */

  left: 50%;

  width: 4em;

  height: 3.0em;

  margin-top: -1.8000000000000001em;

  margin-left: -2.1em;

  display: flex;
  
  align-items: center;
  
  justify-content: center;

  cursor: pointer;

  opacity: 1;

  /* transition */

  -webkit-transition: all .4s;

  -moz-transition: all .4s;

  -o-transition: all .4s;

  transition: all .4s;

  text-align: center;

  vertical-align: middle;

  /* border-radius */

  -webkit-border-radius: .8em;

  -moz-border-radius: .8em;

  border-radius: .8em;

  /* Need a slightly gray bg so it can be seen on black backgrounds */

  /* background-color-with-alpha */

  background-color: #07141e;

  background-color: rgba(7, 20, 30, 0.7);

  /* box-shadow */

  -webkit-box-shadow: 0 0 1em rgba(255, 255, 255, 0.25);

  -moz-box-shadow: 0 0 1em rgba(255, 255, 255, 0.25);

  box-shadow: 0 0 1em rgba(255, 255, 255, 0.25); }



.vjs-error .vjs-device-button {

  display: none; }



/* Record Toggle (start/stop recording button in controlbar)

--------------------------------------------------------------------------------

*/

.vjs-record-button.vjs-control {

  cursor: pointer; }



.vjs-error .vjs-record-button {

  display: none; }


.vjs-record-button.vjs-control.vjs-icon-record-start:before {
  font-size: 1.4em;
  line-height: 2.2em; }



/* Camera Toggle (snapshot try/retry)

--------------------------------------------------------------------------------

*/

.vjs-camera-button.vjs-control {

  cursor: pointer; }



.vjs-error .vjs-camera-button {

  display: none; }



/* CUSTOM : Countdown Indicator

--------------------------------------------------------------------------------

*/

.video-js .vjs-control.vjs-countdown-indicator {

  content: "";

  width: 4em;

  height: 4em;

  background-color: #31B7C0;

  border-radius: 50%;

  left: 5ex;

  top: 5ex;

  position: absolute;

  opacity: 1;

  transform: rotateX(0) scale(1.3);

  transition: all .5s, transform .2s .1s;

  -moz-animation-name: example;

  -moz-animation-duration: 2s;

  -moz-animation-iteration-count:infinite;

  -webkit-animation-name: example;

  -webkit-animation-duration: 2s;

  -webkit-animation-iteration-count:infinite; }



/* .video-js .vjs-control.vjs-countdown-indicator {

 content: "3...2...1...";

   left: 5ex;

 top: 5ex;

 position: absolute;

 opacity: 1;

 font: bold 2em monospace;

 color: white;

 width: 12ch;

 overflow: hidden;

 -webkit-animation: typing 3s steps(12, end);

 -moz-animation: typing 3s steps(12, end);}

*/

@-webkit-keyframes typing { from { width: 0; } }

@-moz-keyframes typing { from { width: 0; } }



/* CUSTOM Recording Indicator (dot in top-right corner visible when recording)

--------------------------------------------------------------------------------

*/

.vjs-record {

  overflow: hidden; }



.video-js .vjs-control.vjs-record-indicator {

  content: "";

  width: 4em;

  height: 4em;

  background-color: #EB0F69;

  border-radius: 50%;

  left: 5ex;

  top: 5ex;

  position: absolute;

  opacity: 1;

  transform: rotateX(0) scale(1.3);

  transition: all .5s, transform .2s .1s;

  -moz-animation-name: example;

  -moz-animation-duration: 2s;

  -moz-animation-iteration-count:infinite;

  -webkit-animation-name: example;

  -webkit-animation-duration: 2s;

  -webkit-animation-iteration-count:infinite; }



@-moz-keyframes example {

  from {opacity: 0;}

}



@-webkit-keyframes example {

  from {opacity: 0;}

}


.vjs-icon-record-start:before {
  font-family: VideoJS;
  content: '\f111' !important;
}