FAQ list, linkage not working

[noholdsbarned]

Hi all,

I'm having my faqs linked to the answer on the same page. Everything seems to be coded correctly, and it works, but will then cut off everything above the linked paragraph.

To get a visual, visit http://coachingbycarminda.com/test/faq.html, and click on question 1. It will go to answer 1, on the same page, but when you try to scroll back up to the top, everything disappears.

I thought it might be an issue with my "overflow: hidden;" property on the container div, which holds all my content, but if i remove that then everything goes crazy.

any suggestions?

[noholdsbarned]

This is the CSS code used for the site.



/* CSS Document */

body {
background-color: #4e7383;
font-family: Helvetica, Arial, sans-serif;
color: #602810;
}

a:link, a:visited, a:active {
color: #4e7383;
text-decoration: none;
}

a:hover {
color: #602810;
text:decoration:none;
}


p {
font-family: Helvetica, Arial, sans-serif;
font-size: 10pt;
color: #602810;
padding-left: 10px;
padding-top: 10px;
margin: 20px;
line-height:14px;
}

span {
font-family: Helvetica, Arial, sans-serif;
font-size: 10pt;
font-color: #602810;
}

p.headline {
font-family: "Book Antiqua", Palatino, Georgia, Times, serif;
color: #3b3b3a;
font-size: 16px;
letter-spacing: 0.3em;
}

p.subheadline {
font-family: "Book Antiqua", Palatino, Georgia, Times, serif;
color: #4c1b1b;
font-size: 14px;
line-height: 16px;
letter-spacing: 0.05em;
}

p.subheadline span, p.headline span {
font-family: Helvetica, Arial, sans-serif;
font-size: 10pt;
letter-spacing: 0.01em;
line-height: 18px;
}

/* optional header tags -- not being used

h2 {
font-family: "Book Antiqua", Palatino, Georgia, Times, serif;
color: #3b3b3a;
padding-left: 20px;
}

h4 {
font-family: "Book Antiqua", Palatino, Georgia, Times, serif;
color: #4c1b1b;
font-size: 11pt;
line-height: 6pt;
letter-spacing:0.01em;
}

*/

p.quote {
font-family: "Book Antiqua", Palatino, Georgia, Times, serif;
color: #4e7383;
font-size: 18px;
letter-spacing: -0.009em;
line-height: 18px;
}


ul, li {
font-family: Helvetica; Arial; sans-serif;
font-size: 12px;
padding-right: 6px;
padding-left: 1em;
margin-left: 15px;
line-height: 20px;
left: 10px;
}


ul.left {
float: left;
width: 300px;
margin: 0px 0px;
padding: 0px 0px;
border: 0px none;
list-style-position: outside;
list-style-type: normal;
position: relative;
left: 50px;
}

ul.right {
float: right;
width: 300px;
margin: 10px 0px;
padding: 0 0 5px 0;
border: 0px none;
list-style-position: inside;
list-style-type: normal;
}

.no-space {
margin: 0px;
padding: 0px;
}


#clear {
height: 20px;
width: 800px;
clear: both;
margin: 0px;
}

#container {
position: relative;
margin-left: auto;
margin-right: auto;
width: 800px;
margin-top: 40px;
overflow: hidden;
}

#kitty {
z-index:100;
position:absolute;
left: 590px;
top: -10px;
}

#masthead {
float: left;
width: 800px;
height: 67px;
background-image: url(images/masthead.png);
background-repeat: no-repeat;
z-index:100;
}

/* Menu declarations start here */
div#menu {
float: left;
width: 800px;
height: 30px;
background-color: #9e563d;
padding: 10px 0 0 0;
}

div#menu ul {
margin: 0 0 10px -13px;
}

div#menu li {
float: left;
font-family: Helvetica; Arial; sans-serif;
font-size: 13px;
padding: 0 4px;
background-color: #9e563d;
list-style-type: none;
}

div#menu a {
font-family: Helvetica; Arial; sans-serif;
font-size: 13px;
text-decoration: none;
padding: 0 4px;
color: #fff;
}


div#menu a:hover {
font-family: Helvetica; Arial; sans-serif;
color:#681b00;
text-decoration:none;
}
/* Menu declarations end here */

#content {
float: left;
width: 600px;
background-color: #f4eee4;
margin-bottom: -1500px;
padding-bottom: 1500px;
}

#sidebar {
float: left;
width: 200px;
background-color: #bebab2;
padding-top:100px;
margin-bottom: -1500px;
padding-bottom: 1500px;
}

#bottom {
float: left;
width: 800px;
background-color: #4e7383;
background-image: url(images/bottom_corners.png);
background-repeat: no-repeat;
}