I thought I would follow up here before I call it a night (12:30am)
The styling for the caption box in the theme looks like this:
.banner-caption {
width: 90%;
padding: 10px 20px;
background-color: rgba(0,0,0,0.30);
text-align: center;
font-family: Serif;
font-size: 1.5rem;
line-height: 1.4;
font-style: italic;
color: #fff;
letter-spacing: 1px;
}
.banner-caption span {
font-family: arial, helvetica, sans-serif;
font-style: normal;
font-size: 0.75rem;
text-transform: uppercase;
}
I’ve left some out of the code, but what you see will allow you to create some custom CSS to override any of the caption box styling.
For the site title, this is found around line 379 of the style.css and looks like this, where the font size is set for small screens at 2.5rem:
.site-title {
padding: 10px 0;
font-family: "Old Standard TT",Georgia,Serif;
font-size: 2.5rem;
line-height: 1;
text-align: center;
}
So any adjustments you make can be done once again doing some custom CSS for the class .site-title
Please note though that the font size of the site title does change with media queries for different screen sizes. This is one:
@media (min-width: 768px) {
.site-title {
font-size: 3rem;
}
}
This is two:
@media (min-width: 992px) {
.site-title {
font-size: 4.75rem;
}
}
Incidentally, I use rem as font size which you can use this site tool for reference. https://www.pxtoem.com (it shows em’s but use it the same for rem’s)