/* Mobile Layout: 449px and below. */
#text {
	width:100%; 
	height:100%;
	max-width:200px;
	color:#000;
	margin:0 auto 0 auto;
}
#resources-left-side  {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}
#resources-middle-side  {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}
#resources-right-side  {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}

/* Tablet Layout: 450px to 749px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 450px) {
#text {
	width:100%; 
	height:100%;
	max-width:600px;
	color:#000;
	margin:0 auto 0 auto;
}
#resources-left-side {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}
#resources-middle-side {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}
	
#resources-right-side  {
	clear: none;
	float: left;
	margin-left: 4.1666%;
	width: 100%;
	display: block;
}

}

/* Desktop Layout: 750px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 750px) {
#text {
	width:100%; 
	height:100%;
	max-width:1200px;
	color:#000;
	margin:0 auto 0 auto;
}
#resources-left-side {
	clear: none;
	float: left;
	width: 20%;
	display: block;
	}
#resources-middle-side {
	clear: none;
	float: left;
	width: 30%;
	display: block;
	}
#resources-right-side {
	clear: none;
	float: left;
	width: 30%;
	display: block;
	}
}