Ever have a site where you want to change the size of something, or apply other custom CSS? A bar-study class I’m taking has the player for videos very small, and I want it to span the whole page. So I came up with the following:

  1. Install the Chome Extension Styler Beta.
  2. Pin the Styler Beta extension to your toolbar:

3. Click on the S icon for Styler Beta in the toolbar.

4. Past the following code:
:root {
  --width-player: 870px;
  --height-player: 600px;
}
div#container, div#divContent div {
    width: 100% !important;
}
.video-container-modal, div#kaplan-player, div#slides, div#dvInteractiveVideoPlayer, div#quizQuestion, div#divQuestion {
	width: var(--width-player) !important;
	height: var(--height-player) !important;
}
#accordion, div#playlist, .seek-points ul, .seek-points {
	height: var(--height-player) !important;
}

5. you can adjust the width and height by changing the second and 3rd lines:

--width-player and --height-player

For me, I use a 16″ MacBook Pro. so 850 x 600 works. You can lower these values depending on your screen size. The code will load automatically every time you visit the player.