@media in CSS does not work correctly

I have two CSS links on my site: The normal layout, and the "responsive corrections" with @media. To do tests with different screen sizes, I'm using Resposive Design Mode from Firefox. When I did the calculations with @media for 1920x900 screens, everything went perfectly. However, with the calculations for 1280x600 screen, it is not working. It keeps all sizes described in 1920x900. However, when I write other attributes, it works correctly. Here is my code with comments for better understanding:

/* Para monitores 1280x600px */
@media screen and (max-height: 600px){
    /* Da forma que está, não funciona, ele continua pegando o height descrito em @media screen and (max-height 900ox). Porém, se eu troco este atributo por display:none; ele funciona. */
    #slider{
        height:73.5vh;
    }
}

@media screen and (max-width: 1280px){
    #mainAtc{
        margin-left:2vw;
    }

    #othAtc{
        margin-left:0;
    }
}

/* Para monitores 1920x900px */
@media screen and (max-height: 900px){
    /* Da mesma forma, se eu trocar o atributo para telas 1280x600 para display:none, e trocar o atributo para telas de 1920x900 para display:block, ele mostra as imagens, como se nao funcionasse quando os atributos são iguais */
    #slider{
        height:51.6vh;
    }
}

@media screen and (max-width: 1920px){
    #mainAtc{
        margin-left:2vw;
    }

    #othAtc{
        margin-left:7.6vw;
    }

    #atcRest{
        margin-left:2vw;
    }
}

Who can help me, I thank you too much. Thank you.