diff --git a/source/Ox.UI/js/Calendar/Ox.Calendar.js b/source/Ox.UI/js/Calendar/Ox.Calendar.js
index 1f58da25..8bb275b7 100644
--- a/source/Ox.UI/js/Calendar/Ox.Calendar.js
+++ b/source/Ox.UI/js/Calendar/Ox.Calendar.js
@@ -98,7 +98,6 @@ Ox.Calendar = function(options, self) {
             event.rangeText = event.rangeText.split(' - ').shift() + ' - ...';
         }
     });
-    self.lineEvents = getLineEvents();
 
     self.maxZoom = 32;
     self.minLabelWidth = 80;
@@ -413,6 +412,8 @@ Ox.Calendar = function(options, self) {
             textAlign: 'center'
         });
     
+    self.$lines = [];
+    self.lineEvents = getLineEvents();
     renderCalendar();
 
     function changeDate() {
@@ -552,7 +553,8 @@ Ox.Calendar = function(options, self) {
                                 )
                                 .css({
                                     left: getPosition(unit.date(value + i), zoom) + 'px',
-                                    width: (u == 0 ? 1 : width) + 'px'
+                                    width: (u == 0 ? 1 : width) + 'px',
+                                    height: self.contentHeight + 'px'
                                 })
                         );
                     }
@@ -776,7 +778,7 @@ Ox.Calendar = function(options, self) {
     }
 
     function panTo(date, line) {
-        var delta = (date - self.options.date) / 1000 * getPixelsPerSecond(),
+        var delta = Math.round((date - self.options.date) / 1000 * getPixelsPerSecond()),
             // 250 ms for half the width of the visible area
             ms = 250 * Math.min(Math.abs(delta) / (self.$content.width() / 2), 1);
         self.$scalebar.stop().animate({
@@ -811,6 +813,7 @@ Ox.Calendar = function(options, self) {
         getBackgroundElements(self.options.zoom).forEach(function($element) {
             $element.appendTo(self.$background);
         });
+        
     }
 
     function renderCalendar() {
@@ -827,6 +830,7 @@ Ox.Calendar = function(options, self) {
 
     function getLineEvents() {
         var lineEvents = [];
+        self.$content.find('.OxLine').remove();
         self.options.events.filter(function(event) {
             // filter out events with types not shown
             // and events outside the visible area  <--  commented out to keep layout from changing
@@ -867,9 +871,19 @@ Ox.Calendar = function(options, self) {
             });
             if (line == lineEvents.length) {
                 lineEvents[line] = [];
+                self.$lines[line] = new Ox.Element()
+                    .addClass('OxLine')
+                    .css({
+                        top: (line * 16) + 'px'
+                    })
+                    .appendTo(self.$content);
             }
             lineEvents[line].push(event);            
         });
+        self.contentHeight = Math.max(
+            lineEvents.length * 16, self.$container.height()
+        );
+        self.$content.css({height: self.contentHeight + 'px'});
         return lineEvents;
     }
 
@@ -877,27 +891,14 @@ Ox.Calendar = function(options, self) {
         var calendarEvent = getCalendarEvent(),
             height;
             //types = ['date', 'place', 'person', 'other'];
-        self.$content.find('.OxLine').remove();
-        height = Math.max(self.lineEvents.length * 16, self.$container.height());
-        self.$background.$element.children().css({height: height + 'px'});
-        self.$content.css({height: height + 'px'});
         self.lineEvents.forEach(function(events, line) {
-            var $line = new Ox.Element()
-                .addClass('OxLine')
-                .css({
-                    top: (line * 16) + 'px'
-                })
-                .appendTo(self.$content);
-            events.sort(function(a, b) {
-                // sort events by start, ascending
-                return a.startTime - b.startTime;
-            }).forEach(function(event) {
+            events.forEach(function(event) {
                 // append if selected or visible
                 if (
                     event.id == self.options.selected
                     || overlaps(event, calendarEvent)
                 ) {
-                    getEventElement(event).data({line: line}).appendTo($line);
+                    getEventElement(event).data({line: line}).appendTo(self.$lines[line]);
                 }
             });
         });
@@ -956,10 +957,9 @@ Ox.Calendar = function(options, self) {
 
     function scrollTo(top, animate) {
         var containerHeight = self.$container.height(),
-            contentHeight = self.$content.height(),
             scrollTop = self.$container.$element[0].scrollTop,
             min = 0,
-            max = Math.ceil(contentHeight - containerHeight / 2),
+            max = Math.ceil(self.contentHeight - containerHeight / 2),
             top = Ox.limit(top, min, max),
             delta = top - scrollTop,
             ms = 250 * Math.min(Math.abs(delta) / (containerHeight / 2), 1);