diff --git a/index.html b/index.html
index c48d311..f79d132 100755
--- a/index.html
+++ b/index.html
@@ -6,6 +6,7 @@
     <link rel="stylesheet" href="styles.css">
     <link rel="stylesheet" href="bootstrap.min.css">
     <link href="https://fonts.googleapis.com/css?family=Orbitron" rel="stylesheet">
+    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css">
     <!-- begin favicon -->
     <link rel="apple-touch-icon" sizes="180x180" href="favicons/apple-touch-icon.png">
     <link rel="icon" type="image/png" sizes="32x32" href="favicons/favicon-32x32.png">
@@ -22,6 +23,21 @@
     <script src="sumorobot.js" type="text/javascript" charset="utf-8"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ace.js" type="text/javascript" charset="utf-8"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ext-language_tools.js" type="text/javascript" charset="utf-8"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>
+    <script>
+        window.addEventListener("load", function() {
+            window.cookieconsent.initialise({
+                "palette": {
+                    "popup": {
+                        "background": "#242943ff"
+                    },
+                    "button": {
+                        "background": "#ffd500ff"
+                    }
+                }
+            })
+        });
+    </script>
 </head>
 <body>
     <div id="battery">Disconnected</div>
diff --git a/styles.css b/styles.css
index e2b6694..7f87c39 100755
--- a/styles.css
+++ b/styles.css
@@ -55,6 +55,10 @@ div.btn-group-control {
     bottom: 0px;
     position: fixed !important;
 }
+/* coockie button */
+a.cc-btn:hover {
+    background-color: #ffd500ff !important;
+}
 /* the battery div */
 div#battery {
     z-index: 35;
