Need Help RE: <div> Not displaying properly

[KatMoody]

Hi -
I created a social box using the various social plugin elements (FB Like box, Google Badge code, etc) and am still playing with the carious elements I want to display in it, but wanted to make sure the code was working properly before sharing it with others.

Previously, I had this set up in my sidebar and it displayed properly. Now I have a small widget area in my header and I'm not sure if I changed something by mistake when I switched out my code or not, but I can't get one part of my "box" to work properly.

I should note I am a newbie to coding, though I'm not afraid to learn!

So, here is the CSS I added to custom.css file to enable my social section:

/* Kat's Social Box */
body.custom div#KatSocial {
  border-bottom-color:#B86969;
  border-bottom-left-radius:5px 5px;
  border-bottom-right-radius:5px 5px;
  border-bottom-style:solid;
  border-bottom-width:2px;
  border-left-color:#B86969;
  border-left-style:solid;
  border-left-width:1px;
  border-right-color:#B86969;
  border-right-style:solid;
  border-right-width:1px;
  border-top-color:#B86969;
  border-top-left-radius:5px 5px;
  border-top-right-radius:5px 5px;
  border-top-style:solid;
  border-top-width:2px;
  width:440px;
}
body.custom div#KatSocialSectA {
  background:##ECE5E5 !important;
  border-bottom-color:#B86969;
  border-bottom-width:1px;
  border-top-color:#B86969;
  border-top-style:solid;
  border-top-width:1px;
  padding-bottom:5px;
  padding-left:10px;
  padding-right:10px;
  padding-top:5px;
}
body.custom div#KatSocialSectB {
  background:#DDC5C5;
  border-bottom-color:#B86969;
  border-bottom-width:1px;
  border-top-color:#B86969;
  border-top-style:solid;
  border-top-width:1px;
  padding-bottom:5px;
  padding-left:10px;
  padding-right:10px;
  padding-top:5px;
}
body.custom div#KatSocialSectC {
  background:##FFFFFF !important;
  border-bottom-color:#B86969;
  border-bottom-width:1px;
  border-top-color:#B86969;
  border-top-style:solid;
  border-top-width:1px;
  padding-bottom:5px;
  padding-left:10px;
  padding-right:10px;
  padding-top:5px;
}
body.custom div#KatSocialSectD {
  background:#CC9999;
  border-bottom-color:#B86969;
  border-bottom-width:1px;
  border-top-color:#B86969;
  border-top-style:solid;
  border-top-width:1px;
  padding-bottom:5px;
  padding-left:10px;
  padding-right:10px;
  padding-top:5px;
  position: relative;
  float: left;
  width: 420px;
}

I'm using Headway, if that makes a difference to anyone. For some reason, the first part of this, the "KatSocial" part - isn't displaying properly. It looks like it is not wrapping around the other elements.

Rather than post the code for the widgeted area, you can go to my site and see this in action on my homepage, on the upper right side of the header area:

http://katscafe.org

I'll be changing out some elements but the actual problem seems to be that the "KatSocial" element won't wrap around the other elements (even though it did before). I don't know if I need to code it a little differently or something?

Please help this newbie to coding out? This is driving me crazy!

--Kat