-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.css
64 lines (62 loc) · 899 Bytes
/
index.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
body{
background-color:#341264
}
.container{
height:31.25em;
width:31.25em;
/* boarder:10px solid white; */
position:absolute;
transform:translate(-50%,-50%);
left:50%;
top:50%;
/* background-color:grey; */
}
.planet{
height:15.62em;
width:15.62em;
background-color:#f5d302;
border-radius:50%;
position:absolute;
margin:auto;
left:0;
right:0;
top:0;
bottom:0;
z-index:1;
}
.planet:before{
content:"";
position:absolute;
height:1.5em;
width:1.5em;
background-color:#d69d00;
top:6em;
left:3em;
border-radius:50%;
box-shadow:2em 5em 0 0.6em #d69d00, 2em -2em 0 1em
#d69d00;
}
.satellite{
height:2em;
width:2em;
background-color:#ffffff;
border-radius:50%;
position:relative;
left:5em;
bottom:-20em;
animation:spin 4s infinite;
z-index:1;
}
@keyframes spin{
49%{
z-index:1;
}
50%{
bottom:-9.3em;
left:23em;
z-index:-1;
}
100%{
z-index:-1;
}
}