diff --git a/app/recordings/recordings.php b/app/recordings/recordings.php
index 1f79be9528..0b54210e39 100644
--- a/app/recordings/recordings.php
+++ b/app/recordings/recordings.php
@@ -307,7 +307,7 @@ require_once "resources/check_auth.php";
 		foreach($result as $row) {
 			//playback progress bar
 			if (permission_exists('recording_play')) {
-				echo "<tr id='recording_progress_bar_".$row['recording_uuid']."' style='display: none;'><td colspan='".$colspan."'><span class='playback_progress_bar' id='recording_progress_".$row['recording_uuid']."'></span></td></tr>\n";
+				echo "<tr id='recording_progress_bar_".$row['recording_uuid']."' style='display: none;'><td class='".$row_style[$c]."' style='border: none; padding: 0;' colspan='".$colspan."'><span class='playback_progress_bar' id='recording_progress_".$row['recording_uuid']."'></span></td></tr>\n";
 			}
 			$tr_link = (permission_exists('recording_edit')) ? "href='recording_edit.php?id=".$row['recording_uuid']."'" : null;
 			echo "<tr ".$tr_link.">\n";
diff --git a/app/xml_cdr/xml_cdr.php b/app/xml_cdr/xml_cdr.php
index e47a3dcc0d..2fe1c06aeb 100644
--- a/app/xml_cdr/xml_cdr.php
+++ b/app/xml_cdr/xml_cdr.php
@@ -461,7 +461,7 @@ else {
 
 			//recording playback
 				if (permission_exists('recording_play') && $recording_file_path != '') {
-					echo "<tr id='recording_progress_bar_".$row['uuid']."' style='display: none;'><td colspan='".((if_group("admin") || if_group("superadmin") || if_group("cdr")) ? ($col_count - 1) : $col_count)."'><span class='playback_progress_bar' id='recording_progress_".$row['uuid']."'></span></td></tr>\n";
+					echo "<tr id='recording_progress_bar_".$row['uuid']."' style='display: none;'><td class='".$row_style[$c]."' style='border: none; padding: 0;' colspan='".((if_group("admin") || if_group("superadmin") || if_group("cdr")) ? ($col_count - 1) : $col_count)."'><span class='playback_progress_bar' id='recording_progress_".$row['uuid']."'></span></td></tr>\n";
 				}
 
 				if (if_group("admin") || if_group("superadmin") || if_group("cdr")) {
diff --git a/themes/default/template.php b/themes/default/template.php
index 9735ddcb2d..2ef8a759b0 100644
--- a/themes/default/template.php
+++ b/themes/default/template.php
@@ -1109,7 +1109,7 @@
 	span.playback_progress_bar {
 		background-color: #c43e42;
 		height: 1px;
-		display: inline-block;
+		display: block;
 		}
 
 /* USER DASHBOARD: BEGIN *****************************************************/
@@ -1413,47 +1413,6 @@
 			$("input.txt, textarea.txt, .formfld").autosizeInput();
 
 
-		//audio playback functions
-			img_play = new Image();	img_play.src = "<?php echo PROJECT_PATH; ?>/themes/default/images/icon_play.png";
-			img_pause = new Image(); img_pause.src = "<?php echo PROJECT_PATH; ?>/themes/default/images/icon_pause.png";
-
-			var recording_audio;
-
-			function recording_play(recording_id) {
-				if (document.getElementById('recording_progress_bar_'+recording_id)) {
-					document.getElementById('recording_progress_bar_'+recording_id).style.display='';
-				}
-				recording_audio = document.getElementById('recording_audio_'+recording_id)
-
-				if (recording_audio.paused) {
-					recording_audio.volume = 1;
-					recording_audio.play();
-					document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo str_replace("class='list_control_icon'", "class='list_control_icon' style='opacity: 1;'", $v_link_label_pause); ?>";
-				}
-				else {
-					recording_audio.pause();
-					document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo $v_link_label_play; ?>";
-				}
-			}
-
-			function recording_reset(recording_id) {
-				if (document.getElementById('recording_progress_bar_'+recording_id)) {
-					document.getElementById('recording_progress_bar_'+recording_id).style.display='none';
-				}
-				document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo $v_link_label_play; ?>";
-			}
-
-			function update_progress(recording_id) {
-				recording_audio = document.getElementById('recording_audio_'+recording_id);
-				var recording_progress = document.getElementById('recording_progress_'+recording_id);
-				var value = 0;
-				if (recording_audio.currentTime > 0) {
-					value = (100 / recording_audio.duration) * recording_audio.currentTime;
-				}
-				recording_progress.style.width = value + "%";
-			}
-
-
 		//apply bootstrap-datetime plugin
 			$(function() {
 				$('.datetimepicker').datetimepicker({
@@ -1483,6 +1442,46 @@
 
 	});
 
+	//audio playback functions
+		img_play = new Image();	img_play.src = "<?php echo PROJECT_PATH; ?>/themes/default/images/icon_play.png";
+		img_pause = new Image(); img_pause.src = "<?php echo PROJECT_PATH; ?>/themes/default/images/icon_pause.png";
+
+		var recording_audio;
+
+		function recording_play(recording_id) {
+			if (document.getElementById('recording_progress_bar_'+recording_id)) {
+				document.getElementById('recording_progress_bar_'+recording_id).style.display='';
+			}
+			recording_audio = document.getElementById('recording_audio_'+recording_id)
+
+			if (recording_audio.paused) {
+				recording_audio.volume = 1;
+				recording_audio.play();
+				document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo str_replace("class='list_control_icon'", "class='list_control_icon' style='opacity: 1;'", $v_link_label_pause); ?>";
+			}
+			else {
+				recording_audio.pause();
+				document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo $v_link_label_play; ?>";
+			}
+		}
+
+		function recording_reset(recording_id) {
+			if (document.getElementById('recording_progress_bar_'+recording_id)) {
+				document.getElementById('recording_progress_bar_'+recording_id).style.display='none';
+			}
+			document.getElementById('recording_button_'+recording_id).innerHTML = "<?php echo $v_link_label_play; ?>";
+		}
+
+		function update_progress(recording_id) {
+			recording_audio = document.getElementById('recording_audio_'+recording_id);
+			var recording_progress = document.getElementById('recording_progress_'+recording_id);
+			var value = 0;
+			if (recording_audio.currentTime > 0) {
+				value = (100 / recording_audio.duration) * recording_audio.currentTime;
+			}
+			recording_progress.style.width = value + "%";
+		}
+
 </script>
 
 <!--{head}-->