title: jQuery Mobile Input & Textarea Custom Style
body: <p>I am trying to style my jQuery Mobile Form inputs &amp; textareas. </p>
  
  <p>Right now they come custom like this: </p>
  
  <p><a href="http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/forms/forms-text.html" rel="nofollow">http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/forms/forms-text.html</a></p>
  
  <p>HI want to style them myself with no rounded edges. I have solved this by adding a new style sheet and adding: </p>
  
  <pre><code>input {
  width:100%;
  height: 40px;
  border: 0px !important;
  border-bottom: 1px solid !important;
  border-bottom-color: #ccc !important;
  -moz-border-radius: 0px !important;
  -khtml-border-radius: 0px !important;
  -webkit-border-radius: 0px !important;
  border-radius: 0px !important;}
  
  #overheard textarea {
  width:100%;
  height: 100px !important;
  border: 0px !important;
  -moz-border-radius: 0px !important;
  -khtml-border-radius: 0px !important;
  -webkit-border-radius: 0px !important;
  border-radius: 0px !important;}
  </code></pre>
  
  <p>However there are a couple of things I can't figure out:</p>
  
  <ol>
  <li>On the textarea I can't get rid of the inner shadow. </li>
  <li>On both textarea and input when I click on on a field there is an outside shadow that comes up. I can't find where in the jQuery Mobile css or .js this is coming from. Any ideas?</li>
  </ol>