His site is pretty good as far as responsiveness goes. There are a few minor issues, especially concerning text size increases, but no show stoppers. Accessibility on the other hand could be better. What would be an interesting challenge is to see if you can make your clone even better than his as far as these issues are concerned.
My tip for dealing with media queries is to do what is referred to as a “mobile first” approach. Narrow your browser as far as it will go and style the elements on the page so that they look good (narrow his site to see how he has them laid out). Concentrate purely on this narrow styling. There should be no horizontal scroll bar. This will be your default/base CSS starting point.
After you are happy with the narrow version, slowly widen the browser window until you find a point where you have enough room to make your first transition to a wider view port. This will be where your first media query break point goes. You will use min-width for the query and I suggest you use ‘em’ units for the value (this will make it not only responsive to width changes but to text size changes). Add all of the CSS you need for this width in the break point.
Repeat the above as much as you think is needed until your page looks good at any width, using any text size. Not all parts of the page may use the same break points. The menu at the top may need a different break point than the nine course offerings. You can work on them separately if you like. Just concentrate on getting the menu working first and then move on to other sections of the page. But with each one, always start with as narrow as you can go and work your way out.