adjusting card styling to match design and styling teaser text

opentech/static_src/src/sass/components/_card.scss

 .card {
-    padding: 20px;
-    background-color: $color--tertiary;
-    transition: background-color $transition;
+    position: relative;
+    padding: 30px 30px 100px;
+    background-color: $color--white;
 
-    &:hover {
-        background-color: darken($color--tertiary, 10%);
-	}
+    &__teaser {
+        font-size: 16px;
+        color: $color--default;
+    }
 }
 
 .card-with-image {

opentech/templates/includes/sprites.html

@@ -71,4 +71,13 @@
     <symbol id="linkedin" viewBox="0 0 17 16" >
         <path d="M17 9.81V16h-3.644v-5.776c0-1.45-.527-2.441-1.846-2.441-1.006 0-1.605.667-1.87 1.313-.095.23-.12.552-.12.875V16H5.875s.05-9.782 0-10.796H9.52v1.53l-.024.035h.024v-.035c.484-.734 1.349-1.783 3.284-1.783C15.202 4.95 17 6.494 17 9.81zM2.062 0C.816 0 0 .806 0 1.865 0 2.9.792 3.73 2.014 3.73h.024c1.272 0 2.062-.83 2.062-1.866C4.076.805 3.31 0 2.062 0zM.216 16H3.86V5.204H.216V16z" fill-rule="nonzero" />
     </symbol>
+
+    <symbol id="arrow-head-pixels" viewBox="0 0 50 75">
+        <g fill="#25AAE1" fill-rule="evenodd">
+            <path opacity=".2" d="M0 50h25v25H0z" />
+            <path opacity=".15" d="M25 25h25v25H25z" />
+            <path opacity=".1" d="M0 0h25v25H0z" />
+        </g>
+    </symbol>
+
 </svg>