message: fix(video-player): fixed focus state
  ### Related Ticket(s)
  ### Description
  I've updated the focus state for the video player so it matches the designs specs.
  New:
  <img width="628" alt="image" src="https://user-images.githubusercontent.com/30945011/114781167-b6834c00-9d4e-11eb-9186-cd08757be40e.png">
  Before:
  ![](https://user-images.githubusercontent.com/48327647/114373480-48425c00-9b8b-11eb-965c-c21fb9d1a14d.png)
diff: @@ -18,6 +18,37 @@ $aspect-ratios: ((16, 9), (9, 16), (2, 1), (1, 2), (4, 3), (3, 4), (1, 1));
  width: 100%;
  height: 100%;
  }
  +
  + &:focus {
  + outline: none;
  + .#{$prefix}--video-player__video-container {
  + &::before {
  + content: ' ';
  + position: absolute;
  + top: rem(2px);
  + left: rem(2px);
  + right: rem(2px);
  + bottom: rem(2px);
  + z-index: 1;
  + border: 1px solid $inverse-focus-ui;
  + outline: 2px solid $focus;
  + }
  + }
  + }
  + }
  +
  + .#{$prefix}--video-player .#{$prefix}--video-player__image-overlay:focus {
  + &::before {
  + content: ' ';
  + position: absolute;
  + top: rem(2px);
  + left: rem(2px);
  + right: rem(2px);
  + bottom: rem(2px);
  + z-index: 1;
  + border: 1px solid $inverse-focus-ui;
  + outline: 2px solid $focus;
  + }
  }
  :host(#{$dds-prefix}-video-player) #{$dds-prefix}-image,
  @@ -53,6 +84,10 @@ $aspect-ratios: ((16, 9), (9, 16), (2, 1), (1, 2), (4, 3), (3, 4), (1, 1));
  display: inline-block;
  margin-top: $spacing-05;
  + &:focus {
  + outline: none;
  + }
  +
  ::slotted(.#{$prefix}--video-player__video),
  .#{$prefix}--video-player__video {
  position: absolute;
  