postcss-normalize is overriding my own styles - postcss

Question

I'm trying to use postcss-normalize with PostCSS. Anywhere I place the plugin in the list causes it to override my styles. I have forceImport set to true so I don't need to import it anywhere.
Here's my .postcssrc:
{
"modules": false,
"plugins": {
"postcss-normalize": {
forceImport: true,
},
"postcss-import": {},
"postcss-nesting": {},
"postcss-preset-env": {
"autoprefixer": {
"grid": true
}
},
"postcss-color-mod-function": {},
"postcss-font-magician": [
{
"variants": {
"Open Sans": {
"300": [],
"400": [],
"700": []
},
"Arvo": {
"400": [],
"700": []
}
},
"foundries": ["google"]
}
]
}
}
I'm also using ParcelJS and I import my styles in index.js like so:
import "./css/layout.css"
import "./css/base.css"
import "./css/fonts.css"
import "./css/theme.css"
import header from "./modules/luxbar"
import jumbo from "./modules/jumbo"
import partners from "./modules/partners"
import instructions from "./modules/instructions"
import about from "./modules/about"
import faq from "./modules/faq";
import contact from "./modules/contact"
import testimonials from "./modules/testimonials";
header();
jumbo();
partners();
instructions();
about();
testimonials()
faq('.faq-list');
contact();
A module looks like this:
import $ from 'jquery'
import slick from 'slick-carousel'
import "./base.pcss"
export default () => {
$('.partners__carousel').slick({
autoplay: true,
speed: 300,
arrows: false,
mobileFirst: true,
centerMode: true,
slidesToShow: 2,
slidesToScroll: 1,
buttons: false,
})
}
The CSS is imported in the index.js for that module.
Any ideas how to solve this? Why is normalizer overriding my own styles?