I have a logo on my main page. use this code to resize at a smaller screen size.

Code:
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
 	#mainBody{
	background:#ff0000;
	}
	
  #logo img{
	padding-left: 20px;
	margin-top: -110px; 
  width:50%;
  height:50%;
	}
}
the bdoy color chnage goes into effect the image resize doesn't I also tried

Code:
  #logo{
padding-left: 20px;
margin-top: -110px; 
width:50%;
 height:50%;
	}
how could I kick this change in please?
thx
D