﻿@media only screen and (max-width: 850px) {
    header .float-left, header .float-right {
        float: none;
    }

    header .site-title {
        margin: 10px;
        text-align: center;
    }

    #login {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
    }

        #login ul {
            margin: 5px 0;
            padding: 0;
        }

        #login li {
            display: inline;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #login a {
            /*background: none;*/
            /*color: #999;*/
            /*font-weight: 600;*/
            margin: 2px;
            padding: 0;
        }

            #login a:hover {
                /*color: #333;*/
            }

    nav {
        margin-bottom: 5px;
    }

        nav ul {
            margin: 0;
            padding: 0;
            text-align: center;
        }

            nav ul li {
                margin: 0;
                padding: 0;
            }


    .main-content, .featured + .main-content {
        background-position: 10px 0;
    }

    .content-wrapper {
        padding-right: 10px;
        padding-left: 10px;
    }

    .featured .content-wrapper {
        padding: 10px;
    }

    article, aside {
        float: none;
        width: 100%;
    }

    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

        ol.round li {
            padding-left: 10px;
            margin: 25px 0;
        }

            ol.round li.zero, ol.round li.one, ol.round li.two, ol.round li.three, ol.round li.four, ol.round li.five, ol.round li.six, ol.round li.seven, ol.round li.eight, ol.round li.nine {
                background: none;
            }

    section.feature {
        float: none;
        padding: 10px;
        width: auto;
    }

        section.feature img {
            color: #999;
            content: attr(alt);
            font-size: 1.5em;
            font-weight: 600;
        }

    input {
        width: 90%;
    }

    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

        #loginForm .validation-error {
            display: block;
            margin-left: 15px;
        }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }


    footer .float-left, footer .float-right {
        float: none;
    }

    footer {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

        footer p {
            margin: 0;
        }
}
