Cacher is the code snippet organizer for pro developers

@media (min-width:320px)  {
 /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
html {
    font-size: 12px;
}

  .container {
    width: 320px;
    background-color: red;
}
}

@media (min-width:480px)  { 
	/* smartphones, Android phones, landscape iPhone */
html {
    font-size: 12px;
}

  .container {
    width: 320px;
    background-color: red;
}
}

@media (min-width:600px)  {
 /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */ 
html {
    font-size: 15px;
}

.container {
    width: 768px;
    background-color: green;
}

}
@media (min-width:801px)  {
 /* tablet, landscape iPad, lo-res laptops ands desktops */

html {
    font-size: 15px;
}

.container {
    width: 768px;
    background-color: green;
}
}
@media (min-width:1025px) {
 /* big landscape tablets, laptops, and desktops */
html {
    font-size: 15px;
}

.container {
    width: 768px;
    background-color: green;
}

}
@media (min-width:1281px) { /* hi-res laptops and desktops */
html {
    font-size: 16px;
}

.container {
    width: 960px;
    background-color: yellow;
}