I am having tons of trouble with the responsive mode display on my mobile, tablet, and smaller resolution desktop sizes. You can see some mobile examples here:

Here are some examples of my CSS for some of these texts:

.fpageabout1 {
    text-align: center;
    color: #212121;
    font-size: 50px;
    font-family: Oswald;
    font-weight: 700;
    transform: capitalize;
    line height: 75px;
    padding-bottom: 25px;
}

.fpageabout2 {
    text-align: center;
    color: #b6b6b6;
    font-size: 35px;
    font-family: Roboto;
    font-weight: 300;
    transform: capitalize;
    line height: 75px;
}

.fpageabout3 {
    text-align: center;
    color: #212121;
    font-size: 20px;
    font-family: Roboto;
    font-weight: 300;
    line-height: 32px;
    letter-spacing: .7px;

As you can see, I have added line height, yet I am still seeing these problems on mobile. I am confused, i thought this theme would translate all of my work to mobile really well but it actually looks awful. 

__________________________________________________________

also

I was wondering if there is a way to redirect portfolio pages to another URL? I built the portfolio pages JUST for the salient portfolio tile display, but the actual pages themselves are blank. I've created new webpages for each portfolio item. Basically, there is no way to get to the actual portfolio pages but they exist as URL's on my website. I don't want extra empty urls on my website so I was wondering if theres a way to set up redirects

_____________________________________________________________________________

Also, my header is loading transparent even after turning off header transparency in the settings: