HTML:
<div class="sidebar subscription">
<div class="subscription-inner">
<h5>Рассылка</h5>
<p><strong>1429</strong> <b>подписчиков</b> уже получают периодическую рассылку о новостях из мира инфографики: тренды, новинки, инструменты, важные события и конференции</p>
<form novalidate="" target="_blank" class="validate" name="mc-embedded-subscribe-form" id="mc-embedded-subscribe-form" method="post" action="http://123.com">
<input type="text" placeholder="Введите e-mail" class="subscription-input" name="EMAIL">
<input type="submit" class="subscription-button" value="Подписаться" name="subscribe">
</form>
</div>
</div>
и стили CSS:
.sidebar.subscription {
background: url("http://infogra.ru/wp-content/themes/infogra/assets/images/subscription-background.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
display: block;
height: 280px;
margin: -8px -8px 20px;
padding: 8px;
text-align: center;
width: 280px;
}
.sidebar.subscription .subscription-inner {
background: none repeat scroll 0 0 #f5f5f5;
height: 280px;
width: 280px;
}
.sidebar.subscription .subscription-inner h5 {
display: block;
font-size: 22px;
font-weight: bold;
padding: 17px 0 16px;
text-transform: uppercase;
}
.sidebar.subscription .subscription-inner p {
color: #262626;
display: block;
font-size: 15px;
line-height: 18px;
padding: 0 18px 24px;
text-align: left;
}
.sidebar.subscription .subscription-inner p strong {
text-transform: uppercase;
}
.sidebar.subscription .subscription-input {
background: none repeat scroll 0 0 #fff;
border: 1px solid #7f8c9c;
display: block;
font-size: 15px;
height: 28px;
line-height: 28px;
margin: 0 auto;
text-align: center;
width: 207px;
}
.sidebar.subscription .subscription-button {
background: none repeat scroll 0 0 #72bb72;
border: medium none;
color: #fff;
cursor: pointer;
display: block;
font-size: 16px;
height: 33px;
line-height: 33px;
margin: 19px auto 0;
text-align: center;
text-transform: uppercase;
width: 182px;
}
оформление было подмечено тут
и на всякий случай картинка бэкграунда:


