@media (max-width: 550px){
    nav{
        width: 100vw;
        position: fixed;
        grid-template-columns: 1fr 16vw;
        
        img{
            display: block;
            width: 8vw !important;
            height: 8vw !important;
        }

        ul{
            background-color: #A5FF8E;
            flex-wrap: wrap;
            height: 0vb;
            position: absolute;
            top: 100%;
            margin: 0;
            width: 40vw;
            overflow: hidden;


            .liBar{
                display: none !important;
            }
        }

        .menuClass{
            display: block !important;
            height: 50vb;
        }
    }

    #sec-inicio{
        
        >div{
            grid-template-columns: 1fr;
            grid-template-rows: 1fr 1fr;
            height: 50vb;
            text-align: center;
            align-items: center;

            img{
                justify-self: center;
                width: 30vw;
                height: 30vw;
            }

            span{
                font-size: 2.5rem !important;
            }
            h2{
                font-size: 2rem !important;
            }
        }
    }

    #sec-about{
        >div{

            h1{
                font-size: 2rem;
            }

            span{

                grid-template-rows: 55vw 1fr;
                grid-template-columns: 1fr;
                justify-items: center;

                img{
                    width: 50vw;
                    height: 50vw;
                }
                >div{
                    font-size: 1.4rem;
                    width: 70vw;
                    height: 55vb;
                }
            }
            
        }
    }

    #sec-skill{

        >div{
            height: auto;
            width: 100vw;
            grid-template-columns: 1fr 1fr;

            >div:nth-child(2){
                grid-row: 1 /3 ;
            }
            >div:last-child{
                display: none;
            }
            #sp2{
                text-align: left;
            }
            span{

                h1{
                font-size: 2.1rem !important;
                }
                span{
                    transform: translateX(-95%) !important;
                    width: 205px !important;
                }
                
            }
            #sp1{

                span:first-child{
                    top: 15.5% !important;
                }
                span:nth-child(2){
                    top: 28.5% !important;
                }
                span:nth-child(3){
                    top:44.5% !important;
                }
            }
            #sp2{
                
                span{
                    left: 0;
                }

                span:first-child{
                    top: 30.5% !important;
                }
                span:nth-child(2){
                    top: 56% !important;
                }
                span:nth-child(3){
                    top: 82% !important;
                }
            }

            h1{
                p{
                    font-size: 1rem;
                }
            }
        }
    }

    #sec-projetos{

        >div{
            height: 1350px;

            >span{
                grid-template-columns: 1fr;
                grid-template-rows: 1fr 1fr 1fr;
                height: 1350px;
                margin-top: 20px;

                div{
                    right: auto !important;
                    left: auto !important;
                    text-align: justify;
                    align-items: flex-start;
                    flex-wrap: wrap;
                    font-size: 1rem !important;
                    height: auto;
                    width: 90%;
                    height: 350px;
                    justify-content: center;

                }
                div:hover{
                    width: 90%;
                    height: 350px;
                }
                #proj-1{
                    grid-row: 1/1;
                }
                #proj-2{
                    grid-row: 2/2;
                }
                #proj-3{
                    grid-row: 3/3;
                }
            }
        }

        >a{
            div{
                justify-content: center;
                h1{
                    display: none;
                }
            }
        }
    }
    
    #sec-contact{
        >div{
            width: 100vw;
            h1{
                font-size: 3rem;
            }
            form{
                font-size: 2rem !important;
                input{
                    font-size: 1.5rem !important;
                }
                textarea{
                    font-size: 1.5rem !important;
                    padding: 5% !important;
                }
                input[type="button"]{
                    font-size: 2rem !important;
                    width: 50% !important;
                    margin: 2% 30% !important;
                }
            }
        }
    }

    #sec-rodape{
        >div{
            >span{
                h1{
                    font-size: 1.5rem !important;
                }
                h2{
                    font-size: 1.5rem !important;
                }
                span{
                    width: 5px;
                    height: 10px;
                    margin: 2vw 1vw;
                }
                span:nth-child(2){
                    width: 0;
                }
            }
        }
        
    }
}