My header is making my nav. strip huge Options

[JYCT]

Here's my livejournal link: http://tosetmefree.livejournal.com/

CODE

GLOBAL_HEAD<=
<style type="text/css">

<!--
table {
width: 500px;
margin-left: auto;
margin-right: auto;
border: 10px solid #000000;
}
table table {
width: 100%;
margin:0;
border:0;
}
table table table {
width: auto;
}
table table table table {
border: 0;
}
body, td, .comments, .caption, .index  {
background-color: #FFFFFF;
}
b {
color: #0EBFE9;
}
a {
color: #0EBFE9;
cursor: crosshair;
}
body, html, td, font, div, p {
font-family: Tahoma;
font-size: 7pt;
color: #777777;
}
body {
background-color: black;
background-image: url(http://img442.imageshack.us/img442/1369/untitled2vo5.jpg);
background-repeat: repeat;
background-position: top left;
}

div {
background-image: url(http://img104.imageshack.us/img104/811/ljheadertakemeanywherebyl6.png);
background-repeat: no-repeat;
background-position: center;
padding-top: 100%;
margin: auto;
}

body {
  scrollbar-arrow-color: #0EBFE9;
  scrollbar-track-color: #A8A8A8;
  scrollbar-face-color: #DCDCDC;
  scrollbar-highlight-color: #0EBFE9;
  scrollbar-3dlight-color: #0EBFE9;
  scrollbar-darkshadow-color: #0EBFE9;
  scrollbar-shadow-color: #0EBFE9;
cursor:crosshair
}

a:hover {
color: #00a3ca;
cursor: crosshair;
text-decoration: italic;
}
p .index {
color: #00a3ca;
font-size: 0pt;
text-align: center;
}
.entrybox .caption {
display: none;
}
.comments {
text-align: center;
font-size: 7pt;
}
tr.caption{
display:none;
}
.shadowed td div{
visibility: hidden;
position: absolute;
top: 1px
}
.shadowed img{
visibility:hidden;position:absolute;top:0
}
.nav {
font-size: 25pt !important;
padding: 0px;
font-family: tahoma;
}
.entrybox .caption{
display: none;
}

b {
font-family:tahoma;
font-size:11;
color: #0EBFE9;
font-weight: bold;
text decoration: none;
letter spacing:0px;
text-transform:lowercase;
padding: 0px;
line-height: 10px;
}

u {
font-family:tahoma;
font-size 11;
color:#777777;
font-weight:normal;
border-bottom: 2px solid;
border-bottom-color: #777777;
}

i {font-family:tahoma;
font-size: 10;
color:#777777;
font-weight:normal;
}

s {color:#777777;
font-family:tahoma;
font-size:12;
text-transform:none;
text-decoration:bold;
}
-->

</style>

<title>eclipse.my.worldx</title>
<=GLOBAL_HEAD

My header has a random slice of it in my nav. strip and theres a huge space between the top and where my actual header is?
I can't explain what's wrong with it, its a lot more easier just looking at my LJ to show whats wrong with the coding lol

and how can I move my header a bit down?

thank you

[*Azarel*]

This part of your coding is causing your header image to show up in your navigation strip:

div {
background-image: url(http://img104.imageshack.us/img104/811/ljheadertakemeanywherebyl6.png);
background-repeat: no-repeat;
background-position: center;
padding-top: 100%;
margin: auto;
}

because there is a div in the navigation strip. If I were you, I'd put the header image into its own div class to fix that as well as move it down. Try referencing the coding from this thread.