1.) Here is the CSS for acqua background color:
#evora_main_header_bar {
background: #95dad5;
}
and for the text color:
#shop_links a {
color: #2F3742;
}
2.) Here is the code that will aligne price numbers:
span.amount sup {
vertical-align: baseline;
}
for the transition there is a lot of CSS code, and we find it hard to explain like this and we can not change a lot of things about it.
3.) The file is not important, just add the above css to the “Custom CSS” textarea.
4.) Here is the code for that social icons:
<div style="display:inline-block;padding-top:7px;">
<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" style="display:inline-block;" data-size="medium" data-href="http://envato.com"></div>
<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/platform.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<div style="display:inline-block;top: -4px;position: relative;">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://envato.com" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
</div>
and you can add this code in “Text” widget, see in the attached image how we made this.