Q:

Media queries não funcionam

Fiz essas medias queries para Desktop, segue o código abaixo:
@media screen and (min-width: 1024px) , screen and (min-height: 600px){

    #menu ul {
        left: 26%;
    }
    .nomes{
        margin-top: 200px;
    }

    .botao-circulo{
        margin-top: 50px;
        margin-left:-15px;
    }

    #header {
        height: 100%;
    }

    video {
        transform:scaley(1.8);
    }

    #bg-video{
        position: absolute;
        top: 0;
        left: 0;
        z-index: -50;
        /*  box-shadow: inset 0px 0px 200px 100px rgba(0,0,0,0.6);*/
    }

    .image.ico {

        margin-left: 70px;
        margin-top: 100px;
    }

    #fundo-transparente-icones{
        left: -300px;
        top: 90%;
        transform:scale(0.6);
    }

    .botao-mais input[type="button"],.mais{
        margin-left: 175%; 
    }

    .texto-jogos{
        margin-top: 200px;
        margin-left: 50px;
    }

    .botaozao input[type="button"],.jogos-botao{
        margin-left: 15%;
        margin-top: 30px;   

    }

    .botaozao input[type="button"]:hover,.jogos-botao{
        background-color: #fff;
        color: #333;
        transition:0.5s;
    }

    #fundo-transparente-parcerias{
        left: -300px;
        top: 330%;
        transform:scale(0.6);
    }

    .linha-team{
        width: 40%;
        margin-top: -10px;
    }

    #footer .copyright {
        left: 38%;
    }
}

@media screen and(min-width:1024px),screen and(min-height: 768px){
    #fundo-transparente-parcerias{
        left: -300px;
        top: 250%;
        transform:scale(0.6);
    }

    #fundo-transparente-icones{
        left: -300px;
        top: 65%;
        transform:scale(0.6);
    }

}

@media screen and (min-width:1280px),screen and(min-height: 800px){
    /*    #fundo-transparente-icones{
            left: -180px;
            top: 85%;
            transform:scale(0.7);
        }

         #fundo-transparente-parcerias{
            left: -180px;
            top: 265%;
            transform:scale(0.7);
        }*/

}

@media screen and (min-width:1366px),screen and(min-height: 768px){
    /*    #fundo-transparente-icones{
            left: -180px;
            top: 90%;
            transform:scale(0.7);
        }

         #fundo-transparente-parcerias{
            left: -180px;
            top: 275%;
            transform:scale(0.7);
        }*/

}

@media screen and (min-width:1440px),screen and(min-height: 900px){
    #menu ul {
        left: 26%;
    } 
}

@media screen and (min-width:1600px),screen and(min-height: 900px){
    #menu ul {
        left: 32%;
    } 

    .setas{
        position: absolute;
        top: 60px;
        left: 14%;
    }
}

@media screen and (max-width:1680px),screen and(max-height: 1050px){
    .botaozao input[type="button"],.jogos-botao{
        margin-left: 15%;
    }
}

@media screen and (min-width:1920px),screen and(min-height: 1080px){
    .botaozao input[type="button"],.jogos-botao{
        margin-left: 13%;
    }

    #bg-video{
       width: 100%;
    }

    video {
        transform:scaleY(1.8);
        transform: scaleX(1.2);
    }

     .setas{
        left: 18%;
    }
}

@media screen and (min-width:1920px),screen and(min-height: 1200px){
    .botaozao input[type="button"],.jogos-botao{
        margin-left: 13%;
    }

    #bg-video{
       width: 100%;
    }

     .setas{
        left: 18%;
    }
}

Porem quando fui fazer para tablets, elas simplesmente não implementam, antes ela bagunçava todas as media queries que eu já havia feito que tive uma resolução disso em um tópico anterior porem agora não quer aplicar. Segue abaixo um dos códigos da medida que não aplica:
@media screen and(max-width:533px),screen and(max-height: 853px){
    #menu ul {
        left: 0px;
    }

    #menu ul li a{

        font-size: 1.2em;
        margin: 4px;
    }

    #seta-esquerda{
        right: 35px;
    }

    #seta-direita{
        left: 35px;
    }

    video {
        transform:scaley(3.4);
    }

    .nomes{
        font-size: 4.3em;
        margin-top: 200px;
    }

    .texto1 {
        font-size: 1em;
    }

    .image.ico {

        margin: 0 0 1em 0;
        width: 50%;
        margin-left: 175px;
        margin-top: 100px;
    }

    .image.ico img {
        width: 60%;
    }

    .botao-mais input[type="button"],.mais{
        margin-left: 80%; 
    }

    #fundo-transparente-icones{
        position: absolute;
        left: -180px;
        top: 80%;
        transform:scale(0.8);
        z-index: -200;
    }

    .main .jogos-nomes{
        margin-top: 50px;
        font-size: 3.5em;
    }

    .texto-jogos{
        text-align: left;
        font-family: Gabriola;
        font-size: 1em;
        margin-top: 120px;
        margin-left: 40px;
    }

    .main {
        padding: 6em 0 4em 0;
    }

    .main.style2 {
        background-color: #333;
        color:#fff;
        background-size: 100% 100%;
        height: 600px;
        opacity: 0.95;
        border-bottom: 15px solid #f80;
        border-top: 15px solid #f80;

    }

    .main.style2{
        background-repeat: no-repeat;

    }

    .botaozao input[type="button"],.jogos-botao{
        background-color: transparent;
        color: #fff;
        width: 250px;
        height: 50px;
        border:3px solid #fff;
        text-align: center;
        margin-left: 20%;
        margin-top: 30px;   
        border-radius: 6px;
        font-family: Gabriola;
        font-size: 1.7em;

    }

    .botaozao input[type="button"]:hover,.jogos-botao{
        background-color: #fff;
        color: #333;
        transition:0.5s;
    }

} 

A:

Já tentou assim @media (max-width:533px) ? 
Caso não dê certo, so vendo o estilo completo para poder indicar algo.

A:

media screen serve para Desktop (e nexus) só, está aqui uma lista de todas as media-queries espeficicas que podes usar no entanto, se usares só @media (max-width:NNpx) ela irá funcionar sem grande problema :)

