Unexpected viewport media query behaviour

Tablet query runs normally:
@media screen and (min-width: 768px) and (max-width: 1250px)
Mobile query runs as if it were the measurements of the tablet:
@media screen and (max-width: 426px)

@media screen and (max-width:426px) {
  body {
    background-color: green;
    background-size: cover;
    min-height: 100vh;
    margin: 0px;
  }
}

@media screen and (min-width:768px) and (max-width: 1250px) {
  body {
    background: url("img/backgournd_tablet.svg");
    background-size: cover;
    min-height: 100vh;
    margin: 0px;
  }
}

@media screen and (min-width: 1250px) and (max-width: 2040px) {
  body {
    background: url("img/background1.svg");
    background-size: cover;
    min-height: 100vh;
    margin: 0px;
  }
}

Note: I just set the background to green to see if it worked but nothing changes when I encode in mobile resolution.