Sematic UI laceholder colour

by skd

HTML

<link rel="stylesheet" href="http://semantic-ui.com/dist/semantic.css">
<script src="http://semantic-ui.com/dist/semantic.js"></script>
<div class="ui form">
<input type="text" name="listname" placeholder="I want 'this' to be blue and the rest red" id="this">
</div>

CSS

body {
  padding: 1em;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    red !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    red !important;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:     red !important;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    red !important;
}