Margins on Announcement Bar Text when Icons are Active

[Ryanp]

I cannot for the life of me figure out how to get past the container and stretch my text out more on Desktop..  When I have social media icons active the text margins are shrunk down.. I would like to bring the text out past the green boxes in this photo.. Just desk top..  So far I have this for code: 

}

<style>
.announcement-bar__message {
text-align: center;
font-size: 18px !important;
word-spacing: 2px;

 <style>
.announcement-bar__message {
text-align: center;
font-size: 18px !important;
word-spacing: 2px;
}
p.announcement-bar__message.h5 {
    display: flex;
    align-items: center;
}
@media screen and (max-width: 767px){
.announcement-bar__message {
text-align: center;
font-size: 14px !important;
}
}
</style>

[Ryanp]

Sure if you have a solution please post it here!  thanks!