What are media break points? A breakpoint is the width of a users screen on certain devices. This width is then put into a media query coded into CSS that will then implement the new style accoding to the users screen width.
How did the sites choose which points to use? Kinsta chose to use the breakpoints provided by Bootstrap. They chose to use these breakpoints because Bootstrap is concidered the first and most popular responsive frameworks and they helped establish mobil-first design as an industry standard.Bootstrap designed their mobile first breakpoints around the idea of fitting containers whose widths are multiples of twelve. They have a set of six breakpoints. The smallest of which is less than 576px. This breakpoint is considered the default and has no media query. The next point would be landscpape phones starting at 576 px, tablets starting at 768 px, laptops at 992 px, and extra large desktops at 1200 px.