@media only screen and (max-width: 840px) {
    body {
        font-size: 13px;
    }
    select, input, textarea {
        width: 100%;
    }

    .flex {
        display: flex;
        flex-direction: column-reverse;
    }

    .flex-left, .flex-right {
        flex-basis: 100%;
        margin-right: 0;
    }

    .top-nav, .nav-tabs, .login-form {
        display: none;
    }

    .header {
        background-image: none;
    }

    .main {
        padding: 10px;
    }

    .navbar-nav > li > a {
        padding-left: 30px;
    }

    .footer a {
        display: none;
    }

    .table {
        /*display: none;*/
    }

    .sm-hide {
        display: none;
    }

    .sm-only {
        display: block;
    }

    .pull-right {
        float: none !important;
    }

    .navbar {
        border-top: none;
    }

    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
}