html,body,ul,li {
    margin: 0px;
    font-family: helvetica,verdana;
}

body {
    min-width: 900px;
}

a {
    text-decoration: none;
}

#header {
    width: 100%;
    height: 124px;
    background-image: url(../images/headerBg.png);
}

#logo {
    width: 586px;
    height: 124px;
    background-image: url(../images/headerLogo.png);
}

#section1 {
    z-index: 100;
    width: 100%;
    height: 100vh;
    background-color: #76c925;
    min-height: 600px;
}

#menus {
    text-align: center;
    position: fixed;
    top: 400px;
    width: 100%;
    background-color: white;
    z-index: 200;
    -skrollr-animation-name: menus-anim;
    white-space: nowrap;
}

#bottom-container {
}

#section2 {
    width: 100%;
    height: 400px;
    background-color: white;
}

#section3 {
    width: 100%;
    height: 400px;
    background-color: yellow;
}

@-skrollr-keyframes menus-anim {
    0 {
        top[swing]: 400px;
        height[swing]: 130px;
    }

    450 {
        top[swing]: 0px;
        height[swing]: 100px;
    }
}

@-skrollr-keyframes mainmenu-anim {
    0 {
        transform[swing]:scale(1) translate(-0%, 0);
    }

    200 {
        transform[swing]:scale(0.8) translate(-12%, 0);
    }
    450 {
        transform[swing]:scale(0.75) translate(-12%, 0);
    }
}

@-skrollr-keyframes mainmenu-ul-anim {
    0 {
        transform[swing]:translate(0px, 0px);
    }

    200 {
        transform[swing]:translate(0px, -15px);
    }
    450 {
        transform[swing]:translate(0px, -15px);
    }
}

.mainmenu {
    text-align: left;
    display: inline-block;
    margin: 0px auto;
    white-space: nowrap;
    -skrollr-animation-name: mainmenu-anim;
    color: #777777;
}

.mainmenu a {
    color: #777777;
}

.mainmenu a:active {
    color: #777777;
}

.mainmenu a:visited {
    color: #777777;
}

.mainmenu a:hover {
    color: #000000;
    transform: scale(1.1);
}

.mainmenu ul {
    margin: 15px 0px 0px;
    -skrollr-animation-name: mainmenu-ul-anim;
}

.mainmenu li {
    margin: 0px;
    display: inline-block;
    font-size: 12pt;
}

.mainmenu a {
    display: inline-block;
    text-align: center;
    min-width: 85px;
}

.mainmenu img {
    display: block;
    margin: 0px auto 8px;
}

#menulogo {
    float: left;
    display: inline-block;
    width: 0px;
    height: 100px;
    background-image: url(../images/headerLogo2.png);
    background-size: 100%;
    background-repeat: no-repeat;
    -skrollr-animation-name: menulogo-anim;
}

@-skrollr-keyframes menulogo-anim {
    0 {
        width: 0px;
        opacity: 0.0;
    }

    200 {
        width: 382px;
        opacity: 0.2;
    }

    400 {
        opacity: 1.0;
        width: 382px;
    }
}

#topcontent {
    position: absolute;
    top: 130px;
    width: 100%;
    height: 250px;
}

#topcontent .csc-default {
    margin: 10px 40px;
    height: 230px;
}
