diff --git a/calendar/templates/pixelegg/app.css b/calendar/templates/pixelegg/app.css
index 9b2ff27d6c..150505d6f7 100755
--- a/calendar/templates/pixelegg/app.css
+++ b/calendar/templates/pixelegg/app.css
@@ -727,11 +727,12 @@ div.calendar {
   /* They are the navigation buttons */
   padding: 2px;
   /* Make the buttons seem like they're pressing */
+  background-color: #ffdd73;
 }
 .calendar .nav {
   /*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/
   background-image: none;
-  background-color: #ffc200;
+  background-color: #ffdd73;
 }
 .calendar thead .title {
   /* This holds the current "month, year" */
@@ -747,7 +748,7 @@ div.calendar {
 }
 .calendar thead .headrow {
   /* Row <TR> containing navigation buttons */
-  background-color: #ffc200;
+  background-color: #ffdd73;
   color: #fff;
 }
 .calendar thead .daynames {
@@ -941,7 +942,7 @@ div.calendar {
 }
 /*###########################################
 #                                           #
-#       dialog-header                       #
+#       dialogHeader                       #
 #############################################
 #                                           #
 #                                           #
@@ -1216,7 +1217,7 @@ div#calendar-edit #calendar-edit_calendar-edit-history tbody {
   display: table-row-group;
   width: 100%;
 }
-div#calendar-edit tr.dialog-footer-toolbar label.et2_label {
+div#calendar-edit tr.dialogFooterToolbar label.et2_label {
   top: 0px !important;
 }
 div#calendar-edit #calendar-edit_action {
@@ -1274,29 +1275,30 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 /* marks a day in the colum-header as today
 */
 .calendar_calToday {
-  background-color: #ffc200;
+  background-color: #ffdd73;
 }
 .calendar_calWeek {
-  background-color: #ffc200;
+  background-color: #ffffff;
   width: auto;
   margin: 0 auto;
   text-align: center;
-  border: 1px solid silver;
+  border: none;
 }
 .calendar_calMonth {
-  background-color: #ffc200;
+  /*.background_table_cal_head;*/
+  background-color: #ffffff;
   width: auto;
   margin: 0 auto;
   text-align: center;
-  border: 1px solid silver;
+  border: none;
 }
 /* marks a day in the colum-header as holiday
 */
 .calendar_calHoliday {
-  background-color: #9b6ad6;
+  background-color: #ffdd73;
 }
 .calendar_calHoliday a {
-  color: #ffffff;
+  color: #1e1e1e !important;
   font-size: 0.9em;
 }
 /* marks a day in the column-header additionaly as birthday of some contact,
@@ -1403,25 +1405,34 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
   line-height: 12px;
   z-index: 30;
 }
+.calendar_calGridHeader {
+  border: none;
+}
 .calendar_calDayColHeader img {
   vertical-align: middle;
 }
 .calendar_calWeekNavHeader,
 .calendar_calMonthNavHeader {
-  top: 0px;
+  top: 3px;
   left: 0px;
-  width: 100%;
+  width: auto;
   right: 0px;
   /* does not work in IE, but looks better in other browsers then width:100% */
   text-align: center;
   font-size: 100%;
   white-space: nowrap;
-  border-bottom: 1px solid silver;
-  border-right: 1px solid silver;
-  height: 16px;
-  line-height: 12px;
+  border-bottom: 0px solid silver;
+  border-right: 0px solid silver;
+  height: 24px;
+  line-height: 21px;
+  /*height: 24px;*/
   z-index: 30;
 }
+.calendar_calWeekNavHeader a img,
+.calendar_calMonthNavHeader a img {
+  position: relative;
+  top: 3px;
+}
 .calendar_calWeekNavHeader,
 .calendar_calMonthNavHeader img {
   vertical-align: middle;
@@ -2146,7 +2157,8 @@ select#calendar_view {
 }
 /*searchfield*/
 input#calendar_keywords {
-  margin: 5px 0;
+  margin: 10px 0 10px 2px;
+  font-size: 1.3em;
 }
 div#calendar-container {
   margin-left: 0px;
@@ -2173,6 +2185,9 @@ div#calendar-container div.calendar table thead .title {
   -webkit-box-shadow: none;
   background-color: #ffc200;
 }
+div#calendar-container div.calendar table thead .headrow {
+  color: #1e1e1e;
+}
 div#calendar-container div.calendar table thead .daynames {
   background-color: #679fd2;
 }
diff --git a/calendar/templates/pixelegg/app.less b/calendar/templates/pixelegg/app.less
index ee450b355c..3f77ebe5b2 100755
--- a/calendar/templates/pixelegg/app.less
+++ b/calendar/templates/pixelegg/app.less
@@ -122,6 +122,7 @@ div.calendar { position: relative; }
     .button { /* "<<", "<", ">", ">>" buttons have this class */
         text-align: center;    /* They are the navigation buttons */
         padding: 2px;          /* Make the buttons seem like they're pressing */
+        .background_table_cal_head;
     }
     .nav {
         /*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/
@@ -391,7 +392,7 @@ div.calendar { position: relative; }
 
 /*###########################################
 #                                           #
-#       dialog-header                       #
+#       dialogHeader                       #
 #############################################
 #                                           #
 #                                           #
@@ -700,7 +701,7 @@ div#calendar-edit{
     /*###########################################*/
     /*// Toolbar*/
 
-    tr.dialog-footer-toolbar{
+    tr.dialogFooterToolbar{
 
         label.et2_label {top: 0px !important;}
 
@@ -777,26 +778,27 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 }
 .calendar_calWeek{
     //	background: #ffffcc;
-    .background_table_cal_head;
+        background-color : @gray_0;
 	width:auto;
 	margin:0 auto;
 	text-align:center;
-	border: 1px solid silver;
+	border: none;
 }
 .calendar_calMonth{
     //	background: #ffffcc;
-    .background_table_cal_head;
+    /*.background_table_cal_head;*/
+        background-color : @gray_0;
 	width:auto;
 	margin:0 auto;
 	text-align:center;
-	border: 1px solid silver;
+	border: none;
 }
 /* marks a day in the colum-header as holiday
 */
 .calendar_calHoliday{
-    background-color: @egw_color_3_e;
+    background-color: @egw_color_1_e;
     a {
-        .color_0_gray;
+        color: @gray_90 !important;
         font-size: 0.9em;
     }
 }
@@ -903,23 +905,38 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
     line-height: 12px;
     z-index: 30;
 }
+
+.calendar_calGridHeader{ border: none; }
+
+
 .calendar_calDayColHeader img {
     vertical-align: middle;
 }
 .calendar_calWeekNavHeader,.calendar_calMonthNavHeader{
-    top: 0px;
+    top: 3px;
     left: 0px;
-    width: 100%;
+    width: auto;
     right: 0px;	/* does not work in IE, but looks better in other browsers then width:100% */
     text-align: center;
     font-size: 100%; 
     white-space: nowrap;
-    border-bottom: 1px solid silver;
-    border-right: 1px solid silver;
-    .dimension_height_s;
-    line-height: 12px;
+    border-bottom: 0px solid silver; // cleaned
+    border-right: 0px solid silver;  // cleaned
+    .dimension_height_m;
+    line-height: 21px;
+    /*height: 24px;*/
     z-index: 30;
+    
+    a {
+        img { 
+            position: relative;
+            top: 3px;
+        }
+    }
 }
+
+
+
 .calendar_calWeekNavHeader,.calendar_calMonthNavHeader img{
     vertical-align: middle;
 }
@@ -1474,7 +1491,11 @@ button[id*="edit_button[add_alarm]"]{
 select#calendar_view{margin-top: 8px;}
 
 /*searchfield*/
-input#calendar_keywords{margin: 5px 0;}
+input#calendar_keywords{
+    margin: 10px 0 10px 2px;
+    font-size: 1.3em;
+    ;
+}
 
 div#calendar-container {
     margin-left: 0px;
@@ -1504,7 +1525,7 @@ div#calendar-container {
                 }
 
                 // << today >>
-                .headrow {}
+                .headrow { color: @gray_90;}
 
                 // daynames
                 .daynames {