diff --git a/ui/BACKGROUND GOOD.png b/ui/BACKGROUND GOOD.png
new file mode 100644
index 0000000..4fdcf62
Binary files /dev/null and b/ui/BACKGROUND GOOD.png differ
diff --git a/ui/gray background for UI with gradient and tiny bit of metallic.png b/ui/gray background for UI with gradient and tiny bit of metallic.png
new file mode 100644
index 0000000..e52b3e0
Binary files /dev/null and b/ui/gray background for UI with gradient and tiny bit of metallic.png differ
diff --git a/ui/index.html b/ui/index.html
index 43850b5..994262a 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -53,21 +53,21 @@
 <script>
     var i = 0;
     document.addEventListener("keydown",function(sex2){
-            if (sex2.code === "ArrowRight"){
+            if (sex2.code === "KeyD"){
             if(i>=prvnihra.length - 1) i = -1;    
             i++;
             prvnihra[i].focus();
-            console.log("prava", i);
+            console.log("right", i);
             console.log("array je", prvnihra.length);
             }
             
         })
     document.addEventListener("keydown",function(sex3){
-        if(sex3.code === "ArrowUp"){
+        if(sex3.code === "KeyA"){
             if(i<=0) i=prvnihra.length
             i--;
             prvnihra[i].focus()
-            console.log("leva", i);
+            console.log("left", i);
         }
         if (sex3.code === "KeyE"){
             console.log(document.activeElement);
diff --git a/ui/style.css b/ui/style.css
index 825bd7b..c93aff8 100644
--- a/ui/style.css
+++ b/ui/style.css
@@ -11,7 +11,9 @@ body{
     min-height: 100vh;
     max-width: 90vw;
     margin: 0 auto;
-    background-color: rgb(56, 55, 55, 1);
+    /*background-color: rgb(56, 55, 55, 1);*/
+    background-image: url(BACKGROUND\ GOOD.png);
+    background-size: cover;
 }
 * {
     box-sizing: border-box; /* ulehci zivot */
@@ -30,13 +32,18 @@ body{
 }
 
 .sex{
+    
+    opacity: 0;
+    margin-bottom: 110px;
     z-index: 1;
-    opacity: 0.91;
+    transition: opacity 1s, margin-bottom 0.8s;
+
+    
 }
 
-.sex:focus{
-    border:10px solid red;
-}
+
+
+
 #sdvx3-button{
     position: relative;    
     border-radius: 15px;
@@ -93,4 +100,27 @@ body{
         height: 100%;
         z-index: 0;
         border-radius: 15px;
-    }  
\ No newline at end of file
+    } 
+    @keyframes blik {
+        0% {
+            box-shadow: 0 0 0 3px rgba(255, 254, 254,0);
+        }
+        50% {
+            box-shadow: 0 0 0 3px rgba(255, 254, 254,1); 
+        }
+        100% {
+            box-shadow: 0 0 0 3px rgba(255, 254, 254,0);
+        }
+    } 
+    .move:focus {
+        outline: none;
+        animation-iteration-count: infinite;
+        animation-name: blik;
+        animation-duration: 1.4s;
+      }
+      .move:focus h1{ 
+        transition: opacity 1s, margin-bottom 0.8s;
+        z-index: 1;
+        opacity: 1;
+        margin-bottom: 80px;
+    }
\ No newline at end of file