¿Cómo ajustar el tamaño de un icono de una web usando html?

Necesito corregir el código de esta página www.urbexa.com/page/test para que el logo de Facebook aparezca en el footer remplazando a 'Like us on Facebook' y con el tamaño adecuado (que se ajuste a la resolución de pantalla o del móvil del usuario que visite la web), ¿cómo lo hago? Y en vez de usar el icono en base64 que hay ahora, ¿se pueden usar los iconos de acá http://fontawesome.io/examples sin tener que modificar ni tocar nada más de la web, solo el código que te puse antes?

Esto es lo que hay escrito ahora (recorto el código base64 de la imagen porque sino no me dejan publicar la pregunta):
<button style="width:100%">
<div class="parent-div"></br>
<img alt="FB" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/P [...] PC9zdmc+" /><span style="font-weight: bold;"><a href="https://www.facebook.com/urbexa" rel="publisher" onmouseout="window.status='';return true" onclick="window.open(this.href); return false;" title="Facebook">Like us on Facebook - </a></span>
<span style="font-weight: bold;"><a href="https://twitter.com/urbexa_com" rel="publisher" onmouseout="window.status='';return true" onclick="window.open(this.href); return false;" title="Twitter">Follow us at Twitter</a></span>
</div>
<div class="clear"> </div>
<div class="disclaimer">
<h4>Copyright c 2017 URBEXA. All Rights Reserved.</h4>
</br><p>Use of this Website constitutes acceptance of the <a href="https://urbexa.com/page/tou">Terms of Use</a> and <a href="http://urbexa.com/page/privacy">Privacy Policy</a>. </br> Designated trademarks and brands are the property of their respective owners.</p>
</br></div>
</button>