Decrease Mobile Text & Item Sizing on Homepage

[duart2023]

I am looking to decrease the text and size of all the red circled items in the below screenshot - ideally all by half.

URL: duoarthouse.com.au

[mrashid]

@duart2023 
Paste in style.css

@media only screen and (max-width: 768px) {
.overlay-text__rte.rte p {
    font-size: 10px !important;
}
h2.overlay-text__title.h1-style {
    font-size: 27px !important;
}
}

[duart2023]

@mrashid  Thank you! Although is it possible to also change the mobile button size and dot sizes - as pictured? Again by half the size.

[duart2023]

[mrashid · Accepted solution]

@duart2023 

@media only screen and (max-width: 768px) {
.slick-dots li button.custom-dot svg {
    height: 8px !important;
    width: 8px !important;
}
a.overlay-text__button.button.altcolour {
    font-size: 7px !important;
}
}