/* COMMON TO MOBILE AND LARGER VIEWPORT */
 
    /* default UI styles for form elements */
    form{
        padding: 1.5rem;
        background-color: var(--dark-grey-opacity);
        border-radius: 10px;
        margin-top: 1rem;
    }

    .form-control{
        display:flex;
        flex-direction: column; 
    }

    label{
        font-size: 1rem;
        font-weight: 600;
        text-align: start;
        color: var(--white);
        margin: 0.5rem 0;
    }

    input, textarea{
        border:none;
        box-shadow: 0 0 2px 0 rgba(0,0,0,0.25);
        padding: 0.75rem;
        border-radius: 10px;
    }
    
    input:focus, textarea:focus{
        background-color: #e6fffd;
    }

    .send-message{
        margin-top: 1rem;
    }

    .page-footer{
        color: white;
    }


/* SMALL VIEWPORT STYLES */

.contact-section{
    color: var(--white);
    background-color: var(--med-grey);
    margin: 2rem auto;
    max-width: 900px;
    font-weight: 600;
    border-radius: 10px;
 }



 .form-container, .contact-section p, .contact-section h2{
    width: 90%;
    margin: 0 auto;
    padding: 1rem;
}