diff --git a/static/main.css b/static/main.css
index c24adad..c068865 100644
--- a/static/main.css
+++ b/static/main.css
@@ -170,37 +170,41 @@ nav .extra > a {
 }
 
 .sound a {
-	background-color: #ff4136;
-	border: 1px solid #000;
-	border-radius: 50px;
-	box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.6);
-	color: #eee;
-	display: inline-block;
-	font-size: 0.6em;
-	height: 100px;
-	line-height: 100px;
-	margin: 10px;
-	overflow: hidden;
-	text-align: center;
-	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100px;
 	width: 100px;
+	margin: 10px;
+    padding: .5rem;
+    background-color: #b02222;
+	border: 1px solid #000;
+    border-radius: 50%;
+    box-shadow: inset -5px -5px 5px rgba(0, 0, 0, .5), inset 5px 5px 5px rgba(255,255,255,.3);
+    transition: all .1s ease-in-out;
+	overflow: hidden;
+    
+    font-weight: bold;
+    font-size: 14px;
+    text-shadow: none;
+	text-align: center;
+    word-break: break-all;
+    line-height: 1.5;
+	color: #eee;
+    
 }
 
-.sound a:hover {
-	background-color: #ff4136;
+.sound a:hover,
+.sound a:active {
+	background-color: #790d0d;
+    transform: scale(.98);
 	box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6);
 	cursor: pointer;
 }
 
-.sound a:active {
-        background-color: #ff4136;
-        box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6);
-	cursor: pointer;
-}
-
 .sound-pressed {
-        background-color: #ff4136 !important;
-        box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6) !important;
+    background-color: #ff4136 !important;
+    box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.6) !important;
 }
 
 .edit {
@@ -210,7 +214,9 @@ nav .extra > a {
 }
 
 .sound.edit a:hover {
-	box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.6);	
+	box-shadow: inset -5px -5px 5px rgba(0, 0, 0, 0.6), inset 5px 5px 5px rgba(255,255,255,.3);	
+    transform: scale(1);
+    background-color: #b02222;
 }
 
 .unselectable {