title: CSS3 webkit transition bug in Chrome
body: <p>I'm having a weird bug in Chrome or my CSS and I can't figure out why.</p>
  
  <p>It concerns the next development website: <a href="http://bit.ly/13KoKOU" rel="nofollow">http://bit.ly/13KoKOU</a></p>
  
  <p>Whenever I'm in Chrome and I refresh the page, both the color from links flashes from the visited default Purple color to my desired color. For some milliseconds there you can see the purple color. </p>
  
  <p>Also, when you refresh the page you can shortly see the submenu fading away. Wich, of course, should not be the case as it needs to be hidden on load. But like the purple link color, you can see it for miliseconds. </p>
  
  <p>All I use is for the links:</p>
  
  <pre><code>a:link,
  a:visited{ 
      color:#ff368e;
      text-decoration: none!important;
      -webkit-transition: color 0.2s linear;
      -moz-transition: color 0.2s linear;
      -o-transition: color 0.2s linear;
      transition: color 0.2s linear;
  
  }
  a:hover, a:focus { color: #d82071; }
  </code></pre>
  
  <p>And for the submenu:</p>
  
  <pre><code>.header .categories ul ul {
  z-index: 1;
  opacity:0;
  visibility: hidden;
  border-bottom: solid 1px #e7e7e7;
  background: #fff; 
  display: block; 
  -webkit-box-shadow: 0 1px 1px #eee;
  -moz-box-shadow: 0 1px 1px #eee;
  box-shadow: 0 1px 1px #eee;
  margin-left: 32px;
  -webkit-transition: all 0.2s ease-out 0.1s;
  -moz-transition: all 0.2s ease-out 0.1s;
  -ms-transition: all 0.2s ease-out 0.1s;
  -o-transition: all 0.2s ease-out 0.1s;
  transition: all 0.2s ease-out 0.1s;
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
  </code></pre>
  
  <p>}</p>
  
  <p>I'm using Google Chrome 26.0.1410.64. 
  All other browsers work fine.</p>
  
  <p>Is it a bug, can it be fixed or is it my CSS?</p>