body {
    padding-bottom: 325px
}

#page_contents .card,header,nav.top.persistent,nav.top.with_color {
    background-color: rgba(255,255,255,.9)!important
}

nav#site_nav {
    z-index: 2
}

#page {
    position: absolute;
    overflow: hidden
}

body.loaded #page_contents,body.loaded.animation-complete #page_contents {
    overflow: hidden
}

@media only screen and (min-width: 1441px) {
    .widescreen:not(.nav_open) nav#site_nav {
        background:rgba(255,255,255,.9);
        border-radius: 0 10px
    }
}

#page_contents {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#page_contents .card {
    max-width: 29em
}

#loader {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    -webkit-transition: all .5s ease-out;
    -webkit-transition-property: opacity -webkit-filter -webkit-transform;
    transition: all .5s ease-out;
    transition-property: opacity filter transform
}

#background {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: 100%;
    max-width: none
}

#background,#sprite-wrapper {
    -webkit-transform: translate3d(-33%,0,0);
    transform: translate3d(-33%,0,0)
}

#content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-position: 50% 100%;
    background-size: auto 100%;
    background-repeat: no-repeat;
    opacity: 0;
    -webkit-transform: scale3d(2,2,2);
    -webkit-transition: all .66s ease-in-out;
    -webkit-filter: blur(4px) grayscale(0);
    -webkit-transition-property: opacity -webkit-filter -webkit-transform;
    -webkit-transition-delay: .33s;
    transform: scale3d(2,2,2);
    filter: blur(4px) grayscale(0);
    transition: all .66s ease-in-out;
    transition-property: opacity filter transform
}

@media only screen and (max-width: 767px) {
    body {
        padding-bottom:0
    }

    #content {
        bottom: 0
    }
}

@media only screen and (max-width: 320px) {
    #content {
        bottom:0
    }
}

footer {
    position: absolute;
    padding-top: 16px!important
}

footer .nav_col {
    margin-bottom: 0!important
}

@media only screen and (max-height: 1000px) {
    footer {
        bottom:auto!important;
        top: 100%;
        margin-top: -75px
    }
}

@media only screen and (max-width: 768px) and (max-height:900px) {
    #content {
        bottom:0
    }

    footer {
        bottom: auto!important;
        top: 100%
    }
}

@media only screen and (max-width: 320px) and (max-height:960px) {
    #content {
        bottom:0
    }

    footer {
        bottom: auto!important;
        top: 100%
    }
}

body.signed_in #content {
    bottom: 0
}

body.window_blurred div#content,body.window_blurred div.sprite {
    -webkit-filter: blur(0) grayscale(1);
    filter: blur(0) grayscale(1)
}

#sprite-wrapper {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

body.visible #sprite-wrapper {
    display: block
}

#not-found {
    position: fixed;
    top: 50%;
    left: 50%;
    text-align: center;
    width: 25em;
    height: 8em;
    margin: -4em 0 0 -12.5em;
    border-radius: 8px;
    background: 0 0;
    box-shadow: none;
    opacity: 0;
    -webkit-transform: scale3d(3.5,3.5,3.5);
    -webkit-transition: all .5s ease-in-out;
    -webkit-transition-property: box-shadow background opacity -webkit-transform;
    filter: blur(0);
    transform: scale3d(3.5,3.5,3.5);
    transition: all .5s ease-in-out;
    transition-property: box-shadow background opacity transform;
    -webkit-pointer-events: none;
    pointer-events: none
}

#loader,body.visible #content,body.visible #not-found {
    opacity: 1;
    -webkit-filter: blur(0);
    -webkit-transform: scale3d(1,1,1);
    filter: blur(0);
    transform: scale3d(1,1,1)
}

body.visible #not-found {
    background: rgba(255,255,255,.15);
    background: -webkit-linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.65),rgba(255,255,255,.9));
    background: -moz-linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.65),rgba(255,255,255,.9));
    background: linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.65),rgba(255,255,255,.9));
    box-shadow: 0 0 8px rgba(0,0,0,.125);
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

body.no_transition #content,body.no_transition #not-found {
    -webkit-transition: none;
    transition: none
}

p {
    padding: .25em;
    text-shadow: 0 0 1px #fff
}

.sprite {
    position: absolute;
    -webkit-transform: scale3d(.5,.5,.5);
    -webkit-transition: opacity -webkit-filter .5s ease-out;
    -webkit-transition-property: opacity -webkit-filter;
    transform: scale3d(.5,.5,.5);
    transition: opacity -webkit-filter .5s ease-out;
    transition-property: opacity filter
}

.sprite.flipped {
    -webkit-transform: scale3d(.5,.5,.5) scaleX(-1);
    -webkit-transition-property: opacity -webkit-filter;
    transform: scale3d(.5,.5,.5) scaleX(-1);
    transition-property: opacity filter
}

body.loaded #loader {
    opacity: 0;
    -webkit-filter: blur(8px);
    -webkit-transform: scale3d(2,2,2);
    -webkit-transition: all .5s ease-out;
    -webkit-transition-property: opacity -webkit-filter -webkit-transform;
    filter: blur(8px);
    transform: scale3d(2,2,2);
    transition: all .5s ease-out;
    transition-property: opacity filter transform
}

body.loaded .butterfly_angle {
    width: 70px;
    height: 65px;
    top: 72px;
    background: url(butterfly-angle.png) no-repeat
}

body.loaded .butterfly_angle_1 {
    width: 70px;
    height: 65px;
    top: 96px;
    background: url(butterfly-angle-1.png) no-repeat
}

body.loaded .butterfly_angle.bottom {
    top: 45%
}

body.loaded .butterfly_angle_1.bottom {
    top: 65%
}

body.loaded .butterfly_side {
    width: 70px;
    height: 65px;
    top: 192px;
    background: url(butterfly-side.png) no-repeat
}

body.loaded .butterfly_side.bottom {
    top: 50%
}

body.loaded .butterfly_rooked {
    width: 70px;
    height: 65px;
    top: 128px;
    background: url(butterfly-rooked.png) no-repeat
}

body.loaded .butterfly_rooked.bottom {
    top: 33%
}

.butterfly_angle_lr {
    -webkit-animation: anim 1s steps(19) infinite,movelr 35s linear infinite,sine 4.5s ease alternate infinite;
    animation: anim 1s steps(19) infinite,movelr 35s linear infinite,sine 4.5s ease alternate infinite
}

.butterfly_angle_rl {
    -webkit-animation: anim 1s steps(19) infinite,movelr 35s linear reverse infinite,sine 4.5s ease alternate infinite;
    animation: anim 1s steps(19) infinite,movelr 35s linear reverse infinite,sine 4.5s ease alternate infinite
}

.butterfly_angle_1_lr {
    -webkit-animation: anim 2s steps(33) infinite,movelr 33s linear infinite,sine 3.5s ease alternate infinite;
    animation: anim 2s steps(33) infinite,movelr 33s linear infinite,sine 3.5s ease alternate infinite
}

.butterfly_angle_1_rl {
    -webkit-animation: anim 2s steps(33) infinite,movelr 33s linear reverse infinite,sine 4.5s ease alternate infinite;
    animation: anim 2s steps(33) infinite,movelr 33s linear reverse infinite,sine 4.5s ease alternate infinite
}

.butterfly_side_lr {
    -webkit-animation: anim .5s steps(13) infinite,movelr 30s linear infinite,sine 3s ease alternate infinite;
    animation: anim .5s steps(13) infinite,movelr 30s linear infinite,sine 3s ease alternate infinite
}

.butterfly_side_rl {
    -webkit-animation: anim .5s steps(13) infinite,movelr 30s linear reverse infinite,sine 3s ease alternate infinite;
    animation: anim .5s steps(13) infinite,movelr 30s linear reverse infinite,sine 3s ease alternate infinite
}

.butterfly_rooked_lr {
    -webkit-animation: anim .5s steps(13) infinite,movelr 25s linear infinite,sine 5.5s ease alternate infinite;
    animation: anim .5s steps(13) infinite,movelr 25s linear infinite,sine 5.5s ease alternate infinite
}

.butterfly_rooked_rl {
    -webkit-animation: anim .5s steps(13) infinite,movelr 25s linear reverse infinite,sine 5.5s ease alternate infinite;
    animation: anim .5s steps(13) infinite,movelr 25s linear reverse infinite,sine 5.5s ease alternate infinite
}

.piggy {
    bottom: 5%;
    width: 88px;
    height: 62px;
    background: url(piggy-walk.png) no-repeat
}

.chicken_walk_lr,.piggy_walk_lr {
    -webkit-animation: anim 1s steps(23) infinite,movelr 120s linear infinite;
    animation: anim 1s steps(23) infinite,movelr 120s linear infinite
}

.sprite.chicken_walk_lr {
    margin-left: -172px
}

.chicken_walk_rl,.piggy_walk_rl {
    -webkit-animation: anim 1s steps(23) infinite,movelr 120s linear reverse infinite;
    animation: anim 1s steps(23) infinite,movelr 120s linear reverse infinite
}

#preload {
    position: absolute;
    left: -10px;
    top: -10px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    visibility: hidden;
    background: url(piggy-chew.png),url(piggy-nibble.png),url(piggy-look.png),url(chicken-idle-2.png),url(chicken-look.png),url(chicken-flying.png)
}

.piggy_chewing {
    bottom: 7.25%;
    left: 47.5%;
    width: 88px;
    height: 62px;
    background: url(piggy-look.png) no-repeat;
    -webkit-animation: anim-look-reverse 2s steps(47);
    animation: anim-look-reverse 2s steps(47)
}

.piggy_chewing:hover {
    cursor: -webkit-grab;
    cursor: grab
}

.piggy_chewing.active:hover,.piggy_chewing.piggy_look_once,.piggy_chewing:hover {
    background: url(piggy-look.png) no-repeat;
    -webkit-animation: anim-look 2s steps(47) alternate infinite;
    animation: anim-look 2s steps(47) alternate infinite
}

.piggy_chewing.piggy_look_once {
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1
}

.piggy_chewing.active {
    background: url(piggy-chew.png) 100% 0 no-repeat;
    -webkit-animation: chew 2.208s steps(52) alternate infinite;
    -webkit-animation-iteration-count: 2;
    animation: chew 2.208s steps(52) alternate infinite;
    animation-iteration-count: 2
}

body #sprite-wrapper .piggy_chewing:active {
    cursor: -webkit-grabbing;
    cursor: grabbing;
    background: url(piggy-nibble.png) no-repeat;
    -webkit-animation: anim-nibble 2s steps(59) alternate infinite;
    animation: anim-nibble 2s steps(59) alternate infinite
}

.chicken {
    position: absolute;
    width: 148px;
    height: 110px;
    left: 0;
    top: auto;
    bottom: 4%;
    margin-left: -148px;
    background: url(chicken-walk.png) no-repeat;
    cursor: -webkit-grab;
    cursor: grab
}

.chicken_peck_2x {
    position: absolute;
    width: 148px;
    height: 110px;
    left: 55%;
    top: auto;
    bottom: 4.33%;
    background: url(chicken-peck-2x.png) no-repeat
}

body #sprite-wrapper .chicken_peck_2x.active,body #sprite-wrapper .chicken_peck_2x:hover {
    background: url(chicken-look.png) no-repeat;
    -webkit-animation: chicken-look 2.25s steps(54) alternate infinite;
    -webkit-animation-iteration-count: 2;
    animation: chicken-look 2.25s steps(54) alternate infinite;
    animation-iteration-count: 2
}

.chicken_peck_2x.idle_2 {
    background: url(chicken-idle-2.png) no-repeat;
    -webkit-animation: anim 2s steps(46) infinite;
    -webkit-animation-iteration-count: 1;
    animation: anim 2s steps(46) infinite;
    animation-iteration-count: 1
}

.chicken_peck_2x.pecking {
    -webkit-animation: anim 1.625s steps(39) infinite;
    -webkit-animation-iteration-count: 1;
    animation: anim 1.625s steps(39) infinite;
    animation-iteration-count: 1
}

body #sprite-wrapper .chicken .sub_sprite {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    -ms-pointer-events: none;
    -webkit-pointer-events: none;
    pointer-events: none
}

body #sprite-wrapper .chicken:active {
    background-image: none;
    cursor: -webkit-grabbing;
    cursor: grabbing
}

body #sprite-wrapper .chicken:active .sub_sprite,body #sprite-wrapper .chicken_peck_2x:active {
    background: url(chicken-flying.png) no-repeat;
    -webkit-animation: chicken-fly 1.75s steps(41) infinite;
    animation: chicken-fly 1.75s steps(41) infinite
}

body #sprite-wrapper .chicken:active .sub_sprite {
    display: block
}

@-webkit-keyframes chickenwalk {
    from {
        left: 42%
    }

    to {
        left: 58%
    }
}

@-webkit-keyframes sine {
    from {
        margin-top: -64px
    }

    to {
        margin-top: 64px
    }
}

@keyframes sine {
    from {
        margin-top: -64px
    }

    to {
        margin-top: 64px
    }
}

@-webkit-keyframes bottomsine {
    from {
        margin-bottom: -64px
    }

    to {
        margin-bottom: 64px
    }
}

@keyframes bottomsine {
    from {
        margin-bottom: -64px
    }

    to {
        margin-bottom: 64px
    }
}

@-webkit-keyframes movelr {
    from {
        left: -2%
    }

    to {
        left: 101%
    }
}

@keyframes movelr {
    from {
        left: -2%
    }

    to {
        left: 101%
    }
}

@-webkit-keyframes anim {
    from {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

@keyframes anim {
    from {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

@-webkit-keyframes anim-nibble {
    from {
        background-position: 0 0
    }

    to {
        background-position: -5192px 0
    }
}

@keyframes anim-nibble {
    from {
        background-position: 0 0
    }

    to {
        background-position: -5192px 0
    }
}

@-webkit-keyframes anim-look {
    from {
        background-position: 0 0
    }

    to {
        background-position: -4136px 0
    }
}

@keyframes anim-look {
    from {
        background-position: 0 0
    }

    to {
        background-position: -4136px 0
    }
}

@-webkit-keyframes anim-look-reverse {
    from {
        background-position: -4136px 0
    }

    to {
        background-position: 0 0
    }
}

@keyframes anim-look-reverse {
    from {
        background-position: -4136px 0
    }

    to {
        background-position: 0 0
    }
}

@-webkit-keyframes chew {
    from {
        background-position: -4576px 0
    }

    to {
        background-position: 0 0
    }
}

@keyframes chew {
    from {
        background-position: -4576px 0
    }

    to {
        background-position: 0 0
    }
}

@-webkit-keyframes chicken-look {
    from {
        background-position: 0 0
    }

    to {
        background-position: -7992px 0
    }
}

@keyframes chicken-look {
    from {
        background-position: 0 0
    }

    to {
        background-position: -7992px 0
    }
}

@-webkit-keyframes chicken-fly {
    from {
        background-position: 0 0
    }

    to {
        background-position: -6068px 0
    }
}

@keyframes chicken-fly {
    from {
        background-position: 0 0
    }

    to {
        background-position: -6068px 0
    }
}

.admin-timings-wrapper,body.debug #page,body.debug #page_contents,body.debug footer {
    position: relative
}