UI: use new pink hues for active/primary btns

ui/styles/_buttons.scss

@@ -32,13 +32,13 @@
     }
 
     &.btn-primary {
-        color: $purple-dark;
+        color: $pink-dark;
         background-color: transparent;
-        border: 2px solid $purple;
+        border: 2px solid $pink;
 
         &:hover {
-            background-color: $light-purple;
+            background-color: $light-pink;
-            color: darken($purple, 10%);
+            color: darken($pink, 10%);
         }
     }
 
@@ -78,13 +78,13 @@
 
 
     &.active {
-        color: $purple-dark;
+        color: $pink-dark;
         background-color: transparent;
-        border: 2px solid $purple;
+        border: 2px solid $pink;
 
         &:hover {
-            background-color: $light-purple;
+            background-color: $light-pink;
-            color: darken($purple, 10%);
+            color: darken($pink, 10%);
         }
 
         &.btn-noactive {

ui/styles/_variables.scss

@@ -12,10 +12,12 @@ $red-darker:                #b03c44;
 $tan:                       #f0f0e5;
 $consul-gray:               #909090;
 $consul-footer-gray:        #d7d4d7;
+$pink-dark:                 #d62783;
+$pink:                      lighten($pink-dark, 20%);
+$light-pink:                #f9f3f7;
 $purple-dark:               #69499a;
 $purple:                    lighten($purple-dark, 20%);
 $light-purple:              #f7f3f9;
-
 $green-faded:               #BBF085;
 $green-dark:                #86B457;
 $red-faded:                 $red;