Icons in front of Phone and Email in Extra Elements in Header

where do you think is the icon info in your code?

To add icons you have to have rules with icons. Best would be to see your site.
But you can see how i did place f.e. via the phone-info input field some extra elements on my playground here: https://webers-testseite.de on top

this is what i have in my phone-info input field on Enfold:
<a href="https://link-to-googlemap-page"><span class="map">Location</span></a><a href="https://link-to-contact-page"><span class="contact">Contact</span></a><a href="tel:+492289768293"><span class="tel">Phone</span> </a>

this is for phone-info class: (left and transform only to center those extra-elements)

.phone-info {
	float: left !important;
	position: relative;
	font-weight: bold;
	line-height: 20px;
	font-size: 11px;
	padding: 5px 0;
	left: 50%;
	transform: translateX(-47%);
}

now you see that in the inserted code there are classes for the extra-elements:
for all of them here is the common rule:

.phone-info span:before {
    font-family: entypo-fontello;
    font-size: 24px;
    padding-right: 5px;
    position: relative;
    top: 2px;
}

now the individual icons (it is easier to use the icons from fontello icon set) :
( you can find here the numbers of the entypo-fontello icons : https://webers-testseite.de/enfold-entypo/index.html )

.map:before {
    content: "\e842";
    color:  #900;
}

.contact:before {
    content: "\e805";
    color:  #090;
}

.tel:before {
    content: "\e854";
    color: #009;
}