Refine Card Hover Animation

Author: gregpalace

app/stylesheets/Applications.css

@@ -1,38 +1,34 @@
 #card-hover {
   cursor: pointer;
   position: relative;
-  font-size: 28px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
   transition: all 1s;
   &:after,
   &:before {
     content: ' ';
     width: 10px;
     height: 10px;
     position: absolute;
-    border: 0px solid #fff;
     transition: all 1s;
   }
   &:after {
     top: -1px;
-    left: -1px;
+    right: -1px;
     border-top: 5px solid black;
-    border-left: 5px solid black;
+    border-right: 5px solid black;
   }
   &:before {
     bottom: -1px;
-    right: -1px;
+    left: -1px;
     border-bottom: 5px solid black;
-    border-right: 5px solid black;
+    border-left: 5px solid black;
   }
   &:hover {
     border-top-right-radius: 0px;
     border-bottom-left-radius: 0px;
     &:before,
     &:after {
-      width: 100%;
-      height: 100%;
+      width: 25%;
+      height: 25%;
     }
   }
 }