gangsta Glowers files added

RAHULBAWA777 · RAHULBAWA777 · commit 9dc3d4897554 · 2022-05-17T14:18:06.000+05:30
diff --git a/Gangsta Glowers/README.md b/Gangsta Glowers/README.md
@@ -0,0 +1,21 @@
+
+#  Gangsta Glowers
+This is a cool css effects using animation colorfully shadows and font awesome library icons.
+
+## 🚀 About Me
+I'm a full stack developer...you can follow me here -https://github.com/RAHULBAWA777
+
+
+## Run Locally
+
+Clone the project
+
+
+Start the live server
+
+
+## Used By
+
+This project is used by the following companies:
+
+- https://github.com/Dezenix/frontend-html-css-js
diff --git a/Gangsta Glowers/index.html b/Gangsta Glowers/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title> Gangsta Glowers</title>
+    <link rel="stylesheet" href="style.css">
+  </head>
+  <body>
+    <div class="box">
+      <i class="fa-solid fa-skull-crossbones" id="skull"></i>
+      <i class="fa-solid fa-bomb" id="bomb"></i>
+      <i class="fa-solid fa-virus" id="virus"></i>
+      <i class="fa-solid fa-motorcycle"  id="bike"></i>
+      <a href="https://github.com/RAHULBAWA777" style="position:absolute; bottom: 0; color: aliceblue;text-decoration: none;">Made with ❤ by RAHULBAWA</a>
+    </div>
+    
+    <script src="https://kit.fontawesome.com/fa1e66a5e4.js" crossorigin="anonymous"></script>
+  </body>
+</html>
diff --git a/Gangsta Glowers/style.css b/Gangsta Glowers/style.css
@@ -0,0 +1,53 @@
+* {
+    margin: 0;
+    padding: 0;
+  }
+  body {
+    height: 100vh;
+    width: 100vw;
+    background: #121316;
+  }
+  .box {
+    height: 100vh;
+    width: 100vw;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  #skull,
+  #bomb,
+  #virus,
+  #bike {
+    border-radius: 10px;
+    padding: 20px 20px;
+    margin: 0 60px;
+    font-size: 10rem;
+    background-color: #000000;
+    color: #fff;
+    box-shadow: 4px 4px 4px #00000080, 10px 1px 17px #00000080,
+      4px 4px 10px #00000080, 4px 4px 3px #00000080, inset 4px 4px 10px #00000080,
+      inset 4px 4px 10px #00000080, inset 4px 4px 10px #00000080,
+      inset 4px 4px 10px #00000080;
+    text-shadow: 0 0 50px #0a78ff, 0 0 100px #0073ff, 0 0 150px #0073ff,
+    0 0 200px #0073ff;
+    animation: blink 2s linear infinite;
+  }
+  #bomb {
+    animation-delay: 0.4s;
+  }
+  #virus {
+    animation-delay: 0.6s;
+  }
+  #bike {
+    animation-delay: 0.2s;
+  }
+  
+  @keyframes blink {
+    from {
+      filter: hue-rotate(0deg);
+    }
+    to {
+      filter: hue-rotate(360deg);
+    }
+  }
+  
