diff --git a/apps/calendar/css/style.css b/apps/calendar/css/style.css
index 8bd5f4acc2..d01bd65bc3 100644
--- a/apps/calendar/css/style.css
+++ b/apps/calendar/css/style.css
@@ -58,6 +58,7 @@
 .weekend_thead, .weekend_row{height: 20px;text-align: center;text-align: center;background: #F3F3F3;}
 .thisday{background: #FFFABC;text-align: center;margin: 0;padding: 0;vertical-align: top;height: 20px;}
 .event {position:relative;}
-.event_popup {display: none; position: absolute; width: 280px; height: 40px; padding: 10px; background: #eeeeee; color: #000000; border: 1px solid #1a1a1a; font-size: 90%;}
+.popup {display: none; position: absolute; z-index: 1000; background: #eeeeee; color: #000000; border: 1px solid #1a1a1a; font-size: 90%;}
+.event_popup {width: 280px; height: 40px; padding: 10px;}
 
 input[type="button"].active {color: #0098E4}
diff --git a/apps/calendar/js/calendar.js b/apps/calendar/js/calendar.js
index e7c31cd7c9..0c4f6fe959 100644
--- a/apps/calendar/js/calendar.js
+++ b/apps/calendar/js/calendar.js
@@ -276,11 +276,12 @@ Calendar={
 			eventcontainer.append(event_holder);
 		},
 		createEventPopup:function(e){
-			var event = $(this).data('event_info');
 			var popup = $(this).data('popup');
 			if (!popup){
+				var event = $(this).data('event_info');
 				popup = $(document.createElement('div'));
 				$(this).data('popup', popup).append(popup);
+				popup.addClass('popup')
 				popup.addClass('event_popup')
 					.html(Calendar.UI.getEventPopupText(event));
 			}