Desktop und Mobile unterschiedliches Bild laden

[Khan]

Leute gibt mir mal bitte einen kurzen Tip. 2 Hintergrundbildern, Desktop soll die PNG und das JPG geladen werden, Mobil soll nur ein Bild geladen werden namens bg.jpg. Mein aktueller Code muß auf die Mobile Version angepasst werden:

.content{
	background-color:#000000;
	background-image:url(../images/bg.png), url(../images/panorama.jpg);
	background-repeat:no-repeat;
	background-position: top center;
}

@media (max-width: 876px) {
  .content {      
  background-size:contain;
}
}

---

Ich würde logischerweise verstehen:

@media only screen (max-width: 876px) {
  .content {      
  background-size:contain;
  background-image:url(../images/bg.jpg);
  background-repeat:no-repeat;
  background-position:top center;
}
}

GEHT ABER NICHT!

P. S. Dreamweaver kennt die @media befehle noch nicht, sonst würde es anhand von automatischen Vorschlägen besser gehen.