title: Div background color, to change onhover slowly
body: <p>I'm trying to make a div's background color change on mouse over. I wanna make background like <a href="https://i.stack.imgur.com/KPIi1.png" rel="nofollow noreferrer">this spnashot</a></p>
  
  <p>and i am using this code on hover. I also wanna that when mouse over then color will change slowly </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.header_col a:hover{
    background: -webkit-repeating-linear-gradient(#74ABDD, #74ABDD 49.9%, #498DCB 50.1%, #498DCB 100%);
    background: -o-repeating-linear-gradient(#74ABDD, #74ABDD 49.9%, #498DCB 50.1%, #498DCB 100%);
    background: -moz-repeating-linear-gradient(#74ABDD, #74ABDD 49.9%, #498DCB 50.1%, #498DCB 100%);
    background: repeating-linear-gradient(#74ABDD, #74ABDD 49.9%, #498DCB 50.1%, #498DCB 100%); 
    color: white!important;
  }</code></pre>
  </div>
  </div>
  </p>