/*
==================================================
    The Double A Method
==================================================
*/

* { box-sizing: border-box; }

body {
	border-left-color: red;
	border-left-style: solid;
	border-left-width: 8px;
}

@media only screen and (min-width: 30em) { 
	body { border-left-color: orange; }
}

@media only screen and (min-width: 40em) { 
	body { border-left-color: green; }
}

@media only screen and (min-width: 50em) { 
	body { border-left-color: blue; }
}

@media only screen and (min-width: 60em) { 
	body { border-left-color: purple; }
}

A toolkit method for responsive development

The Double A Method

web, design

CSS