individual member page

www/wp-content/themes/ation2016/src/styles/utility/_images.scss

@@ -5,4 +5,15 @@ img {
   &.aligncenter {
     margin: auto;
   }
+  &.greyscale {
+    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+, IE10 */
+    filter: gray; /* IE6-9 */
+    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
+    -webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
+    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
+    &:hover {
+        filter: none;
+        -webkit-filter: none;
+    }
+  }
 }

www/wp-content/themes/ation2016/static/styles/site.css

@@ -6140,6 +6140,20 @@ img {
   height: auto; }
   img.aligncenter {
     margin: auto; }
+  img.greyscale {
+    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
+    /* Firefox 3.5+, IE10 */
+    filter: gray;
+    /* IE6-9 */
+    -webkit-filter: grayscale(100%);
+    /* Chrome 19+ & Safari 6+ */
+    -webkit-transition: all .6s ease;
+    /* Fade to color for Chrome and Safari */
+    -webkit-backface-visibility: hidden;
+    /* Fix for transition flickering */ }
+    img.greyscale:hover {
+      filter: none;
+      -webkit-filter: none; }
 
 .video-contain {
   position: relative;

www/wp-content/themes/ation2016/templates/page-about.twig

@@ -17,7 +17,7 @@
 						<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
 							<a href="{{ member.link }}">
 								{% if member.get_thumbnail %}
-									<img src="{{ member.get_thumbnail.get_src|resize(600,600) }}" class="img-responsive"/>
+									<img src="{{ member.get_thumbnail.get_src|resize(600,600) }}" class="img-responsive greyscale"/>
 								{% else %}
 									{# <p>{{ member.name }}</p> #}
 								{% endif %}

www/wp-content/themes/ation2016/templates/single-member.twig

@@ -0,0 +1,53 @@
+{% extends "base.twig" %}
+
+{% block content %}
+    <div class="container">
+
+        <div class="col-xs-12 col-sm-6 col-md-4">
+            {% if post.get_thumbnail %}
+                <img src="{{ post.get_thumbnail.get_src | resize( 600, 600 ) }}">
+            {% endif %}
+            {% if post.email %}
+                <p>
+                    <a href="mailto:{{ post.email }}">{{ post.email }}</a>
+                </p>
+            {% endif %}
+            {% if post.website_portfolio_link %}
+                <p>
+                    <a href="{{post.website_portfolio_link}}">{{ post.website_portfolio_link }}</a>
+                </p>
+            {% endif %}
+            {% if post.linkedin %}
+                <p>
+                    <a href="{{ post.linkedin }}">{{ post.linkedin }}</a>
+                </p>
+            {% endif %}
+        </div>
+
+        <div class="col-xs-12 col-sm-6 col-md-8">
+            <h1>{{ post.name }}</h1>
+            {% if post.major_concentration %}
+                <h3>
+                    {% for concentration in post.major_concentration %}
+                        {{ concentration }}{% if not loop.last %}, {% endif %}
+                    {% endfor %}
+                </h3>
+            {% endif %}
+            {% if post.hometown %}
+                <h6>{{ post.hometown }}</h6>
+            {% endif %}
+        </div>
+
+        <div class="col-xs-12">
+            {% if post.content %}
+                <h2>Bio</h2>
+                <p>{{ post.content }}</p>
+            {% endif %}
+
+            {% if post.quote %}
+                <h2>Quote</h2>
+                <p><em>{{ post.quote }}</em></p>
+            {% endif %}
+        </div>
+    </div>
+{% endblock %}