diff --git a/src/styles/plugins/_videoplayer.sass b/src/styles/plugins/_videoplayer.sass
index 319a3420..d1a25058 100644
--- a/src/styles/plugins/_videoplayer.sass
+++ b/src/styles/plugins/_videoplayer.sass
@@ -1,8 +1,4 @@
-$flowplayer-skin-main: $color-background-nav
-$flowplayer-skin-highlight: $color-primary
-$flowplayer-skin-background: $color-background-nav
-$flowplayer-controls-height: 30px
-
+$videoplayer-controls-color: white
 $videoplayer-background-color: $color-background-nav
 
 .video-js
@@ -209,35 +205,35 @@ $videoplayer-background-color: $color-background-nav
 
 
 .vjs-loop-button
+	&:hover
+		&:before
+			opacity: 1
+
 	&:before
 		font-family: 'pillar-font'
 		content: '\e864'
-		opacity: .7
+		opacity: .4
+		font-weight: normal
 
 .vjs-control-active
-	text-shadow: 0 0 1em #FFF
+	box-shadow: inset 0 -3px $videoplayer-controls-color
 
 	&:before
 		opacity: 1
 
-
 .video-js
-	.vjs-play-progress, .vjs-time-tooltip
-		font-family: $font-body
-		position: absolute
-		top: -30px
-
 	.vjs-mouse-display, .vjs-volume-level
 		font-family: VideoJS
 		font-weight: normal
 		font-style: normal
 
-.vjs-icon-circle:before
-	content: '\f111'
-
 .video-js
 	.vjs-mouse-display:before, .vjs-play-progress:before, .vjs-volume-level:before
-		content: '\f111'
+		background-color: $videoplayer-controls-color
+		border-radius: 50%
+		content: ''
+		height: 10px
+		width: 10px
 
 .vjs-icon-circle-outline
 	font-family: VideoJS
@@ -253,12 +249,6 @@ $videoplayer-background-color: $color-background-nav
 	&:before
 		content: '\f113'
 
-.vjs-icon-hd
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f114'
 
 .vjs-icon-cancel, .video-js .vjs-control.vjs-close-button
 	font-family: VideoJS
@@ -275,47 +265,6 @@ $videoplayer-background-color: $color-background-nav
 	&:before
 		content: '\f116'
 
-.vjs-icon-facebook
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f117'
-
-.vjs-icon-gplus
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f118'
-
-.vjs-icon-linkedin
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f119'
-
-.vjs-icon-twitter
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f11a'
-
-.vjs-icon-tumblr
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f11b'
-
-.vjs-icon-pinterest
-	font-family: VideoJS
-	font-weight: normal
-	font-style: normal
-	&:before
-		content: '\f11c'
 
 .vjs-icon-audio-description
 	font-family: VideoJS
@@ -328,7 +277,7 @@ $videoplayer-background-color: $color-background-nav
 	display: block
 	vertical-align: top
 	box-sizing: border-box
-	color: white
+	color: $videoplayer-controls-color
 	background-color: black
 	position: relative
 	padding: 0
@@ -355,10 +304,8 @@ $videoplayer-background-color: $color-background-nav
 		font-size: inherit
 		line-height: inherit
 		list-style-position: outside
-		margin-left: 0
-		margin-right: 0
-		margin-top: 0
-		margin-bottom: 0
+		margin: 0
+
 	&.vjs-fluid, &.vjs-16-9, &.vjs-4-3
 		width: 100%
 		max-width: 100%
@@ -416,7 +363,7 @@ body.vjs-full-window
 
 .vjs-no-js
 	padding: 20px
-	color: white
+	color: $videoplayer-controls-color
 	background-color: black
 	font-size: 18px
 	font-family: Arial, Helvetica, sans-serif
@@ -440,7 +387,6 @@ body.vjs-full-window
 	cursor: pointer
 	opacity: 1
 	background-color: $videoplayer-background-color
-	background-color: rgba($videoplayer-background-color, .7)
 	-webkit-border-radius: 0.3em
 	-moz-border-radius: 0.3em
 	border-radius: 0.3em
@@ -457,7 +403,7 @@ body.vjs-full-window
 .video-js
 	&:hover .vjs-big-play-button, .vjs-big-play-button:focus
 		outline: 0
-		border-color: white
+		border-color: $videoplayer-controls-color
 		background-color: #73859f
 		background-color: rgba(115, 133, 159, 0.5)
 		-webkit-transition: all 0s
@@ -516,10 +462,10 @@ body.vjs-full-window
 		background-color: #73859f
 		background-color: rgba(115, 133, 159, 0.5)
 	&.vjs-selected
-		background-color: white
+		background-color: $videoplayer-controls-color
 		color: $videoplayer-background-color
 		&:focus, &:hover
-			background-color: white
+			background-color: $videoplayer-controls-color
 			color: $videoplayer-background-color
 	&.vjs-menu-title
 		text-align: center
@@ -539,10 +485,9 @@ body.vjs-full-window
 	left: -3em
 	height: 0em
 	margin-bottom: 1.5em
-	border-top-color: rgba($videoplayer-background-color, .7)
+	border-top-color: $videoplayer-background-color
 	.vjs-menu-content
 		background-color: $videoplayer-background-color
-		background-color: rgba($videoplayer-background-color, .7)
 		position: absolute
 		width: 100%
 		bottom: 1.5em
@@ -603,15 +548,20 @@ body.vjs-full-window
 	margin: 0
 	overflow: hidden
 
-.video-js .vjs-control-bar
-	display: none
-	width: 100%
-	position: absolute
-	bottom: 0
-	left: 0
-	right: 0
-	height: 3.0em
-	background-color: rgba($videoplayer-background-color, .7)
+.video-js
+	.vjs-control-bar
+		display: none
+		width: 100%
+		position: absolute
+		bottom: 0
+		left: 0
+		right: 0
+		height: 3.0em
+		background-color: rgba($videoplayer-background-color, .6)
+		transition: background-color 150ms ease-in-out
+
+		&:hover
+			background-color: $videoplayer-background-color
 
 .vjs-has-started
 	.vjs-control-bar
@@ -649,25 +599,22 @@ body.vjs-full-window
 
 .video-js
 	.vjs-control
+		font-weight: bold
+		flex: none
+		height: 100%
+		margin: 0
 		outline: none
+		padding: 0
 		position: relative
 		text-align: center
-		margin: 0
-		padding: 0
-		height: 100%
 		width: 4em
-		-webkit-box-flex: none
-		-moz-box-flex: none
-		-webkit-flex: none
-		-ms-flex: none
-		flex: none
 
 		&:before
 			font-size: 1.8em
 			line-height: 1.67
 
 		&:focus:before, &:hover:before, &:focus
-			text-shadow: 0em 0em 1em white
+			box-shadow: inset 0 -3px $videoplayer-controls-color
 
 	.vjs-control-text
 		border: 0
@@ -744,14 +691,13 @@ body.vjs-full-window
 		display: none
 
 	.vjs-play-progress
-		background-color: white
+		background-color: $videoplayer-controls-color
 
 		&:before
 			position: absolute
 			top: -0.333333333333333em
 			right: -0.5em
 
-	.vjs-play-progress
 		&:after
 			display: none
 			position: absolute
@@ -760,22 +706,25 @@ body.vjs-full-window
 			color: black
 			content: attr(data-current-time)
 			padding: 6px 8px 8px 8px
-			background-color: white
-			background-color: rgba(255, 255, 255, 0.8)
-			-webkit-border-radius: 0.3em
-			-moz-border-radius: 0.3em
-			border-radius: 0.3em
+			background-color: $videoplayer-controls-color
 
 		&:before, &:after
 			z-index: 1
 
+		.vjs-time-tooltip
+			background-color: $videoplayer-background-color
+			color: $videoplayer-controls-color
+			z-index: 1
+
+			&:after
+				border-top-color: $videoplayer-background-color !important
+
 	.vjs-load-progress
-		background: #bfc7d3
-		background: rgba(115, 133, 159, 0.5)
+		background-color: darken($videoplayer-background-color, 10%)
 
 		div
-			background: white
-			background: rgba(115, 133, 159, 0.75)
+			background: rgba($videoplayer-controls-color, .33)
+
 	&.vjs-no-flex .vjs-progress-control
 		width: auto
 
@@ -783,20 +732,29 @@ body.vjs-full-window
 	.vjs-progress-control .vjs-mouse-display
 		display: none
 		position: absolute
-		width: 2px
-		height: 10px
-		border: thick solid transparent
-		border-top-color: white
-		bottom: 0
-		z-index: 1
 
-		.vjs-time-tooltip
-			background-color: white
-			color: $color-background-nav
-			border-radius: 3px
-			font-size: 1.3em
-			padding: 3px 8px
-			top: -24px
+.vjs-time-tooltip
+	background-color: $videoplayer-controls-color
+	border-radius: 3px
+	color: $videoplayer-background-color
+	font-family: $font-body
+	font-size: 1.2em
+	font-weight: bold
+	padding: 5px 8px
+	position: absolute
+	top: -40px
+	z-index: 2
+
+	&:after
+		border: thick solid transparent
+		border-top-color: $videoplayer-controls-color
+		bottom: -10px
+		content: ' '
+		height: 10px
+		left: 50%
+		position: absolute
+		transform: translateX(-50%)
+		width: 2px
 
 .vjs-live .vjs-progress-control
 	display: none
@@ -835,7 +793,7 @@ body.vjs-full-window
 			&:after
 				display: none
 	.vjs-progress-control .vjs-mouse-display:after
-		color: white
+		color: $videoplayer-controls-color
 		background-color: black
 		background-color: rgba(0, 0, 0, 0.8)
 	.vjs-slider
@@ -844,13 +802,8 @@ body.vjs-full-window
 		cursor: pointer
 		padding: 0
 		margin: 0 0.45em 0 0.45em
-		background-color: #73859f
-		background-color: rgba(115, 133, 159, 0.5)
-		&:focus
-			text-shadow: 0em 0em 1em white
-			-webkit-box-shadow: 0 0 1em white
-			-moz-box-shadow: 0 0 1em white
-			box-shadow: 0 0 1em white
+		background-color: rgba(darken($videoplayer-background-color, 10%), .5)
+
 	.vjs-mute-control, .vjs-volume-menu-button
 		cursor: pointer
 		-webkit-box-flex: none
@@ -875,10 +828,6 @@ body.vjs-full-window
 		margin: 1.35em 0.45em
 
 .vjs-volume-bar
-	&.vjs-slider-horizontal
-		width: 5em
-		height: 0.3em
-
 	&.vjs-slider-vertical
 		width: 0.3em
 		height: 5em
@@ -896,7 +845,7 @@ body.vjs-full-window
 	position: absolute
 	bottom: 0
 	left: 0
-	background-color: white
+	background-color: $videoplayer-controls-color
 	&:before
 		position: absolute
 		font-size: 0.9em
@@ -907,11 +856,6 @@ body.vjs-full-window
 		top: -0.3em
 		right: -0.5em
 
-.vjs-volume-bar
-
-	&.vjs-slider-horizontal .vjs-volume-level
-		width: 100%
-
 .vjs-menu-button-popup
 	&.vjs-volume-menu-button .vjs-menu
 		display: block
@@ -1046,7 +990,7 @@ body.vjs-full-window
 		background-color: rgba(0, 0, 0, 0.5)
 
 .vjs-subtitles
-	color: white
+	color: $videoplayer-controls-color
 
 .vjs-captions
 	color: #fc6
@@ -1095,7 +1039,7 @@ video::-webkit-media-text-track-display
 		font-size: 1.4em
 		text-align: center
 	&:before
-		color: white
+		color: $videoplayer-controls-color
 		content: 'X'
 		font-family: Arial, Helvetica, sans-serif
 		font-size: 4em
@@ -1139,7 +1083,7 @@ video::-webkit-media-text-track-display
 		opacity: 1
 		border: inherit
 		border-color: transparent
-		border-top-color: white
+		border-top-color: $videoplayer-controls-color
 
 .vjs-seeking .vjs-loading-spinner
 	&:before, &:after
@@ -1152,10 +1096,10 @@ video::-webkit-media-text-track-display
 		animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, vjs-spinner-fade 1.1s linear infinite
 
 .vjs-seeking .vjs-loading-spinner:before, .vjs-waiting .vjs-loading-spinner:before
-	border-top-color: white
+	border-top-color: $videoplayer-controls-color
 
 .vjs-seeking .vjs-loading-spinner:after, .vjs-waiting .vjs-loading-spinner:after
-	border-top-color: white
+	border-top-color: $videoplayer-controls-color
 	-webkit-animation-delay: 0.44s
 	animation-delay: 0.44s
 
@@ -1177,7 +1121,7 @@ video::-webkit-media-text-track-display
 		border-top-color: #73859f
 
 	35%
-		border-top-color: white
+		border-top-color: $videoplayer-controls-color
 
 	60%
 		border-top-color: #73859f
@@ -1194,7 +1138,7 @@ video::-webkit-media-text-track-display
 		border-top-color: #73859f
 
 	35%
-		border-top-color: white
+		border-top-color: $videoplayer-controls-color
 
 	60%
 		border-top-color: #73859f
@@ -1230,7 +1174,7 @@ video::-webkit-media-text-track-display
 	top: 1em
 	background-color: $videoplayer-background-color
 	background-color: rgba(43, 51, 63, 0.75)
-	color: white
+	color: $videoplayer-controls-color
 	margin: 0 auto
 	padding: 0.5em
 	height: 15em
@@ -1296,7 +1240,7 @@ video::-webkit-media-text-track-display
 		height: 8em
 		bottom: 8em
 		background-color: #2B333F
-		background-color: rgba(43, 51, 63, 0.7)
+		background-color: $videoplayer-background-color
 
 	.vjs-volume-panel
 		display: -webkit-box