diff --git a/homeassistant/components/http/www_static/polymer/dialogs/event-fire-dialog.html b/homeassistant/components/http/www_static/polymer/dialogs/event-fire-dialog.html
index 4ea0de089c9..75bb3ed8ea1 100644
--- a/homeassistant/components/http/www_static/polymer/dialogs/event-fire-dialog.html
+++ b/homeassistant/components/http/www_static/polymer/dialogs/event-fire-dialog.html
@@ -1,22 +1,16 @@
 <link rel="import" href="../bower_components/polymer/polymer.html">
-<link rel="import" href="../bower_components/core-style/core-style.html">
-<link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
 <link rel="import" href="../bower_components/paper-button/paper-button.html">
 <link rel="import" href="../bower_components/paper-input/paper-input.html">
 <link rel="import" href="../bower_components/paper-input/paper-input-decorator.html">
 <link rel="import" href="../bower_components/paper-input/paper-autogrow-textarea.html">
 
+<link rel="import" href="ha-action-dialog.html">
 <link rel="import" href="../components/events-list.html">
 
 <polymer-element name="event-fire-dialog" attributes="api">
 <template>
 
-  <paper-action-dialog
-      id="dialog" heading="Fire Event"
-      transition="core-transition-bottom"
-      backdrop="true" layered="false">
-
-    <core-style ref='ha-dialog'></core-style>
+  <ha-action-dialog id="dialog" heading="Fire Event" class='two-column'>
 
     <div layout horizontal>
       <div class='ha-form'>
@@ -43,7 +37,7 @@
 
     <paper-button dismissive>Cancel</paper-button>
     <paper-button affirmative on-click={{clickFireEvent}}>Fire Event</paper-button>
-  </paper-dialog>
+  </ha-action-dialog>
 
 </template>
 <script>
diff --git a/homeassistant/components/http/www_static/polymer/dialogs/ha-action-dialog.html b/homeassistant/components/http/www_static/polymer/dialogs/ha-action-dialog.html
new file mode 100644
index 00000000000..9c2b4a5ed00
--- /dev/null
+++ b/homeassistant/components/http/www_static/polymer/dialogs/ha-action-dialog.html
@@ -0,0 +1,24 @@
+<link rel="import" href="../bower_components/polymer/polymer.html">
+<link rel="import" href="../bower_components/core-style/core-style.html">
+<link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
+<link rel="import" href="../bower_components/paper-dialog/paper-dialog-transition.html">
+
+<polymer-element name="ha-action-dialog" extends="paper-action-dialog">
+<template>
+  <core-style ref='ha-dialog'></core-style>
+  <shadow></shadow>
+</template>
+<script>
+  Polymer({
+    layered: true,
+    backdrop: true,
+    transition: 'core-transition-bottom',
+
+    domReady: function() {
+      this.addEventListener('core-overlay-open-completed', function() {
+        this.resizeHandler();
+      }.bind(this));
+    },
+  });
+</script>
+</polymer-element>
diff --git a/homeassistant/components/http/www_static/polymer/dialogs/service-call-dialog.html b/homeassistant/components/http/www_static/polymer/dialogs/service-call-dialog.html
index a43e6a0cb34..282c77fe9bf 100644
--- a/homeassistant/components/http/www_static/polymer/dialogs/service-call-dialog.html
+++ b/homeassistant/components/http/www_static/polymer/dialogs/service-call-dialog.html
@@ -1,21 +1,16 @@
 <link rel="import" href="../bower_components/polymer/polymer.html">
-<link rel="import" href="../bower_components/core-style/core-style.html">
-<link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
-<link rel="import" href="../bower_components/paper-dialog/paper-dialog-transition.html">
 <link rel="import" href="../bower_components/paper-button/paper-button.html">
 <link rel="import" href="../bower_components/paper-input/paper-input.html">
 <link rel="import" href="../bower_components/paper-input/paper-input-decorator.html">
 <link rel="import" href="../bower_components/paper-input/paper-autogrow-textarea.html">
 
+<link rel="import" href="ha-action-dialog.html">
 <link rel="import" href="../components/services-list.html">
 
 <polymer-element name="service-call-dialog" attributes="api">
 <template>
 
-  <paper-action-dialog
-      id="dialog" heading="Call Service"
-      transition="core-transition-bottom"
-      backdrop="true" layered="false">
+  <ha-action-dialog id="dialog" heading="Call Service">
 
     <core-style ref='ha-dialog'></core-style>
 
@@ -43,7 +38,7 @@
 
     <paper-button dismissive>Cancel</paper-button>
     <paper-button affirmative on-click={{clickCallService}}>Call Service</paper-button>
-  </paper-action-dialog>
+  </ha-action-dialog>
 
 </template>
 <script>
diff --git a/homeassistant/components/http/www_static/polymer/dialogs/state-card-dialog.html b/homeassistant/components/http/www_static/polymer/dialogs/state-card-dialog.html
index 26eb5fa5dcc..358fcf35192 100644
--- a/homeassistant/components/http/www_static/polymer/dialogs/state-card-dialog.html
+++ b/homeassistant/components/http/www_static/polymer/dialogs/state-card-dialog.html
@@ -1,17 +1,12 @@
 <link rel="import" href="../bower_components/polymer/polymer.html">
-<link rel="import" href="../bower_components/core-style/core-style.html">
 
+<link rel="import" href="ha-action-dialog.html">
 <link rel="import" href="../cards/state-card-content.html">
 <link rel="import" href="../more-infos/more-info-content.html">
 
 <polymer-element name="state-card-dialog" attributes="api">
 <template>
-  <paper-action-dialog
-      id="dialog"
-      transition="core-transition-bottom"
-      backdrop="true" layered="false">
-
-    <core-style ref='ha-dialog'></core-style>
+  <ha-action-dialog id="dialog">
 
     <style>
     .title-card {
@@ -27,13 +22,19 @@
 
     <paper-button dismissive>Dismiss</paper-button>
     <paper-button affirmative on-click={{editClicked}}>Edit State</paper-button>
-  </paper-action-dialog>
+  </ha-action-dialog>
 
 </template>
 <script>
 Polymer({
   stateObj: {},
 
+  // domReady: function() {
+  //   this.$.dialog.addEventListener('core-overlay-open-completed', function() {
+  //     this.$.dialog.resizeHandler();
+  //   }.bind(this));
+  // },
+
   show: function(stateObj) {
     this.stateObj = stateObj;
     this.$.dialog.toggle();
diff --git a/homeassistant/components/http/www_static/polymer/dialogs/state-set-dialog.html b/homeassistant/components/http/www_static/polymer/dialogs/state-set-dialog.html
index 143c64f1ca7..1995b0eb194 100644
--- a/homeassistant/components/http/www_static/polymer/dialogs/state-set-dialog.html
+++ b/homeassistant/components/http/www_static/polymer/dialogs/state-set-dialog.html
@@ -1,19 +1,15 @@
 <link rel="import" href="../bower_components/polymer/polymer.html">
-<link rel="import" href="../bower_components/core-style/core-style.html">
-<link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
 <link rel="import" href="../bower_components/paper-button/paper-button.html">
 <link rel="import" href="../bower_components/paper-input/paper-input.html">
 <link rel="import" href="../bower_components/paper-input/paper-input-decorator.html">
 <link rel="import" href="../bower_components/paper-input/paper-autogrow-textarea.html">
 
+<link rel="import" href="ha-action-dialog.html">
 <link rel="import" href="../components/entity-list.html">
 
 <polymer-element name="state-set-dialog" attributes="api">
 <template>
-  <paper-action-dialog
-      id="dialog" heading="Set State"
-      transition="core-transition-bottom"
-      backdrop="true" layered="false">
+  <ha-action-dialog id="dialog" heading="Set State">
 
     <core-style ref='ha-dialog'></core-style>
 
@@ -41,7 +37,7 @@
 
     <paper-button dismissive>Cancel</paper-button>
     <paper-button affirmative on-click={{clickSetState}}>Set State</paper-button>
-  </paper-action-dialog>
+  </ha-action-dialog>
 
 </template>
 <script>
diff --git a/homeassistant/components/http/www_static/polymer/home-assistant-style.html b/homeassistant/components/http/www_static/polymer/home-assistant-style.html
index 704b965e21e..9c072bdbe2b 100644
--- a/homeassistant/components/http/www_static/polymer/home-assistant-style.html
+++ b/homeassistant/components/http/www_static/polymer/home-assistant-style.html
@@ -4,34 +4,43 @@
 <polymer-element name="home-assistant-style" noscript>
   <template>
     <core-style id="ha-dialog">
-      paper-action-dialog, paper-dialog {
+      :host {
         font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
 
         min-width: 350px;
       }
 
-      paper-action-dialog .sidebar, paper-dialog .sidebar {
+      :host .sidebar {
         margin-left: 30px;
       }
 
       @media all and (max-width: 620px) {
-        paper-action-dialog, paper-dialog {
+        :host.two-column {
           margin: 0;
           width: 100%;
           height: calc(100% - 64px);
           top: 64px;
         }
 
-        paper-action-dialog .sidebar, paper-dialog .sidebar {
+        :host .sidebar {
           display: none;
         }
       }
 
-      .ha-form paper-input {
+      @media all and (max-width: 464px) {
+        :host {
+          margin: 0;
+          width: 100%;
+          height: calc(100% - 64px);
+          top: 64px;
+        }
+      }
+
+      html /deep/ .ha-form paper-input {
         display: block;
       }
 
-      .ha-form paper-input:first-child {
+      html /deep/ .ha-form paper-input:first-child {
         padding-top: 0;
       }
     </core-style>