edit: panneau contact + bug fix

style/animation.css

@@ -10,11 +10,11 @@
 
 @keyframes blinkBack {
   0%   { background-color: var(--accent-color);}
-  15%  { background-color: var(--main-color);}
-  35%  { background-color: var(--main-color);}
+  15%  { background-color: var(--neon-color);}
+  35%  { background-color: var(--neon-color);}
   50%  { background-color: var(--accent-color);}
-  65%  { background-color: var(--main-color);}
-  85%  { background-color: var(--main-color);}
+  65%  { background-color: var(--neon-color);}
+  85%  { background-color: var(--neon-color);}
   100%  { background-color: var(--accent-color);}
 }
 
@@ -24,4 +24,4 @@
   50%  { transform: translateY(-10px); }
   65%  { transform: translateY(1px); }
   100% { transform: translateY(0px); }
-}
+}

style/common.css

@@ -66,6 +66,32 @@
     }
 }
 
+.textBtn{
+  background-color: var(--back-color);
+  border-color: var(--main-color);
+  border-style: solid;
+  border-radius: 22px;
+  border-width: thin thin thick thin;
+
+  color: var(--main-color);
+
+  font-family: 'velvelyne';
+  font-weight: bold;
+  text-transform: uppercase;
+  font-size: 22px;
+
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+
+  animation: none;
+}
+
+.textBtn:hover{
+  color: var(--back-color);
+  animation: blinkBack 1.61s infinite;
+}
+
 .floating[data-window="selected"]{
   z-index: 333 !important;
   border-color: var(--accent-color);
@@ -73,10 +99,10 @@
         h1{
           background-color: var(--accent-color);
         }
-        
+
         .iconBtn{
           border-color: var(--accent-color);
           color: var(--accent-color);
         }
-        
-}
+
+}

style/main.css

@@ -2,15 +2,15 @@
 :root[data-theme="dark"]{
   --back-color: black;
   --main-color: white;
-  --accent-color: #3CFF00;
-  --neon-color: #3CFF00;
+  --accent-color: #05ff61;
+  --neon-color: #fe02c6;
 }
 
 :root[data-theme="light"]{
   --back-color: white;
   --main-color: black;
   --accent-color: #FFA64D;
-  --neon-color: black;
+  --neon-color: skyblue;
 }
 /*==========================Background*/
 html,body{
@@ -35,9 +35,9 @@ main{
                 position: absolute;
                 z-index: 1;
                 width: 444px;
-                height: 444px;
+                height: 377px;
                 top:33px;
-                left:13.12px;
+                left:33px;
 
                 div {
                     padding: 13.12px;
@@ -47,7 +47,7 @@ main{
                                 font-size: 22px;
                                 color: var(--main-color)
 
-                                
+
                             }
 
                             strong{
@@ -57,32 +57,38 @@ main{
                 }
             }
 
-            #musicPlayer{
+            #contactSection{
                 position: absolute;
                 z-index: 1;
                 width: 333px;
                 height: 117px;
-                top:444px;
-                left:277px;
-                visibility: collapse;
+                top:400px;
+                left:13.12px;
+
 
                 nav{
                     width: 100%;
                     height: 100%;
 
+                    padding: 13.12px;
+                    gap: 7.77px;
+
                     display: flex;
                     flex-direction: row;
                     align-items: center;
                     justify-content: space-around;
 
-                    .iconBtn{
-                        width: 33px;
-                        height: 33px;
+                    box-sizing: border-box;
+
+                    .textBtn{
+                        width: 66%;
+                        height: 77%;
                     }
                 }
             }
 
             #colorBtnContainer{
+                    visibility: collapse;
                     position:absolute;
                     right: 13.12px;
                     bottom: 117px;
@@ -227,4 +233,4 @@ aside{
                     transition: 7.77s ease-in;
                 }
 
-}
+}

style/responsive.css

@@ -12,6 +12,6 @@
 @media(min-width: 1300px){
   main > footer{
     grid-template-columns: repeat(9, 1fr);
-    min-height: 77px;
+    min-height: 99px;
   }
 }