Помогите поменять иконки при hover

.header-left-title 
	color: #ffffff 
	font-family: "Open Sans" 
	font-size: 18px 
	font-weight: 700 
	display: block 
	text-align: center 
	letter-spacing: 0.5px 
	margin-top: 10px 
.header-list 
	display: -webkit-flex 
	display: -moz-flex 
	display: -ms-flex 
	display: -o-flex 
	display: flex 
	justify-content: center 
	padding-left: 0 
	list-style-type: none 
	margin: 0 
	&__item 
		margin-left: 30px 
		&:first-child 
			margin-left: 0 
		i 
			font-size: 40px

<div class="col-md-6"> 
    <span class="header-left-title">вступить в наши группы</span> 
    <ul class="header-list"> 
        <li class="header-list__item"> 
            <i class="fab fa-facebook"></i> 
        </li> 
        <li class="header-list__item"> 
            <i class="fab fa-telegram"></i> 
        </li> 
        <li class="header-list__item"> 
            <i class="fab fa-vk"></i> 
        </li> 
        <li class="header-list__item"> 
            <i class="fab fa-instagram"></i> 
        </li> 
    </ul> 
</div>