--- a/devtools/client/themes/tooltips.css
+++ b/devtools/client/themes/tooltips.css
@@ -167,17 +167,17 @@
 
 .tooltip-flexible-height .tooltip-filler {
   /* In flexible mode the filler should grow as much as possible. */
   flex-grow: 1;
 }
 
 /* type="arrow" overrides: remove arrow decorations for the xul <panel> wrapper */
 
-.tooltip-xul-wrapper[type="arrow"] {
+.tooltip-xul-wrapper[type="arrow"][side] {
   margin: 0;
 }
 
 /* The arrow image is hidden because the panel is opened using openPopupAtScreen(). */
 
 /* Remove all decorations on .panel-arrowcontent is the tooltip content container. */
 .tooltip-xul-wrapper[type="arrow"] .panel-arrowcontent {
   margin: 0;

--- a/toolkit/content/widgets.css
+++ b/toolkit/content/widgets.css
@@ -10,11 +10,12 @@
 @import url("chrome://global/skin/autocomplete.css");
 @import url("chrome://formautofill-shared/skin/autocomplete-item.css");
 @import url("chrome://formautofill/skin/autocomplete-item.css");
 @import url("chrome://global/skin/dropmarker.css");
 @import url("chrome://global/skin/groupbox.css");
 @import url("chrome://global/skin/menu.css");
 @import url("chrome://global/skin/menulist.css");
 @import url("chrome://global/skin/notification.css");
+@import url("chrome://global/skin/popup.css");
 @import url("chrome://global/skin/richlistbox.css");
 @import url("chrome://global/skin/splitter.css");
 @import url("chrome://global/skin/toolbar.css");

--- a/toolkit/content/widgets/popup.xml
+++ b/toolkit/content/widgets/popup.xml
@@ -6,25 +6,17 @@
 <!-- This files relies on these specific Chrome/XBL globals -->
 <!-- globals PopupBoxObject -->
 
 <bindings id="popupBindings"
    xmlns="http://www.mozilla.org/xbl"
    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    xmlns:xbl="http://www.mozilla.org/xbl">
 
-  <binding id="popup-base">
-    <resources>
-      <stylesheet src="chrome://global/skin/popup.css"/>
-    </resources>
-  </binding>
-
-  <binding id="popup"
-           extends="chrome://global/content/bindings/popup.xml#popup-base">
-
+  <binding id="popup">
     <content>
       <xul:arrowscrollbox class="popup-internal-box" flex="1" orient="vertical"
                           smoothscroll="false">
         <children/>
       </xul:arrowscrollbox>
     </content>
 
     <implementation>
@@ -50,18 +42,17 @@
           }
           for (var i = 0; i < array.length; i++)
             array[i].width = width;
         ]]>
       </handler>
     </handlers>
   </binding>
 
-  <binding id="panel"
-           extends="chrome://global/content/bindings/popup.xml#popup-base">
+  <binding id="panel">
     <implementation>
       <field name="_prevFocus">0</field>
     </implementation>
 
     <handlers>
       <handler event="popupshowing"><![CDATA[
         // Capture the previous focus before has a chance to get set inside the panel
         try {
@@ -134,16 +125,21 @@
             currentFocus = currentFocus.parentNode;
           }
         }
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="arrowpanel" extends="chrome://global/content/bindings/popup.xml#panel">
+    <resources>
+      <!-- Fixes an issue with the "test_arrowpanel.xul" animation on Mac, see bug 1470880. -->
+      <stylesheet src="data:text/css,"/>
+    </resources>
+
     <content flip="both" side="top" position="bottomcenter topleft" consumeoutsideclicks="false">
       <xul:vbox anonid="container" class="panel-arrowcontainer" flex="1"
                xbl:inherits="side,panelopen">
         <xul:box anonid="arrowbox" class="panel-arrowbox">
           <xul:image anonid="arrow" class="panel-arrow" xbl:inherits="side"/>
         </xul:box>
         <xul:box class="panel-arrowcontent" xbl:inherits="side,align,dir,orient,pack" flex="1">
           <children/>
@@ -262,18 +258,17 @@
         }
       </handler>
       <handler event="popuppositioned" phase="target">
         this.adjustArrowPosition();
       </handler>
     </handlers>
   </binding>
 
-  <binding id="tooltip"
-           extends="chrome://global/content/bindings/popup.xml#popup-base">
+  <binding id="tooltip">
     <content>
       <children>
         <xul:label class="tooltip-label" xbl:inherits="xbl:text=label" flex="1"/>
       </children>
     </content>
 
     <implementation>
       <field name="_mouseOutCount">0</field>