How to reduce the margin between header banner and contents?

Hi everyone, can anybody please tell me what can i do to reduce the distance (margin) between header banner and contents of my page as shown in this attachment? Thank you very much.

Best Regards,
WendyT

in your style.css file experiemnt with the #mainWrapper and #headerWrapper attributes.

#headerWrapper {
PADDING-BOTTOM: 0em;
BACKGROUND-COLOR: #252736;
MARGIN: 0em;
PADDING-LEFT: 0em;
PADDING-RIGHT: 0em;
PADDING-TOP: 0em
}
#mainWrapper {
PADDING-BOTTOM: 0em;
BACKGROUND-COLOR: #252736;
MARGIN: 0em;
PADDING-LEFT: 0em;
PADDING-RIGHT: 0em; PADDING-TOP: 0em
}

#logoWrapper {
BACKGROUND-IMAGE: url(../images/header_bg2.jpg); BACKGROUND-COLOR: #0b0c0f;
WIDTH: 100%;
BACKGROUND-REPEAT: no-repeat;
HEIGHT: 51px
}

padding and height stuff can affect those areas so maybe experiemnt with the developer tools within your browser, as many let you affect changes real time to see your adjustment's effects on the page within your browser.
just navigate to your page, and open the css section of the developer tool, and enter some other paddings, and heights, to watch the effects before finalizing them in your actual css file.

also review the use of templates, to protect your changes from being overwritten with upgrades. see "template overrides" in the tutorials section.