Remove hover effects on mobile only

Site URL: https://www.patrickpilato.ca/

Hi there,

I have hover effects on icons on my homepage that work great on desktop, but do not work properly on mobile. Can someone help me remove these hover effects only on mobile? And also help me center align the captions on these icons on mobile please?

A.       B

2 minutes ago, P-Lato said:

Site URL: https://www.patrickpilato.ca/

Hi there,

I have hover effects on icons on my homepage that work great on desktop, but do not work properly on mobile. Can someone help me remove these hover effects only on mobile? And also help me center align the captions on these icons on mobile please?

 

 

Hover effects not working properly need to be removed:

A.       

Caption not centered:

2 minutes ago, P-Lato said:

B

Password: 123

20 hours ago, P-Lato said:

 

 

Caption not centered:

 

Password: 123

It looks fine here. Did you solve problem?Also, the tablet...

2 hours ago, tuanphan said:

 

Yes I was finally able to make some code to remove the hover and center the captions for mobile. Can you help me to make these icons correct on the tablet view please?

www.patrickpilato.ca password: 123

2 hours ago, P-Lato said:

Yes I was finally able to make some code to remove the hover and center the captions for mobile. Can you help me to make these icons correct on the tablet view please?

 

www.patrickpilato.ca password: 123

Add to Design > Custom CSS

/* Tablet home icons */
@media screen and (max-width:991px) and (min-width:768px) {
div#block-yui_3_17_2_1_1618200791223_22986+.row>.span-1:not(:first-child) {
    width: 25%;
}
div#block-yui_3_17_2_1_1618200791223_22986+.row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
div#block-yui_3_17_2_1_1618200791223_22986+.row .span-1:first-child, div#block-yui_3_17_2_1_1618200791223_22986+.row .span-1:last-child {
    display: none;
}
}

1 minute ago, tuanphan said:

Add to Design > Custom CSS

/* Tablet home icons */
@media screen and (max-width:991px) and (min-width:768px) {
div#block-yui_3_17_2_1_1618200791223_22986+.row>.span-1:not(:first-child) {
    width: 25%;
}
div#block-yui_3_17_2_1_1618200791223_22986+.row {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
div#block-yui_3_17_2_1_1618200791223_22986+.row .span-1:first-child, div#block-yui_3_17_2_1_1618200791223_22986+.row .span-1:last-child {
    display: none;
}
}

That looks beautiful thank you so much!