/* reset + utils */
table{
    border-collapse: collapse;
    border-spacing: 0;
}
.clr, .clear{
    clear: both;
    height: 0px;
}

form{
    margin: 0;
    padding: 0;
}

#preload1{
    visibility: hidden;
    background: url(../images/gfx_hover.png);
    height: 0;
    width: 0;
}

hr{
    color: #000;
    background-color: #000;
    height: 1px;
    margin-top: 16px;
    margin-bottom: 16px;
    margin-right: 50%;
    padding: 0;
}

/* global */

body{
    background: #fff;
    margin: 27px 50px 50px 34px;
    font-family: arial, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

a:link, a:visited{
    color: #006100;
    text-decoration: underline;
}
a:hover{
    text-decoration: none;
}

/* layout */
div#everything{
    width: 916px;
}

div#navigation_col{
    float: left;
    width: 566px;
}

div#navigation_wrapper{
    background: url(../images/gfx.png) no-repeat;
    width: 514px;
    height: 516px;
}

div#content_col{
    float: left;
    width: 350px;
    padding-top: 23px;
}

/* navigation links */
div#home a:link, div#home a:visited,
div#link1 a:link, div#link1 a:visited,
div#link2 a:link, div#link2 a:visited,
div#link3 a:link, div#link3 a:visited,
div#link4 a:link, div#link4 a:visited,
div#link5 a:link, div#link5 a:visited{
    display: block;
}

div#home{
    float: left;
    margin-left: 0px;
    margin-top: 0px;
}

div#home a:link, div#home a:visited{
    width: 187px;
    height: 112px;
}
div#link1{
    float: left;
    padding-left: 143px;
    padding-top: 39px;
}
div#link1 a:link, div#link1 a:visited{
    width: 113px;
    height: 73px;
}
div#link1 a:hover, div#link1 a.active:link, div#link1 a.active:visited{
    background: url(../images/gfx_hover.png);
    background-position: -330px -39px;
}

div#link2{
    float: left;
    padding-left: 216px;
    padding-top: 29px;
}
div#link2 a:link, div#link2 a:visited{
    width: 115px;
    height: 92px;
}
div#link2 a:hover, div#link2 a.active:link, div#link2 a.active:visited{
    background: url(../images/gfx_hover.png);
    background-position: -216px -141px;
}

div#link3{
    float: left;
    padding-left: 60px;
    padding-top: 60px;
}
div#link3 a:link, div#link3 a:visited{
    width: 110px;
    height: 27px;
}
div#link3 a:hover, div#link3 a.active:link, div#link3 a.active:visited{
    background: url(../images/gfx_hover.png);
    background-position: -391px -172px;
}

div#link4{
    padding-left: 344px;
    padding-top: 18px;
}
div#link4 a:link, div#link4 a:visited{
    width: 98px;
    height: 93px;
}
div#link4 a:hover, div#link4 a.active:link, div#link4 a.active:visited{
    background: url(../images/gfx_hover.png);
    background-position: -344px -251px;
}

div#link5{
    padding-left: 134px;
    padding-top: 35px;
}
div#link5 a:link, div#link5 a:visited{
    width: 65px;
    height: 75px;
}
div#link5 a:hover, div#link5 a.active:link, div#link5 a.active:visited{
    background: url(../images/gfx_hover.png);
    background-position: -134px -379px;
}

/* content */

/* green: #006100 */

h1, h2, h3, h4{
margin: 0;
padding: 0;
font-size: 12px;
font-weight: bold;
color: #006100;
line-height: 16px;
}

strong{
    font-weight: bold;
    color: #006100;
}


/* player */
div.mp3row{
    margin-bottom: 10px;
    line-height: 21px;
}

div.mp3row div.author{
    float: left;
    width: 67px;
    font-weight: bold;
    color: #006100;
}

div.mp3row div.noflash{
    font-weight: bold;
    background: black;
    color: white;
}

div.mp3row div.player_wrapper{
    float: left;
    width: 40px;
}

div.mp3row div.title{
    float: left;
    width: 243px;
}

div.mp3row div.listen{
    float: left;
    width: 87px;
    font-weight: bold;
    color: #006100;
}

div.mp3row div.player_wrapper2{
    float: left;
    width: 30px;
}

div.mp3row div.input_field{
    float: left;
    width: 233px;
}



/* forms */

input.text{
    width: 230px;
    margin-top: 16px;
    margin-bottom: 16px;
}

textarea.textarea{
    width: 234px;
    margin-top: 16px;
    margin-bottom: 16px;
}

input.guess{
    width: 135px;
}