-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstyle1.css
103 lines (77 loc) · 2.28 KB
/
style1.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
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
body,h1,h2,li,ul,div,p{
margin:0px;
padding:0px;
border:0px;
}
body{
text-align:center;
background:#000 url("images/skygrad.jpg") ;
background-size: cover;
overflow:hidden;
}
.wava.blue{
background: transparent repeat-x;
position:absolute;
-ms-transform: translate(-190px,370px); /* IE 9 */
-webkit-transform: translate(-190px,370px); /* Chrome, Safari, Opera */
transform: translate(-190px,370px);
}
.wava.purple{
background: transparent repeat-x;
position:absolute;
-ms-transform: translate(-40px,365px); /* IE 9 */
-webkit-transform: translate(-40px,365px); /* Chrome, Safari, Opera */
transform: translate(-40px,365px);
}
/* keyframes for animation; simple 0 to 360 */
@-webkit-keyframes spin{
0% {-webkit-transform: rotate( 0deg);}
100% {-webkit-transform: rotate(360deg);}
}
/* Standard syntax */
@keyframes myfirst {
0% {-webkit-transform: rotate( 0deg);}
100% {-webkit-transform: rotate(360deg);}
}
#sun{
height:200px;
width:200px;
position:relative;
left:-520px;
-webkit-animation: spin 10s infinite linear; /* Chrome, Safari, Opera */
animation: spin 10s infinite;
}
#cloud-2{
position:relative;
-ms-transform: translate(600px,-200px); /* IE 9 */
-webkit-transform: translate(600px,-200px); /* Chrome, Safari, Opera */
transform: translate(600px,-200px);
}
#cloud-3{
position:relative;
-ms-transform: translate(10px,65px); /* IE 9 */
-webkit-transform: translate(10px,65px); /* Chrome, Safari, Opera */
transform: translate(10px,65px);
}
#cloud-4{
position:relative;
-ms-transform: translate(940px,65px); /* IE 9 */
-webkit-transform: translate(940px,65px); /* Chrome, Safari, Opera */
transform: translate(940px,65px);
}
#cloud-5{
position:relative;
-ms-transform: translate(1240px,-165px); /* IE 9 */
-webkit-transform: translate(1240px,-165px); /* Chrome, Safari, Opera */
transform: translate(1240px,-165px);
}
#cloud-6{
-ms-transform: translate(440px,165px); /* IE 9 */
-webkit-transform: translate(440px,165px); /* Chrome, Safari, Opera */
transform: translate(440px,165px);
}
#boat-1{
-ms-transform: translate(980px,-90px); /* IE 9 */
-webkit-transform: translate(980px,-90px); /* Chrome, Safari, Opera */
transform: translate(980px,-90px);
}