diff --git a/drawer.js b/drawer.js
index eda6db4..a602a68 100644
--- a/drawer.js
+++ b/drawer.js
@@ -9,12 +9,16 @@ class Drawer extends IgniteElement {
 
     get styles() {
         return /*css*/`
-            mt-drawer > div {
+            mt-drawer {
+                z-index: 999999;
+            }
+
+            mt-drawer > .container {
                 position: relative;
                 background-color: #f8f9fa;
             }
 
-            mt-drawer > div.absolute {
+            mt-drawer.absolute > .container {
                 position: absolute;
             }
 
@@ -22,7 +26,7 @@ class Drawer extends IgniteElement {
                 order: 0;
             }
 
-            mt-drawer.left > div {
+            mt-drawer.left > .container {
                 left: 0;
                 top: 0;
                 height: 100vh;
@@ -32,33 +36,32 @@ class Drawer extends IgniteElement {
                 order: 9999;
             }
 
-            mt-drawer.right > div {
+            mt-drawer.right > .container {
                 right: 0;
                 top: 0;
                 height: 100vh;
             }
 
-            mt-drawer.top > div {
+            mt-drawer.top > .container {
                 top: 0;
                 left: 0;
                 width: 100vw;
             }
 
-            mt-drawer.bottom > div {
+            mt-drawer.bottom > .container {
                 bottom: 0;
                 left: 0;
                 width: 100vw;
             }
 
-            mt-drawer > div {
+            mt-drawer > .container {
                 display: flex;
                 flex-direction: column;
             }
 
-            mt-drawer > div.mobile {
+            mt-drawer.mobile > .container {
                 display: none;
                 position: absolute;
-                z-index: 999999;
                 box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
             }
 
@@ -89,17 +92,17 @@ class Drawer extends IgniteElement {
                 text-align: center;
             }
 
-            mt-drawer.left > div > .close-btn {
+            mt-drawer.left > .container > .close-btn {
                 right: -3em;
                 top: 0.5em;
             }
 
-            mt-drawer.right > div > .close-btn {
+            mt-drawer.right > .container > .close-btn {
                 left: -3em;
                 top: 0.5em;
             }
 
-            mt-drawer > div > .close-btn {
+            mt-drawer > .container > .close-btn {
                 position: absolute;
                 z-index: 999999;
                 width: 2.5em;
@@ -160,6 +163,8 @@ class Drawer extends IgniteElement {
     render() {
         return this.template
             .class(this.placement)
+            .class(this.mobile, value => value ? "mobile" : null)
+            .class(this.absolute, value => value ? "absolute" : null)
             .child(
                 new button()
                     .class("open-btn")
@@ -167,12 +172,11 @@ class Drawer extends IgniteElement {
                     .onClick(() => this.show = true)
                     .child("<i class='fas fa-chevron-right'></i>"),
                 new div()
-                    .class(this.absolute, value => value ? "absolute" : null)
-                    .class(this.mobile, value => value ? "mobile" : null)
                     .style("width", this.width)
                     .style("height", this.height)
                     .style("padding", this.padding)
-                    .style("display", this.show, true, value => value ? "flex" : null)
+                    .style("display", this.show, true, value => value ? "flex" : "none")
+                    .class("container")
                     .child(
                         new button()
                             .class("close-btn")