added css animation to only the dialog part and also added opacity to bg

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "medium-style-confirm",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "homepage": "http://bitwiser.i/medium-style-confirm/",
   "authors": [
     "Brijesh Bittu <[email protected]>"

css/msc-style.css

@@ -32,6 +32,7 @@
     top: 0;
     height: 100%;
     width: 100%;
+    opacity: 0.9;
     left: 0;
     background-color: #fff;
     z-index: 20;
@@ -70,9 +71,21 @@
     opacity: 1.0;
     max-width: 480px;
     margin: 10% auto 10% auto;
+    padding: 40px;
     text-align: center;
 }
 
+@media (max-width: 600px) {
+  .msc-content {
+    padding: 10px;
+  }
+}
+@media (max-width: 600px) {
+  .msc-content {
+    padding: 0px;
+  }
+}
+
 .msc-title {
     font-size: 2em;
     margin: 0 0 0.1em 0;

js/msc-script.js

@@ -70,7 +70,7 @@
         dialog.appendChild(content);
         document.body.appendChild(dialog);
         dialog.style.display = 'block';
-        dialog.classList.add('msc-confirm--animate');
+        content.classList.add('msc-confirm--animate');
         cancelbtn.focus();
 
         document.addEventListener('keyup', _hide);
@@ -106,4 +106,4 @@
 
     //window.msc = MscConfirm;
     window.mscConfirm = MscConfirm;
-})();
+})();