updates for community team

Author: thabofletcher

src/css/member-onboarding.css

@@ -236,13 +236,31 @@
     font-family: 'Sofia Pro';
 }
 #onboarding .pageTitleWrapper {
-    height: initial;
+    height: auto!important;
     margin-bottom: 10px;
-	overflow:hidden;
+	overflow:hidden!important;
 	clear:both;
+	/*IE*/
+	line-height: inherit !important;
+	/* Rest of the world */
+	line-height: initial !important;
+	
+	/*IE*/
+	min-height: auto !important; 
+	/* Rest of the world */
+	min-height: initial !important;
 }
 #onboarding .pageTitleWrapper .pageTitle {
-    height: initial;
+    height: auto!important;
+	/*IE*/
+	line-height: inherit !important;
+	/* Rest of the world */
+	line-height: initial !important;
+	
+	/*IE*/
+	min-height: auto !important; 
+	/* Rest of the world */
+	min-height: initial !important;
 }
 #onboarding .pageTitleWrapper .pageTitle h2.blogPageTitle {
     float: left;
@@ -1928,22 +1946,40 @@ color: #3d4d65 !important;
 	margin-left: 30px;
 }
 
-.footer-buttons li{
+.footer-buttons li,
+.footer-buttons li a{
 	float:left;
 	width: 108px;
 	margin-right: 10px;
-}
+} 
 
 .footer-buttons li span{
 	display:inline-block;
 	clear:both;
 	overflow: hidden;
 	margin: 0 auto 10px auto;
 	width: 60px;
-	height: 60px;
-	background:#32D50A;
+	height: 60px; 
 }
 
+.icon-design span{
+	background: url("/mf/i/design_onboarding_icon.png") no-repeat 0 0;
+	background-size: 60px 60px;
+}
+.icon-development span{
+	background:url("/mf/i/development_onboarding_icon.png") no-repeat 0 0;
+	background-size: 60px 60px;
+}
+.icon-data-science span{
+	background:url("/mf/i/data_science_onboarding_icon.png") no-repeat 0 0;
+	background-size: 60px 60px;
+}
+.icon-programming span{
+	background:url("/mf/i/competitive_programming_onboarding_icon.png") no-repeat 0 0;
+	background-size: 60px 60px;
+}
+
+
 .footer-buttons li p{
 	display:block;
 	clear:both;
@@ -1958,12 +1994,17 @@ color: #3d4d65 !important;
 .footer-buttons li a{
 	display:block; 
 	font-size: 14px;
-	font-weight: 200;
+	font-weight: 400;
 	text-transform:uppercase;
 	color: #a3a3ae;
 	text-align:center;
 }
 
+.box-15439,
+.box-15440{
+	display: none;
+}
+
 @media only screen and (max-width: 480px) {
 	#onboarding .pageTitleWrapper{
 		padding-bottom: 20px;

wp/wp-content/themes/tcs-responsive/i/competitive_programming_onboarding_icon.png

@@ -87,7 +87,7 @@
 			if( $posts->have_posts() ): while( $posts->have_posts() ) : $posts->the_post(); ?>
 
 
-                        <div class="flip-container" ontouchstart="this.classList.toggle('hover');">
+                        <div class="flip-container box-<?php echo $post->ID ?>" ontouchstart="this.classList.toggle('hover');">
                             <div class="flipper">
                                 <div class="front">
                                     <span class="name">
@@ -209,10 +209,10 @@
         	<h3>What will you create?</h3>
             <h4>Jump into a competition now!</h4>
             <ul class="footer-buttons">
-            	<li><a href="https://www.topcoder.com/challenges/design/active/"><span></span><p>Design</p></a></li>
-                <li><a href="https://www.topcoder.com/challenges/develop/active/"><span></span><p>Development</p></a></li>
-                <li><a href="https://www.topcoder.com/challenges/data/active/"><span></span><p>Data Science</p></a></li>
-                <li class="last"><a href="https://arena.topcoder.com/"><span></span><p>Competitive Programming</p></a></li>
+            	<li><a href="https://www.topcoder.com/challenges/design/active/" class="icon-design"><span></span><p>Design</p></a></li>
+                <li><a href="https://www.topcoder.com/challenges/develop/active/" class="icon-development"><span></span><p>Development</p></a></li>
+                <li><a href="https://www.topcoder.com/challenges/data/active/" class="icon-data-science"><span></span><p>Data Science</p></a></li>
+                <li class="last"><a href="https://arena.topcoder.com/"  class="icon-programming"><span></span><p>Competitive Programming</p></a></li>
             </ul>
             <!--<a data-rel="lightbox" class="btn-play" href="https://www.youtube.com/watch?v=_ncY-jYlTjY?autoplay=1">GETTING STARTED</a>-->