/* === Layout Section === */
body {
    margin: auto;
    padding: 0;
    background:  #c4deff url(img/body-bg.gif) repeat;
    font-family:  'Pt Sans', Helvetica, Arial, Verdana, sans-serif;
    font-size: 62.5%;
    text-align: left;
    color: #014d7c;
    overflow: hidden;
}
a {
    color: #014d7c;
    text-decoration: underline;
}
a:hover, a:focus {
    text-decoration: none;
}

/* === Main Section === */
#ribbon {
    width: 726px;
    height: 311px;
    margin: 0 auto 0 auto;
    background: url(img/ribbon.png) no-repeat;
    overflow: hidden;
    position: relative;
    z-index: 100;
}
#ribbon h1 {
    display: none;
}
#ribbon p {
    text-align: center;
    font-size: 1.4em;
    line-height: 1.92em;
    width: 465px;
    margin: 135px auto 0 auto;
}
#ribbon .buttons {
    width: 465px;
    overflow: hidden;
    margin: 40px auto 0 auto;
}
#ribbon .back-to-homepage {
    display: block;
    float: left;
    width: 180px;
    height: 34px;
    text-indent: -9999px;
    background: url(img/button-catchthefish.gif) no-repeat;
}
#ribbon .back-to-homepage:hover {
    background-position: -180px;
}
#ribbon .search-on-site {
    width: 228px;
    height: 34px;
    line-height: 34px;
    background: url(img/search-bg.gif) no-repeat;
    border: 0;
    color: #fff;
    padding-left: 30px;
    font-size: 1.4em;
    font-family: 'Pt Sans';
    float: right;
}
#menu {
    margin: auto;
    width: 280px;
    position: relative;
    z-index: 100;
}
#menu li {
    float: left;
    font-size: 1.4em;
    margin-right: 35px;
}
#menu li.last {
    margin-right: 0;
}
#content-wrapper {
    overflow: hidden;
    position: absolute;
    top:0;
    left: 0;
}

/* === Graphic section === */
#clouds {
    width: 941px;
    height: 86px;
    background: url(img/clouds.png) no-repeat center;
    margin: 70px auto 0 auto;
    position: relative;
    z-index: 50;
}
#rod {
    width: 369px;
    height: 255px;
    background: url(img/rod.png) no-repeat;
    position: absolute;
    z-index: 50px;
    left: 0;
    bottom: 0px;
}
#waves {
    position: absolute;
    z-index: 50;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 103px;
}
#waves .wave1 {
    height: 144px;
    width: 100%;
    background: url(img/wave1.png) center repeat;
    z-index: 30;
}
#waves .wave2 {
    height: 116px;
    width: 100%;
    background: url(img/wave2.png) center repeat;
    z-index: 20;
}
#waves .wave3 {
    height: 116px;
    width: 100%;
    background: url(img/wave3.png) center repeat;
    z-index: 10;
}
#waves .parallax-layer {
    position: absolute;
}