JSFiddle - React, Tailwind, and code Playground

HTML

<ul class='social'>
<li><a class='social-feed' href='##' rel='nofollow' target='_blank'>RSS feed</a></li>
<li><a class='social-twitter' href='##' rel='nofollow' target='_blank'>Twitter</a></li>
<li><a class='social-facebook' href='##' rel='nofollow' target='_blank'>Facebook</a></li>
<li class='last'><a class='social-youtube' href='##'>Google+</a></li>
</ul>

<div class="mbt-email"> 
E-Posta Aboneliği 
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER ID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> 
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;E-Posta Adresinizi Girin&quot;;}" onfocus="if (this.value == &quot;E-Posta Adresinizi Girin&quot;) {this.value = &quot;&quot;;}" value="E-Posta Adresinizi Girin" type="text" /> 
<input type="hidden" value="FEEDBURNER ID" name="uri"/><input type="hidden" name="loc" value="en_US"/> 
<input class="mbt-emailsubmit" value="Gönder" type="submit" /> 
</form> 
</div>

CSS

.social {
background: none repeat scroll 0 0 #FCFCFC;
border-bottom: 1px solid #F0F0F0;
height: 80px;
padding: 15px;
}
.social li {
float: left;
margin-right: 15px;
text-align: center;
width: 52px;
}
.social li.last {
margin-right: 0;
}
.social li a {
color: #666666;
font-size: 11px;
line-height: 34px;
opacity: 0.6;
padding-top: 42px;
}
.social li a:hover {
color: #666666;
opacity: 1;
text-decoration: none;
}
.social .social-feed {
background: url("http://3.bp.blogspot.com/-_gwlmCiRPw0/T4MMqbhtV6I/AAAAAAAAAP8/nH_B9B4zuf0/ico-social-rss.png") no-repeat scroll 0 0 transparent;
display: block;
}
.social .social-twitter {
background: url("http://1.bp.blogspot.com/-AEs2xaucVqo/T4MMrfQok6I/AAAAAAAAAQA/tUHW2QEIZXY/ico-social-twitter.png") no-repeat scroll 0 0 transparent;
display: block;
}
.social .social-facebook {
background: url("http://1.bp.blogspot.com/-69FO7ybaHo0/T4MMo5Ms1VI/AAAAAAAAAP0/a84dfPIr0NA/ico-social-facebook.png") no-repeat scroll 0 0 transparent;
display: block;
}
.social .social-youtube {
background: url("http://1.bp.blogspot.com/-Ke7NQ2PDKgA/T4G-C7pmEfI/AAAAAAAAAOc/tIWtV_pdOeA/googleplus.png") no-repeat scroll 0 0 transparent;
display: block;
margin-right: 0;
}

.mbt-email{ 
background:url(http://cdn1.iconfinder.com/data/icons/socialmediaicons_v120/48/email.png) no-repeat 0px 12px ; 
width:300px; 
padding:10px 0 0 55px; 
float:left; 
font-size:1.4em; 
font-weight:bold; 
margin:0 0 10px 0; 
color:#686B6C; 
}
.mbt-emailsubmit{ 
background:#9B9895; 
cursor:pointer; 
color:#fff; 
border:none; 
padding:3px; 
text-shadow:0 -1px 1px rgba(0,0,0,0.25); 
-moz-border-radius:6px; 
-webkit-border-radius:6px; 
border-radius:6px; 
font:12px sans-serif; 
} 
.mbt-emailsubmit:hover{ 
background:#007fff; 
} 
.textarea{ 
padding:2px; 
margin:6px 2px 6px 2px; 
background:#f9f9f9; 
border:1px solid #ccc; 
resize:none; 
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); 
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); 
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);...