title: Contact Form 7 - How Do I Style The Select Arrow and Select Options
body: <p>I'm building a website using <strong>Contact Form 7</strong> for WordPress and am having issues styling the select menu. Specifically, I cannot move the arrows or add padding to the dropdown so it's not so tight.</p>
  <p>I've tried using this CSS to add spacing to the dropdown items <em>(and some other CSS trickery)</em> but it has no effect:</p>
  <pre><code>options {
   padding: 20px 10px!important;
   margin: 20px 10px!important;
   line-height: 36px!important;
   border-bottom: 10px solid tan!important;
  }
  </code></pre>
  <p>Do you know if there's a way to control the styling behavior of CF7's select menu <em>(arrow and options dropdown)</em>?</p>
  <p>Thank you!</p>
  <p><strong>Demo Website:</strong>
  <a href="https://miles.birdhouse-demos.com/connect/" rel="nofollow noreferrer">https://miles.birdhouse-demos.com/connect/</a></p>
  <p><a href="https://i.stack.imgur.com/AVOUK.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AVOUK.jpg" alt="Cannot Move or Find Arrow" /></a>
  <a href="https://i.stack.imgur.com/NhgMH.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NhgMH.jpg" alt="Cannot Add Space" /></a></p>