diff --git a/admin/survey/SurveyAdminSettings.php b/admin/survey/SurveyAdminSettings.php
index f74303306..2114bd23f 100644
--- a/admin/survey/SurveyAdminSettings.php
+++ b/admin/survey/SurveyAdminSettings.php
@@ -9674,6 +9674,13 @@ class SurveyAdminSettings {
 			echo '</div>';
 		} 
 		elseif ($_GET['a'] == A_TELEPHONE){
+
+			echo '<div class="phone_settings_top" id="globalSettingsInner">';
+			if(isset($modules['phone'])){
+				$ST = new SurveyTelephone($this->anketa);
+				$ST->action($_GET['m']);
+			}
+			echo '</div>';
 		
 			// Ce je anketar ne vidi teh nastavitev
 			$isAnketar = Common::isUserAnketar($this->anketa, $global_user_id);
@@ -9686,9 +9693,13 @@ class SurveyAdminSettings {
 					// Ce se nimamo nobene stevilke v bazi, pustimo da se lahko ugasne
 					if($rowT['cnt'] == 0){
 						echo '<fieldset><legend>'.$lang['srv_vrsta_survey_type_7'].' '.Help::display('srv_telephone_help').'</legend>';
-						echo '<label class="strong'.$css_disabled.'"><input type="checkbox" id="advanced_module_phone" name="phone" value="1" '. (isset($modules['phone']) ? ' checked="checked"' : '').$disabled.' onChange="toggleAdvancedModule(\'phone\');" />';
-						echo $lang['srv_vrsta_survey_type_7'] . '</label>';
-						echo '<br/><i class="'.$css_disabled.'">'.$lang['srv_vrsta_survey_note_7_3'].'</i>';
+
+						echo '<div class="setting_holder">';
+						echo '<input type="checkbox" id="advanced_module_phone" name="phone" value="1" '. (isset($modules['phone']) ? ' checked="checked"' : '').$disabled.' onChange="toggleAdvancedModule(\'phone\');" />';
+						echo '<label for="advanced_module_phone" class="'.$css_disabled.'">'.$lang['srv_vrsta_survey_type_7'] . '</label>';
+						echo '</div>';
+
+						echo '<p class="top16 '.$css_disabled.'">'.$lang['srv_vrsta_survey_note_7_3'].'</p>';
 						echo '</fieldset>';
 					}
 					else{
@@ -9698,21 +9709,15 @@ class SurveyAdminSettings {
 				}
 				else{					
 					echo '<fieldset><legend>'.$lang['srv_vrsta_survey_type_7'].' '.Help::display('srv_telephone_help').'</legend>';
-					echo '<label class="strong'.$css_disabled.'"><input type="checkbox" id="advanced_module_phone" name="phone" value="1" '. (isset($modules['phone']) ? ' checked="checked"' : '').$disabled.' onChange="toggleAdvancedModule(\'phone\');" />';
-					echo $lang['srv_vrsta_survey_type_7'] . '</label>';
-					echo '<br/><i class="'.$css_disabled.'">'.$lang['srv_vrsta_survey_note_7_3'].'</i>';
+					echo '<div class="setting_holder">';
+					echo '<input type="checkbox" id="advanced_module_phone" name="phone" value="1" '. (isset($modules['phone']) ? ' checked="checked"' : '').$disabled.' onChange="toggleAdvancedModule(\'phone\');" />';
+					echo '<label for="advanced_module_phone" class="'.$css_disabled.'">'.$lang['srv_vrsta_survey_type_7'] . '</label>';
+					echo '</div>';
+
+					echo '<p class="top16 '.$css_disabled.'">'.$lang['srv_vrsta_survey_note_7_3'].'</p>';
 					echo '</fieldset>';
 				}
-				
-				echo '<br />';
 			}
-			
-			echo '<div id="globalSettingsInner">';
-			if(isset($modules['phone'])){
-				$ST = new SurveyTelephone($this->anketa);
-				$ST->action($_GET['m']);
-			}
-			echo '</div>';
 		}
 		elseif ($_GET['a'] == A_CHAT){
 			global $site_path;
diff --git a/admin/survey/classes/class.SurveyTelephone.php b/admin/survey/classes/class.SurveyTelephone.php
index 5ffc00410..2610dae24 100644
--- a/admin/survey/classes/class.SurveyTelephone.php
+++ b/admin/survey/classes/class.SurveyTelephone.php
@@ -445,7 +445,7 @@ class SurveyTelephone {
 			echo '</fieldset>';	
 		
 		} else {
-			echo '<p>'.$lang['srv_telephone_no_respondents'].'</p>';
+			echo '<p class="bottom32">'.$lang['srv_telephone_no_respondents'].'</p>';
 		}
 	}
 
@@ -786,55 +786,33 @@ class SurveyTelephone {
 	
 				$spaceChar = '&nbsp;';
 				
-				echo '<div class="phn_step_nav'.$active_step[1].'">';
-				echo '<div class="phn_step">';
-				echo '<a href="'.$this->addUrl('dashboard').'">';
-				echo '<span class="label">'.$lang['srv_telephone_navi_dashboard'].'</span>';
-				echo '</a>';
-				echo '</div>';
-				echo '</div>';
-				
 				if ($this->telephoneSprId) {
 					#space
-					echo '<div class="phn_space">&nbsp;</div>';
-					$class_yellow = ' yellow';
-					echo '<div class="phn_step_nav yellow">';
+					echo '<div class="phn_step_nav">';
 					
 					#navigacija
-					echo '<div class="phn_step'.$class_yellow.$active_step[2].'">';
-					echo '<a href="'.$this->addUrl('recipients_lists').'">';
-					echo '<span class="circle">1</span>';
-					echo '<span class="label">'.$lang['srv_telephone_navi_add'].'</span>';
-					echo '</a>';
-					echo '</div>';
-				
-					echo '<div class="phn_step_space'.$class_yellow.'">'.$spaceChar.'</div>';
-					
-					echo '<div class="phn_step'.$class_yellow.$active_step[3].'">';
-					echo '<a href="'.$this->addUrl('view_recipients').'">';
-					echo '<span class="circle">2</span>';
-					echo '<span class="label">'.$lang['srv_telephone_navi_view'].'</span>';
-					if ($disabled == false) {
-						echo '</a>';
-					}
+					echo '<div class="phn_step menu'.$active_step[2].'" onClick="window.location.href=\''.$this->addUrl('recipients_lists').'\';return false;">';
+					echo '<div class="square">1</div>';
+					echo '<div class="label">'.$lang['srv_telephone_navi_add'].'</div>';
 					echo '</div>';
 					
-					echo '<div class="phn_step_space'.$class_yellow.$css_disabled.'">'.$spaceChar.'</div>';
-					
-					echo '<div class="phn_step'.$class_yellow.$css_disabled.$active_step[4].'">';
-					echo '<a href="'.$this->addUrl('start_call').'">';
-					echo '<span class="circle">3</span>';
-					echo '<span class="label" >'.$lang['srv_telephone_navi_start_call'].'</span>';
-					echo '</a>';
+					echo '<div class="phn_step menu'.$active_step[3].'" '. ($disabled == false ? 'onClick="window.location.href=\''.$this->addUrl('view_recipients').'\';return false;"' : '' ).'>';
+					echo '<div class="square">2</div>';
+					echo '<div class="label">'.$lang['srv_telephone_navi_view'].'</div>';
 					echo '</div>';
+					
+					echo '<div class="phn_step menu'.$css_disabled.$active_step[4].'" onClick="window.location.href=\''.$this->addUrl('start_call').'\';return false;">';
+					echo '<div class="square">3</div>';
+					echo '<div class="label" >'.$lang['srv_telephone_navi_start_call'].'</div>';
+					echo '</div>';
+					
 					echo '</div>';
 					
 					#space
-					echo '<div class="phn_space">&nbsp;</div>';
 					
 					// Cakalni seznam
-					echo '<div class="phn_step_nav'.$active_step[6].'" style="margin-right:20px; width:90px;">';
-					echo '<div class="phn_step">';
+					echo '<div class="phn_step_nav'.$active_step[6].'">';
+					echo '<div class="phn_step settings">';
 					echo '<a href="'.$this->addUrl('calling_list').'">';
 					echo '<span class="label">'.$lang['srv_telephone_navi_waiting_list'].'</span>';
 					echo '</a>';
@@ -844,15 +822,20 @@ class SurveyTelephone {
 
 				// Nastavitve
 				echo '<div class="phn_step_nav'.$active_step[5].'">';
-				echo '<div class="phn_step">';
+				echo '<div class="phn_step settings">';
 				echo '<a href="'.$this->addUrl('settings').'">';
 				echo '<span class="label">'.$lang['srv_telephone_navi_settings'].'</span>';
 				echo '</a>';
 				echo '</div>';
 				echo '</div>';
 				
-				echo '<br class="clr" />';
-				echo '<br class="clr" />';
+				echo '<div class="phn_step_nav'.$active_step[1].'">';
+				echo '<div class="phn_step settings">';
+				echo '<a href="'.$this->addUrl('dashboard').'">';
+				echo '<span class="label">'.$lang['srv_telephone_navi_dashboard'].'</span>';
+				echo '</a>';
+				echo '</div>';
+				echo '</div>';
 			}
 		}
 	}
diff --git a/lang/1.php b/lang/1.php
index d4db56d4c..ed5f0d5b1 100644
--- a/lang/1.php
+++ b/lang/1.php
@@ -6418,7 +6418,7 @@ $lang = array (
 	'srv_telephone_call_comment'				=>	'Morebitni komentar anketarja na to številko:',
 	'srv_telephone_settings_access_list'		=>	'Seznam anketarjev in urednikov z dostopom:',
 	'srv_telephone_settings_access_list_link'	=>	' (podrobno lahko urednike urejate <a href="%s">tukaj</a>)',
-	'srv_telephone_no_respondents'				=>	'V bazi nimate respondentov z telefonskimi številkami.',
+	'srv_telephone_no_respondents'				=>	'V bazi nimate respondentov s telefonskimi številkami.',
 	'srv_telephone_dashboard_legend'			=>	'Sumarni pregled telefonske ankete:',
 	'srv_telephone_dashboard_legend_finished'	=>	'Sumarni pregled zaključenih anket:',
 	'srv_telephone_dashboard_legend_anketar'	=>	'Pregled stanja klicev po anketarjih:',
diff --git a/public/css/admin_new.css b/public/css/admin_new.css
index 6ccf5d12f..93cf4d38b 100644
--- a/public/css/admin_new.css
+++ b/public/css/admin_new.css
@@ -19253,6 +19253,72 @@ dl.arch_email dd {
   text-align: center;
 }
 
+div.page_telephone div.phone_settings_top div#inv_top_navi {
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 32px;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav {
+  display: flex;
+  flex-direction: row;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step {
+  display: flex;
+  flex-direction: row;
+  vertical-align: middle;
+  cursor: pointer;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu {
+  color: #C4C4C4;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu div.label:after {
+  content: "";
+  display: inline-block;
+  height: 0.5em;
+  vertical-align: bottom;
+  width: 32px;
+  margin-right: -100%;
+  margin-left: 3px;
+  border-top: 1px solid #C4C4C4;
+  cursor: default;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu:not(:first-of-type) {
+  margin-left: 3px;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu:last-of-type {
+  margin-right: 64px;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu:last-of-type div.label::after {
+  display: none;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu div.square {
+  width: 20px;
+  height: 20px;
+  border: 1px solid #E5E5E5;
+  box-sizing: border-box;
+  border-radius: 2px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 8px;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu.active {
+  color: #1E88E5;
+  font-weight: 600;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.menu.active div.square {
+  border-color: #1E88E5;
+  background-color: #1E88E5;
+  color: #FFFFFF;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step a {
+  color: inherit;
+  text-decoration: none;
+}
+div.page_telephone div.phone_settings_top div#inv_top_navi div.phn_step_nav div.phn_step.settings {
+  margin-right: 32px;
+}
+
 div.subpage_predvidenicas table,
 div.subpage_cas table {
   width: 100%;
diff --git a/resources/sass/admin_new/pages/survey_edit/survey_edit.scss b/resources/sass/admin_new/pages/survey_edit/survey_edit.scss
index 07093d9d2..89182ca5c 100644
--- a/resources/sass/admin_new/pages/survey_edit/survey_edit.scss
+++ b/resources/sass/admin_new/pages/survey_edit/survey_edit.scss
@@ -21,3 +21,5 @@
 
 // Popupi
 @import "popups/popups";
+
+@import "telefonska_anketa";
\ No newline at end of file
diff --git a/resources/sass/admin_new/pages/survey_edit/telefonska_anketa.scss b/resources/sass/admin_new/pages/survey_edit/telefonska_anketa.scss
new file mode 100644
index 000000000..f9ef60075
--- /dev/null
+++ b/resources/sass/admin_new/pages/survey_edit/telefonska_anketa.scss
@@ -0,0 +1,100 @@
+div.page_telephone {
+    
+    //Nastavitve zgoraj
+    div.phone_settings_top {
+
+        div#inv_top_navi {
+
+            display: flex;
+            flex-direction: row;
+
+            margin-bottom: 32px;
+
+            div.phn_step_nav {
+                display: flex;
+                flex-direction: row;
+
+                div.phn_step {
+
+                    display: flex;
+                    flex-direction: row;
+
+                    vertical-align: middle;
+
+                    cursor: pointer;
+
+                    &.menu {
+
+                        color: $dark-gray;
+
+                        div.label {
+
+                            &:after {
+                                content: "";
+                                display: inline-block;
+                                height: 0.5em;
+                                vertical-align: bottom;
+                                width: 32px;
+                                margin-right: -100%;
+                                margin-left: 3px;
+                                border-top: 1px solid $dark-gray;
+
+                                cursor: default;
+                            }
+                        }
+
+                        &:not(:first-of-type) {
+                            margin-left: 3px;
+                        }
+    
+                        &:last-of-type {
+                            div.label {
+                                &::after {
+                                    display: none;
+                                }
+                            }
+
+                            margin-right: 64px;
+                        }
+
+                        div.square {
+                            width: 20px;
+                            height: 20px;
+
+                            border: 1px solid $gray;
+                            box-sizing: border-box;
+                            border-radius: 2px;
+
+                            display: flex;
+                            align-items: center;
+                            justify-content: center;
+
+                            margin-right: 8px;
+                        }
+
+                        &.active {
+                            color: $blue;
+                            font-weight: $semi-bold;
+
+                            div.square {
+                                border-color: $blue;
+                                background-color: $blue;
+                                color: $white;
+                            }
+
+                        }
+                    }
+
+                    a  {
+                        color: inherit;
+                        text-decoration: none;
+                    }
+                    
+                    &.settings {
+                        margin-right: 32px;
+                    }
+                }
+            }
+        }
+    }
+}
\ No newline at end of file