Можете помочь с футором? У меня проблема с svg. Вот

мой html и css: Html: <footer class="footer">
<b class="hash">#VISITSEDONA </b>
<ul class="footer-info">
<li class="item-footer-1">
<a class="twitter-icon"> Twitter</a>
</li>
<li class="item-footer-2">
<a class="fb-icon">Fb</a>
</li>
<li class="item-footer-3">
<a class="youtube-icon"> Youtube</a>
</li>
</ul>
</footer> Css: .footer{
padding-top: 0;
background-color: #FFF;
height: 120px;
width: 1200px;
}

.footer-info{
display: flex;
flex-direction: row;
margin-top: 35px;
margin: 0;
padding: 0;
}

.twitter-icon{
background-image: url('/Users/nikolaj/Sedona/img/twitter.svg');
height: 48px;
width: 46px;
background-color: #81b3d2;
}

.item-footer-1{
margin-left: 525px;
}

.item-footer-2{
margin-left: 7px

???

В общем, насколько понял я, в html-академии ничему не учат, раз это такая проблема)) Дай футеру display: flex, justify-content: space-between; Поставь иконки вместо слов в социалках (юзать тег img - его вставить внутрь ссылки (тег a)) Потом выравнивай как тебе нужно. И убери отступ у item-footer-1.