From MDN :
Sometimes you will see double colons (: :) instead of one (:). This is part of CSS3 and an attempt to distinguish between pseudo-classes and pseudo-elements. Most browsers support both values.
So, if you want to use pseudo-classes , for example :hover, :first-childetc., use one colon. If you want to use the pseudo-elements , such as ::before, ::after, ::first-letter, etc. Use the double colon.
: W3C , :: , CSS 3, :)