#contact-us-container {
    display: grid;
    grid-template-areas: "contact-us-head"
                         "contact-info-form-container";
}

#contact-us-head {
    grid-area: contact-us-head;
    text-align: center;
    font-weight: bold;
    padding-top: 4%;
    font-size: 1.5em;
}

#contact-info-form-container {
    grid-area: contact-info-form-container;
    display: grid;
    grid-template-areas: "contact-info"
                         "contact-form";
    transition: .4s;
    padding-bottom: 4% !important;
}

/* **********Contact-Info content********** */

#contact-info {
    grid-area: contact-info;
    display: grid;
    grid-template-areas: "contact-paragraph"
                         "contact-info-images"
                         "contact-cushman-wakefield";
    transition: .4s;
}

/* contact-info child 1*/
#contact-paragraph {
    grid-area: contact-paragraph;
    min-width: 0;
    transition: .4s;
    line-height: 1.8em;
}


/* contact-info child 2*/
#contact-info-images {
    grid-area: contact-info-images;
    display: grid;
    grid-template-areas: "contact-ryan-holtzman"
                         "contact-andrew-trench"
                         "contact-lena-weeks";
    min-width: 0;
    transition: .4s;
}

/* *** contact-info-images children *** */
#contact-ryan-holtzman {
    grid-area: contact-ryan-holtzman;
    text-align: center;
    min-width: 0;
    transition: .4s;
}

#contact-andrew-trench {
    grid-area: contact-andrew-trench;
    text-align: center;
    min-width: 0;
    transition: .4s;
}

#contact-lena-weeks {
    grid-area: contact-lena-weeks;
    text-align: center;
    min-width: 0;
    transition: .4s;
}

.contact-info-span {
    display: block;
    font-weight: bold;
    transition: .4s;
}

.contact-info-emails {
    font-weight: normal;
    word-wrap: break-word;
    transition: .4s;
}


/* contact-info child 3*/
#contact-cushman-wakefield {
    grid-area: contact-cushman-wakefield;
    transition: .4s;
}


/* **********Contact-Form content********** */

#contact-form {
    grid-area: contact-form;
    border: 1px solid white;
    text-align: left;
    margin: 0 auto;
    transition: .4s;
}

label {
    display: block;
}

input, textarea {
    display: block;
    width: 100%;
    border: 1.5px solid black;
    transition: .4s;
}

#form-button-submit {
    color: white;
    background-color: #8AADB7;
    border: 1px solid #8AADB7;
    border-radius: 5px;
    padding: 5px 15px;
    margin: auto;
    margin-bottom: 20px;
    width: 35%;
    transition: .4s;
}

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

    #contact-info-form-container {
        padding: 0 5%;
    }

    #contact-paragraph {
        padding: 0 5%;
    }

    #contact-ryan-holtzman, #contact-andrew-trench, #contact-lena-weeks {
        padding: 0 10%;
    }

    .contact-info-span {
        font-size: .9rem;
    }

    .contact-info-emails {
        font-size: .85rem;
        line-height: 1.5;
    }

    #contact-cushman-wakefield {
        text-align: center;
        margin: 20px auto;
        padding: 0 5%;
    }

    #contact-cushman-wakefield img {
        width: 100%
    }

}

@media only screen and (min-width: 360px) and (max-width: 760px) {

    #contact-info-form-container {
        padding: 0 5%;
    }

    #contact-paragraph {
        padding: 0 8%;
    }

    #contact-ryan-holtzman, #contact-andrew-trench, #contact-lena-weeks {
        padding: 0 0;
    }

    .contact-info-span {
        font-size: .9rem;
    }

    .contact-info-emails {
        font-size: .85rem;
        line-height: 1.5;
    }

    #contact-cushman-wakefield {
        text-align: center;
        margin: 25px auto;
        padding: 0 5%;
    }

    #contact-cushman-wakefield img {
        width: 100%
    }

    #contact-form {
        margin: 0 20%;
    }
}

@media only screen and (min-width: 760px) and (max-width: 1280px) {

    #contact-info-form-container {
        grid-template-columns: 65% 35%;
        grid-template-areas: "contact-info contact-form"
                             "contact-cushman-wakefield contact-cushman-wakefield";
        padding: 0 5%;
        margin-bottom: 40px;
    }

    #contact-paragraph {
        padding: 0 6.7%;
        margin-bottom: 40px;
    }

    #contact-info-images {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas: "contact-ryan-holtzman contact-andrew-trench contact-lena-weeks";
        gap: 0 25px;
        padding: 0 5%;
    }

    #contact-ryan-holtzman img, #contact-andrew-trench img, #contact-lena-weeks img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .contact-info-span {
        font-size: .9rem;
    }

    .contact-info-emails {
        font-size: .85rem;
        line-height: 1.5;
    }

    #contact-cushman-wakefield {
        text-align: center;
        margin: 15px auto;
        padding: 0 5%;
    }

    #contact-cushman-wakefield img {
        width: 100%
    }
}

@media only screen and (min-width: 1280px) and (max-width: 1760px) {

    #contact-info-form-container {
        grid-template-columns: 65% 35%;
        grid-template-areas: "contact-info contact-form"
                             "contact-cushman-wakefield contact-cushman-wakefield";
        padding: 0 5%;
        margin-bottom: 40px;
    }

    #contact-paragraph {
        padding: 0 6.7%;
        margin-bottom: 40px;
    }

    #contact-info-images {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas: "contact-ryan-holtzman contact-andrew-trench contact-lena-weeks";
        gap: 0 25px;
        padding: 0 5%;
    }

    #contact-ryan-holtzman, #contact-andrew-trench, #contact-lena-weeks {
        padding: 0 10%;
    }

    #contact-ryan-holtzman img, #contact-andrew-trench img, #contact-lena-weeks img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .contact-info-span {
        font-size: .9rem;
    }

    .contact-info-emails {
        font-size: .85rem;
        line-height: 1.5;
    }

    #contact-cushman-wakefield {
        text-align: center;
        margin: 15px auto;
        padding: 0 5%;
    }

    #contact-cushman-wakefield img {
        width: 100%
    }
}

/* Adjust After previous media is complete*/
@media only screen and (min-width: 1760px) {

    #contact-info-form-container {
        grid-template-columns: 65% 35%;
        grid-template-areas: "contact-info contact-form"
                             "contact-cushman-wakefield contact-cushman-wakefield";
        padding: 0 13%;
        margin-bottom: 40px;
    }

    #contact-paragraph {
        padding: 0 6.7%;
        margin-bottom: 40px;
    }

    #contact-info-images {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas: "contact-ryan-holtzman contact-andrew-trench contact-lena-weeks";
    }

    #contact-ryan-holtzman, #contact-andrew-trench, #contact-lena-weeks {
        padding: 0 10%;
    }

    #contact-ryan-holtzman img, #contact-andrew-trench img, #contact-lena-weeks img {
        padding: 0 10%;
        width: 100%;
    }

    .contact-info-span {
        font-size: .9rem;
    }

    .contact-info-emails {
        font-size: .85rem;
        line-height: 1.5;
    }

    #contact-cushman-wakefield {
        text-align: center;
        margin: 15px auto;
        padding: 0 5%;
    }

    #contact-cushman-wakefield img {
        width: 100%
    }

    #contact-form {
        margin-top: 40px;
    }
}
