@media screen and (max-width: 800px) {}
@media only screen and (min-width : 320px) and (max-width : 568px) {}

/*


@media only screen and (min-width: 320px) {
	body:after {
		content: "320 to 480px";
		background-color: hsla(90,60%,40%,0.7);
	}
}
@media only screen and (min-width: 480px) {
	body:after {
		content: "480 to 768px";
		background-color: hsla(180,60%,40%,0.7);
	}
}
@media only screen and (min-width: 768px) {
	body:after {
		content: "768 to 1024px";
		background-color: hsla(270,60%,40%,0.7);
	}
}
@media only screen and (min-width: 1024px) {
	body:after {
		content: "1024 and up";
		background-color: hsla(360,60%,40%,0.7);
	}
}







/*=======================================================================

	❤❤❤ Gumby by Digital Surgeons. ❤❤❤
	
	*** This is where you should keep all of your TEXT styles ***
 
 ========================================================================*/
  
 
 /* ==|== media queries ======================================================
    PLACEHOLDER Media Queries for Responsive Design.
    These override the primary ('mobile first') styles
    Modify as content requires.
    ========================================================================== */
 
 /* @media only screen and (min-width: 480px) {
   Style adjustments for viewports 480px and over go here 
 
 }
 
 @media only screen and (min-width: 768px) {
  Style adjustments for viewports 768px and over go here
 
 }
*/