Added bg music to konami, added toasty fully

added bg music for konami
credited for music
added toasty pop-out

1 files changed, 68 insertions, 4 deletions

diff --git a/konami/css/main.css b/konami/css/main.css
index ba22b2f..fb6298e 100644
--- a/konami/css/main.css
+++ b/konami/css/main.css
@@ -1,13 +1,13 @@
 /* BACKGROUND SPARKLES CSS */
 
-html,
-body {
+html, body {
     margin: 0 0;
     padding: 0 0;
     text-align: center;
     font-size: 0;
     background: url(../assets/bg/bg.gif);
     cursor: url(../assets/images/smiley\ face\ cursor.cur), default;
+    overflow-X: hidden; /* Toasty */
 }
 
 /* ORINGINAL SITE CSS */
@@ -34,8 +34,7 @@ html {
     box-sizing: inherit;
 }
 
-html,
-body {
+html, body {
     height: 100%;
     display: -webkit-box;
     display: -ms-flexbox;
@@ -146,3 +145,68 @@ main {
     bottom: 0;
 }
 
+/* TOASTY */
+
+.toasty {
+    position: absolute;
+    left: 110%;
+    bottom: 0;
+}
+
+.flash {
+    animation: flash 1s linear infinite;
+}
+
+.animateIn {
+    animation: 2s left forwards ease;
+}
+
+.code {
+    text-align: center;
+    opacity: 0;
+    position: absolute;
+    top: calc(50% + 40px);
+    left: 50%;
+    transform: translate(-50%);
+    font-family: 'Open Sans Condensed', sans-serif;
+    font-size: 20px;
+    letter-spacing: 0.05em;
+    text-transform: uppercase;
+    border-bottom: 2px solid #333;
+    padding: 0 20px;
+    animation: fade 2.5s 7s forwards linear;
+}
+
+@keyframes fade {
+    0% {
+        opacity: 0;
+    }
+
+    100% {
+        opacity: 1;
+    }
+}
+
+@keyframes left {
+    0% {
+        left: 110%;
+    }
+
+    50% {
+        left: 80%;
+    }
+
+    100% {
+        left: 110%;
+    }
+}
+
+@keyframes flash {
+    0% {
+        border-right: none;
+    }
+
+    100% {
+        border-right: 0.08em solid #222;
+    }
+}