<div class="container">
    <div class="col-md-6">
        <div class="md-form">
            <input id="input_text" type="text" length="100">
            <label for="input_text">Title</label>
        </div>
        <div class="md-form">
            <textarea type="text" id="textarea" class="md-textarea"></textarea>
            <label for="textarea">Description</label>
        </div>
    </div>
</div>

textarea.md-textarea-scroll{
  overflow-y: visible;
}
textarea.md-textarea {
  padding: 0;
  resize: none;
  min-height: 3rem;
}

::-webkit-scrollbar {
    width: 8px;
}
/* Track */

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
/* Handle */

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #your-color;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-thumb:window-inactive {
   background: #your-color;
}

var $textarea = $('#textarea');

$textarea.on('keyup', function(evt){
    var $this = $(this);
    var height = $this.height();
    evt.which === 13 && height < 200 ? $this.height(height+=25) : $this.addClass("md-textarea-scroll");   
});