How do I get my Caroufredsel to open properly initially without page refresh?

How do I get my Caroufredsel to open properly initially without page refresh?

Here are a couple of screenshots. The first an initial page load (history and cache cleared), ...



and the second after refreshing (also works once in cache).



See how it only displays the tops of the images, initially and how it displays more than the four to the right in the carousel?

Again, works fine after reloading the page, but to someone new to the site, this wouldn't be ideal.

If it's in the CSS, here is what I have:

.carousel {
    position: relative;
    font-size: 80%;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    width: 560px;
}

.image_carousel {
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 16px;
}
.image_carousel img {
    border: 1px solid #ccc;
    background-color: white;
    display: block;
    float: left;
    margin-top: 3px;
    margin-right: 4px;
    margin-bottom: 3px;
    margin-left: 4px;
    padding: 7px;
}

Thanks for any advice.

Dave