diff --git a/bower.json b/bower.json
index 55e7988..3a9f4a4 100644
--- a/bower.json
+++ b/bower.json
@@ -20,6 +20,7 @@
   "main": "paper-toast.html",
   "dependencies": {
     "iron-a11y-announcer": "PolymerElements/iron-a11y-announcer#^1.0.0",
+    "iron-overlay-behavior": "PolymerElements/iron-overlay-behavior#~1.0.9",
     "paper-styles": "PolymerElements/paper-styles#^1.0.0",
     "polymer": "Polymer/polymer#^1.1.0"
   },
diff --git a/demo/index.html b/demo/index.html
index dd1b53a..dbd061e 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -42,6 +42,8 @@
 </head>
 <body>
 
+  <paper-toast text="hi there!" opened></paper-toast>
+
   <paper-button raised onclick="document.querySelector('#toast1').show()">Discard Draft</paper-button>
 
   <paper-button raised onclick="document.querySelector('#toast2').show()">Get Messages</paper-button>
diff --git a/paper-toast.html b/paper-toast.html
index c4b1494..e66d9ae 100644
--- a/paper-toast.html
+++ b/paper-toast.html
@@ -10,6 +10,7 @@
 
 <link rel="import" href="../polymer/polymer.html">
 <link rel="import" href="../iron-a11y-announcer/iron-a11y-announcer.html">
+<link rel="import" href="../iron-overlay-behavior/iron-overlay-behavior.html">
 <link rel="import" href="../paper-styles/typography.html">
 
 <!--
@@ -29,7 +30,6 @@
       :host {
         display: inline-block;
         position: fixed;
-
         background: #323232;
         color: #f1f1f1;
         min-height: 48px;
@@ -42,13 +42,10 @@
         left: 12px;
         font-size: 14px;
         cursor: default;
-
-          -webkit-transition: visibility 0.3s, -webkit-transform 0.3s;
+        -webkit-transition: visibility 0.3s, -webkit-transform 0.3s;
         transition: visibility 0.3s, transform 0.3s;
-
-          -webkit-transform: translateY(100px);
+        -webkit-transform: translateY(100px);
         transform: translateY(100px);
-
         visibility: hidden;
       }
 
@@ -64,10 +61,9 @@
         border-radius: 0;
       }
 
-      :host(.paper-toast-open){
+      :host(.paper-toast-open) {
         visibility: visible;
-
-          -webkit-transform: translateY(0px);
+        -webkit-transform: translateY(0px);
         transform: translateY(0px);
       }
     </style>
@@ -81,6 +77,10 @@
       var PaperToast = Polymer({
         is: 'paper-toast',
 
+        behaviors: [
+          Polymer.IronOverlayBehavior
+        ],
+
         properties: {
           /**
            * The duration in milliseconds to show the toast.
@@ -95,25 +95,25 @@
            */
           text: {
             type: String,
-            value: ""
+            value: ''
           },
 
           /**
-           * True if the toast is currently visible.
+           * Set to false to enable closing of the toast by clicking outside it.
            */
-          visible: {
+          noCancelOnOutsideClick: {
             type: Boolean,
-            readOnly: true,
-            observer: '_visibleChanged'
-          }
+            value: true
+          },
         },
 
-        created: function() {
-          Polymer.IronA11yAnnouncer.requestAvailability();
+        get visible() {
+          console.warn('`visible` is deprecated, use `opened` instead');
+          return this.opened;
         },
 
-        attached: function() {
-          this.hide();
+        created: function() {
+          Polymer.IronA11yAnnouncer.requestAvailability();
         },
 
         /**
@@ -121,50 +121,60 @@
          * @method show
          */
         show: function() {
-          if (PaperToast.currentToast) {
-            PaperToast.currentToast.hide();
-          }
-          PaperToast.currentToast = this;
-          this.removeAttribute('aria-hidden');
-          this._setVisible(true);
-          this.fire('iron-announce', {
-            text: this.text
-          });
-          // auto-close if duration is a positive finite number
-          if (this.duration > 0 && this.duration !== Infinity) {
-            this.debounce('hide', this.hide, this.duration);
-          }
+          this.open();
         },
 
         /**
          * Hide the toast
          */
         hide: function() {
-          this.setAttribute('aria-hidden', 'true');
-          this._setVisible(false);
-          if (PaperToast.currentToast === this) {
+          this.close();
+        },
+
+        /**
+         * Overridden from `IronOverlayBehavior`.
+         * Called when the value of `opened` changes.
+         */
+        _openedChanged: function() {
+          if (this.opened) {
+            if (PaperToast.currentToast && PaperToast.currentToast !== this) {
+              PaperToast.currentToast.close();
+            }
+            PaperToast.currentToast = this;
+            this.fire('iron-announce', {
+              text: this.text
+            });
+            // auto-close if duration is a positive finite number
+            if (this.duration > 0 && this.duration !== Infinity) {
+              this.debounce('close', this.close, this.duration);
+            }
+          } else if (PaperToast.currentToast === this) {
             PaperToast.currentToast = null;
           }
+          Polymer.IronOverlayBehaviorImpl._openedChanged.apply(this, arguments);
         },
 
         /**
-         * Toggle the opened state of the toast.
-         * @method toggle
+         * Overridden from `IronOverlayBehavior`.
          */
-        toggle: function() {
-          if (!this.visible) {
-            this.show();
-          } else {
-            this.hide();
-          }
+        _renderOpened: function() {
+          this.classList.add('paper-toast-open');
+        },
+        /**
+         * Overridden from `IronOverlayBehavior`.
+         */
+        _renderClosed: function() {
+          this.classList.remove('paper-toast-open');
         },
 
-        _visibleChanged: function(visible) {
-          this.toggleClass('paper-toast-open', visible);
+        _onIronResize: function() {
+          Polymer.IronOverlayBehaviorImpl._onIronResize.apply(this, arguments);
+          if (this.opened) {
+            // override the inline `static` setup by iron-fit-behavior since we need position: `fixed` for correct display
+            this.style.position = '';
+          }
         }
       });
-
-      PaperToast.currentToast = null;
     })();
   </script>
 </dom-module>
diff --git a/test/basic.html b/test/basic.html
index 3c83a58..4ee8f63 100644
--- a/test/basic.html
+++ b/test/basic.html
@@ -31,7 +31,7 @@
 
     <test-fixture id="show">
       <template>
-        <paper-toast></paper-toast>
+        <paper-toast opened></paper-toast>
       </template>
     </test-fixture>
 
@@ -43,21 +43,18 @@
 
         test('is hidden', function() {
           toast = fixture('basic');
-          assert.isFalse(toast.visible, '`visible` is false');
-          assert.strictEqual(toast.getAttribute('aria-hidden'), 'true', '`aria-hidden` attribute is set to `true`');
+          assert.isFalse(toast.opened, '`opened` is false');
         });
 
         test('is visible', function() {
           toast = fixture('show');
-          toast.show();
-          assert.isTrue(toast.visible, '`visible` is true');
-          assert.isFalse(toast.hasAttribute('aria-hidden'), '`aria-hidden` attribute is not set');
+          assert.isTrue(toast.opened, '`opened` is true');
         });
 
-        test('show() will update `visible`', function() {
+        test('show() will update `opened`', function() {
           toast = fixture('basic');
           toast.show();
-          assert.isTrue(toast.visible, '`visible` is true');
+          assert.isTrue(toast.opened, '`opened` is true');
         });
 
         test('show() will auto-close toast after `duration` milliseconds', function(done) {
@@ -67,7 +64,7 @@
           toast.show();
           assert.isTrue(debounceSpy.called, '`debounce` was called');
           setTimeout(function(){
-            assert.isFalse(toast.visible, '`visible` is false');
+            assert.isFalse(toast.opened, '`opened` is false');
             done();
           }, 12);
         });
@@ -100,13 +97,13 @@
         test('there is only 1 toast opened', function() {
           var toast1 = fixture('basic');
           var toast2 = fixture('show');
-          toast2.show();
-          toast1.show();
-          assert.isTrue(toast1.visible, 'toast1 is visible');
-          assert.isFalse(toast2.visible, 'toast2 is not visible');
-          toast2.show();
-          assert.isFalse(toast1.visible, 'toast1 is now not visible');
-          assert.isTrue(toast2.visible, 'toast2 is now visible');
+          toast2.open();
+          toast1.open();
+          assert.isTrue(toast1.opened, 'toast1 is opened');
+          assert.isFalse(toast2.opened, 'toast2 is not opened');
+          toast2.open();
+          assert.isFalse(toast1.opened, 'toast1 is now not opened');
+          assert.isTrue(toast2.opened, 'toast2 is now opened');
         });
 
       });
