Can't style banner above header

Hello
I’ve used this –

to make a banner and I’ve placed it on just the home page for my site but when I try and edit the css nothing is happening. Am I missing something obvious? I also want to set the height to something quite narrow like 50px high. Thank you.

/*--------------------------------*/

/* Header widget */

/*--------------------------------*/

/* Widget text and background */
#top #header #header_main .widget {
    line-height: 14px;
    color:fff!important;
    background: blue!important;
}

/* Widget title */
#top #header #header_main .widget h3.widgettitle {
    color: #ff0000!important;
}

/* Widget link */
#top #header.header_color #header_main .widget a {
    color: green!important;
}

#top #header.header_color #header_main .widget a:hover {
    background: #000;
    color: #fff;
}