[Resolvido] teste site responsivo não funciona em celular

eu criei um site teste responsivo, mas quando acesso o site pelo celular ele não muda, me expliquem porque, eu fiz uma configuração com o @media, me ajudem a entender porque não está pegando o @media no samsung galaxy j6. deixei o código css para verificarem e deixarei o site de teste para verificarem.
eu entro pelo celular neste link e não fica as configurações do @media.

link do site de teste : https://meutesteaqui.000webhostapp.com/
css:

*{

    margin: 0;

    padding: 0;

    box-sizing: border-box;

    font-family-removed: "Open Sans";

}

html,body{

    height: 100%;

}



@font-face{

    src:url('../fonts/OpenSans-light.ttf');

    font-family-removed: "Open Sans";

}

.clear{

    clear: both;

}



.center{

   

    text-align: center;

    margin: 0 auto;

}





.interface{

    width: 100%;

    min-width: 280px;

    height: 100%;

    background-color: green;

}

nav{

    width: 100%;

    min-width: 280px;

    height: 60px;

    position: absolute;

    background-color: black;

    color: white;



}

nav li{



    margin-top: 10px;

    margin-left: 15px;

    padding: 5px;

    list-style: none;



}

nav ul li{



    float: left;

    font-size-removed: 150%;

    font-family-removed: "Arial"

}



section{



    position: relative;

    top: 200px;

    width: 100%;

    background-color: #cecece;

    padding: 90px 0;

}



section .center > h2{

    color: #462663;

    font-size-removed: 24px;

    font-weight: normal;

    padding: 40px 0;

}



.container{

    margin-top: 90px;

    float: left;

    width: 33.333%

}



section .text h2{

    text-align: center;

    margin-bottom: 10px;

}

section .text{

    text-align: justify;

    padding: 20px 15%;

}



@media screen and (max-width: 520px){

       

        nav {

            height: 100%;

           



        }



        nav ul{

            min-width: ;



        }

        nav ul li{

            margin-left: 4%;

            margin-right: 4%;

            float: none;

            width: 90%;

            min-width: 250px;

            background-color: rgb(80,80,80);

            font-size-removed: 30px;

            text-align: center;



           





        }

        .container{

            width: 100%;

        }

   

   

}