I have the following media query which applies the background style to the body successfully, however it does not change the others, any ideas pleople? 

```
@media (min-width: 980px) and (max-width: 1200px) {
body {
    background:#F00;
}
.contentsearch.navbar {
    margin-left: -475px !important;
    top: 200px !important;
    width: 950px !important;
}
.contentTabs {
    margin-left: -475px !important;
    width: 948px !important;
}
.ui-tabs-panel { 
    width: 948px !important;
}
}

```

heres the original css for these elements 

```
.contentsearch.navbar { 
     position:absolute; 
     top:200px; 
     width:1170px; 
     left:50%; 
     margin-left:-585px;  
}
.contentTabs {  
border-bottom: 1px solid #AAAAAA;
    border-left: 1px solid #AAAAAA;
    border-right: 1px solid #AAAAAA;
    bottom: 55px;
    height: auto !important;
    left: 50%;
    margin-left: -585px;
    position: absolute !important;
    top: 241px;
    width: 1168px;
 }
.ui-tabs-panel {
    border-bottom: 1px solid #DDDDDD !important;
    border-top: 1px solid #CCCCCC !important;
    bottom: -1px !important;
    height: auto !important;
    overflow: auto;
    position: absolute !important;
    top: 47px !important;
    width: 1168px;
}

```