AdNahim

var bar = $('.bar-text');
            
bar.mouseenter(function() {
    $(this).css('background-color', 'black');
  })
  .mouseleave(function() {
    $(this).css('background-color', 'transparent');
  });

<div class="input">
    <input type="text" value="Имя..." />
</div>

.input input {
    font-size:20px;
    border:none;
    outline:none;
    background: transparent;
}
.input {
    border:none;
    display:inline-block;
    border-bottom:solid #333 2px;
}
.input:before, .input:after {
    content:" ";
    display: inline-block;
    vertical-align:bottom;
    height: 5px;
    width: 2px;
    background: #333;
}

$(':checkbox').change(function(){
    var c = this.checked ? '#ff0000' : '#000';
    $('.spoil-table').css('color', c);
});

<div class="container">
    <div class="box"></div>
  </div>

.container {
  position: relative;
  display: block;
  float: left;
  width: 100px;
  height: 100px;
  background-color: #ccc;
  margin: 0 1.5%;
  text-align: center;
}


.box {
  position: absolute;
  bottom: 0px;
  top: 0px;
  right: 0px;
  left: 0px;
  margin: auto;
  width: 20px;
  height: 20px;
  background-color: #c2c;
}