Twitter Bootstrap style

src/extra.css

@@ -242,6 +242,7 @@
 
 /* Bootstrap style */
 .ui-tooltip, .qtip{
+	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 	font-size: 13px;
 	line-height: 18px;
 }
@@ -269,18 +270,35 @@
 	color: #333;
 
 	font-size: 18px;
-	line-height: 27px;
+	line-height: 22px;
 
 	border: 1px solid #ccc;
-	border: 1px solid rgba(0, 0, 0, 0.2);
+	border: 1px solid rgba(0, 0, 0, 0.2); /* Transparency does not work */
+
+	border-bottom: 1px solid #ccc;
 
-	border-bottom: 1px solid #eee;
+	/* padding: 5px 35px 5px 10px; */
+	/*padding: 5px 9px;*/
+	padding: 5px 35px 5px 10px;
 
+	/**
+	 * border transparency does not work
+	 * border-radius should not be done for the titlebar and the content
+	 * but only once for .ui-tooltip-*
+	 * This is because of the little ^ shape
+	 * If border-radius is done at .ui-tooltip-* then the little ^ shape is white
+	 */
 	-webkit-border-radius: 5px 5px 0 0;
 	-moz-border-radius: 5px 5px 0 0;
 	border-radius: 5px 5px 0 0;
 }
 
+.ui-tooltip-bootstrap .ui-tooltip-titlebar .ui-state-default{
+	right: 9px;
+	top: 49%; /*52*/
+	margin-top: -9px;
+}
+
 .ui-tooltip-bootstrap .ui-tooltip-content{
 	/*border-color: #ccc;*/
 	background-color: white;
@@ -294,10 +312,49 @@
 	border-radius: 0 0 5px 5px;
 }
 
+/* Override Boostrap .control-group { margin-bottom: 9px; } */
+.ui-tooltip-bootstrap .ui-tooltip-content .control-group {
+	/*margin-bottom: 9px;*/
+}
+
+/* Override Boostrap form { margin: 0 0 18px; } */
+.ui-tooltip-bootstrap .ui-tooltip-content form{
+	margin: 0 0 5px;
+}
+
 .ui-tooltip-bootstrap .ui-tooltip-icon{
+	border: 0px none white;
+	background: white;
+	top: 45%;
+}
+
+.ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon{
+	border: 0px none white;
+
+	border-style: none;
+	border-color: white;
+	background: white;
+	color: black;
+
+	width: auto;
+	height: auto;
+
+	float: right;
+	font-size: 20px;
+	font-weight: bold;
+	line-height: 18px;
+	color: #000000;
+	text-shadow: 0 1px 0 #ffffff;
+	opacity: 0.2;
+	filter: alpha(opacity=20);
 }
 
-.ui-tooltip-bootstrap .ui-tooltip-titlebar .ui-state-hover{
+.ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon:hover{
+	color: #000000;
+	text-decoration: none;
+	cursor: pointer;
+	opacity: 0.4;
+	filter: alpha(opacity=40);
 }