@media only screen and (max-width:770px){
    #burger{
        display: block;
        background-attachment: fixed;
    }
    #logo-id{
        position: relative;
        margin-left:-44rem;
        justify-content: center;
        align-self: center;
        align-content: center;
    }
    #logo-img{
        justify-content: center;
        align-content: center;
        margin-left: 65%;
        height:80px;
        margin-top: 55px;
    }
    #nav-list{
        flex-direction: column;
        font-size:20px;
        margin-top:70px;
        display: none;
        margin-right:15%;
    }
    .list-items{
        margin-top:20px;
    }
    #nav-bar{
        transition: 0.2s ease-in-out;
    } 
    #main-heading{
        font-size:3.2rem;
    }
    #header-content{
        margin-top:300px;
    }
}
@media only screen and (max-width:850px){
    #grid-1{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #grid-2{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #grid-3{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #grid-4{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #grid-5{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #grid-6{
        grid-column-start: 1;
        grid-column-end: 4;
    }
    #contact{
        margin-top:1480px;
    }
}


@media only screen and (max-width:1100px){
    .container{
        flex-direction: column;
    }
    .contact-form{
        width: 100%;
    }
    .contact-form-box{
        width:100%;
        border-radius:0px;
    }
    .contact-info{
        width:100%;
    }
    .edit-input{
        width:90%;
    }
    #message{
        width:90%;
    }
    .label{
        width:92%;
    }
}

@media only screen and (max-width: 622px){
    #main-heading{
        font-size:2.5rem;
        text-align: center;
    }
}

/* Logo Image Working Responsivness --------- */
@media only screen and (max-width: 727px){
    #logo-img{
        margin-left:75%;
    }
}
@media only screen and (max-width: 667px){
    #logo-img{
        margin-left:90%;
    }
}
@media only screen and (max-width: 603px){
    #logo-img{
        margin-left:105%;
    }
}
@media only screen and (max-width: 546px){
    #logo-img{
        margin-left:120%;
    }
}
@media only screen and (max-width: 472px){
    #logo-img{
        margin-left:155%;
    }
}
@media only screen and (max-width: 401px){
    #logo-img{
        margin-left:160%;
    }
}
@media only screen and (max-width: 321px){
    #logo-img{
        margin-left:180%;
    }
}
@media only screen and (max-width: 361px){
    #logo-img{
        margin-left:170%;
    }
}
/* Logo Image Working Responsivness --------- */

@media only screen and (max-width: 443px){
    #contact{
        margin-top:1500px
    }
}
@media only screen and (max-width: 335px){
    .info-header{
        font-size:22px;
    }
}

@media only screen and (max-width:506px){
    #footer{
        margin-top:120px;
    }
}
@media only screen and (max-width:370px){
    .text{
        font-size:12px;
    }
}
@media only screen and (max-width:305px){
    #contact{
        margin-top:1550px;
    }
}

@media only screen and (max-width:424px){
    #contact{
        margin-top:1550px;
    }
}
@media only screen and (max-width:380px){
    #contact{
        margin-top:1600px;
    }
}
@media only screen and (max-width:332px){
    #contact{
        margin-top:1650px;
    }
}
@media only screen and (max-width:310px){
    #contact{
        margin-top:1700px;
    }
}
@media only screen and (max-width:301px){
    .link-text{
        font-size:14px;
    }
}




@media only screen and (max-width:342px){
    .info-header{
        font-size:20px;
    }
}







@media only screen and (max-width:296px){
    .info-header{
        font-size:20px;
    }
}
@media only screen and (max-width:300px){
    #contact{
        margin-top:1600px;
    }
}