add some yellow to the rainbow button

Author: zeke

assets/css/about.css

@@ -97,7 +97,8 @@ footer.about-section {
   --rainbow-color-3: hsl(222, 53%, 50%);
   --rainbow-color-4: hsl(285, 47%, 46%);
   --rainbow-color-5: hsl(330, 65%, 48%);
-  --rainbow-color-6: hsl( 36, 77%, 34%);
+  --rainbow-color-6: hsl(32, 79%, 49%);
+  --rainbow-color-7: hsl(53, 84%, 50%);
 }
 
 .rainbow-button-wrapper {
@@ -115,12 +116,11 @@ footer.about-section {
   z-index: 2;
   top: 0;
   left: 0;
-  width: 1000px;
+  width: 600px;
   height: var(--rainbow-button-height);
   background: #CCC;
-  /*background: linear-gradient(to right, var(--rainbow-color-1) 0%, var(--rainbow-color-2) 17%, var(--rainbow-color-3) 33%, var(--rainbow-color-4) 50%, var(--rainbow-color-5) 67%, var(--rainbow-color-6) 83%, var(--rainbow-color-1) 100%);*/
-  background: linear-gradient(to right, var(--rainbow-color-1) 0%, var(--rainbow-color-2) 12.5%, var(--rainbow-color-3) 25%, var(--rainbow-color-4) 37.5%, var(--rainbow-color-5) 50%, var(--rainbow-color-6) 62.5%, var(--rainbow-color-1) 75%, black 87.5%);
-  background-position: -820px 0;
+  background: linear-gradient(to right, var(--rainbow-color-1) 0%, var(--rainbow-color-2) 14%, var(--rainbow-color-3) 28%, var(--rainbow-color-4) 42%, var(--rainbow-color-5) 56%, var(--rainbow-color-6) 70%, var(--rainbow-color-7) 84%, var(--rainbow-color-1) 100%);
+  background-position: -200px 0;
   transition: all 0.5s;
   content: "";
 }
@@ -140,7 +140,7 @@ footer.about-section {
 }
 
 .rainbow-button-wrapper:hover:before {
-  background-position: 0px 0;
+  background-position: 200px 0;
 }
 
 @media (min-width: 940px) {