Font Size Header mobile

I’ve use the following Additional CSS to set the color and font size of my header title and subtitle, but now the font is too big for mobile. Can I add additional CSS to make sure the fontsize is smaller on mobile divices?

CSS:

}
.text-slider .maintitle{
color: #000000;
}

.text-slider .subtitle{
color: #000000;
}
.text-slider .maintitle {
font-size: 80px;
}
.text-slider .subtitle {
font-size: 50px;
}

Site is still in test: https://bc-test.carbonero.nl/

Hello,

First thanks for using our theme!

Please keep your code and add this additional CSS at Appearance > Customize > Additional CSS:

/* Tablets */
@media(max-width: 1024px) {
	.text-slider .maintitle {
	    font-size: 60px !important;
	}
	.text-slider .subtitle {
	    font-size: 30px !important;
	}
}

/* Smartphones */
@media(max-width: 1024px) {
	.text-slider .maintitle {
	    font-size: 30px !important;
	}
	.text-slider .subtitle {
	    font-size: 20px !important;
	}
}

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.

aThemes Support

Yes this works thanks!

Hello,

You are welcome!

Let us know if you need further assistance.

Kind Regards,

Rodrigo.

aThemes Support