/* ********************************************************************************** */
/* general                                                                            */
/* ********************************************************************************** */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
        margin:0;
        padding:0;
}


fieldset,img {
        border:0;
}


select {
        width:150px;
}


h2 {
    margin:10px 0px 10px 0px;
    color: #795d55;
}


/* clearing div */
div#clearing {
       clear:both;
}


/* clearing div for links */
div#clearing_links {
       clear:both;
       height: 20px;
       width: 468px;
}



/* ********************************************************************************** */
/* page setup                                                                         */
/* ********************************************************************************** */

body {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        line-height: 150%;
        color: #646464;
        background-color: #fdf6da;
        text-align: center;       /* IE hack om pagina gecentreerd te krijgen, part 1 */
}


/* full body width top banner background */
div#topbannerfill {
        position: absolute;
        top:0px;
        left:0px;
        width: 100%;
        height: 200px;
        background-color: #ffffff;
        z-index: 1;
}


/* full body width top menu background */
div#topmenufill {
        position: absolute;
        top:200px;
        left:0px;
        width: 100%;
        height: 80px;
        background: url(images/topmenufill_1x80.png) 0 100% repeat-x;
        z-index: 1;
}


/* centered 1024px-width page wrapper */
div#wrapper {
        width: 1024px;
        height: 100%;
        margin-left: auto ;
        margin-right: auto ;
        text-align: left;       /* IE hack om pagina gecentreerd te krijgen, part 2 */
}


/* top logo banner */
div#topbanner {
        position: relative;
        top: 0px;
        left: 0px;
        width: 1024px;
        height: 200px;
        background: #ffffff url(images/sloeries_online_1024x200.jpg) 0 100%;
        z-index: 2;
}


/* top menu */
div#topmenu {
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 80px;
        color: #ffffff;
        background:  url(images/topmenu_silk.png) 0 100%;
        z-index: 2;
}


/* main content wrapper */
div#maincontent {
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        color: #000000;
        background-color: #fdf6da;
}

/* main content top text */
div#maintop {
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        text-align: center;
        color: #795d55;
        background-color: #fdf6da;
}

/* left */
div#left {
        float:  left;
        width:  220px;
        color: #000000;
        background-color: #fdf6da; 
}

/* middle content */
div#content {
        float: left;
        width: 800px;
        color: #000000;
        background-color: #fdf6da; 
}


/* footer */
div#footer {
        margin: 10px 0px 0px 0px;
        position: relative;
        left: 0px;
        width: 100%;
        height: 50px;
        color: #795d55;
        text-align: center;
}



/* ********************************************************************************** */
/* top menu buttons                                                                   */
/* ********************************************************************************** */

/* button wrapper */
div#buttonwrapper {
       position:relative;
       top:   17px;
       left:  30px;
       width: 964px;
       height: 50px;
}

/* home */
div#home {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_home_normal.png) 0 100%;
}

a:hover div#home {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       cursor:pointer;
       background: url(images/Btn_home_gloei.png) 0 100%;
}

div#home.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_home_underline.png) 0 100%;
}

a:hover div#home.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_home_underline_gloei.png) 0 100%;
}



/* live cams */
div#livecams {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_livecams_normal.png) 0 100%;
}

a:hover div#livecams {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       cursor:pointer;
       background: url(images/Btn_livecams_gloei.png) 0 100%;
}

div#livecams.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_livecams_underline.png) 0 100%;
}

a:hover div#livecams.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_livecams_underline_gloei.png) 0 100%;
}



/* movies */
div#movies {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_movies_normal.png) 0 100%;
}

a:hover div#movies {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       cursor:pointer;
       background: url(images/Btn_movies_gloei.png) 0 100%;
}

div#movies.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_movies_underline.png) 0 100%;
}

a:hover div#movies.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_movies_underline_gloei.png) 0 100%;
}



/* links */
div#links {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_links_normal.png) 0 100%;
}

a:hover div#links {
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       cursor:pointer;
       background: url(images/Btn_links_gloei.png) 0 100%;
}

div#links.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_links_underline.png) 0 100%;
}

a:hover div#links.onderstreep{
       float:left;
       width: 200px;
       height: 50px;
       z-index: 4;
       background: url(images/Btn_links_underline_gloei.png) 0 100%;
}