diff --git a/package.json b/package.json
index 5b4db76..e894857 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vue-cookie-comply-with-reject",
   "description": "A Vue 3 component to handle cookie acceptance on your website",
-  "version": "0.1.0-beta.1",
+  "version": "0.0.6",
   "files": [
     "dist"
   ],
diff --git a/src/components/CookieComply.vue b/src/components/CookieComply.vue
index 5c14b53..39ac6cc 100644
--- a/src/components/CookieComply.vue
+++ b/src/components/CookieComply.vue
@@ -182,9 +182,27 @@ export default {
 };
 </script>
 
-<style>
+<style lang="css">
 @import '../styles/variables.css';
 
+/* Render cookie comply out of viewport to reduce LCP */
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0.8;
+  }
+}
+@keyframes slide-up {
+  0% {
+    transform: translateY(110vh);
+  }
+  100% {
+    transform: translateY(0vh);
+  }
+}
+
 .cookie-comply-body-grey-out {
   position: fixed;
   top: 0;
@@ -192,10 +210,11 @@ export default {
   bottom: 0;
   left: 0;
   background-color: #000;
-  opacity: .8;
+  opacity: 0;
   width: 100vw;
   height: 100vh;
   overflow: hidden;
+  animation: fade-in 1s forwards;
 }
 
 .cookie-comply {
@@ -210,6 +229,8 @@ export default {
   box-shadow: var(--box-shadow);
   padding: var(--spacing-md);
   border-radius: var(--border-radius);
+  animation: slide-up 1s forwards;
+  transform: translateY(110vh);
 }
 
 .cookie-comply-edit {