media-queries-in-depth.css

/* Large Desktop = Width 1824px To Higher Resolution */
@media (min-width: 1824px) {
/* Styles */
}

/* Most Of The Desktop And Laptops = Width 1025px To 1823px */
@media (min-width: 1025px) and (max-width: 1823px) {
/* Styles */
}

/* Tablets and Ipads (Portrait) = Width 768px To 1024px */
@media (min-width: 768px) and (max-width: 1024px) and (orientation : portrait) {
/* Styles */
}

/* Tablets and Ipads (Landscape) = Width 768px To 1024px */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
/* Styles */
}

/* Low Resolution Tablets And Mobiles (Landscape) = Width 481px To 767px */
@media (min-width: 481px) and (max-width: 767px) {
/* Styles */
}

/* Most Of The Smartphones Mobiles (Portrait) = Width 320px To 480px */
@media (min-width: 320px) and (max-width: 480px) {
/* Styles */
}