Skip to Content

Changes for page Academy

Last modified by Erik Bakker on 2024/09/24 16:12
From version 54.1
edited by Erik Bakker
on 2022/04/25 15:41
Change comment: There is no comment for this version
To version 53.1
edited by Erik Bakker
on 2022/04/25 15:39
Change comment: There is no comment for this version

Summary

Details

XWiki.StyleSheetExtension[0]
Code
... ... @@ -1,161 +1,2 @@
1 -body {
2 -
3 - margin: 0;
4 -
5 - padding: 0;
6 -
7 - min-height: 100vh;
8 -
9 - display: flex;
10 -
11 - align-items: center;
12 -
13 - justify-content: center;
14 -
15 - font-family: sans-serif;
16 -
17 - background-color: #f1f1f1;
18 -
1 +#xwikicontent {background-color: #f5f5f5;font-family:Ubuntu;color:#10137e
19 19  }
20 -
21 -.container .card .icon {
22 -
23 - position: absolute;
24 -
25 - top: 0;
26 -
27 - left: 0;
28 -
29 - width: 100%;
30 -
31 - height: 100%;
32 -
33 - background: #2c73df;
34 -
35 -}
36 -
37 -.container .card .icon .fa {
38 -
39 - position: absolute;
40 -
41 - top: 50%;
42 -
43 - left: 50%;
44 -
45 - transform: translate(-50%, -50%);
46 -
47 - font-size: 80px;
48 -
49 - color: #fff;
50 -
51 -}
52 -
53 -.container .card .slide {
54 -
55 - width: 300px;
56 -
57 - height: 200px;
58 -
59 - transition: 0.5s;
60 -
61 -}
62 -
63 -.container .card .slide.slide1 {
64 -
65 - position: relative;
66 -
67 - display: flex;
68 -
69 - justify-content: center;
70 -
71 - align-items: center;
72 -
73 - z-index: 1;
74 -
75 - transition: .7s;
76 -
77 - transform: translateY(100px);
78 -
79 -}
80 -
81 -.container .card:hover .slide.slide1{
82 -
83 - transform: translateY(0px);
84 -
85 -}
86 -
87 -.container .card .slide.slide2 {
88 -
89 - position: relative;
90 -
91 - display: flex;
92 -
93 - justify-content: center;
94 -
95 - align-items: center;
96 -
97 - padding: 20px;
98 -
99 - box-sizing: border-box;
100 -
101 - transition: .8s;
102 -
103 - transform: translateY(-100px);
104 -
105 - box-shadow: 0 20px 40px rgba(0,0,0,0.4);
106 -
107 -}
108 -
109 -.container .card:hover .slide.slide2{
110 -
111 - transform: translateY(0);
112 -
113 -}
114 -
115 -.container .card .slide.slide2::after{
116 -
117 - content: "";
118 -
119 - position: absolute;
120 -
121 - width: 30px;
122 -
123 - height: 4px;
124 -
125 - bottom: 15px;
126 -
127 - left: 50%;
128 -
129 - left: 50%;
130 -
131 - transform: translateX(-50%);
132 -
133 - background: #2c73df;
134 -
135 -}
136 -
137 -.container .card .slide.slide2 .content p {
138 -
139 - margin: 0;
140 -
141 - padding: 0;
142 -
143 - text-align: center;
144 -
145 - color: #414141;
146 -
147 -}
148 -
149 -.container .card .slide.slide2 .content h3 {
150 -
151 - margin: 0 0 10px 0;
152 -
153 - padding: 0;
154 -
155 - font-size: 24px;
156 -
157 - text-align: center;
158 -
159 - color: #414141;
160 -
161 -}