Catalyst-IN · devil-cyber · Jun 2, 2020
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
     "react-dom": "^16.12.0",
     "react-responsive-carousel": "^3.1.51",
     "react-router-dom": "^5.1.2",
-    "react-scripts": "3.3.0",
+    "react-scripts": "3.4.0",
     "react-simple-chatbot": "^0.6.1",
     "semantic-ui-css": "^2.4.1",
     "semantic-ui-react": "^0.88.2",

diff --git a/public/img/download1.jpg b/public/img/download1.jpg
diff --git a/public/img/download2.jpg b/public/img/download2.jpg
diff --git a/public/img/download3.jpg b/public/img/download3.jpg
diff --git a/public/index.css b/public/index.css
@@ -0,0 +1,66 @@
+*{
+    margin:0;
+    padding:0;
+}
+.header-data{
+    color:orange;
+    border-bottom: 1px solid red;
+    font-family:Raleway, Comic Sans MS, cursive;
+    font-size: 20px;
+}
+ .card{
+    box-shadow: 8px 8px 6px grey;
+    margin:10px;
+
+ }
+ body{
+    background-color: black;
+ }
+ .card-body a:hover{
+     background-color:green;
+     border-style: none;
+
+ }
+
+ .navbar{
+     background-color: steelblue;
+     bottom:0;
+     height:30px;
+
+
+ }
+
+
+.image1{
+    margin-top: 30px;
+    background-image: url(img/download2.jpg);
+    height:200px;
+    width:300px;
+    margin: 25px;
+    background-size: cover;
+    box-shadow: 10px 10px 8px #888888;
+}
+.image2{
+    margin-top: 30px;
+    background-image: url(img/download1.jpg);
+    height:200px;
+    width:300px;
+    margin: 25px;
+    background-size: cover;
+    box-shadow: 10px 10px 8px #888888;
+}
+.image3{
+    margin-top: 30px;
+    background-image: url(img/download3.jpg);
+    height:200px;
+    width:300px;
+    margin: 25px;
+    background-size: cover;
+    box-shadow: 10px 10px 8px #888888;
+}
+
+
+
+
+
+
diff --git a/public/index.html b/public/index.html
@@ -9,6 +9,7 @@
   <meta name="description" content="Web site created using create-react-app" />
   <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
   <link href="https://fonts.googleapis.com/css?family=Raleway&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="index.css">
   <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
@@ -28,7 +29,7 @@
   <title>React App</title>
 </head>
 
-<body>
+<body style="background-color:rgb(56,56,56)">
   <noscript>You need to enable JavaScript to run this app.</noscript>
   <div id="root"></div>
   <!--

diff --git a/src/App.js b/src/App.js
@@ -16,7 +16,7 @@ function App() {
         <Header />
         <div style={{ marginTop: "90px", fontFamily: "Comic Sans, Comic Sans MS, cursive", fontSize: "24px" }}>
           <center>
-            <b>
+            <b style={{color:"white"}}>
               Efficient and user-friendly Chabot Based Crime Registration & Crime Awareness System
             </b>
           </center>

diff --git a/src/components/Home.jsx b/src/components/Home.jsx