Change footer font and size

Hi there

How do i go about changing the font and font size on my footer?

Looked everywhere could not find answer.

Many Thanks


Hi @Huseyin3001,

Thanks for writing in.

Add this code in your custom CSS:

.x-colophon.bottom .x-colophon-content {
    font-size: 14px;

.x-colophon.bottom .x-colophon-content p {
     font-family: "Roboto";
    font-size: 31px;
    font-style: normal;
    font-weight: 300;

Let us know how it goes.

If still not helping, please share us your URL…

Thanks. :slight_smile:

Hi there

Thank you for your reply.
Re: Changing footer font and size.

The code you supplied did not work.

As requested please find my link:

Thanks again

Hi again,

Please replace the previous code with the following code:

.x-colophon.bottom .x-nav li a {
    font-size: 16px !important;
    font-family: sans-serif !important;

Let us know how this goes!

Fantastic thankyou I will try it when I get home…

I do have another issue…

How do I remove the boxes that surround the sub menu once expanded so it only shows text?

Also when the menu expands it sits on top of a current page…how can I get it to expand alone so it’s on its own…not sitting on top of a page full of content?

Finally…how can I increase the sub menu fonts once expanded…currently too small?

Really appreciate your help…nearly finished my project…thank god :joy:

Yours thankfully

See for yourself

Hi There,

Please add this on Theme Options > CSS

	.masthead.masthead-inline {
		position: absolute;
	    top: 0;
	    left: 0;
	    right: 0;
	.x-navbar .mobile .x-nav li>a {
		font-size: 1.2em;
		border-width: 0;

Feel free to adjust the font-size: 1.2em; property.

Hope it helps,

Hi there

I am having difficulties at the moment and really need your assistance…

I have been trying to increase the submenu font size without success with code supplied and in the process i may have made a mistake whether the wrong code is installed that may be conflicting the code given?? I have it copied for you to see.

What i am trying to do is:

  1. Increase submenu font size and to change the colour too for different pages as i cannot see it as i have different colour pages. (Would i change css on each page for colour changes) opposed to global??

  2. I have H1 headings which are perfect on desktop but on smaller devices they look too large so i need to reduce h1 on mobile devices.

I would really appreciate your time on this as this needs to go live asap !!
If necessary i will pay for this to be fixed…

**Please see uploaded files showing the code in Global CSS…you will know if there is a problem as you know what you are doing more than i do :slight_smile:

Much appreciation as always…i eagerly await your response!!

Yours Kindly

***If necessary i will give you access to the site if you need it.

Thanks again :thumbsup:

Hello There,

Thanks for updating in! In most cases, css that do not works may have been inserted incorrectly like unclosed curly braces or invalid css syntax. Just as I suspected, I found out that there is an invalid code with no closing curly brace.

Please have it updated and change it to this:

@media(max-width: 767px) {
  .cs-content .x-section { 
     padding-left: 0 !important;
     padding-right: 0 !important;

Please noticed that I have indented the code to easily see the curly braces.

Regarding your H1 being to huge in smaller screens, I would suggest that you apply responsive text. Please find the gear icon ( and find the Responsive text manager. To get familiar with the responsive text and how it works, please check this out:

Hope this helps.