Although your question is about the performance, (and I would suggest, measure it..) I would really like to add that you should always try to use the shortest definition possible to identity the correct elements.
The reason is not the file size, but the ability to extend your site without altering the main css.
For example you've got this part in your html site:
<div id="Header">
<h1>Css example</h1>
<h2>Welcome to the css example site</h2>
<p>An example page by davy</p>
</div>
and this is the css:
#Header
{
background-color: #ffeedd;
padding: 1em;
}
#Heading h1
{
font-size: 3em;
color: #333;
}
#Heading h2
{
font-size: 1.5em;
color: #666;
}
#Heading p
{
margin: 0 0.5em 1.5em 1em;
font-size: 1.1em;
color: #999;
}
And later on you'd get to a page where you'd like your header to have a different background.
Had you chosen to use div#Header in you main css file, you'd either have to change the html (which depending on your system might mean creating a different template/masterpage) to add an extra class, or create a more qualified css selector such as body div#Header.
Using the shortest selector you could still use div#Header { background : ... } to change your header. You can either create an extra css file and load that into your header on that page (if allowed) or add a style definition directly to your <head> section. The nice thing about this is your css file does not grow with selectors for each different page, and you can keep clear of classitis.
You could also use it to switch the sizing method of your page (static/fluid) so that one template/masterpage uses the default css, and the other derives from that template/masterpage and just links a css called FluidWitdth90.css to change the template to 90% width fluid layout.