diff --git a/data/stylesheet.css b/data/stylesheet.css
index 07cc58f..b7c08f0 100644
--- a/data/stylesheet.css
+++ b/data/stylesheet.css
@@ -126,3 +126,22 @@ padding-right: 5px;
 padding-left: 15px;
 padding-right: 5px;
 }
+
+.openweather-button-action {
+-st-icon-style: symbolic;
+border-radius: 32px;
+margin: 0px;
+min-height: 22px;
+min-width: 22px;
+padding: 10px;
+font-size: 100%;
+}
+.openweather-button-action:hover,
+.openweather-button-action:focus {
+border: none;
+padding: 11px;
+}
+
+.openweather-button-action > StIcon {
+icon-size: 16px;
+}
diff --git a/src/extension.js b/src/extension.js
index 3d2c9b3..2b894fa 100644
--- a/src/extension.js
+++ b/src/extension.js
@@ -698,24 +698,25 @@ class OpenweatherMenuButton extends PanelMenu.Button {
         this._buttonMenu.remove_style_pseudo_class('active');
     }
 
-
     createButton(iconName, accessibleName) {
         let button;
 
+        button = new St.Button({
+            reactive: true,
+            can_focus: true,
+            track_hover: true,
+            accessible_name: accessibleName,
+            style_class: 'message-list-clear-button button openweather-button-action'
+        });
+
+        button.child = new St.Icon({
+            icon_name: iconName
+        });
+
         if (ExtensionUtils.versionCheck(['3.8'], Config.PACKAGE_VERSION)) {
-            button = new St.Button({
-                reactive: true,
-                can_focus: true,
-                track_hover: true,
-                accessible_name: accessibleName,
-                style_class: 'popup-menu-item openweather-button'
-            });
-            button.child = new St.Icon({
-                icon_name: iconName
-            });
+            button.style_class ='popup-menu-item openweather-button';
             button.connect('notify::hover', Lang.bind(this, this._onButtonHoverChanged));
-        } else
-            button = Main.panel.statusArea.aggregateMenu._system._createActionButton(iconName, accessibleName);
+        }
 
         return button;
     }