Social Media Icons and scroll top of page arrow

Hi

I just updated to 3.9 Enfold and have seen some strange things, my social media icons have lost there color, but on hover you see the color, i had it alternating from color background with white icon then on hover black with colored icon, this happens on laptop and pc’s

On iphone’s, ipad’s and andriod devices it’s differant, the social media icons are the correct color but also show the alt tag, same with the scroll up arrow.

this only happened when i upgraded. i do have custom css on the icons please see below

/* Have fun adding your style here :) – PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */

/*SOCIAL MEDIA ICONS SECTION */

#top .social_bookmarks_twitter:hover a
{ color: #4099ff; background-color: transparent; text-decoration: none; }
#top .social_bookmarks_twitter a { color: #fff; background-color: #4099ff; text-decoration: none; }

#top .social_bookmarks_facebook:hover a
{ color: #3B5998; background-color: transparent; text-decoration: none; }
#top .social_bookmarks_facebook a { color: #fff; background-color: #3B5998; text-decoration: none; }

#top .social_bookmarks_youtube:hover a
{color: #c4302b; background-color: transparent; text-decoration: none; }
#top .social_bookmarks_youtube a { color: #fff; background-color: #c4302b; text-decoration: none; }

#top .social_bookmarks_mail:hover a
{ color: #ffcc00; background-color: transparent; text-decoration: none; }
#top .social_bookmarks_mail a { color: #fff; background-color: #ffcc00; text-decoration: none; }

#top .social_bookmarks_pinterest:hover a
{ color: #C92228; background-color: transparent; text-decoration: none; }
#top .social_bookmarks_pinterest a { color: #fff; background-color: #C92228; text-decoration: none; }

.social_bookmarks li { margin-right: 5px; }
/* Social Icon spacing */

/* SCREEN RESPONSIVE SECTION */

@media only screen and (max-width: 640px)
{
.responsive .logo a, .responsive .logo img
{ width:100%; height: auto !important; float:left; margin:0; padding:0; top:0; }
#advanced_menu_toggle { top: 52px; }
.responsive #header .social_bookmarks { top: 55%; margin:0; padding:0; left: -15%; }
}

/* LAYOUTS & CONTAINERS SECTION */

.avia-team-member { margin:5px; }

.content, .sidebar { padding-top: 5px; padding-bottom: 0px; }
/* this is the spacing on the main page */

.inner_sidebar { margin-left: 10px; margin-right: 0px; padding:0px; }

.togglecontainer { margin: 0px 0px; padding: 0px; }
/* this is the Accordion box on the page */

.js_active .toggle_content { padding: 3px; margin: 0px; border-color: #d20000; } /* corsa rossa */
/* this is for the Accordion content details */

.js_active .toggler { border-color: #d20000; } /* corsa rossa */
/* this is the Accordion title border area */

.tabcontainer { margin:0px 0px; }
/* this is for the content of the Tab box */

.js_active .tab_content { padding: 5px; margin: 0px; }
/* this is the content of the Tab box expanded */

.js_active .top_tab .tab { border-color: #d20000; } /* corsa rossa */
.js_active .active_tab_content { border-color: #d20000; } /* corsa rossa */
/* this is for the Tab titles and expanded tabs borders */

.av-special-heading { margin-top: 0px; }
/* this is for the Special Heading text */

.special-heading-inner-border { border-top-width: 2px; border-top-style: none; }
/* this is for the Special Heading line style */

.hr { border: solid #ddd; border-width: 2px 0px 0px 0px; clear: both; margin: 5px 0px 5px 0px; height: 0px; }
.hr span { border-color: #00ffaa; }
/* this is for the Horizontal Rule */

.avia_textblock { padding: 5px 0px 0px 0px; margin: 0px; }

table { margin: 0px; }
th { padding: 0px; margin: 0px; border: none; }
td { padding: 0px; margin: 0px; border: none; }
tr th:first-child, tr td:first-child { border-left-style: none; margin: 0px; }
tr:first-child th, tr:first-child td { border-top-style: none; margin: 0px; }

.single-post .post-entry .big-preview { display:none !important }
/* This stops the preview image being displayed in the post */

/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
/* Add your Desktop Styles here */

}

/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */

}