I am trying to make my website more friendly with smartphones, tablets and other types of devices/screens

I have more or less completed it, but am I using too many media queries? If so, how can I reduce the amount of css used on my website?

Partial code shown below:
Code:
@media only screen and (min-device-width : 320px) 
and (max-device-width : 480px)
@media only screen and (min-device-width : 500px) 
and (max-device-width: 800px)   
@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)  
@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)  
/* iPads (landscape) ----------- */ 
@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px)  and (orientation : landscape) 
@media only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) and (orientation : portrait)  
@media only screen and (min-device-width : 1000px) 
and (max-device-width: 1366px)  
@media only screen and (min-device-width : 1367px) 
and (max-device-width: 2366px)   
@media only screen and (min-device-width : 1367px) 
and (max-device-width: 2000px)