title: Unsupported style property with React-Awesome-Slider and Gatsby
body: <p>I've added React Awesomeslider into my project, which is built with Gatsby.js, Next.js and using Sanity.io as a CMS. The css is currently configured by post css.</p>
  
  <p><a href="https://github.com/rcaferati/react-awesome-slider" rel="nofollow noreferrer">https://github.com/rcaferati/react-awesome-slider</a></p>
  
  <p>I've linked the plain css as advised in the documentation (and as I'm not using scss for this project).</p>
  
  <p>Here is my component</p>
  
  <pre><code>import PropTypes from "prop-types";
  import styles from "./Hero.module.css";
  import client from "../../client";
  import SimpleBlockContent from "../SimpleBlockContent";
  import Cta from "../Cta";
  import imageUrlBuilder from "@sanity/image-url";
  import AutoplaySlider from "react-awesome-slider";
  import AwesomeSliderStyles from "react-awesome-slider/dist/styles.css";
  const builder = imageUrlBuilder(client);
  
  function Hero(props) {
    const { heading, image, tagline, ctas } = props;
  
    const images = props.image;
    return (
      &lt;div className={styles.root}&gt;
        &lt;div className={styles.content}&gt;
          &lt;h1 className={styles.title}&gt;{heading}&lt;/h1&gt;
          &lt;div className={styles.tagline}&gt;{tagline &amp;&amp; &lt;SimpleBlockContent blocks={tagline} /&gt;}&lt;/div&gt;
          &lt;AutoplaySlider
            play={true}
            cancelOnInteraction={false}
            interval={6000}
            style={AwesomeSliderStyles}
          &gt;
            &lt;div&gt;
              {images.map((image) =&gt; (
                &lt;img
                  className={styles.image}
                  src={builder.image(image).url()}
                  className={styles.image}
                  alt={heading}
                /&gt;
              ))}
            &lt;/div&gt;
          &lt;/AutoplaySlider&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    );
  }
  
  Hero.propTypes = {
    heading: PropTypes.string,
    backgroundImage: PropTypes.object,
    tagline: PropTypes.array,
    ctas: PropTypes.arrayOf(PropTypes.object),
  };
  
  export default Hero;
  </code></pre>
  
  <p>Everything is showing as imported and the slider is appearing on the page however I'm having this show up in the console...</p>
  
  <pre><code>Warning: Unsupported style property awssld__timer--hidden. Did you mean awssld__timer-hidden?
  </code></pre>
  
  <p>And none of the other css seems to be pulling through either. Has anyone come across this before?</p>
  
  <p>Any help would be appreciated.</p>
  
  <p>Thanks</p>