@media only screen and (max-width: 720px) {

    main {
        width: 100%;
    }

    .intro {
        height: 250px;
    }

    .intro h1 {
        font-size: 30px;
    }

    form {
        display: flex;
        flex-direction: column;
        justify-content: start;
        background-color: rgba(255, 255, 255, 0.1);
        border: 0 solid red;
        border-radius: 3em;
        color: white;
        font-family: Arial, Helvetica, sans-serif;
        padding: 3em;
        margin: 2em;
    }

    label {
        padding: 1em 0 1em 0;
    }

    input {
        border-radius: 1em;
        padding: 1em;
        background-color: rgba(255, 255, 255, 0.85);
        color: black;
        width: 150px;
    }

    .info-container {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: first baseline;
        gap: 1em;
    }

    .info {
        display: flex;
        flex-direction: column;
        justify-content: first baseline;
        align-items: start;
    }

    .text-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: first baseline;
        padding: 2em 0 2em 0;
        border: 0 solid red;
    }

    textarea {
        width: 97%;
        height: 200px;
        max-width: 97%;
        max-height: 200px;
        border: none;
        border-radius: 1em;
        padding: 1em;
    }

    .send-btn {
        position: relative;
        float: left;
        width: 150px;
        height: 50px;
        border: none;
        border-radius: 0.5em;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        font-size: 20px;
        cursor: pointer;
        background-color: rgb(50, 150, 240);
        color: white;
        transition: transform 0.3s ease;
    }

    .send-btn:hover {
        transform: scale(1.05);
    }
}
