Amazon
HTML
<section class="amzn-promo">
<img class="amzn-promo-cover-art" src="http://placehold.it/320x320" />
<div class="amzn-promo-information">
<h4 class="amzn-promo-message">Get a free song at Amazon</h4>
<a class="amzn-call-to-action " href="#">Learn more</a>
</div>
</section>
<iframe width="560" height="315" src="https://www.youtube.com/embed/owsfdh4gxyc" frameborder="0" allowfullscreen></iframe>
CSS
.amzn-call-to-action {
margin: 20px;
display: inline-block;
}
.amzn-promo-cover-art {
width: 320px;
height: 320px;
float: left;
}
.amzn-promo-information {
float: left;
text-align: center;
margin-top: 40px;
width: 320px;
}
.amzn-promo-message {
font-size: 30px;
font-family: Helvetica;
font-weight: normal;
}
.amzn-call-to-action {
background: #fdc579;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdc579), color-stop(100%,#eb7a27)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #fdc579 0%,#eb7a27 100%);
text-decoration: none;
color: #fff;
padding: 10px 20px;
border-radius: 5px;
border: 1px solid #9F631D;
letter-spacing: 1px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-size: 18px;
text-shadow: 0 -1px 0 #302D2D;
box-shadow: 0px 1px 2px #302D2D;
}