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

    html, body {
        max-width: 100%;
        overflow-x: hidden;
    }

    textarea, select {
        background-color: white; /*appears gray in android so need to change it back to white */
    }

    .footer-background {
        background-image: url('assets/footer_background.jpg');
        height: 80px;
        width: 110vw;
        
        margin-top: 50%;
    }  

    .upload-screen-blocker .message {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    
        border-radius: 10px;
        border: 2px solid rgb(63, 63, 63);
    
        padding: 10px;
        width: 90%;
    
        background-color: rgb(255, 255, 255);
    }

    .upload-screen-blocker .message img {
        height: 90px;
    }

    .upload-screen-blocker .message h3 {
        font-size: 30px;
    }

    .upload-screen-blocker .message .hide_button {
        padding: 12px 60px 12px 60px;
        margin-top: 20px;
        font-size: 18px;
    }

    .upload-screen-blocker .message .suggestion-message {
        font-size: 20px;
    }

    .group-actions-container {
        position: fixed;
        right: -90px;
        bottom: 20%;
        text-align: center;
    
        background-color: white;
        padding: 2px 15px 2px 6px;
        border-radius: 10px;
        border: 2px solid rgb(76, 180, 206);
    
        transition: 0.8s;
    }
  }