Make changes to new carousel

Make changes to the new carousel feature based on the conversation in this PR https://github.com/BlackPythonDevs/blackpythondevs.github.io/pull/544

TODOS:

[x] #580
[x] The circle image makes it hard to see some images, it may be better as a full width image [more ...]
[x] With the new featured image setup, we should be able to use that for articles with
[x] #579
[x] #556
[x] The section is margined inside the container making it smaller than the content near it. We can fix that by changing the width of the container from 85% to 100%
[x] The default image seems to be a little buggy. Instead of giving the default image it like creates an image of the raw content... we can fix this by removing default: post.content | split: '!' | first | split: '(' | last | split: ')' | first |
[ ] Investigate load time difference between using using bootstrap and traditional CSS [more ...]
[x] Use appropriate naming conventions for CSS file [more ...]
[ ] #578
- [ ] Test 1:
  - Add a small post as a demo (in test as a test case and destroy it after)
  - Wait and let it rebuild and then check to see if the default image is grabbed.
- [ ] Test 2:
  - If you select the next_button you expect the image to change to a new one. Same for prev_button
- [ ] Test 3:
  - That slides match the links in the recent posts section
- [ ] Test 4:
  - When you click the links in the carousel they go to the corresponding webpages

BlackPythonDevs / blackpythondevs.github.io