body {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}body {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}
portfoliobody {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}body {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}body {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}body {
background-color: #fff;
margin: 0;
padding: 0;
overflow: hidden;
}
.bee-container {
position: absolute;
top: 40%;
left: 40%;
}
.bee {
width: 150px;
animation: buzz 4s infinite ease-in-out;
}
@keyframes buzz {
0% { transform: translate(0px, 0px) rotate(0deg); }
10% { transform: translate(5px, -5px) rotate(3deg); }
20% { transform: translate(-10px, 5px) rotate(-3deg); }
30% { transform: translate(10px, 10px) rotate(5deg); }
40% { transform: translate(-5px, -10px) rotate(-5deg); }
50% { transform: translate(0px, 5px) rotate(2deg); }
60% { transform: translate(-5px, -5px) rotate(-2deg); }
70% { transform: translate(5px, 10px) rotate(3deg); }
80% { transform: translate(-10px, 0px) rotate(-3deg); }
90% { transform: translate(5px, -5px) rotate(1deg); }
100% { transform: translate(0px, 0px) rotate(0deg); }
}