diff --git a/admin/survey/classes/class.SurveyAktivnost.php b/admin/survey/classes/class.SurveyAktivnost.php
index 87c61d938..62cd369fe 100644
--- a/admin/survey/classes/class.SurveyAktivnost.php
+++ b/admin/survey/classes/class.SurveyAktivnost.php
@@ -52,39 +52,10 @@ class SurveyAktivnost{
 		
 		$language = (isset($_GET['language'])) ? $_GET['language'] : 0;
     
-		echo '<select id="diagnostics_date_selected" name="time" onchange="diagnosticsChooseDate()">';
-		echo '<option value="1 minute"' . ($time == '1 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 minute'].'</option>';
-		echo '<option value="5 minute"' . ($time == '5 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_5 minute'].'</option>';
-		echo '<option value="10 minute"' . ($time == '10 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_10 minute'].'</option>';
-		echo '<option value="30 minute"' . ($time == '30 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_30 minute'].'</option>';
-		echo '<option value="1 hour"' . ($time == '1 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 hour'].'</option>';
-		echo '<option value="6 hour"' . ($time == '6 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_6 hour'].'</option>';
-		echo '<option value="12 hour"' . ($time == '12 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_12 hour'].'</option>';
-		echo '<option value="1 day"' . ($time == '1 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 day'].'</option>';
-		echo '<option value="2 day"' . ($time == '2 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_2 day'].'</option>';
-		echo '<option value="5 day"' . ($time == '5 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_5 day'].'</option>';
-		echo '<option value="7 day"' . ($time == '7 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_7 day'].'</option>';
-		echo '<option value="14 day"' . ($time == '14 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_14 day'].'</option>';
-		echo '<option value="1 month"' . ($time == '1 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 month'].'</option>';
-		echo '<option value="3 month"' . ($time == '3 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_3 month'].'</option>';
-		echo '<option value="6 month"' . ($time == '6 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_6 month'].'</option>';
-		echo '<option id="option_99date" value="99date"' . ($time == '99date' ? ' selected' : '') . '>'.$lang['srv_diagnostics_choose_date'].'</option>';
-		echo '</select> ';
-		
-		// Datum - od
-		echo ''.$lang['srv_diagnostics_orfrom'].' <input type="text" id="from" name="from" value="' . $from . '" '. ($time != '99date' ? ' disabled' : '') .' />';
-		echo ' <span class="faicon calendar_icon icon-as_link" onclick="changeSelectOption()" id="from_img"></span>';
-
-		// Datum - do
-		echo ' '.$lang['srv_diagnostics_to'].' <input type="text" id="to" name="to" value="' . $to . '" '. ($time != '99date' ? ' disabled' : '') .'/>';
-		echo ' <span class="faicon calendar_icon icon-as_link" onclick="changeSelectOption()" id="to_img"></span>';
-
 		// n, število anket
         //echo '<label class="srv_diagnostic_total_sub">'.$lang['srv_diagnostics_sum_total'].'</label><label class="srv_diagnostic_total_sub_label">'.$sum.'</label>';
         //echo '<label class="srv_diagnostic_total_sub">'.$lang['srv_diagnostics_sum_total_survey'].'</label><label class="srv_diagnostic_total_survey_label">'.$sum_survey.'</label>';
 		
-		///////////////////////////////////////////////////////////////////////////////////
-		
 		// Nastavitve nad tabelo
 		echo '<div class="data_table_top_holder">';
 
@@ -104,7 +75,7 @@ class SurveyAktivnost{
 
 		//Upoštevane enote
 		echo '<div class="dataSettingsBasic">';    
-		echo '  <button id="toggleDataCheckboxes" class="small white-blue" onClick="toggleAktivnostCheckboxes(); return false;"><span class="faicon plus"></span>'.$lang['srv_diagnostics_upostevane'].'</button>';
+		echo '  <button id="toggleDataCheckboxes" class="small white-blue" onClick="toggleAktivnostCheckboxes(\'units\'); return false;"><span class="faicon plus"></span>'.$lang['srv_diagnostics_upostevane'].'</button>';
 		echo '</div>';
 
 		// Dodatne nastavitve, ki se razprejo
@@ -189,13 +160,78 @@ class SurveyAktivnost{
 
 		// Gumb filtriraj
 		echo '<div class="button_holder">';
-		echo '  <button class="small blue" onClick="this.form.submit(); toggleAktivnostCheckboxes(); return false;">'.$lang['srv_diagnostics_filter'].'</button>';
+		echo '  <button class="small blue" onClick="this.form.submit();">'.$lang['srv_diagnostics_filter'].'</button>';
 		echo '</div>';
 		
 		echo '  </div>';
 		echo '</div>'; //div#dataSettingsCheckboxes
 
 
+		// Datum
+		echo '<div id="end">';    
+		echo '<div class="dataSettingsBasic">';    
+		echo '  <button id="toggleDataCheckboxes_Date" class="small white-blue" onClick="toggleAktivnostCheckboxes(\'date\'); return false;"><span class="faicon calendar_icon"></span>'.$lang['srv_diagnostics_date'].'</button>';
+		echo '</div>';
+		echo '</div>';
+
+		// Dodatne nastavitve, ki se razprejo
+		echo '<div id="dataSettingsCheckboxes_Date" class="displayNone">';
+		echo '  <div class="dataSettingsCheckboxes_holder">';
+
+		echo '<div class="setting_holder">';
+		echo $lang['srv_diagnostics_date2'];
+		echo '<select class="dropdown w130" id="diagnostics_date_selected" name="time" onChange="this.form.submit();">';
+		echo '<option value="1 minute"' . ($time == '1 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 minute'].'</option>';
+		echo '<option value="5 minute"' . ($time == '5 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_5 minute'].'</option>';
+		echo '<option value="10 minute"' . ($time == '10 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_10 minute'].'</option>';
+		echo '<option value="30 minute"' . ($time == '30 minute' ? ' selected' : '') . '>'.$lang['srv_diagnostics_30 minute'].'</option>';
+		echo '<option value="1 hour"' . ($time == '1 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 hour'].'</option>';
+		echo '<option value="6 hour"' . ($time == '6 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_6 hour'].'</option>';
+		echo '<option value="12 hour"' . ($time == '12 hour' ? ' selected' : '') . '>'.$lang['srv_diagnostics_12 hour'].'</option>';
+		echo '<option value="1 day"' . ($time == '1 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 day'].'</option>';
+		echo '<option value="2 day"' . ($time == '2 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_2 day'].'</option>';
+		echo '<option value="5 day"' . ($time == '5 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_5 day'].'</option>';
+		echo '<option value="7 day"' . ($time == '7 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_7 day'].'</option>';
+		echo '<option value="14 day"' . ($time == '14 day' ? ' selected' : '') . '>'.$lang['srv_diagnostics_14 day'].'</option>';
+		echo '<option value="1 month"' . ($time == '1 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_1 month'].'</option>';
+		echo '<option value="3 month"' . ($time == '3 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_3 month'].'</option>';
+		echo '<option value="6 month"' . ($time == '6 month' ? ' selected' : '') . '>'.$lang['srv_diagnostics_6 month'].'</option>';
+		echo '<option id="option_99date" value="99date"' . ($time == '99date' ? ' selected' : '') . '>'.$lang['srv_diagnostics_choose_date'].'</option>';
+		echo '</select>';
+		echo '</div>';
+
+		$disabled = '';
+		/*if ($time != '99date') {
+			$disabled = 'disabled';
+		}*/
+
+		// Datum - od
+		echo '<div class="setting_holder">';
+		echo $lang['srv_diagnostics_orfrom'];
+		echo '<div class="date_holder">';
+		echo '<input type="text" class="text '. $disabled.'" id="from" name="from" value="' . $from . '"/>';
+		echo '<span class="faicon calendar_icon blue" onclick="changeSelectOption()" id="from_img"></span>';
+		echo '</div>';
+		echo '</div>';
+
+		// Datum - do
+		echo '<div class="setting_holder">';
+		echo $lang['srv_diagnostics_to'];
+		echo '<div class="date_holder">';
+		echo '<input type="text" class="text '. $disabled .'" id="to" name="to" value="' . $to . '"/>';
+		echo '<span class="faicon calendar_icon blue" onclick="changeSelectOption()" id="from_img"></span>';
+		echo '</div>';
+		echo '</div>';
+
+		// Gumb filtriraj
+		echo '<div class="button_holder">';
+		echo '  <button class="small blue" onClick="this.form.submit();">'.$lang['srv_diagnostics_filter'].'</button>';
+		echo '</div>';
+
+		echo '</div>';
+		echo '</div>'; //div#dataSettingsCheckboxes_Date
+
+
 		echo '</div>'; // div.data_table_top_holder
 
 
diff --git a/admin/survey/script/script.js b/admin/survey/script/script.js
index 1de2967b7..2a5637302 100644
--- a/admin/survey/script/script.js
+++ b/admin/survey/script/script.js
@@ -5577,7 +5577,19 @@ function toggleNiceURL(type) {
 }
 
 //Aktivnost - toggle dropdown checkboxes
-function toggleAktivnostCheckboxes() {
-	$("#dataSettingsCheckboxes").fadeIn("medium");
-	$("#dataSettingsCheckboxes").toggleClass("displayNone");
+function toggleAktivnostCheckboxes(type) {
+	if (type == 'units') {
+		$("#dataSettingsCheckboxes").fadeIn("medium");
+		$("#dataSettingsCheckboxes").toggleClass("displayNone");
+	}
+	else if (type == 'date') {
+		$("#dataSettingsCheckboxes_Date").fadeIn("medium");
+		$("#dataSettingsCheckboxes_Date").toggleClass("displayNone");
+	}
+	else if (type == 'time') {
+		if ($("#diagnostics_date_selected").value == '99date') {
+			$("#from").toggleClass("disabled");
+			$("#to").toggleClass("disabled");
+		}
+	}
 }
diff --git a/lang/1.php b/lang/1.php
index 26fe2a5f8..8156c1192 100644
--- a/lang/1.php
+++ b/lang/1.php
@@ -3600,8 +3600,8 @@ $lang = array (
 	"srv_diagnostics_user_surveys"		=>	"&#352;tevilo anket v",
 	"srv_diagnostics_total"				=>	"Skupno &#353;tevilo",
 	"srv_diagnostics_in"				=>	"v",
-	"srv_diagnostics_orfrom"			=>	", ali od",
-	"srv_diagnostics_to"				=>	"do",
+	"srv_diagnostics_orfrom"			=>	"Od:",
+	"srv_diagnostics_to"				=>	"Do:",
 	"srv_diagnostics_respondentov"		=>	"Ustrezne enote", // respondentov
 	"srv_diagnostics_strani"			=>	"Strani",
 	"srv_diagnostics_analiza"			=>	"Analize",
@@ -3612,22 +3612,24 @@ $lang = array (
 	"srv_diagnostics_upostevaj"			=>	"Upoštevaj enote:",
 	"srv_diagnostics_jezik"				=>	"Jezik:",
 	"srv_diagnostics_filter"			=>	"Filtriraj",
-	"srv_diagnostics_1 minute"			=>	"1 minuti",
-	"srv_diagnostics_5 minute"			=>	"5 minutah",
-	"srv_diagnostics_10 minute"			=>	"10 minutah",
-	"srv_diagnostics_30 minute"			=>	"30 minutah",
-	"srv_diagnostics_1 hour"			=>	"1 uri",
-	"srv_diagnostics_6 hour"			=>	"6 urah",
-	"srv_diagnostics_12 hour"			=>	"12 urah",
-	"srv_diagnostics_1 day"				=>	"1 dnevu",
-	"srv_diagnostics_2 day"				=>	"2 dneh",
-	"srv_diagnostics_5 day"				=>	"5 dneh",
-	"srv_diagnostics_7 day"				=>	"zadnji teden",
-	"srv_diagnostics_14 day"			=>	"14 dneh",
-	"srv_diagnostics_1 month"			=>	"zadnji mesec",
-	"srv_diagnostics_3 month"			=>	"3 mesecih",
-	"srv_diagnostics_6 month"			=>	"6 mesecih",
-	"srv_diagnostics_choose_date"		=>	"Izberi datum",
+	"srv_diagnostics_date"				=>	"Določi obdobje",
+	"srv_diagnostics_date2"				=>	"Izberi obdobje:",
+	"srv_diagnostics_1 minute"			=>	"1 minuta",
+	"srv_diagnostics_5 minute"			=>	"5 minut",
+	"srv_diagnostics_10 minute"			=>	"10 minut",
+	"srv_diagnostics_30 minute"			=>	"30 minut",
+	"srv_diagnostics_1 hour"			=>	"1 ura",
+	"srv_diagnostics_6 hour"			=>	"6 ur",
+	"srv_diagnostics_12 hour"			=>	"12 ur",
+	"srv_diagnostics_1 day"				=>	"1 dan",
+	"srv_diagnostics_2 day"				=>	"2 dneva",
+	"srv_diagnostics_5 day"				=>	"5 dni",
+	"srv_diagnostics_7 day"				=>	"Zadnji teden",
+	"srv_diagnostics_14 day"			=>	"14 dni",
+	"srv_diagnostics_1 month"			=>	"Zadnji mesec",
+	"srv_diagnostics_3 month"			=>	"3 mesecev",
+	"srv_diagnostics_6 month"			=>	"6 mesecev",
+	"srv_diagnostics_choose_date"		=>	"Po meri",
 	"srv_diagnostics_sum_total"			=>	"n = ",
 	"srv_diagnostics_sum_total_survey"	=>  "Število anket: ",	
 	"srv_diagnostics_filter_test"		=>  "Testne",	
diff --git a/lang/2.php b/lang/2.php
index 3d99bc03d..03c9d6a1c 100644
--- a/lang/2.php
+++ b/lang/2.php
@@ -3569,8 +3569,8 @@ $lang = array (
 	"srv_diagnostics_user_surveys"	=>	"Numbers of surveys",
     "srv_diagnostics_total"			=>	"Total number of",
 	"srv_diagnostics_in"			=>	"in",
-	"srv_diagnostics_orfrom"		=>	", or from",
-	"srv_diagnostics_to"			=>	"to",
+	"srv_diagnostics_orfrom"		=>	"Od:",
+	"srv_diagnostics_to"			=>	"Do:",
 	"srv_diagnostics_respondentov"	=>	"Valid units",
 	"srv_diagnostics_strani"		=>	"Pages",
 	"srv_diagnostics_analiza"		=>	"Analysis",
@@ -3581,6 +3581,8 @@ $lang = array (
 	"srv_diagnostics_upostevaj"			=>	"Count units:",
 	"srv_diagnostics_jezik"				=>	"Language:",
 	"srv_diagnostics_filter"			=>	"Filter",
+	"srv_diagnostics_date"				=>	"Select range",
+	"srv_diagnostics_date2"				=>	"Choose range:",
 	"srv_diagnostics_1 minute"		=>	"1 minute",
 	"srv_diagnostics_5 minute"		=>	"5 minutes",
 	"srv_diagnostics_10 minute"		=>	"10 minutes",
diff --git a/public/css/admin_new.css b/public/css/admin_new.css
index 3e89ead01..85f051ce0 100644
--- a/public/css/admin_new.css
+++ b/public/css/admin_new.css
@@ -21929,6 +21929,7 @@ div.page_diagnostics .data_table_top_holder {
   position: relative;
   display: flex;
   align-items: center;
+  white-space: nowrap;
   box-sizing: border-box;
   margin-bottom: 16px;
   padding: 6px 16px;
@@ -21970,7 +21971,23 @@ div.page_diagnostics .data_table_top_holder .dataSettingsBasic button.white-blue
   font-size: 12px;
   color: #1E88E5;
 }
+div.page_diagnostics .data_table_top_holder #end {
+  width: 100%;
+  display: flex;
+  justify-content: flex-end;
+}
+div.page_diagnostics .data_table_top_holder #end .dataSettingsBasic {
+  margin: 0;
+  padding: 0;
+}
 div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes {
+  left: 211px;
+}
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date {
+  left: 902px;
+}
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date {
   padding: 16px;
   color: #333333;
   font-weight: 400;
@@ -21980,65 +21997,98 @@ div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes {
   background: #FFFFFF;
   border: 1px solid #C4C4C4;
   box-shadow: 0px 4px 7px rgba(0, 0, 0, 0.07);
-  z-index: 99999;
+  z-index: 998;
   position: absolute;
   top: 41px;
-  left: 211px;
   border-radius: 2px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes a {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes a,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date a {
   text-decoration: none;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date ul {
   margin: 0;
   padding: 0;
   list-style-type: none;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date ul li {
   margin-bottom: 16px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li:last-of-type {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li:last-of-type,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date ul li:last-of-type {
   margin-bottom: 0;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li span {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li span,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date ul li span {
   cursor: pointer;
   color: #333333;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li span:hover {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes ul li span:hover,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date ul li span:hover {
   color: #1E88E5;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder {
   display: flex;
   flex-direction: column;
+  font-size: 14px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder #jezikpaket {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder #jezikpaket,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder #jezikpaket {
   display: flex;
   flex-direction: row;
   gap: 64px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder #jezikpaket select,
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder #jezikpaket option {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder select,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder option,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder select,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder option {
   padding: 3px 5px;
-  font-size: 16px !important;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder {
   margin-bottom: 16px;
   display: flex;
   flex-direction: column;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .setting_title {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .setting_title,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder .setting_title {
   font-weight: 600;
   text-transform: uppercase;
+  font-size: 14px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .setting_item {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .setting_item,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder .setting_item {
   margin-top: 12px;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .button_holder {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .setting_item label,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder .setting_item label {
+  font-size: 14px;
+}
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .date_holder input.text,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder .date_holder input.text {
+  width: 130px;
+  margin-right: 8px;
+  height: 28px;
+  padding: 5px 8px;
+}
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .setting_holder .date_holder input.text.disabled,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .setting_holder .date_holder input.text.disabled {
+  border-color: #C4C4C4;
+  background-color: #E5E5E5;
+  color: #777777;
+  pointer-events: none;
+}
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .button_holder,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .button_holder {
   padding: 8px 0 0 0;
   margin: 0;
   border-top: 1px #E5E5E5 solid;
 }
-div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .button_holder button {
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes .dataSettingsCheckboxes_holder .button_holder button,
+div.page_diagnostics .data_table_top_holder #dataSettingsCheckboxes_Date .dataSettingsCheckboxes_holder .button_holder button {
   min-width: 130px;
 }
 div.page_diagnostics table#aktivnost_ankete_table {
@@ -22065,6 +22115,118 @@ div.page_diagnostics table#aktivnost_ankete_table td.graph_cell div.graph_cell .
   height: 24px;
   margin-right: 8px;
 }
+div.page_diagnostics .time_span_container {
+  position: relative;
+  height: 200px;
+  width: 95%;
+  margin-bottom: 50px;
+  border: 1px solid #E5E5E5;
+}
+div.page_diagnostics .time_span_header {
+  clear: both;
+}
+div.page_diagnostics .time_span {
+  background-color: #E5E5E5;
+  width: 1px;
+  display: inline-block;
+  vertical-align: bottom;
+}
+div.page_diagnostics .time_span.year_2022 {
+  background-color: #f79646;
+}
+div.page_diagnostics .time_span.year_2021 {
+  background-color: #4bacc6;
+}
+div.page_diagnostics .time_span.year_2020 {
+  background-color: #8064a2;
+}
+div.page_diagnostics .time_span.year_2019 {
+  background-color: #4f81bd;
+}
+div.page_diagnostics .time_span.year_2018 {
+  background-color: #9bbb59;
+}
+div.page_diagnostics .time_span.year_2017 {
+  background-color: #c0504d;
+}
+div.page_diagnostics .time_span.year_2016 {
+  background-color: #92a9cf;
+}
+div.page_diagnostics .time_span.year_2015 {
+  background-color: #f79646;
+}
+div.page_diagnostics .time_span.year_2014 {
+  background-color: #4bacc6;
+}
+div.page_diagnostics .time_span.year_2013 {
+  background-color: #8064a2;
+}
+div.page_diagnostics .time_span.year_2012 {
+  background-color: #9bbb59;
+}
+div.page_diagnostics .time_span.year_2011 {
+  background-color: #c0504d;
+}
+div.page_diagnostics .time_span.year_2010 {
+  background-color: #4f81bd;
+}
+div.page_diagnostics .time_span.day_1 {
+  background-color: #4f81bd;
+}
+div.page_diagnostics .time_span.day_2 {
+  background-color: #c0504d;
+}
+div.page_diagnostics .time_span.day_3 {
+  background-color: #9bbb59;
+}
+div.page_diagnostics .time_span.day_4 {
+  background-color: #8064a2;
+}
+div.page_diagnostics .time_span.day_5 {
+  background-color: #4bacc6;
+}
+div.page_diagnostics .time_span.day_6 {
+  background-color: #f79646;
+}
+div.page_diagnostics .time_span.day_7 {
+  background-color: #92a9cf;
+}
+div.page_diagnostics .time_span.month_1 {
+  background-color: #4f81bd;
+}
+div.page_diagnostics .time_span.month_2 {
+  background-color: #c0504d;
+}
+div.page_diagnostics .time_span.month_3 {
+  background-color: #9bbb59;
+}
+div.page_diagnostics .time_span.month_4 {
+  background-color: #8064a2;
+}
+div.page_diagnostics .time_span.month_5 {
+  background-color: #4bacc6;
+}
+div.page_diagnostics .time_span.month_6 {
+  background-color: #f79646;
+}
+div.page_diagnostics .time_span.month_7 {
+  background-color: #92a9cf;
+}
+div.page_diagnostics .time_span.month_8 {
+  background-color: #4f81bd;
+}
+div.page_diagnostics .time_span.month_9 {
+  background-color: #c0504d;
+}
+div.page_diagnostics .time_span.month_10 {
+  background-color: #9bbb59;
+}
+div.page_diagnostics .time_span.month_11 {
+  background-color: #8064a2;
+}
+div.page_diagnostics .time_span.month_12 {
+  background-color: #4bacc6;
+}
 
 @media (max-width: 1100px) {
   #quick_comments_link.newCss {
diff --git a/resources/sass/admin_new/pages/aktivnost/aktivnost.scss b/resources/sass/admin_new/pages/aktivnost/aktivnost.scss
index 1c4f00073..27f5339f5 100644
--- a/resources/sass/admin_new/pages/aktivnost/aktivnost.scss
+++ b/resources/sass/admin_new/pages/aktivnost/aktivnost.scss
@@ -8,6 +8,8 @@ div.page_diagnostics {
         position: relative;
         display: flex;
         align-items: center;
+
+        white-space: nowrap;
     
         box-sizing: border-box;
         margin-bottom: 16px;
@@ -39,7 +41,7 @@ div.page_diagnostics {
             margin-right: 8px;
             padding-right: 8px;
             border: none;
-    
+
             button.white-blue{
                 height: 28px;
                 width: 140px;
@@ -60,31 +62,54 @@ div.page_diagnostics {
                 }
             }
         }
+
+        //Gumb za datum na desni
+        #end {
+            width: 100%;
+            display: flex;
+            justify-content: flex-end;
+
+            .dataSettingsBasic{
+                margin: 0;
+                padding: 0;
+            }
+
+        }
+
+        //Extra nastavitve za enote in datum
+        #dataSettingsCheckboxes {
+            left: 211px;
+        }
+
+        #dataSettingsCheckboxes_Date {
+            left: 902px;
+        }
+        
     
-        #dataSettingsCheckboxes{
+        #dataSettingsCheckboxes,
+        #dataSettingsCheckboxes_Date{
             @include hover_basic();
     
-            z-index: 99999;
+            z-index: 998;
             position: absolute;
             top: 41px;
-            left: 211px;
-    
+            
             border-radius: 2px;
     
             .dataSettingsCheckboxes_holder{
                 display: flex;
                 flex-direction: column;
+                font-size: 14px;
 
                 #jezikpaket {
                     display: flex;
                     flex-direction: row;
                     gap: 64px;
+                }
 
-                    select,
-                    option {
-                        padding: 3px 5px;
-                        font-size: 16px !important;
-                    }
+                select,
+                option {
+                    padding: 3px 5px;
                 }
     
                 .setting_holder {
@@ -95,10 +120,31 @@ div.page_diagnostics {
                     .setting_title {
                         font-weight: $semi-bold;
                         text-transform: uppercase;
+                        font-size: 14px;
                     }
             
                     .setting_item {
                         margin-top: 12px;
+                        label {
+                            font-size: 14px;
+                        }
+                    }
+
+                    .date_holder {
+                        input.text {
+                            width: 130px;
+                            margin-right: 8px;
+                            height: 28px;
+                            padding: 5px 8px;
+
+                            &.disabled {
+                                border-color: $dark-gray;
+                                background-color: $gray;
+                                color: $very-dark-gray;
+                        
+                                pointer-events: none;
+                            }
+                        }
                     }
                 }
     
@@ -148,4 +194,126 @@ div.page_diagnostics {
             }
         }
     }
+
+    // Grafi (Tedenska, mesečna, etc)
+    .time_span_container {
+        position: relative;
+        height: 200px;
+        width: 95%;
+        margin-bottom: 50px;
+        border: 1px solid $gray;
+    }
+    .time_span_header {
+        clear: both;
+    }
+    .time_span {
+        background-color: $gray;
+        width: 1px;
+        display: inline-block;
+        vertical-align: bottom;
+    }
+
+    $background_color_125: #9bbb59;
+    $background_color_126: #c0504d;
+    $background_color_127: #92a9cf;
+    $background_color_128: #f79646;
+    $background_color_129: #4bacc6;
+    $background_color_130: #8064a2;
+    $background_color_131: #4f81bd;
+
+    .time_span.year_2022 {
+        background-color: $background_color_128;
+    }.time_span.year_2021 {
+        background-color: $background_color_129;
+    }
+    .time_span.year_2020 {
+        background-color: $background_color_130;
+    }
+    .time_span.year_2019 {
+        background-color: $background_color_131;
+    }
+    .time_span.year_2018 {
+        background-color: $background_color_125;
+    }
+    .time_span.year_2017 {
+        background-color: $background_color_126;
+    }
+    .time_span.year_2016 {
+        background-color: $background_color_127;
+    }
+    .time_span.year_2015 {
+        background-color: $background_color_128;
+    }
+    .time_span.year_2014 {
+        background-color: $background_color_129;
+    }
+    .time_span.year_2013 {
+        background-color: $background_color_130;
+    }
+    .time_span.year_2012 {
+        background-color: $background_color_125;
+    }
+    .time_span.year_2011 {
+        background-color: $background_color_126;
+    }
+    .time_span.year_2010 {
+        background-color: $background_color_131;
+    }
+    .time_span.day_1 {
+        background-color: $background_color_131;
+    }
+    .time_span.day_2 {
+        background-color: $background_color_126;
+    }
+    .time_span.day_3 {
+        background-color: $background_color_125;
+    }
+    .time_span.day_4 {
+        background-color: $background_color_130;
+    }
+    .time_span.day_5 {
+        background-color: $background_color_129;
+    }
+    .time_span.day_6 {
+        background-color: $background_color_128;
+    }
+    .time_span.day_7 {
+        background-color: $background_color_127;
+    }
+    .time_span.month_1 {
+        background-color: $background_color_131;
+    }
+    .time_span.month_2 {
+        background-color: $background_color_126;
+    }
+    .time_span.month_3 {
+        background-color: $background_color_125;
+    }
+    .time_span.month_4 {
+        background-color: $background_color_130;
+    }
+    .time_span.month_5 {
+        background-color: $background_color_129;
+    }
+    .time_span.month_6 {
+        background-color: $background_color_128;
+    }
+    .time_span.month_7 {
+        background-color: $background_color_127;
+    }
+    .time_span.month_8 {
+        background-color: $background_color_131;
+    }
+    .time_span.month_9 {
+        background-color: $background_color_126;
+    }
+    .time_span.month_10 {
+        background-color: $background_color_125;
+    }
+    .time_span.month_11 {
+        background-color: $background_color_130;
+    }
+    .time_span.month_12 {
+        background-color: $background_color_129;
+    }
 }
\ No newline at end of file