@media only screen and (max-width: 768px) {
    header {
        display: flex;
        justify-content: space-between;
        height: auto;
        margin-bottom: 1.4rem;
    }
    header a[href] {
        height: 34px;
        padding: 8px 14px;
        font-size: 14px;
        line-height: normal;
    }
    header img {
        width: 94px;
        height: auto;
    }
    header nav {
        display: flex;
        align-items: center;
        position: relative;
    }
    header nav.open .links {
        display: block;
    }
    header nav .links {
        position: absolute;
        right: 68px;
        top: 34px;
        background-color: white;
        border-radius: 2px;
        padding: 18px;
        transition: all .3s ease;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
        z-index: 10;
    }
    header nav .links a[href] {
        color: white;
        margin-right: 20px;
        white-space: nowrap;
        text-align: left;
        width: 100%;
        padding: 10px 20px;
        color: green;
    }
    .hamburger-icon {
        display: block;
        margin: 1rem 1.6rem;
    }
    .hamburger-icon svg {
        width: 40px;
        height: 40px;
        pointer-events: none;
    }
    .login-page form h2 {
        font-size: 22px;
        text-align: center;
        margin-bottom: 22px;
    }
    .login-page form button,
    .login-page form a {
        width: 100%;
    }
    .login-page form a.forgot-password {
        color: rgba(0, 0, 0, .5);
        text-decoration: none;
    }

    .forgot-password-page form h2 {
        font-size: 22px;
        text-align: center;
        margin-bottom: 22px;
    }
    .forgot-password-page form button {
        width: 100%;
    }
    .splash {
        height: 10em;
    }

    .btn-some {
        width: 100%;
        margin: 0;
    }

    .entries-page .tables {
        margin-top: 0 !important;
    }
    .entries-page #entry-form {
        padding: 0;
        margin: 32px 0;
    }
    .entries-page #entry-form h2 {
        padding: 18px 18px 4px;
    }
    .entries-page table tr th,
    .entries-page table tr td {
        padding: 5px 8px;
        white-space: nowrap;
    }
    .entries-page table tr td a {
        height: auto;
        line-height: normal;
        font-size: 16px;
    }

    .signup-entry .entry-form > ul li {
        width: 100%;
        margin-bottom: 2px;
    }
    .signup-entry .entry-form > ul li a {
        margin: 0;
        border-radius: 6px;
        padding: 10px 20px;
        border-color: transparent !important;
    }

    #flashMessage {
        width: 100%;
    }

    #entry-form.entry-details,
    #entry-form.entry-runners {
        padding: 1.6em;
    }
    #entry-form.entry-details h2,
    #entry-form.entry-runners h2 {
        font-size: 20px;
        margin-bottom: 16px;
    }
    #entry-form.entry-runners table td {
        white-space: nowrap;
    }
    #entry-form.entry-runners table td button,
    #entry-form.entry-runners table td a {
        height: auto;
        line-height: normal;
        font-size: 16px;
        white-space: nowrap;
    }
    .pay_entry {
        margin: 0 40px;
        width: auto;
    }

    .table-wrapper {
        overflow-y: auto;
    }
    .table-wrapper table th,
    .table-wrapper table td {
        white-space: nowrap;
    }

    .modal .modal-content {
        width: auto;
        padding: 12px;
    }
    .modal-body {
        padding: 1rem 0;
    }
    .modal-body form h2 {
        font-size: 16px;
        text-transform: uppercase;
        font-weight: bold;
    }
    .modal-body form .input {
        margin-bottom: 8px;
    }
    .modal-body form .input label {
        margin: 0;
    }
    .modal-footer {
        width: 100%;
    }
    .pay-page section {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .completed-entries {
        margin: 0 !important;
    }
    .completed-entries > div {
        margin: 12px 0 !important;
    }
    .completed-entries #entry-form {
        margin: 2em 0;
    }
    .completed-entries #entry-form h2 {
        font-size: 1.2em;
        margin-bottom: 1em;
    }
    table.overview_table td a {
        height: auto;
        line-height: normal;
        font-size: 16px;
        white-space: nowrap;
    }
    .register-page {
        
    }

}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .login-page form h2 {
        font-size: 22px;
        margin-bottom: 18px;
    }
    .login-page form button[type="submit"],
    .login-page form a.btn-green {
        display: block;
        width: 100%;
    }
    .forgot-password {
        color: rgba(0, 0, 0, .5);
        text-decoration: none;
    }
}