good working, looks neat and simple, but has some small issues.
First thing is the media size, some images are very heavy!! And needs too much bytes! to load! like christmas day image.
Try to use just perfectly fit size images! not so small, not so big.
The next issue is about the absolute unites like pixel. try to use relative units like
vw (more reading here)
Images also causes the horizontal scrolling for small screens. You may set a default image width (with height as auto) for small screens, and also maximum size when screen is big. example below
width: 90%;/*90% of the screen when screen goes smaller than below*/
max-width:10in; /*for big screen, no more than 7in please, you set 500px./*
height:auto;/*automatically set the height based on width*/
Please note the above css rule might not work probably with your work, since you have kind of different layouting by html. For example you may not host your images with div which they control the size and the layout of the images, or better fix it.
There is also some clear area at the end of the page which could be removed.
For first two images, you may considering following more simple approach too
<img class="img_dude border" src="https://sirpeterblaketrust.org/app/default/assets/forum/uploads/Peter%20crew%20talking%20red%20socks.CF.JPG" alt="Black Magic's Team New Zealand">
<img class="img_dude border" src="https://sirpeterblaketrust.org/app/default/assets/forum/uploads/Off%20Shore%20racing%20dreams%20becomes%20a%20reality.JPG" alt="First Whitbread Race">
This is also very good you set
alt attribute for each image, very good.
Again, keep an eye about relative units, they are good.
Keep going on good work, happy programming.