Transparent App Engine logo

The other day I was looking for a transparent App Engine Logo to use in this blog.
Unfortunately I could not find one so I had to make it. Now it is available here .
As for people asking how I made this flying animation ( I know I know ...  it looks  stupid and obscuring etc. etc.  but I wanted this lovely plane to fly a bit !, it is all pure CSS  plus a couple of lines of js all made very easy with the new blogger template designer. Here are the steps :

1) Save the image in an image gadget:
From template designer  > Advanced > Add CSS : to add some css to make thing work.
 3) Position the image :
#Image1{
 position:fixed;
 width:auto;height:auto;
 left:20px;top:30px;}

#Image1 div {position: fixed;top: 7%;left:1%}

4)Define a class so it can be applied by js to auto start the animation on page load or on click using a little js  :

.nmanimate {
-webkit-animation-name: flyplane;
-webkit-animation-duration: 60s;
-webkit-animation-iteration-count: 1;
}

5) Or make the animation start  with hover ... : 

#Image1 div:hover {
-webkit-animation-name: flyplane;
-webkit-animation-duration: 60s;
-webkit-animation-iteration-count: 2;
}


(*) It only works on Chrome but it degrades gracefully in other browsers, besides most of the visitors here are Chrome users.
(* *) Lets hope some body with a more creative mind than mine picks up from here an recreates it in a much better way  ie. use multiple css backgrounds to create a parallax effect.

(*) For people wanting the transparent App Engine logo they can get it from here: Logo