Css 为什么第二个媒体查询会'；不适用

此代码

@media screen and (max-device-width: 2000px)
{
    body
    {
        margin:0px;
        padding:0;
        background-color: #000;
        color: white;
        font-size: 30px;
    }
    #offer
    {
        padding-right:250px;
        padding-left:250px;
    }
} 
@media screen and (max-device-width: 1000px)
{
    body
    {
        background-color: #fff;
    }
    #offer
    {
        padding-left: 10px;
        padding-right: 10px;
    }
}

始终提供黑色背景，填充也不适用，因此我假设第二个查询根本不起作用，为什么会这样？

这应该可以做到：

@media screen and (max-width: 2000px)
{
    body
    {
        margin:0px;
        padding:0;
        background-color: #000;
        color: white;
        font-size: 30px;
    }
    #offer
    {
        padding-right:250px;
        padding-left:250px;
    }
} 
@media screen and (max-width: 1000px)
{
    body
    {
        background-color: #fff;
    }
    #offer
    {
        padding-left: 10px;
        padding-right: 10px;
    }
}