Custom CSS for three custom header widgets?

Hi guys,
So I have three custom widgets int he header. I currently have these two:
A) Shows a small digital clock via the ‘Date and Time’ widget plugin
B) Shows a small stock ticker

However, I need a third one, which needs to be displayed above the top one (A)).
C) Needs to show todays date via the ‘Date and Time’ widget plugin used in (A).

The three widgets should be aligned directly under each other. Now, I have already added the third header as a widget named ‘header3’, and it is also in my functions.php file. The widget is displaying in the header, but it is apparently using the same CSS as the one in (A).
I cannot seem to find the right selector so that I can move the new, third widget onto its own line.

My CSS is as follows:

/* Header Widget header1: clock CSS */
#header .widget {
left: 89%;
padding-top: 0px;
position: absolute;
top: -50%;
padding-bottom: 0px;
z-index: 1;
}

/* Header Widget header2 Stock Ticker */
#header #text-8 {
left: 90%;
padding-top: 0px;
position: absolute;
top: 0%;
padding-bottom: 0px;
z-index: 1;
}

/* Header Widget header3: Date */
#header3 .widget {
left: 89%;
padding-top: 0px;
position: absolute;
top: -75%;
padding-bottom: 0px;
z-index: 1;
}

What selector should I apply to the last widget’s CSS?

Thanks!