@media only screen and (max-width: 300px) {
  body {
    background-color: red;
	font-size:16px;
  }
	#small,#medium,#large{
		position: absolute;
  }
  
	#smallp{
		visibility:visible;
}
	#mediump,#largep{

		visibility:hidden;
}
}
@media only screen and (min-width: 300px) {
  body {
    background-color: green;
		font-size:20px;
  }
	#medium{
		width:33%;
  }
	#small{
		width:66%;
}
	#large{
		width:100%;
}
	#mediump{
		visibility:visible;
}
	#smallp,#largep{

		visibility:hidden;
}
}
@media only screen and (min-width: 768px) {
  body {
		background-color: blue;
		font-size:25px;
  }
	#small,#medium,#large{
		float:left;
		width:33%;
}
	#largep{
		visibility:visible;
}
	#smallp,#mediump{
		visibility:hidden;
}
}

#smallp,#mediump,#largep{
		position: absolute;
		top:0px;
		bottom:5px;
  }