@media (max-width: 1200px){

        .navbar-mobile{
            display: block;
            z-index: 1000;
            box-shadow: 1px 2px 27px -5px rgba(0,0,0,0.76);
            -webkit-box-shadow: 1px 2px 27px -5px rgba(0,0,0,0.76);
            -moz-box-shadow: 1px 2px 27px -5px rgba(0,0,0,0.76);
            background-color: #FBF8EF;
            overflow: hidden;
            position: fixed;
            bottom: 0;
            width: 100%;
            padding: 1.3vh;
            border-radius: 10px;
        }

        .mobile-navbar-content{
            display: flex;
            justify-content: space-evenly;
            text-align: center;
            list-style: none;
            
        }

        .mobile-navbar-content a{
            text-decoration: none;
            color: black;
        }

    .container{
        display: flex;
        flex-direction: column;
    }

    .main-banner-links{
        display: block;
    }

    .links-container{
        display: none;
    }

    .textContainer{
        height: 92vh;
    }

    .text-flex-container {
        margin-left: 2vh;
    }

    .skills h2{
        font-size: 1.3rem;
    }

    #skill-icon{
        font-size: 30px;
    }

        .project-grid{
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(2, 1fr);
        }

        .box-text:hover{
            opacity: 1;
        }

    .contact-form-grid-container{
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto;
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        justify-items: stretch;
        align-items: stretch;
        padding-left: 2vh;
    }

    .contact-form-text{
        display: none;
    }

    .mobile-contact-form-text{
        display: block;
    }

    .mobile-contact-form-text { 
        text-align: left;
        padding: 25% 0;
        padding-bottom: 1vh;
        max-width: 600px;
    }


    .mobile-contact-form-text h1{
        font-size: 3rem;
        color: #F0F0F0;
        font-family: 'Maven Pro', sans-serif;
        display: inline-block;
        font-weight: 700;
        margin-bottom: 10%;
    }

    .mobile-contact-form-text p{
        line-height: 25px;
        font-family: 'Barlow', sans-serif;
        color: hsl(167, 40%, 24%);
        padding-bottom: 10%;
    }

    footer{
        margin-bottom: 7vh;
    }
}

@media (max-width: 720px){
    .project-grid{
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(1, 1fr);
    }
}