@import 'includes/vars';
@import 'includes/mixins';
@import 'includes/grid';
@import 'includes/fonts-milk';

html {
    background: url('/media/img/bg-content.png') repeat fixed 0% 0% #f6f6f1;
}

/* open auth login header */
.oauth-login-options span {
    color: #fff;
}

/* demos page */
.section-demos {
    background: #c0c4c8;
    min-width: 0;

    use-white-logo();

    main {
        background: transparent;
    }

    &:not(.devderby) {
        override-main-nav-color(#fff);

        #main-header {

            .search-wrap {
                background-color: rgba(255, 255, 255, 0.2);

                &, input, .search-trigger {
                    color: #fff !important;
                }
            }
        }
    }

    /* dev derby landing - legacy offsets */
    &.devderby.landing {

        main {
            .center {
                max-width: 980px; /* bandaid to keep the page looking good in the redesign */
            }
        }

        .main, .sub {
            float: left;
        }

        .main {
            @extend $column-main;
        }

        .sub {
            @extend $column-strip;
        }

        #challenge-prizes {
            padding: 0;
        }
    }

    /* remove ugly button styles */
    .button, button {
        &, &:link, &:visited {
            color: #fff;
        }
        box-shadow: none;
    }

    .gallery-head {
        position: relative;
        z-index: 11;
    }
}

/* allow demo blocks for flow freely with site width */
.gallery {
    .demo {
        display: inline-block;
        vertical-align: text-top;
        float: none;
        margin: 20px 20px 0 0;
    }
}

#demostudio.landing, #demostudio.detail {
    background-position: center 0px;
}
