Changing portfolio text color on mobile with custom code

I'm trying to change the portfolio text on my site on mobile only with custom code. The current code below  doesn't seem to be working. Can anyone help me out? 

@media screen and (max-width:640px) {
.portfolio-text {
    color: #d0ff00 !important; 
    
}
}

On 9/29/2021 at 1:41 AM, ThanksForHelpingMe said:

I'm trying to change the portfolio text on my site on mobile only with custom code. The current code below  doesn't seem to be working. Can anyone help me out? 

@media screen and (max-width:640px) {
.portfolio-text {
    color: #d0ff00 !important; 
    
}
}

Try this code

@media screen and (max-width:767px) {
.portfolio-text h3 {
    color: #d0ff00 !important;   
}
}

Amazing! Thank you! 

Is there a way to make the Portfolio Grid Overlay Color different on mobile? This code isn't working? Think you can help? Thanks.

@media screen and (max-width:767px) {
.portfolio-overlay {
    color: #000000 !important;
}
}

On 10/4/2021 at 10:58 PM, ThanksForHelpingMe said:

Amazing! Thank you! 

Is there a way to make the Portfolio Grid Overlay Color different on mobile? This code isn't working? Think you can help? Thanks.

@media screen and (max-width:767px) {
.portfolio-overlay {
    color: #000000 !important;
}
}

overlay is background-color, not color

try change color: #000000 !important;

to

background-color: #000000 !important;

If it doesn't work, please share link to your site, we can check easier

That worked perfectly. Thank you again!!! 

@tuanphanwhat would the code be if we're trying to add an overlay to the main image on MOBILE ONLY?

On 12/4/2021 at 12:38 AM, geearias said:

@tuanphanwhat would the code be if we're trying to add an overlay to the main image on MOBILE ONLY?

Can you share link to page in screenshot? We can check easier

https://carlycushine.squarespace.com/

PW: CUSHNIE

On 12/10/2021 at 10:43 PM, geearias said:

https://carlycushine.squarespace.com/

 

PW: CUSHNIE

Add to Design > Custom CSS

/* Mobile home top overlay */
@media screen and (max-width:640px) {
section#new-page .Index-page-content:after {
    content: "";
    background-color: rgba(255,255,255,0.5);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}
section#new-page .span-12 {
    position: relative;
    z-index: 10000000000000;
}
}

On 12/11/2021 at 7:57 PM, tuanphan said:

Add to Design > Custom CSS

/* Mobile home top overlay */
@media screen and (max-width:640px) {
section#new-page .Index-page-content:after {
    content: "";
    background-color: rgba(255,255,255,0.5);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}
section#new-page .span-12 {
    position: relative;
    z-index: 10000000000000;
}
}

 

Thank you. This worked @tuanphan!