PluginProbe
Master Addons for Elementor – Elementor Addons, Widgets, Mega Menu Builder, Popup Builder, Widget Builder & Template Kits / 3.1.2
Master Addons for Elementor – Elementor Addons, Widgets, Mega Menu Builder, Popup Builder, Widget Builder & Template Kits v3.1.2
3.2.2 3.2.3 3.2.1 3.2.0 3.1.9 3.1.8 3.1.7 3.1.6 3.1.5 3.1.4 3.1.3 3.1.2 3.1.1 3.1.0 3.0.9 trunk 1.0.6 1.0.7 1.0.8 1.0.9 1.1.0 1.1.1 1.1.3 1.1.4 1.1.5 All 174 releases
master-addons / assets / css / addons / ma-countdown-timer.css

ma-countdown-timer.css in Master Addons for Elementor – Elementor Addons, Widgets, Mega Menu Builder, Popup Builder, Widget Builder & Template Kits 3.1.2, at assets/css/addons/ma-countdown-timer.css

341 lines 14.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Master Addons: Countdown Timer Start */
2 .jltma-widget-countdown .jltma-countdown-wrapper {
3 position: relative;
4 }
5
6 .jltma-widget-countdown .jltma-countdown-wrapper .jltma-countdown-value {
7 font-size: 4.5em;
8 font-weight: bold;
9 line-height: 1.2em;
10 }
11
12 .jltma-widget-countdown .jltma-countdown-wrapper .jltma-countdown-title {
13 font-size: 0.875em;
14 font-weight: 500;
15 color: #888;
16 }
17
18 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline,
19 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline-table {
20 display: -webkit-box;
21 display: -webkit-flex;
22 display: -ms-flexbox;
23 display: flex;
24 -webkit-flex-wrap: wrap;
25 -ms-flex-wrap: wrap;
26 flex-wrap: wrap;
27 -webkit-box-align: center;
28 -webkit-align-items: center;
29 -ms-flex-align: center;
30 align-items: center;
31 }
32
33 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline .jltma-countdown-item,
34 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline-table .jltma-countdown-item {
35 -webkit-box-flex: 0;
36 -webkit-flex: 0 0 auto;
37 -ms-flex: 0 0 auto;
38 flex: 0 0 auto;
39 padding: 0.9375em 1.875em;
40 }
41
42 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline .jltma-countdown-seperator,
43 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline-table .jltma-countdown-seperator {
44 padding: 0.9375em;
45 }
46
47 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-inline-table .jltma-countdown-item {
48 -webkit-box-flex: 1;
49 -webkit-flex: 1 0 auto;
50 -ms-flex: 1 0 auto;
51 flex: 1 0 auto;
52 }
53
54 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block,
55 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table {
56 display: -webkit-box;
57 display: -webkit-flex;
58 display: -ms-flexbox;
59 display: flex;
60 -webkit-flex-wrap: wrap;
61 -ms-flex-wrap: wrap;
62 flex-wrap: wrap;
63 -webkit-box-align: center;
64 -webkit-align-items: center;
65 -ms-flex-align: center;
66 align-items: center;
67 }
68
69 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block .jltma-countdown-item,
70 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table .jltma-countdown-item {
71 text-align: center;
72 padding: 1.875em;
73 }
74
75 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block .jltma-countdown-title,
76 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block .jltma-countdown-value,
77 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table .jltma-countdown-title,
78 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table .jltma-countdown-value {
79 display: block;
80 }
81
82 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table .jltma-countdown-item,
83 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-block-table .jltma-countdown-seperator {
84 -webkit-flex-basis: 0;
85 -ms-flex-preferred-size: 0;
86 flex-basis: 0;
87 -webkit-box-flex: 1;
88 -webkit-flex-grow: 1;
89 -ms-flex-positive: 1;
90 flex-grow: 1;
91 text-align: center;
92 }
93
94 /* Master Addons: Countdown Timer Presets */
95 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card,
96 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip,
97 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle,
98 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient,
99 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon,
100 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass,
101 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal,
102 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline,
103 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic {
104 display: flex;
105 flex-wrap: wrap;
106 align-items: stretch;
107 justify-content: center;
108 gap: 15px;
109 }
110 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-item,
111 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-item,
112 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-item,
113 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-item,
114 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-item,
115 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-item,
116 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-item,
117 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-item,
118 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-item {
119 display: flex;
120 flex-direction: column;
121 align-items: center;
122 justify-content: center;
123 text-align: center;
124 }
125 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-value,
126 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-title,
127 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-value,
128 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-title,
129 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-value,
130 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-title,
131 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-value,
132 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-title,
133 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-value,
134 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-title,
135 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-value,
136 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-title,
137 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-value,
138 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-title,
139 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-value,
140 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-title,
141 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-value,
142 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-title {
143 display: block;
144 }
145 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-value,
146 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-value,
147 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-value,
148 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-value,
149 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-value,
150 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-value,
151 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-value,
152 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-value,
153 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-value {
154 font-size: 3.5em;
155 line-height: 1.1;
156 }
157 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-title,
158 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-title,
159 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-title,
160 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-title,
161 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-title,
162 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-title,
163 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-title,
164 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-title,
165 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-title {
166 margin-top: 8px;
167 text-transform: uppercase;
168 letter-spacing: 1px;
169 }
170
171 /* Preset: Card */
172 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-item {
173 min-width: 90px;
174 padding: 25px 30px;
175 background: #ffffff;
176 border-radius: 12px;
177 box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
178 }
179 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-value {
180 color: #1f2937;
181 }
182 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-card .jltma-countdown-title {
183 color: #9ca3af;
184 }
185
186 /* Preset: Flip */
187 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-item {
188 min-width: 90px;
189 padding: 22px 28px;
190 background: #1f2630;
191 border-radius: 8px;
192 box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
193 }
194 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-value {
195 position: relative;
196 display: inline-block;
197 color: #ffffff;
198 padding-bottom: 2px;
199 }
200 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-value::after {
201 content: "";
202 position: absolute;
203 left: -8px;
204 right: -8px;
205 top: 50%;
206 height: 2px;
207 background: rgba(0, 0, 0, 0.45);
208 }
209 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-flip .jltma-countdown-title {
210 color: #9ca3af;
211 }
212
213 /* Preset: Circle */
214 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-item {
215 width: 120px;
216 height: 120px;
217 padding: 0;
218 border-radius: 50%;
219 border: 3px solid #6e00e9;
220 }
221 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-value {
222 font-size: 2.6em;
223 color: #1f2937;
224 }
225 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-circle .jltma-countdown-title {
226 margin-top: 2px;
227 font-size: 0.75em;
228 color: #888888;
229 }
230
231 /* Preset: Gradient */
232 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-item {
233 min-width: 90px;
234 padding: 25px 30px;
235 background: linear-gradient(135deg, #6e00e9 0%, #c724b1 100%);
236 border-radius: 14px;
237 box-shadow: 0 12px 24px rgba(110, 0, 233, 0.25);
238 }
239 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-value {
240 color: #ffffff;
241 }
242 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-gradient .jltma-countdown-title {
243 color: rgba(255, 255, 255, 0.85);
244 }
245
246 /* Preset: Neon */
247 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-item {
248 min-width: 90px;
249 padding: 25px 30px;
250 background: #0b0f1a;
251 border: 1px solid #1fb6ff;
252 border-radius: 10px;
253 box-shadow: 0 0 18px rgba(31, 182, 255, 0.5), inset 0 0 12px rgba(31, 182, 255, 0.15);
254 }
255 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-value {
256 color: #1fb6ff;
257 text-shadow: 0 0 12px rgba(31, 182, 255, 0.8);
258 }
259 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neon .jltma-countdown-title {
260 color: #7fd4ff;
261 letter-spacing: 2px;
262 }
263
264 /* Preset: Glassmorphism */
265 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-item {
266 min-width: 90px;
267 padding: 25px 30px;
268 background: rgba(255, 255, 255, 0.25);
269 border: 1px solid rgba(255, 255, 255, 0.6);
270 border-radius: 16px;
271 -webkit-backdrop-filter: blur(10px) saturate(160%);
272 backdrop-filter: blur(10px) saturate(160%);
273 box-shadow: 0 8px 32px rgba(31, 38, 135, 0.15);
274 }
275 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-value {
276 color: #1f2937;
277 }
278 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-glass .jltma-countdown-title {
279 color: rgba(31, 41, 55, 0.65);
280 }
281
282 /* Preset: Minimal */
283 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal {
284 gap: 40px;
285 }
286 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-item {
287 padding: 0 10px;
288 position: relative;
289 }
290 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-value {
291 font-size: 4em;
292 color: #1f2937;
293 padding-bottom: 10px;
294 }
295 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-value::after {
296 content: "";
297 position: absolute;
298 left: 50%;
299 bottom: 28px;
300 transform: translateX(-50%);
301 width: 30px;
302 height: 3px;
303 border-radius: 3px;
304 background: #6e00e9;
305 }
306 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-minimal .jltma-countdown-title {
307 color: #9ca3af;
308 }
309
310 /* Preset: Outline */
311 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-item {
312 min-width: 90px;
313 padding: 25px 30px;
314 background: transparent;
315 border: 2px solid #6e00e9;
316 border-radius: 12px;
317 }
318 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-value {
319 color: #6e00e9;
320 }
321 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-outline .jltma-countdown-title {
322 color: #6e00e9;
323 opacity: 0.7;
324 }
325
326 /* Preset: Neumorphic */
327 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-item {
328 min-width: 90px;
329 padding: 25px 30px;
330 background: #e0e5ec;
331 border-radius: 18px;
332 box-shadow: 8px 8px 16px #b8bcc2, -8px -8px 16px #ffffff;
333 }
334 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-value {
335 color: #4b5563;
336 }
337 .jltma-widget-countdown .jltma-countdown-wrapper.jltma-countdown-skin-neumorphic .jltma-countdown-title {
338 color: #9ca3af;
339 }
340
341 /* Master Addons: Countdown Timer End */