title: change dots size in slick.js
body: <p>I try to implement the slick.js slider with dots in my website.
  slider dots are very small in size.can i change the size of the dots? or it's default one </p>
  
  <p>my css </p>
  
  <pre><code>.slider {
            width: 650px;
            margin: 0 auto;
          }
  
          img {
            width: 200px;
            height: 200px;
          } 
  </code></pre>
  
  <p>my html </p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-sm-6"&gt;
          &lt;div class="slider-about"&gt;
              &lt;div class="slider"&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide1.jpg"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide2.jpg"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide3.jpg"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide1.jpg"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide2.jpg"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;img src="resources/image/slide3.jpg"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>my js :</p>
  
  <pre><code>$('.slider').slick({
        slidesToShow: 3,
        slidesToScroll: 3,
        dots: true,
        infinite: true,
        cssEase: 'linear'
      });
  </code></pre>
  
  <p>this is dots appered <a href="https://i.stack.imgur.com/EmKOe.png" rel="noreferrer"><img src="https://i.stack.imgur.com/EmKOe.png" alt="enter image description here"></a></p>