@media only screen and (max-width: 480px){
    .container{
        grid-template-columns: repeat(4, 1fr);
        width: 100%;
    }
    .logo{
        grid-area: 1/1/2/2;
    }
    nav{
        display: none;
        grid-area: 1/2/2/3;
    }
    .menu{
        visibility: visible;
        grid-area: 1/4/2/5;
        justify-self: flex-end;
    }
    header{
        grid-area: 2/1/3/5;
        grid-template-columns: repeat(4, 1fr);
        gap: 5px;
    }
    .header-img{
        grid-area: 7/1/9/4;
        width: 100%;
    }
    .sec2{
        grid-area: 3/2/4/5;
        grid-template-columns: repeat(4, 1fr);
    }
    .sec2-img{
        grid-area: 1/1/5/5;
        width: 100%;
    }
    .sec2 h1{
        grid-area: 6/1/7/5;
    }
    .sec2 p{
        grid-area: 8/1/9/5;
    }
    .sec2-btn{
        grid-area: 9/1/10/5;
    }
    .sec3{
        grid-area: 4/1/5/5;
        grid-template-columns: repeat(4, 120px);
        gap: 40px;
    }
    .featured{
        grid-area: 1/1/2/2;
    }
    .sec3-link{
        grid-area: 1/3/2/4;
    }
    .sec3-img1{
        grid-area: 2/2/4/3;
        justify-self: center;
    }
    .sec3-img2{
        grid-area: 4/2/6/3;
        justify-self: center;
    }
    .sec3-img3{
        grid-area: 6/2/8/3;
        justify-self: center;
    }
    .sec3-img4{
        grid-area: 8/2/10/3;
        justify-self: center;
    }
    .sec4{
        grid-area: 5/1/7/4;
        grid-template-columns: repeat(4, 1fr);
        padding-bottom: 300px;
    }
    .sec4 h1{
        grid-area: 1/1/2/2;
    }
    .sec4 p{
        grid-area: 2/1/3/2;
    }
    .sec4-btn{
        grid-area: 3/1/4/2;
    }
    .sec4-img{
        grid-area: 4/1/5/2;
        width: 400px;
    }
    .sec5{
        grid-area: 8/1/9/4;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(13, 90px);
    }
    .sec5 h1{
        grid-area: 1/1/2/4;
    }
    .sec5-img{
        grid-area: 2/1/4/2;
    }
    .rate{
        grid-area: 8/1/9/4;
    }
    .sec5-p1{
        grid-area: 9/1/10/4;
    }
    .sec5 h4{
        grid-area: 12/1/13/4;
    }
    .sec5-p2{
        grid-area: 13/1/14/4;
    }
    .sec6{
        grid-area: 9/1/10/4;
        grid-template-columns: repeat(4, 1fr);
    }
    .sec6 h1{
        grid-area: 1/2/2/4;
    }
    .sec6-link{
        grid-area: 1/4/2/5;
    }
    .sec6-img1{
        grid-area: 2/2/6/5;
    }
    .sec6 .img1-h4{
        grid-area: 6/2/7/5;
    }
    .sec6 .img1-p{
        grid-area: 7/2/8/5;
    }
    .sec6 .img1-link{
        grid-area: 8/2/9/5;
    }
    .sec6-img2{
        grid-area: 9/2/13/5;
    }
    .sec6 .img2-h4{
        grid-area: 13/2/14/5;
    }
    .sec6 .img2-p{
        grid-area: 14/2/15/5;
    }
    .sec6 .img2-link{
        grid-area: 15/2/16/5;
    }
    .sec6-img3{
        grid-area: 16/2/20/5;
    }
    .sec6 .img3-h4{
        grid-area: 20/2/21/5;
    }
    .sec6 .img3-p{
        grid-area: 21/2/22/5;
    }
    .sec6 .img3-link{
        grid-area: 22/2/23/5;
    }
    .sec6-img4{
        grid-area: 23/2/27/5;
    }
    .sec6 .img4-h4{
        grid-area: 28/2/29/5;
    }
    .sec6 .img4-p{
        grid-area: 29/2/30/5;
    }
    .sec6 .img4-link{
        grid-area: 30/2/31/5;
    }
    footer{
        grid-area: 10/1/11/5;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(16, 90px);
    }
    .footer-logo{
        grid-area: 2/1/3/5;
    }
    .footer-p1{
        grid-area: 3/1/4/5;
        justify-self: center;
    }
    .footer-p2{
        grid-area: 6/1/7/5;
        justify-self: center;
    }
    .footer-h4-left{
        grid-area: 7/1/8/2;
    }
    .footer-left{
        grid-area: 8/1/9/2;
    }
    .footer-h4-mid{
        grid-area: 7/3/8/5;
    }
    .footer-mid{
        grid-area: 8/3/9/5;
    }
    .footer-h4-right{
        grid-area: 11/1/12/4;
    }
    .footer-right{
        grid-area: 12/1/13/4;
    }
    footer .line2{
        grid-area: 15/2/16/4;
    }
    .social{
        grid-area: 15/1/17/5;
    }
}