diff --git a/styles/bootstrap/application.css b/styles/bootstrap/application.css
index a01283209..ead57bd62 100644
--- a/styles/bootstrap/application.css
+++ b/styles/bootstrap/application.css
@@ -193,7 +193,13 @@ div.popupbox {
 	padding: 15px;
 	display: none;
 	position: absolute;
-	width: 200px;
+	width: 250px;
+}
+
+div.popupbox span.closepopupbox {
+	position: absolute;
+	right: 5px;
+	top: 0px;
 }
 
 @media (max-width: 480px) { 
diff --git a/styles/bootstrap/application.js b/styles/bootstrap/application.js
index 037f2731b..c67376d3f 100644
--- a/styles/bootstrap/application.js
+++ b/styles/bootstrap/application.js
@@ -989,9 +989,10 @@ $(document).ready(function() { /* {{{ */
 		});
 	});
 
-	$('span.openpopupbox').on('click', function(e) {
-		$('div.popupbox').toggle();
-		console.log('Hallo');
+	$("body").on("click", "span.openpopupbox", function(e) {
+		$(""+$(e.target).data("href")).toggle();
+	});
+	$("body").on("click", "span.closepopupbox", function(e) {
+		$(this).parent().hide();
 	});
-
 }); /* }}} */
diff --git a/views/bootstrap/class.Bootstrap.php b/views/bootstrap/class.Bootstrap.php
index 79ed0d72a..89e4141b1 100644
--- a/views/bootstrap/class.Bootstrap.php
+++ b/views/bootstrap/class.Bootstrap.php
@@ -2554,10 +2554,20 @@ mayscript>
 	} /* }}} */
 
 	protected function printPopupBox($title, $content, $ret=false) { /* {{{ */
+		$id = md5(uniqid());
+		/*
+		$this->addFooterJS('
+$("body").on("click", "span.openpopupbox", function(e) {
+	$(""+$(e.target).data("href")).toggle();
+//	$("div.popupbox").toggle();
+});
+');
+		 */
 		$html = '
-		<span class="openpopupbox">'.$title.'</span>
-		<div class="popupbox" style="display: none;">
-			'.$content.'
+		<span class="openpopupbox" data-href="#'.$id.'">'.$title.'</span>
+		<div id="'.$id.'" class="popupbox" style="display: none;">
+		'.$content.'
+			<span class="closepopupbox"><i class="icon-remove"></i></span>
 		</div>';
 		if($ret)
 			return $html;