/* sm-viewport.css */
@media only screen and (min-width: 556px) {

    /* classes */

    .brag-tag {
        position: absolute;
        right: -3rem;
        bottom: -1.5rem;
        line-height: .5rem;
    }

    .btn-floater {
        position: absolute;
        top: 1vw;
    }

    .btn-spacing {
        margin-top: 0.25rem;
        margin-left: 2.5vw;
    }

    .contact-us {
        top: -6%;
        left: 2%;
    }

    .gallery {
        margin-top: -108px;
        margin-left: 1rem;
    }

    .margin-narrow {
        margin-left: 2rem;
        margin-right: 2rem;
    }

    .navbar {
        border-bottom: 1px darkgrey solid;
    }

    .offices {
        position: absolute;
        top: -1vw;
        right: 43vw;
        left: 3vw;
        text-align: left;
    }

    p.my-contact {
        position: absolute;
        text-align: left;
        font-size: 1.25rem;
        left: 46%;
        top: 22%;
        color: #5C361C;
    }

    .project-caption {
        margin-left: 14vw;
        height: 1em;
    }


    /* id's */
    #page-banner_cardText {
        padding: 2vw;
        margin: 4vw 0vw;
        color: var(--tagline-font-color);
        font-family: var(--tagline-font-family):;
    }

    #page-footer_cardTitle.h1,
    #page-footer_cardTitle h1 {
        font-size: 5.5vw;
    }

    #page-footer_cardButton.h6,
    #page-footer_cardText p.h6,
    #page-footer_cardButton h6 {
        font-size: .65rem;
    }
}