Responsive design with Bootstrap 4 grid

Hi guys,
I went back to my tribute page after completing a while ago in hopes of making it more responsive.
I’m running into a few issues which i assume is due to my lack of understanding of the grid system.

First off, for some reason, all my content is to the left of my page and doesnt take up the whole right side of the page for some reason even though i included “col-xl” in my divs classes.

Also, how do i make it so that the text in my #jumbo2 class is contained inside.

Finally, any tips on how i could better layout all of the content on this tribute page would be much appreciated. Thank you.

https://s.codepen.io/Modestas/debug/Jyexye/xnMabdyBjLPr

The codepen.io link that you have provided gives a 403 error. Sort it out.