Skew Modules to 0 Degrees in Home Page

How do I skew the slanted modules to be horizontal for Mobile and Tablet?

Below is the CSS overide which works on desktop but NOT on mobile or tablet:

.frontpage #gkDarkBottom::after, .frontpage #gkDarkBottom::before,
.frontpage #gkBottom3::after, .frontpage #gkBottom3::before {
transform: skewY(0deg);
}

#gkBottomSection::before {
transform: skewY(0deg) !important;
}

Thanks for helping.

Could you please post an url to your site?

I will private message the URL. Thanks.

Could you please mark those elements on a screenshot?

For example in your demo template, the modules are skewed on the home page. I have the css above applied for desktop however I like to apply the same for mobile and tablet.

Hello,

Did you tried to use the CSS properties with prefixes?

Code: Select all

-webkit-transform: skewY(0deg) !important;
-moz-transform: skewY(0deg) !important;
-ms-transform: skewY(0deg) !important;
-o-transform: skewY(0deg) !important;
transform: skewY(0deg) !important;