PluginProbe
Icegram Engage – Popups, Optins, CTAs & Lead Generation / 3.1.34
Icegram Engage – Popups, Optins, CTAs & Lead Generation v3.1.34
3.1.5 3.1.6 3.1.7 3.1.8 3.1.9 3.1.34 3.1.35 3.1.36 3.1.37 3.1.38 3.1.39 3.1.4 3.1.40 3.1.41 3.1.42 3.1.43 trunk 1.1 1.1.1 1.1.2 1.10 1.10.1 1.10.10 1.10.11 1.10.12 All 180 releases
icegram / lite / assets / css / frontend.css

frontend.css in Icegram Engage – Popups, Optins, CTAs & Lead Generation 3.1.34, at lite/assets/css/frontend.css

831 lines 25.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Powered By link */
2 .ig_powered_by, .ig_powered_by a, a.ig_powered_by {
3 color: #A8A8A8 !important;
4 text-decoration: none;
5 }
6 .ig_cta_overlay{width: 100%; height: 100%; top: 0; left: 0; background: #E6E6E6; z-index: 1000000; position: fixed; opacity: 0.5; } .ig_cta_spinner{background : url('../images/spinner-2x.gif') no-repeat no-repeat center; height: 100%; }
7
8 /* Make border none for all buttons under icegram, to have our style */
9 /*todo :test this and check with all wp themes and icegram themes*/
10 .icegram .ig_button,
11 .icegram input[type="submit"],
12 .icegram input[type="button"]{
13 border: none; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */
14 box-sizing: border-box; /* Opera/IE 8+ */
15 box-shadow:none;
16 }
17 /** TODO : check the need of this while testing **/
18 /*
19 .icegram .ig_button:hover,
20 .icegram input[type="submit"]:hover,
21 .icegram input[type="button"]:hover,
22 .icegram .ig_button:active,
23 .icegram input[type="submit"]:active,
24 .icegram input[type="button"]:active{
25 border: none;
26 }
27 */
28
29 /*
30 Making p tag margin uniform to all icegram message type.
31 It can be override with default.css and theme.css if required
32 */
33 .ig_message p{
34 margin: 0;
35 padding: 0;
36 line-height: inherit;
37 font-size: inherit;
38 }
39
40 .ig_clear_fix:after {
41 content: ".";
42 display: block;
43 clear: both;
44 visibility: hidden;
45 line-height: 0;
46 height: 0;
47 }
48
49 .ig_form_response_text{
50 margin:.5em auto;
51 padding: .5em;
52 text-align:center;
53 }
54
55 /****************** Embed Form: Start *******************/
56
57 .ig_form_container{
58 display: none;
59 position: relative;
60 height: 100%;
61 z-index: 10;
62 padding: .7em 1em;
63 text-align: left;
64 line-height: 1; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */
65 box-sizing: border-box; /* Opera/IE 8+ */
66 }
67
68 .ig_form_container form{
69 margin: 0;
70 padding: 0;
71 font-size: 100%;
72 }
73
74 .ig_form_container textarea,
75 .ig_form_container select{
76 height: 2.25em;
77 }
78 /*.ig_form_container textarea{
79 height: 4.25em;
80 }*/
81 .ig_form_container input[type=checkbox]{
82 height: 1.25em !important;
83 }
84
85 .ig_form_container .ig_form_header{
86 /*font-size: 1.5em;*/
87 width: 98%;
88 /*margin: 0 auto;*/
89 text-align: left;
90 }
91 .ig_form_container .ig_form_footer{
92 font-size: .8em;
93 /*margin: 0 auto;*/
94 width: 98%;
95 clear: both;
96 text-align: left;
97 }
98
99 .ig_form_container .ig_form_els{
100 margin:.3em 1% .3em 0;
101 }
102
103 .ig_form_left .ig_form_container.layout_left{
104 display: block;
105 padding: 1em .7em;
106 }
107
108 .ig_form_right .ig_form_container.layout_right{
109 display: block;
110 padding: 1em .7em;
111 float: left;
112 }
113
114 .ig_form_bottom .ig_form_container.layout_bottom{
115 display: block;
116 width: 100%;
117 height: auto;
118 }
119
120 .ig_form_inline .ig_form_container.layout_inline{
121 display: block;
122 width: 100%;
123 padding: .5em;
124 background-color: transparent !important;
125 color: inherit !important;
126 }
127 .ig_form_bottom .ig_form_container.layout_bottom .ig_embed_form_container,
128 .ig_form_inline .ig_form_container.layout_inline .ig_embed_form_container{
129 /*text-align: center;*/
130 }
131
132 .ig_form_left .ig_form_container.layout_left .ig_form_els,
133 .ig_form_right .ig_form_container.layout_right .ig_form_els{
134 margin: .5em auto;
135
136 }
137 .ig_form_bottom .ig_form_container.layout_bottom .ig_form_els{
138 display: inline-block;
139 float: left;
140 }
141
142 .ig_form_inline .ig_form_container.layout_inline .ig_form_els{
143 display: inline-block;
144 float: left;
145 }
146
147 .ig_form_bottom .ig_form_container.layout_bottom .ig_full .ig_form_els,
148 .ig_form_inline .ig_form_container.layout_inline .ig_full .ig_form_els{
149 width: 99%;
150 }
151
152 .ig_form_bottom .ig_form_container.layout_bottom .ig_half .ig_form_els,
153 .ig_form_inline .ig_form_container.layout_inline .ig_half .ig_form_els{
154 width: 49%;
155 }
156
157 .ig_form_bottom .ig_form_container.layout_bottom .ig_third .ig_form_els,
158 .ig_form_inline .ig_form_container.layout_inline .ig_third .ig_form_els{
159 width: 32%;
160 }
161
162 .ig_form_bottom .ig_form_container.layout_bottom .ig_quater .ig_form_els,
163 .ig_form_inline .ig_form_container.layout_inline .ig_quater .ig_form_els{
164 /*width: 22%;*/
165 width: 24%;
166 }
167
168 .ig_form_container .ig_form_els input{
169 height: 2.25em;
170 line-height: 2.2em;
171 }
172 .ig_form_container .ig_form_els input,
173 .ig_form_container .ig_form_els button,
174 .ig_form_container .ig_form_els label,
175 .ig_form_container .ig_form_els textarea,
176 .ig_form_container .ig_form_els select{
177 width: 99%;
178 font-size: 1em;
179 text-align: left;
180 display: block;
181 margin: 0 auto; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */
182 box-sizing: border-box; /* Opera/IE 8+ */
183 }
184 .ig_form_container .ig_form_els .ig_button {
185 text-align: center;
186 }
187 .ig_form_container .ig_form_els textarea,
188 .ig_form_container .ig_form_els select{
189 padding-left: .5em;
190 }
191 .ig_form_container .ig_form_els textarea{
192 padding-top: .5em;
193 }
194
195 /*TODO : make it work for every message type.. every layout*/
196 .ig_form_container .ig_form_els.ig_form_el_radio {
197 height: 2.25em !important;
198 line-height: 2.2em;
199 }
200 .ig_form_container .ig_form_els.ig_form_el_radio input{
201 width: auto ! important;
202 display: inline;
203 margin: 0 .3em;
204 height: 1em !important;
205 }
206
207 .ig_form_container .ig_form_els.ig_form_el_radio input[type="checkbox"] {
208 display: inline-block !important;
209 margin: 0 0.3em;
210 height: 1em !important;
211 }
212 .ig_form_container .ig_form_els.ig_form_el_radio input[type="checkbox"]::before {
213 margin: -0.85rem 0 0 -0.65em;
214 }
215
216
217 .ig_form_bottom .ig_form_container.layout_bottom .ig_quater .ig_form_els.ig_form_el_radio,
218 .ig_form_inline .ig_form_container.layout_inline .ig_quater .ig_form_els.ig_form_el_radio{
219 display: inline;
220 }
221 .ig_form_bottom .ig_form_container.layout_bottom .ig_quater .ig_form_els.ig_form_el_radio label,
222 .ig_form_inline .ig_form_container.layout_inline .ig_quater .ig_form_els.ig_form_el_radio label{
223 width: auto;
224 display: inline;
225 }
226
227 .ig_form_left .ig_form_container.layout_left .ig_button_label,
228 .ig_form_right .ig_form_container.layout_right .ig_button_label{
229 display: none;
230 }
231
232 .ig_form_inline .ig_form_container.layout_inline .ig_button_label,
233 .ig_form_bottom .ig_form_container.layout_bottom .ig_button_label{
234 display: block;
235 visibility: hidden;
236 opacity: 0;
237 }
238
239 /* Form Button CSS */
240 .ig_form_inline .ig_form_container.layout_inline .ig_button,
241 .ig_form_inline .ig_form_container.layout_inline input[type="submit"],
242 .ig_form_inline .ig_form_container.layout_inline input[type="button"],
243 .ig_form_bottom .ig_form_container.layout_bottom .ig_button,
244 .ig_form_bottom .ig_form_container.layout_bottom input[type="submit"],
245 .ig_form_bottom .ig_form_container.layout_bottom input[type="button"],
246 .ig_form_left .ig_form_container.layout_left .ig_button,
247 .ig_form_left .ig_form_container.layout_left input[type="submit"],
248 .ig_form_left .ig_form_container.layout_left input[type="button"],
249 .ig_form_right .ig_form_container.layout_right .ig_button,
250 .ig_form_right .ig_form_container.layout_right input[type="submit"],
251 .ig_form_right .ig_form_container.layout_right input[type="button"] {
252 width: 99% ;
253 font-size: 1em;
254 float: none;
255 margin: 0 auto!important;
256 text-align: center;
257 display: block;
258 -ms-transform: inherit;
259 -webkit-transform: inherit;
260 transform: inherit;
261 opacity: 1;
262 }
263
264 /* End */
265
266
267 /****** Form Styles: Start ******/
268 .ig_form_container:before{
269 content: '';
270 padding: 0;
271 margin: 0;
272 position: absolute; /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */
273 box-sizing: content-box; /* Opera/IE 8+ */
274 }
275
276 /****** Form Style: Style 0 ******/
277
278 .ig_form_style_0 .ig_form_container:before{
279 display: none;
280 }
281
282 .ig_form_style_0 .ig_form_container .ig_form_els input{
283 height: 2.25em;
284 line-height: 2.2em;
285 padding: inherit;
286 padding-left: .5em;
287 }
288
289 .ig_form_style_0 .ig_form_container .ig_form_els .ig_button:hover,
290 .ig_form_style_0 .ig_form_container .ig_form_els .ig_button:focus,
291 .ig_form_style_0 .ig_form_container .ig_form_els .ig_button{
292 height: 2.25em;
293 line-height: 2.2em;
294 /*border: inherit; */
295 padding: inherit;
296 }
297
298 /****** Form Style: Style 1 ******/
299
300 .ig_form_style_1 .ig_form_container:before{
301 border-width: 0;
302 border-style: solid;
303 border-color: #000 !important;
304 opacity: .3;
305 top: 0;
306 }
307
308 .ig_form_left.ig_form_style_1 .ig_form_container:before{
309 right: 0;
310 height: inherit;
311 border-left-width: .22em;
312 }
313 .ig_form_right.ig_form_style_1 .ig_form_container:before{
314 left: 0;
315 height: inherit;
316 border-left-width: .22em;
317 }
318 .ig_form_bottom.ig_form_style_1 .ig_form_container:before{
319 left: 0;
320 width: 100%;
321 border-top-width: .22em;
322 }
323 .ig_form_inline.ig_form_style_1 .ig_form_container:before{
324 display: none;
325 }
326
327 .ig_form_style_5 .ig_form_container .ig_form_els input:not(.ig_button),
328 .ig_form_style_6 .ig_form_container .ig_form_els input:not(.ig_button),
329 .ig_form_style_1 .ig_form_container .ig_form_els input:not(.ig_button){
330 border: 1px solid #ccc;
331 }
332 .ig_form_style_5 .ig_form_container .ig_form_els input,
333 .ig_form_style_6 .ig_form_container .ig_form_els input,
334 .ig_form_style_1 .ig_form_container .ig_form_els input{
335 height: 2.25em;
336 line-height: 2.2em;
337 border-radius: .2em;
338 box-shadow: none;
339 padding: inherit;
340 padding-left: .5em;
341 }
342 .ig_form_style_5 .ig_form_container .ig_form_els input:focus:not(.ig_button),
343 .ig_form_style_5 .ig_form_container .ig_form_els input:hover:not(.ig_button),
344 .ig_form_style_6 .ig_form_container .ig_form_els input:focus:not(.ig_button),
345 .ig_form_style_6 .ig_form_container .ig_form_els input:hover:not(.ig_button),
346 .ig_form_style_1 .ig_form_container .ig_form_els input:focus:not(.ig_button),
347 .ig_form_style_1 .ig_form_container .ig_form_els input:hover:not(.ig_button){
348 border-color: #999;
349 }
350 .ig_form_style_5 .ig_form_container .ig_form_els input:focus,
351 .ig_form_style_5 .ig_form_container .ig_form_els input:hover,
352 .ig_form_style_6 .ig_form_container .ig_form_els input:focus,
353 .ig_form_style_6 .ig_form_container .ig_form_els input:hover,
354 .ig_form_style_1 .ig_form_container .ig_form_els input:focus,
355 .ig_form_style_1 .ig_form_container .ig_form_els input:hover{
356 height: 2.25em;
357 line-height: 2.2em;
358 padding: inherit;
359 padding-left: .5em;
360 }
361 .ig_form_style_5 .ig_form_container .ig_form_els .ig_button:hover,
362 .ig_form_style_5 .ig_form_container .ig_form_els .ig_button:focus,
363 .ig_form_style_5 .ig_form_container .ig_form_els .ig_button,
364 .ig_form_style_6 .ig_form_container .ig_form_els .ig_button:hover,
365 .ig_form_style_6 .ig_form_container .ig_form_els .ig_button:focus,
366 .ig_form_style_6 .ig_form_container .ig_form_els .ig_button,
367 .ig_form_style_1 .ig_form_container .ig_form_els .ig_button:hover,
368 .ig_form_style_1 .ig_form_container .ig_form_els .ig_button:focus,
369 .ig_form_style_1 .ig_form_container .ig_form_els .ig_button{
370 height: 2.25em;
371 line-height: 2.2em;
372 /*border: inherit; */
373 padding: inherit;
374 }
375
376 /****** Form Style: Style 2 ******/
377
378 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els,
379 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els{
380 margin-right: 0;
381 margin-left: 0;
382 }
383 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els .ig_button,
384 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els .ig_button,
385 .ig_form_left.ig_form_style_2 .ig_form_container.layout_left .ig_form_els .ig_button,
386 .ig_form_right.ig_form_style_2 .ig_form_container.layout_right .ig_form_els .ig_button{
387 padding: inherit;
388 }
389 .ig_form_left.ig_form_style_2 .ig_form_container.layout_left .ig_form_els input,
390 .ig_form_right.ig_form_style_2 .ig_form_container.layout_right .ig_form_els input{
391 padding-left: 1em;
392 }
393
394 .ig_form_left.ig_form_style_2 .ig_form_container.layout_left .ig_form_els .ig_button,
395 .ig_form_left.ig_form_style_2 .ig_form_container.layout_left .ig_form_els input,
396 .ig_form_right.ig_form_style_2 .ig_form_container.layout_right .ig_form_els .ig_button,
397 .ig_form_right.ig_form_style_2 .ig_form_container.layout_right .ig_form_els input{
398 height: 2.25em;
399 line-height: 2.2em;
400 border-radius: 2em;
401 }
402 .ig_form_left.ig_form_style_2 .ig_form_container.layout_left .ig_form_els label,
403 .ig_form_right.ig_form_style_2 .ig_form_container.layout_right .ig_form_els label{
404 padding-left: 1em;
405 }
406
407 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els .ig_button,
408 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els .ig_button,
409 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els input,
410 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els input{
411 height: 2.25em;
412 line-height: 2.2em;
413 width: 100%;
414 border-width: 2px;
415 border-right-width: 0;
416 }
417
418 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els.ig_form_els_first input,
419 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els.ig_form_els_first input{
420 border-radius: 2em 0 0 2em;
421 padding-left: 1em;
422 }
423
424 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els.ig_form_els_first label,
425 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els.ig_form_els_first label{
426 padding-left: 1em;
427 }
428
429 .ig_form_bottom.ig_form_style_2 .ig_form_container.layout_bottom .ig_form_els.ig_form_els_last input,
430 .ig_form_inline.ig_form_style_2 .ig_form_container.layout_inline .ig_form_els.ig_form_els_last input{
431 border-radius: 0 2em 2em 0;
432 }
433
434 /****** Form Style: Style 3 ******/
435
436 .ig_form_style_3 .ig_form_container .ig_form_els input:not(.ig_button){
437 border: 1px solid rgba(255,255,255,.3);
438 }
439 .ig_form_style_3 .ig_form_container .ig_form_els input{
440 height: 2.25em;
441 line-height: 2.2em;
442 box-shadow: none;
443 padding: inherit;
444 padding-left: .5em;
445 background-color: rgba(0, 0, 0, .3);
446 /*color: inherit;*/
447 }
448 .ig_form_style_3 .ig_form_container .ig_form_els input:focus:not(.ig_button),
449 .ig_form_style_3 .ig_form_container .ig_form_els input:hover:not(.ig_button){
450 border-color: rgba(255,255,255,.6);
451 }
452 .ig_form_style_3 .ig_form_container .ig_form_els input:focus,
453 .ig_form_style_3 .ig_form_container .ig_form_els input:hover{
454 height: 2.25em;
455 line-height: 2.2em;
456 padding: inherit;
457 padding-left: .5em;
458 }
459 .ig_form_style_3 .ig_form_container .ig_form_els .ig_button:hover,
460 .ig_form_style_3 .ig_form_container .ig_form_els .ig_button:focus,
461 .ig_form_style_3 .ig_form_container .ig_form_els .ig_button{
462 height: 2.25em;
463 line-height: 2.2em;
464 /*border: inherit; */
465 padding: inherit;
466 }
467 .ig_form_style_3 .ig_form_container .ig_form_els ::-webkit-input-placeholder { /* WebKit browsers */
468 color: rgba(255,255,255,.5);
469 }
470 .ig_form_style_3 .ig_form_container .ig_form_els :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
471 color: rgba(255,255,255,.5);
472 opacity: 1;
473 }
474 .ig_form_style_3 .ig_form_container .ig_form_els ::-moz-placeholder { /* Mozilla Firefox 19+ */
475 color: rgba(255,255,255,.5);
476 opacity: 1;
477 }
478 .ig_form_style_3 .ig_form_container .ig_form_els :-ms-input-placeholder { /* Internet Explorer 10+ */
479 color: rgba(255,255,255,.5);
480 }
481
482 /****** Form Style: Style 4 ******/
483
484 .ig_form_bottom.ig_form_style_4 .ig_content{
485 margin-bottom: 1.3em;
486 }
487 .ig_form_style_4 .ig_form_container:before{
488 /*opacity: .4;*/
489 border-style: solid;
490 /*top: -1.2em;
491 left: -1.3em;
492 border-width: 1.3em;*/
493 top: -1em;
494 left: -1em;
495 width: 100%;
496 height: 100%;
497 border-width: 1em;
498 z-index: -1;
499 box-shadow: 0 0px 15px rgba(0,0,0,0.7);
500 }
501
502 .ig_form_bottom.ig_form_style_4 .ig_form_container:before{
503 /*top: 0;*/
504 /*border-bottom-width: 0;*/
505 }
506 .ig_form_right.ig_form_style_4 .ig_form_container:before{
507 left: inherit;
508 right: -1em;
509 }
510 .ig_form_inline.ig_form_style_4 .ig_form_container:before{
511 display: none;
512 }
513
514 .ig_form_style_4 .ig_form_container .ig_form_els input{
515 height: 2.25em;
516 line-height: 2.2em;
517 padding: inherit;
518 padding-left: .5em;
519 }
520
521 .ig_form_style_4 .ig_form_container .ig_form_els .ig_button:hover,
522 .ig_form_style_4 .ig_form_container .ig_form_els .ig_button:focus,
523 .ig_form_style_4 .ig_form_container .ig_form_els .ig_button{
524 height: 2.25em;
525 line-height: 2.2em;
526 /*border: inherit; */
527 padding: inherit;
528 }
529
530
531 /****** Form Style: Style 5 ******/
532
533 .ig_form_bottom.ig_form_style_5 .ig_form_container.layout_bottom .ig_form_els_first,
534 .ig_form_inline.ig_form_style_5 .ig_form_container.layout_inline .ig_form_els_first{
535 width: 68%;
536 }
537
538 .ig_form_bottom.ig_form_style_5 .ig_form_container.layout_bottom .ig_form_els_last,
539 .ig_form_inline.ig_form_style_5 .ig_form_container.layout_inline .ig_form_els_last{
540 width: 30%;
541 }
542
543 /****** Form Style: Style 6 ******/
544
545 .ig_form_style_6 .ig_form_container.layout_bottom .ig_full .ig_form_els,
546 .ig_form_style_6 .ig_form_container.layout_inline .ig_full .ig_form_els,
547 .ig_form_style_6 .ig_form_container.layout_bottom .ig_half .ig_form_els,
548 .ig_form_style_6 .ig_form_container.layout_inline .ig_half .ig_form_els,
549 .ig_form_style_6 .ig_form_container.layout_bottom .ig_third .ig_form_els,
550 .ig_form_style_6 .ig_form_container.layout_inline .ig_third .ig_form_els,
551 .ig_form_style_6 .ig_form_container.layout_bottom .ig_quater .ig_form_els,
552 .ig_form_style_6 .ig_form_container.layout_inline .ig_quater .ig_form_els{
553 width: 99%;
554 margin: .5em auto 0 auto;
555 }
556
557 /****** Form Styles: End ******/
558
559
560 /****************** Embed Form: End *******************/
561
562
563 /***************Animations: Start******************/
564 /*** Appear: Start ***/
565
566 .ig_anim_appear_in {
567 -webkit-animation: IgFadeIn 0.9s;
568 animation: IgFadeIn 0.9s;
569 visibility: visible;
570 }
571 @-webkit-keyframes IgFadeIn {
572 0% {opacity: 0; }
573 50% {opacity: 0.5; }
574 100% {opacity: 1; }
575 }
576
577 @keyframes IgFadeIn {
578 0% {opacity: 0; }
579 50% {opacity: 0.5; }
580 100% {opacity: 1; }
581 }
582 .ig_anim_appear_out {
583 -webkit-animation: IgFadeOut 0.9s;
584 animation: IgFadeOut 0.9s;
585 }
586
587 @-webkit-keyframes IgFadeOut {
588 0% {opacity: 1; }
589 99.5% {opacity: 0.5; }
590 100% {opacity: 1; }
591 }
592
593 @keyframes IgFadeOut {
594 0% {opacity: 1; }
595 99.5% {opacity: 0.5; }
596 100% {opacity: 1; }
597 }
598
599
600
601 /*** Appear: End***/
602
603 /*** Slide: Start ***/
604 /****-Slide Left: Start-***/
605 .ig_left.ig_anim_slide_in{
606 animation-name: IgSlideInLeft;
607 -moz-animation-name: IgSlideInLeft;
608 -webkit-animation-name: IgSlideInLeft;
609
610 animation-duration: 0.5s;
611 -moz-animation-duration: 0.5s;
612 -webkit-animation-duration: 0.5s;
613
614 animation-timing-function: ease;
615 -moz-animation-timing-function: ease;
616 -webkit-animation-timing-function: ease;
617 }
618 @-webkit-keyframes IgSlideInLeft {
619 0% {-webkit-transform: translate3d(-100%, 0, 0);}
620 100% {-webkit-transform: none;}
621 }
622
623 @keyframes IgSlideInLeft {
624 0% {-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0);}
625 100% {-webkit-transform: none;transform: none;}
626 }
627 .ig_left.ig_anim_slide_out{
628 animation-name: IgFadeOutLeft;
629 -moz-animation-name: IgFadeOutLeft;
630 -webkit-animation-name: IgFadeOutLeft;
631
632 animation-duration: 0.9s;
633 -moz-animation-duration: 0.9s;
634 -webkit-animation-duration: 0.9s;
635
636 animation-timing-function: ease;
637 -moz-animation-timing-function: ease;
638 -webkit-animation-timing-function: ease;
639
640 -webkit-animation-fill-mode: forwards;
641 animation-fill-mode: forwards;
642 }
643
644 @-webkit-keyframes IgFadeOutLeft {
645 0% {opacity: 1; -webkit-transform: translate3d( 0%, 0, 0);}
646 99.5% {opacity: 0; -webkit-transform: translate3d(-100%, 0, 0);}
647 100% {opacity: 1; -webkit-transform: translate3d(-100%, 0, 0);}
648 }
649
650 @keyframes IgFadeOutLeft {
651 0% {opacity: 1; -webkit-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); }
652 99.5% {opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); }
653 100% {opacity: 1; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); }
654 }
655
656 /****-Slide Left: End-***/
657
658 /****-Slide Right: Start-***/
659 .ig_right.ig_anim_slide_in{
660 animation-name: IgSlideInRight;
661 -moz-animation-name: IgSlideInRight;
662 -webkit-animation-name: IgSlideInRight;
663
664 animation-duration: 0.5s;
665 -moz-animation-duration: 0.5s;
666 -webkit-animation-duration: 0.5s;
667
668 animation-timing-function: ease;
669 -moz-animation-timing-function: ease;
670 -webkit-animation-timing-function: ease;
671 }
672
673 @-webkit-keyframes IgSlideInRight {
674 0% {-webkit-transform: translate3d(100%, 0, 0);}
675 100% {-webkit-transform: none; }
676 }
677
678 @keyframes IgSlideInRight {
679 0% { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
680 100% { -webkit-transform: none; transform: none; }
681 }
682
683 .ig_right.ig_anim_slide_out{
684 animation-name: IgFadeOutRight;
685 -moz-animation-name: IgFadeOutRight;
686 -webkit-animation-name: IgFadeOutRight;
687
688 animation-duration: 0.9s;
689 -moz-animation-duration: 0.9s;
690 -webkit-animation-duration: 0.9s;
691
692 animation-timing-function: ease;
693 -moz-animation-timing-function: ease;
694 -webkit-animation-timing-function: ease;
695
696 -webkit-animation-fill-mode: forwards;
697 animation-fill-mode: forwards;
698 }
699
700 @-webkit-keyframes IgFadeOutRight {
701 0% {opacity: 1; -webkit-transform: translate3d(0%, 0, 0);}
702 99.5% {opacity: 0; -webkit-transform: translate3d(100%, 0, 0);}
703 100% {opacity: 1; -webkit-transform: translate3d(100%, 0, 0);}
704 }
705
706 @keyframes IgFadeOutRight {
707 0% {opacity: 1; -webkit-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0);}
708 99.5% {opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
709 100% {opacity: 1; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); }
710 }
711 /****-Slide Right: End-***/
712
713 /****-Slide Up : start***/
714 .ig_bottom.ig_anim_slide_in,
715 .ig_bottom .ig_anim_slide_in{
716 animation-name: IgSlideInUp;
717 -moz-animation-name: IgSlideInUp;
718 -webkit-animation-name: IgSlideInUp;
719
720 animation-duration: 0.5s;
721 -moz-animation-duration: 0.5s;
722 -webkit-animation-duration: 0.5s;
723
724 animation-timing-function: ease;
725 -moz-animation-timing-function: ease;
726 -webkit-animation-timing-function: ease;
727 }
728 @-webkit-keyframes IgSlideInUp {
729 0% {-webkit-transform: translate3d(0, 100%, 0);}
730 100% {-webkit-transform: none;}
731 }
732
733 @keyframes IgSlideInUp {
734 0% {-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0); }
735 100% {-webkit-transform: none;transform: none; }
736 }
737
738 .ig_bottom.ig_anim_slide_out,
739 .ig_bottom .ig_anim_slide_out{
740 animation-name: IgFadeOutDown;
741 -moz-animation-name: IgFadeOutDown;
742 -webkit-animation-name: IgFadeOutDown;
743
744 animation-duration: 0.9s;
745 -moz-animation-duration: 0.9s;
746 -webkit-animation-duration: 0.9s;
747
748 animation-timing-function: ease;
749 -moz-animation-timing-function: ease;
750 -webkit-animation-timing-function: ease;
751
752 -webkit-animation-fill-mode: forwards;
753 animation-fill-mode: forwards;
754 }
755
756 @-webkit-keyframes IgFadeOutDown {
757 0% {opacity: 1; -webkit-transform: translate3d(0, 0%, 0);}
758 99.5% {opacity: 0; -webkit-transform: translate3d(0, 100%, 0);}
759 100% {opacity: 1; -webkit-transform: translate3d(0, 100%, 0);}
760 }
761
762 @keyframes IgFadeOutDown {
763 0% {opacity: 1; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0);}
764 99.5% {opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
765 100% {opacity: 1; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);}
766 }
767
768 /****-Slide Up: End-***/
769
770 /****-Slide Down: Start-***/
771 .ig_anim_slide_in,
772 .ig_top.ig_anim_slide_in,
773 .ig_top .ig_anim_slide_in{
774 animation-name: IgSlideInDown;
775 -moz-animation-name: IgSlideInDown;
776 -webkit-animation-name: IgSlideInDown;
777
778 animation-duration: 0.5s;
779 -moz-animation-duration: 0.5s;
780 -webkit-animation-duration: 0.5s;
781
782 animation-timing-function: ease;
783 -moz-animation-timing-function: ease;
784 -webkit-animation-timing-function: ease;
785 }
786 @-webkit-keyframes IgSlideInDown {
787 0% {-webkit-transform: translate3d(0, -100%, 0);}
788 100% {-webkit-transform: none; }
789 }
790
791 @keyframes IgSlideInDown {
792 0% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
793 100% {-webkit-transform: none;transform: none; }
794 }
795
796 .ig_anim_slide_out,
797 .ig_top.ig_anim_slide_out,
798 .ig_top .ig_anim_slide_out{
799 animation-name: IgFadeOutUp;
800 -moz-animation-name: IgFadeOutUp;
801 -webkit-animation-name: IgFadeOutUp;
802
803 animation-duration: 0.9s;
804 -moz-animation-duration: 0.9s;
805 -webkit-animation-duration: 0.9s;
806
807 animation-timing-function: ease;
808 -moz-animation-timing-function: ease;
809 -webkit-animation-timing-function: ease;
810
811 -webkit-animation-fill-mode: forwards;
812 animation-fill-mode: forwards;
813 }
814 @-webkit-keyframes IgFadeOutUp {
815 0% {opacity: 1; -webkit-transform: translate3d(0, 0%, 0);}
816 99.5% {opacity: 0; -webkit-transform: translate3d(0, -100%, 0);}
817 100% {opacity: 1; -webkit-transform: translate3d(0, -100%, 0);}
818 }
819
820 @keyframes IgFadeOutUp {
821 0% {opacity: 1; -webkit-transform: translate3d(0, 0%, 0); transform: translate3d(0, 0%, 0);}
822 99.5% {opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
823 100% {opacity: 1; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);}
824 }
825
826 /****-Slide Down: End***/
827
828 /*** Slide: End***/
829 /****************Animation: End******************/
830
831