@media only screen and (max-width: 780px) {
    body, .btn {
        font-size: 1.25rem;
    }

    .header {
        padding: 0;
        background-color: white;

        .logo {
            background-color: var(--primary-color);
            padding: 0.5em;

            img {
                width: 80%;
                display: block;
                margin-left: auto;
                margin-right: auto;
            }
        }
    }

    .sub_header {
        margin: 0.5em;

        a, button {
            color: var(--primary-color);
            background-color: white;
            margin: 0;
        }

        img {
            filter: brightness(0) saturate(100%) invert(48%) sepia(22%) saturate(957%) hue-rotate(198deg) brightness(88%) contrast(81%);
        }

        #help_link {
            padding-left: 5em;
        }
    }

    #data_break {
        width: 100%;
    }

    #scenario {
        margin-left: 1em;
        margin-right: 1em;
    }

    #menu_toggle {
        top: unset;
        left: unset;
    }

    #menu {
        padding-left: 25px;
        margin: -50px 0 0 -25px;

        .card_menu {
            right: 10px;
        }

        h5 li {
            width: 200px;
        }
    }

    #login, #logout {
        padding: 6px;
    }

    #users_list {
        margin-left: 6em;
    }

    #admin_users_list {
        margin-left: 1em;
        margin-right: 1em;

        li {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
    }

    #your_data_form {
        justify-content: space-between;

        .col {
            flex: 0 0 46%;
        }
    }

    .notification_alert {
        width: auto;
    }
}

@media only screen and (max-width: 992px) {
    #your_data_form {
        justify-content: space-between;

        .col {
            flex: 0 0 42%;
        }
    }

    #card_section_switcher {
        input[type="radio"] {
            width: 0;
            height: 0;
        }

        input[type="radio"]:checked+label  {
            img {
                width: 50px;
                height: 50px;
                filter: invert(48%) sepia(22%) saturate(957%) hue-rotate(198deg) brightness(88%) contrast(81%);
                transition: width 0.5s;
            }
        }

        input[type="radio"]:not(:checked)+label {
            img {
                width: 25px;
                height: 25px;
                filter: invert(82%) sepia(6%) saturate(114%) hue-rotate(202deg) brightness(86%) contrast(77%);
                transition: width 0.5s;
            }
        }

        input[type="radio"]+label {
            background: none;
            border: none;
            cursor: pointer;
        }
    }

    .hidden_card {
        display: none;
    }

    .money_input, .age_input, .percent_input {
        input {
            padding-right: 0.15em;
            padding-left: 0.15em;
        }
    }

    .card_section {
        background: none;
    }

    .notification_modal {
        .modal-content {
            margin-top: 75vh;
        }
    }

    #card_forms {
        font-size: 1.4rem;
    }

    .generated_data {
        margin-right: -10px !important;
        margin-left: -10px !important;
    }

    #table_graph {
        margin-right: -10px !important;
        margin-left: -10px !important;
    }

    #last_saved {
        padding-right: 10px;
    }

    button:hover {
        background-color: var(--secondary-color);
        color: white;
    }

    button:focus {
        background-color: var(--secondary-color);
        color: white;
    }

    #income_card form:first-of-type {
        min-height: unset;
    }

    .drag_and_drop {
        display: block;
        position: absolute;
        left: 25px;
        cursor: pointer;
    }

    .additional_card_header, #income_card form:first-of-type .additional_card_header {
        width: 80%;
    }
}