transition of social media elements appearance upon refresh in the code below is not smooth how can i make it smooth?

Question

in the CSS I have added transition 0.5s but when I refresh my page the social media icons just pop in a sudden choppy manner instead of smooth appearance. how can I resolve this