Looking to make text smaller on mobile and larger on desktop

[ArronJW]

My website: https://xzvcbynb1ebsrhd4-29280075912.shopifypreview.com

Looking for the text above the bag image to read 17 font on mobile and 30 font on the desktop.  Currently the custom code makes the words appear at the top, however, I cannot get the text to be responsive.

.block-163650005194bcaa71-0 .overlay .inner {justify-content: start;}

Thanks for any help!

[Zworthkey]

Hii, @ArronJW 
Kindly share a screenshot of your problem so,
I can solve it perfectly.
Thank You.

[ArronJW]

Hi, 

Below is the text that isn't 17 font on mobile and 30 on desktop.

[Zworthkey]

@ArronJW 
Paste this code on top of the styles.css file.

@media only screen and (max-width: 749px) {
span.overlay__link.feature-link.cc-animate-init.-in.cc-animate-complete {
    font-size: 17px !important;
}
}

@media only screen and (min-width: 992px) {
span.overlay__link.feature-link.cc-animate-init.-in.cc-animate-complete {
    font-size: 30px !important;
}
}

Thank You.

[ArronJW]

Thanks so much!!! This was a really fast solution!

[dmwwebartisan]

@ArronJW 

1. Go to your store. Click on Actions > Edit Code 2. Go to Assets > styles.css add below lines at the bottom of the file.  

@media only screen and (max-width: 749px) {
span.overlay__link.feature-link.cc-animate-init.-in.cc-animate-complete {
    font-size: 17px !important;
}
}

@media only screen and (min-width: 992px) {
span.overlay__link.feature-link.cc-animate-init.-in.cc-animate-complete {
    font-size: 30px !important;
}
}

Thanks!

[ArronJW]

Hi!

Unfortunately the update doesn't work anymore.  I haven't changed the code at all.  The fix works on the shopify preview display but not in real time on the official URL.