animation-fill-mode: forwards;
}
.plane .base{
width:24px;
height:7px;
background: #333;
position: absolute;
border-radius: 0% 0% 40% 40%;
-webkit-animation:tyreOut 3s 10s linear;
animation:tyreOut 3s 10s linear;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.plane .base::before{
content:””;
display: block;
width:4px;
height:13px;
position: absolute;
top:0;
left:10px;
background: #333;
}
.plane .base-back{
top:160px;
left:145px;
}
.plane .base-front{
top:147px;
right:104px;
-webkit-transform:rotate(-5deg);
transform:rotate(-5deg);</p>
<p> }
.plane .base .tyre{
width: 20px;
height: 20px;
border-radius: 50%;
background: #3f3f40;
position: absolute;
top: 11px;</p>
<p> }
.plane .base .tyre:before {
content:”;
width: 10px;
height: 10px;
border-radius: 50%;
background: #bdc2bd;
position: absolute;
top: 5px;
left: 5px;
}
.plane .base .tyre-back{
left: 2px;
-webkit-animation:tyreRotate 5s ease-out;
animation:tyreRotate 5s ease-out;
}
.plane .base .tyre-front{
right:2px;
-webkit-animation:tyreRotate 4s ease-out;
animation:tyreRotate 4s ease-out;
}
.plane .base .tyre .gap{
background: #3f3f40;
width: 2px;
height: 4px;
position: absolute;
left: 9px;
top: 5px;
box-shadow: 0 6px 0 #3f3f40;
}
.plane .base .tyre .gap:before {
content:”;
display:block;
width:2px;
height:4px;
position:absolute;
top:3px;
left:-3px;
background:#3f3f40;
box-shadow:0 6px 0 #3f3f40;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
}
@keyframes tyreRotate{
from{-webkit-transform:rotate(-5400deg);}
to{-webkit-transform:rotate(0deg);}
}</p>
<p> @keyframes hillMove{
0%{left:-200;}
100%{left:-1200px;}
}
@keyframes streetMove{
0%{left:0;}
100%{left:-1000px;}
}
@keyframes planeFly{
0%{left:0;bottom:0;transform:rotate(0deg);}
50%{left:15%;bottom:0;transform:rotate(-3deg);}
60%{left:18%;bottom:5%;transform:rotate(-5deg);}
100%{left:30%;bottom:35%;transform:rotate(0deg);}
}
@keyframes earthDown{
0%{bottom:0;}
25%{bottom:-30px;}
50%{bottom:-100px;}
100%{bottom:-300px;}
}
@keyframes tyreOut{
to{top:110px;}
}
</style>
</head>
<body>
<div class=”sky”></div>
<div class=”plane”>
<div class=”frame”>
<div class=”head”></div>
<div class=”windows”></div>
<div class=”door”></div>
