html - How to stop Navbar overlapping my blog's slider and article headers? -

blog link: http://confabtest.blogspot.co.uk/

the navbard on blog overlapping other elements such featured article slider, , when open article top of header , social sharing widget on side partially overlapped.

http://imm.io/voxw

anyone know how can fix this?

here code navbar:

.menu-secondary-container{position:relative;height:40px;z-index:300;background:#000;padding-left:5px} .menu-secondary{} .menu-secondary ul{min-width:160px} .menu-secondary li a{color:#fff;padding:12px 15px 11px 15px;text-decoration:none;font:12px 'oswald',sans-serif;text-transform:uppercase} .menu-secondary li a:hover,.menu-secondary li a:active,.menu-secondary li a:focus,.menu-secondary li:hover > a,.menu-secondary li.current-cat > a,.menu-secondary li.current_page_item > a,.menu-secondary li.current-menu-item > a{color:#000;background:url(http://www.colorhexa.com/ff0033.png) repeat-x;outline:0} .menu-secondary li li a{color:#fff;background:#51abee;padding:10px 15px;text-transform:none;margin:0;font-weight:normal} .menu-secondary li li a:hover,.menu-secondary li li a:active,.menu-secondary li li a:focus,.menu-secondary li li:hover > a,.menu-secondary li li.current-cat > a,.menu-secondary li li.current_page_item > a,.menu-secondary li li.current-menu-item > a{color:#51abee;background:#000;outline:0} .menu-secondary a.sf-with-ul{padding-right:26px;min-width:1px} .menu-secondary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:13px 13px 0 0} .menu-secondary li li .sf-sub-indicator{padding:9px 13px 0 0} .wrap-menu-secondary .sf-shadow ul{background:url('http://1.bp.blogspot.com/-duec7hcoya4/tuh_aes2pzi/aaaaaaaabuy/pkxmvzomjkw/s1600/menu-secondary-shadow.png') no-repeat bottom right} 

in html @ div next div header-wrapper

<div class="span-24" style="height: 0pt;"> 

remove style attribute on div. should fix issue.