@media (max-width: 767px) {
    #Apps .appHeader>img.logo {
        display: none;
    }

    #Apps .appButtons.large {
        display: none;
    }

    #Apps .appButtons.small {
        display: flex;
    }

    #Apps .appButtons img.logo {
        width: 150px;
        border: 1px solid #222;
        margin-right: 25px;
    }
    #Apps .appButtons a {
        margin-top: 5px;
    }
    #Apps .linkButtons {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    #Apps h3 {
        margin-bottom: 10px;
    }

}


@media (max-width: 599px) {
    header .logo {
        display: none;
    }
    header {
        justify-content: center;
    }

    #About {
        background-image: none;
    }

    .intro {
        filter: none;

    }

    .intro>p>span {
        color: #ccc;
        background: none;
    }

    .intro a {
        color: white;
    }

    #Donations {
    }

    #Contact .content {
        max-width: 100%;
    }

    #Contact form {
        width: 400px;
    }

    #Contact textarea {
        width: 400px;
    }
    #Contact .socialLinks {
        flex-direction: column;

    }

    #Contact .socialLinks img {
        margin-right: 10px;
    }

    #Contact .socialLinks a {
        margin: 10px 0;
        width: 160px;
    }
}

@media (max-width: 560px) {
    #Apps .appButtons.small {
        flex-direction: column;
        align-items: center;
    }
    #Apps h3 {
        text-align: center;
    }
}

@media (max-width: 450px) {
    .wrapper {
        font-size: 12px;
    }

    nav.menu {
        margin: 10px;
    }

    nav.menu ul li {
        width: 80px;
    }
    .intro {
        font-size: 1.2rem;
    }

    #Contact form {
        width: 100%;
    }

    #Contact textarea {
        width: 100%;
    }
    
    #Contact input {
        width: 100%;
    }

    #Contact .social, .socialLinks {
        width: 100%
    }
}