Changes styles for FAQ

Author: Pavithra K

components/vote/app-style.scss

@@ -10,20 +10,30 @@
       flex-direction: column;
 
       @include break(medium) {
-        flex-direction: row-reverse;
+        flex-direction: row;
       }
   }
 
   &__influence {
-    flex: 0 0 80%;
+    flex: 0 0 75%;
   }
 
   &__influence-description {
     display: flex;
+    flex-direction: column;
+
+    @include break(medium) {
+      flex-direction: row;
+    }
   }
 
   &__user-section {
-    flex: 0 0 20%;
+    flex: 0 0 25%;
+    padding-left: 20px;
+
+    @include break(large) {
+      border-left: 2px solid getColor(elephant);
+    }
   }
 
   &__influence-section {
@@ -98,8 +108,9 @@
   }
 
   h1 {
-    font-size: 20pt;
+    font-size: 16pt;
     font-weight: bold;
+    margin-bottom: 10px;
   }
 
   &__item-title {

components/vote/influence.jsx

@@ -8,12 +8,12 @@ export default class InfluenceComponent extends React.Component {
     render() {
         return (this.props.type === "normal" ? (
             <section className="influence-info influence-info__section">
-                <h1 className="influence-info__header">What is Influence?</h1>
+                <h1 className="influence-info__header">Influence</h1>
                 <p><em>Influence</em> is a unit of measure based on time you have been a member on GitHub. However, in 2017 and on you will recieve one influence per day.</p>
             </section>
         ) : (
             <section className="influence-info influence-info__section">
-                <h1 className="influence-info__header">What is Golden Influence?</h1>
+                <h1 className="influence-info__header">Golden Influence</h1>
                 <p><em>Golden Influence</em> is equal to 100 <i>normal influence</i>. Golden Influence is obtained by being a backer or sponsor on our <a href="https://opencollective.com/webpack">Open Collective page</a>.</p>
             </section>
         ));