All you need to change at the snippet you used above is where to add the widget area. That is controlled by:
add_action ('__after_header', 'add_my_widget_area', 0);
So, you need to remove/disable that add_action first, but leave all the rest of the snippet in place. Now we're going to filter the output of the slider and add the result of a custom function
add_my_widget_area to it.
// we're capturing the output of tc_display_filter function
// and apply the function add_widget_to_slider to it.
Now let's write the function:
// we're returning $contents unchanged + the result of
// add_my_widget_area function (already defined in the snippet)
All the code from above goes into functions.php, where you already placed the snippet. Don't forget to disable (prefix with //) the initial
add_action. Also, you don't need the comments (what is after the // signs). I just put them to help you understand the code.
For centering the contents of the widget area I'll need to look at your page first to give you the best solution. We're gonna do that through use of CSS.
To answer your where is custom CSS question:
In Customizr you can add CSS easily with two methods:
1. Go to Dashboard > Appearance > Customize and find the Custom CSS section. Put your code in and save.
2. Make a child theme for Customizr (the child theme is a place where you can make modifications to the parent theme without the fear of them being lost on parent theme update). You can find out how on Customizr website, in the guide. Once created, open style.css of your child theme and put your code at the end of the file. Upload and you're done.