Image Hover Effects – Elementor Addon

Version Description

Initial version

Release Info

Developer	blocksera
Plugin	Image Hover Effects – Elementor Addon
Version	1.0
Comparing to
See all releases

Version 1.0

Files changed (7) hide show

assets/css/admin.css +100 -0
assets/css/imagehover.css +1520 -0
image-hover-effects-addon-for-elementor.php +96 -0
inc/elementor-checker.php +59 -0
inc/elementor-helper.php +19 -0
readme.txt +95 -0
widgets/eihe-image-hover.php +419 -0

assets/css/admin.css ADDED Viewed

	@@ -0,0 +1,100 @@


1	+ .eihe-container {
2	+ display: block;
3	+ -webkit-box-sizing: border-box;
4	+ box-sizing: border-box;
5	+ text-align: center;
6	+ display: -webkit-box;
7	+ display: -ms-flexbox;
8	+ display: flex;
9	+ -ms-flex-wrap: wrap;
10	+ flex-wrap: wrap;
11	+ -webkit-box-orient: vertical;
12	+ -webkit-box-direction: normal;
13	+ -ms-flex-direction: row;
14	+ flex-direction: row;
15	+ -webkit-box-pack: center;
16	+ -ms-flex-pack: center;
17	+ justify-content: center;
18	+ -webkit-box-align: center;
19	+ -ms-flex-align: center;
20	+ -ms-grid-row-align: center;
21	+ align-items: center;
22	+ }
23	+ .eihe-container[data-col="1"] .eihe-columns {
24	+ width: 100%;
25	+ }
26	+ .eihe-container[data-col="2"] .eihe-columns {
27	+ width: 50%;
28	+ }
29	+ .eihe-container[data-col="3"] .eihe-columns {
30	+ width: 33.33%;
31	+ }
32	+ .eihe-container[data-col="4"] .eihe-columns {
33	+ width: 25%;
34	+ }
35	+ .eihe-container[data-col="5"] .eihe-columns {
36	+ width: 20%;
37	+ }
38	+
39	+ @media only screen and (min-width: 768px) and (max-width: 1024px) {
40	+ .eihe-container[data-col="4"] .eihe-columns,
41	+ .eihe-container[data-col="5"] .eihe-columns {
42	+ width: 50%;
43	+ }
44	+ }
45	+ @media only screen and (max-width: 767px) {
46	+ .eihe-container[data-col="1"] .eihe-columns,
47	+ .eihe-container[data-col="2"] .eihe-columns,
48	+ .eihe-container[data-col="3"] .eihe-columns,
49	+ .eihe-container[data-col="4"] .eihe-columns,
50	+ .eihe-container[data-col="5"] .eihe-columns {
51	+ width: 100%;
52	+ }
53	+ }
54	+
55	+ .eihe-columns .eihe-box {
56	+ position: relative;
57	+ }
58	+
59	+ .eihe-container.eihe-vertical .eihe-info {
60	+ display: -webkit-box;
61	+ display: -ms-flexbox;
62	+ display: flex;
63	+ -ms-flex-wrap: wrap;
64	+ flex-wrap: wrap;
65	+ -webkit-box-orient: vertical;
66	+ -webkit-box-direction: normal;
67	+ -ms-flex-direction: column;
68	+ flex-direction: column;
69	+ -webkit-box-pack: center;
70	+ -ms-flex-pack: center;
71	+ justify-content: center;
72	+ -webkit-box-align: center;
73	+ -ms-flex-align: center;
74	+ -ms-grid-row-align: center;
75	+ align-items: center;
76	+ }
77	+
78	+ .eihe-container .eihe-info h2 {
79	+ margin: 0;
80	+ padding: 0;
81	+ }
82	+
83	+ .eihe-container .eihe-info p {
84	+ margin: 0;
85	+ padding: 0;
86	+ }
87	+
88	+ .eihe-columns .eihe-box .eihe-layer {
89	+ position: absolute;
90	+ top: 0;
91	+ left: 0;
92	+ right: 0;
93	+ bottom: 0;
94	+ margin: auto;
95	+ opacity: 0;
96	+ }
97	+
98	+ .eihe-columns .eihe-box:hover .eihe-layer {
99	+ opacity: 1;
100	+ }

assets/css/imagehover.css ADDED Viewed

	@@ -0,0 +1,1520 @@


1	+ @charset "UTF-8";
2	+ /*!
3	+ * ImageHover.css - http://www.imagehover.io
4	+ * Version 1.0
5	+ * Author: Ciarán Walsh
6	+
7	+ * Made available under a MIT License:
8	+ * http://www.opensource.org/licenses/mit-license.php
9	+
10	+ */
11	+ .eihe-container [class^='imghvr-'], .eihe-container [class*=' imghvr-'] {
12	+ position: relative;
13	+ display: inline-block;
14	+ margin: 0;
15	+ max-width: 100%;
16	+ overflow: hidden;
17	+ -webkit-backface-visibility: hidden;
18	+ backface-visibility: hidden;
19	+ -moz-osx-font-smoothing: grayscale;
20	+ -webkit-transform: translateZ(0);
21	+ -moz-transform: translateZ(0);
22	+ -ms-transform: translateZ(0);
23	+ -o-transform: translateZ(0);
24	+ transform: translateZ(0);
25	+ }
26	+
27	+ .eihe-container [class^='imghvr-'] > img, .eihe-container [class*=' imghvr-'] > img {
28	+ vertical-align: top;
29	+ max-width: 100%;
30	+ }
31	+
32	+ .eihe-container [class^='imghvr-'] .eihe-info, .eihe-container [class*=' imghvr-'] .eihe-info {
33	+ background: transparent;
34	+ position: absolute;
35	+ top: 0;
36	+ left: 0;
37	+ right: 0;
38	+ bottom: 0;
39	+ backface-visibility: hidden;
40	+ width: 100%;
41	+ }
42	+
43	+ .eihe-container [class^='imghvr-'] a, .eihe-container [class*=' imghvr-'] a {
44	+ position: absolute;
45	+ top: 0;
46	+ bottom: 0;
47	+ left: 0;
48	+ right: 0;
49	+ z-index: 1;
50	+ }
51	+
52	+ .eihe-container [class^='imghvr-'], .eihe-container [class*=' imghvr-'], .eihe-container [class^='imghvr-']:before,
53	+ .eihe-container [class^='imghvr-']:after, .eihe-container [class=' imghvr-']:before, .eihe-container [class=' imghvr-']:after,
54	+ .eihe-container [class^='imghvr-'] , .eihe-container [class=' imghvr-'] , .eihe-container [class^='imghvr-'] :before,
55	+ .eihe-container [class^='imghvr-'] :after, .eihe-container [class=' imghvr-'] :before, .eihe-container [class=' imghvr-'] *:after {
56	+ box-sizing: border-box;
57	+ -webkit-transition: all 0.35s ease;
58	+ -moz-transition: all 0.35s ease;
59	+ transition: all 0.35s ease;
60	+ }
61	+
62	+ /* imghvr-fade-*
63	+ ----------------------------- */
64	+ .eihe-container [class^='imghvr-fade'] .eihe-info, .eihe-container [class*=' imghvr-fade'] .eihe-info {
65	+ opacity: 0;
66	+ }
67	+
68	+ .eihe-container [class^='imghvr-fade']:hover .eihe-info, .eihe-container [class*=' imghvr-fade']:hover .eihe-info {
69	+ opacity: 1;
70	+ }
71	+
72	+ .eihe-container [class^='imghvr-fade']:hover > img, .eihe-container [class^='imghvr-fade']:hover .eihe-info, .eihe-container [class=' imghvr-fade']:hover > img, .eihe-container [class=' imghvr-fade']:hover .eihe-info {
73	+ -webkit-transform: translate(0, 0);
74	+ -moz-transform: translate(0, 0);
75	+ -ms-transform: translate(0, 0);
76	+ -o-transform: translate(0, 0);
77	+ transform: translate(0, 0);
78	+ }
79	+
80	+ /* imghvr-fade
81	+ ----------------------------- */
82	+ /* imghvr-fade-in-up
83	+ ----------------------------- */
84	+ .eihe-container .imghvr-fade-in-up .eihe-info {
85	+ -webkit-transform: translate(0, 15%);
86	+ -moz-transform: translate(0, 15%);
87	+ -ms-transform: translate(0, 15%);
88	+ -o-transform: translate(0, 15%);
89	+ transform: translate(0, 15%);
90	+ }
91	+
92	+ /* imghvr-fade-in-down
93	+ ----------------------------- */
94	+ .eihe-container .imghvr-fade-in-down .eihe-info {
95	+ -webkit-transform: translate(0, -15%);
96	+ -moz-transform: translate(0, -15%);
97	+ -ms-transform: translate(0, -15%);
98	+ -o-transform: translate(0, -15%);
99	+ transform: translate(0, -15%);
100	+ }
101	+
102	+ /* imghvr-fade-in-left
103	+ ----------------------------- */
104	+ .eihe-container .imghvr-fade-in-left .eihe-info {
105	+ -webkit-transform: translate(-15%, 0);
106	+ -moz-transform: translate(-15%, 0);
107	+ -ms-transform: translate(-15%, 0);
108	+ -o-transform: translate(-15%, 0);
109	+ transform: translate(-15%, 0);
110	+ }
111	+
112	+ /* imghvr-fade-in-right
113	+ ----------------------------- */
114	+ .eihe-container .imghvr-fade-in-right .eihe-info {
115	+ -webkit-transform: translate(15%, 0);
116	+ -moz-transform: translate(15%, 0);
117	+ -ms-transform: translate(15%, 0);
118	+ -o-transform: translate(15%, 0);
119	+ transform: translate(15%, 0);
120	+ }
121	+
122	+ /* imghvr-push-*
123	+ ----------------------------- */
124	+ .eihe-container [class^='imghvr-push-']:hover .eihe-info, .eihe-container [class*=' imghvr-push-']:hover .eihe-info {
125	+ -webkit-transform: translate(0, 0);
126	+ -moz-transform: translate(0, 0);
127	+ -ms-transform: translate(0, 0);
128	+ -o-transform: translate(0, 0);
129	+ transform: translate(0, 0);
130	+ }
131	+
132	+ /* imghvr-push-up
133	+ ----------------------------- */
134	+ .eihe-container .imghvr-push-up .eihe-info {
135	+ -webkit-transform: translateY(100%);
136	+ -moz-transform: translateY(100%);
137	+ -ms-transform: translateY(100%);
138	+ -o-transform: translateY(100%);
139	+ transform: translateY(100%);
140	+ }
141	+
142	+ .eihe-container .imghvr-push-up:hover > img {
143	+ -webkit-transform: translateY(-100%);
144	+ -moz-transform: translateY(-100%);
145	+ -ms-transform: translateY(-100%);
146	+ -o-transform: translateY(-100%);
147	+ transform: translateY(-100%);
148	+ }
149	+
150	+ /* imghvr-push-down
151	+ ----------------------------- */
152	+ .eihe-container .imghvr-push-down .eihe-info {
153	+ -webkit-transform: translateY(-100%);
154	+ -moz-transform: translateY(-100%);
155	+ -ms-transform: translateY(-100%);
156	+ -o-transform: translateY(-100%);
157	+ transform: translateY(-100%);
158	+ }
159	+
160	+ .eihe-container .imghvr-push-down:hover > img {
161	+ -webkit-transform: translateY(100%);
162	+ -moz-transform: translateY(100%);
163	+ -ms-transform: translateY(100%);
164	+ -o-transform: translateY(100%);
165	+ transform: translateY(100%);
166	+ }
167	+
168	+ /* imghvr-push-left
169	+ ----------------------------- */
170	+ .eihe-container .imghvr-push-left .eihe-info {
171	+ -webkit-transform: translateX(100%);
172	+ -moz-transform: translateX(100%);
173	+ -ms-transform: translateX(100%);
174	+ -o-transform: translateX(100%);
175	+ transform: translateX(100%);
176	+ }
177	+
178	+ .eihe-container .imghvr-push-left:hover > img {
179	+ -webkit-transform: translateX(-100%);
180	+ -moz-transform: translateX(-100%);
181	+ -ms-transform: translateX(-100%);
182	+ -o-transform: translateX(-100%);
183	+ transform: translateX(-100%);
184	+ }
185	+
186	+ /* imghvr-push--right
187	+ ----------------------------- */
188	+ .eihe-container .imghvr-push-right .eihe-info {
189	+ -webkit-transform: translateX(-100%);
190	+ -moz-transform: translateX(-100%);
191	+ -ms-transform: translateX(-100%);
192	+ -o-transform: translateX(-100%);
193	+ transform: translateX(-100%);
194	+ }
195	+
196	+ .eihe-container .imghvr-push-right:hover > img {
197	+ -webkit-transform: translateX(100%);
198	+ -moz-transform: translateX(100%);
199	+ -ms-transform: translateX(100%);
200	+ -o-transform: translateX(100%);
201	+ transform: translateX(100%);
202	+ }
203	+
204	+ /* imghvr-slide-*
205	+ ----------------------------- */
206	+ .eihe-container [class^='imghvr-slide-']:hover .eihe-info, .eihe-container [class*=' imghvr-slide-']:hover .eihe-info {
207	+ -webkit-transform: translate(0, 0);
208	+ -moz-transform: translate(0, 0);
209	+ -ms-transform: translate(0, 0);
210	+ -o-transform: translate(0, 0);
211	+ transform: translate(0, 0);
212	+ }
213	+
214	+ /* imghvr-slide-up
215	+ ----------------------------- */
216	+ .eihe-container .imghvr-slide-up .eihe-info {
217	+ -webkit-transform: translateY(100%);
218	+ -moz-transform: translateY(100%);
219	+ -ms-transform: translateY(100%);
220	+ -o-transform: translateY(100%);
221	+ transform: translateY(100%);
222	+ }
223	+
224	+ /* imghvr-slide-down
225	+ ----------------------------- */
226	+ .eihe-container .imghvr-slide-down .eihe-info {
227	+ -webkit-transform: translateY(-100%);
228	+ -moz-transform: translateY(-100%);
229	+ -ms-transform: translateY(-100%);
230	+ -o-transform: translateY(-100%);
231	+ transform: translateY(-100%);
232	+ }
233	+
234	+ /* imghvr-slide-left
235	+ ----------------------------- */
236	+ .eihe-container .imghvr-slide-left .eihe-info {
237	+ -webkit-transform: translateX(100%);
238	+ -moz-transform: translateX(100%);
239	+ -ms-transform: translateX(100%);
240	+ -o-transform: translateX(100%);
241	+ transform: translateX(100%);
242	+ }
243	+
244	+ /* imghvr-slide-right
245	+ ----------------------------- */
246	+ .eihe-container .imghvr-slide-right .eihe-info {
247	+ -webkit-transform: translateX(-100%);
248	+ -moz-transform: translateX(-100%);
249	+ -ms-transform: translateX(-100%);
250	+ -o-transform: translateX(-100%);
251	+ transform: translateX(-100%);
252	+ }
253	+
254	+ /* imghvr-slide-top-left
255	+ ----------------------------- */
256	+ .eihe-container .imghvr-slide-top-left .eihe-info {
257	+ -webkit-transform: translate(-100%, -100%);
258	+ -moz-transform: translate(-100%, -100%);
259	+ -ms-transform: translate(-100%, -100%);
260	+ -o-transform: translate(-100%, -100%);
261	+ transform: translate(-100%, -100%);
262	+ }
263	+
264	+ /* imghvr-slide-top-right
265	+ ----------------------------- */
266	+ .eihe-container .imghvr-slide-top-right .eihe-info {
267	+ -webkit-transform: translate(100%, -100%);
268	+ -moz-transform: translate(100%, -100%);
269	+ -ms-transform: translate(100%, -100%);
270	+ -o-transform: translate(100%, -100%);
271	+ transform: translate(100%, -100%);
272	+ }
273	+
274	+ /* imghvr-slide-bottom-left
275	+ ----------------------------- */
276	+ .eihe-container .imghvr-slide-bottom-left .eihe-info {
277	+ -webkit-transform: translate(-100%, 100%);
278	+ -moz-transform: translate(-100%, 100%);
279	+ -ms-transform: translate(-100%, 100%);
280	+ -o-transform: translate(-100%, 100%);
281	+ transform: translate(-100%, 100%);
282	+ }
283	+
284	+ /* imghvr-slide-bottom-right
285	+ ----------------------------- */
286	+ .eihe-container .imghvr-slide-bottom-right .eihe-info {
287	+ -webkit-transform: translate(100%, 100%);
288	+ -moz-transform: translate(100%, 100%);
289	+ -ms-transform: translate(100%, 100%);
290	+ -o-transform: translate(100%, 100%);
291	+ transform: translate(100%, 100%);
292	+ }
293	+
294	+ /* imghvr-reveal-*
295	+ ----------------------------- */
296	+ .eihe-container [class^='imghvr-reveal-']:before, .eihe-container [class*=' imghvr-reveal-']:before {
297	+ position: absolute;
298	+ top: 0;
299	+ bottom: 0;
300	+ left: 0;
301	+ right: 0;
302	+ content: '';
303	+ }
304	+
305	+ .eihe-container [class^='imghvr-reveal-'] .eihe-info, .eihe-container [class*=' imghvr-reveal-'] .eihe-info {
306	+ opacity: 0;
307	+ }
308	+
309	+ .eihe-container [class^='imghvr-reveal-']:hover:before, .eihe-container [class*=' imghvr-reveal-']:hover:before {
310	+ -webkit-transform: translate(0, 0);
311	+ -moz-transform: translate(0, 0);
312	+ -ms-transform: translate(0, 0);
313	+ -o-transform: translate(0, 0);
314	+ transform: translate(0, 0);
315	+ }
316	+
317	+ .eihe-container [class^='imghvr-reveal-']:hover .eihe-info, .eihe-container [class*=' imghvr-reveal-']:hover .eihe-info {
318	+ opacity: 1;
319	+ -webkit-transition-delay: 0.21s;
320	+ -moz-transition-delay: 0.21s;
321	+ transition-delay: 0.21s;
322	+ }
323	+
324	+ /* imghvr-reveal-up
325	+ ----------------------------- */
326	+ .eihe-container .imghvr-reveal-up:before {
327	+ -webkit-transform: translateY(100%);
328	+ -moz-transform: translateY(100%);
329	+ -ms-transform: translateY(100%);
330	+ -o-transform: translateY(100%);
331	+ transform: translateY(100%);
332	+ }
333	+
334	+ /* imghvr-reveal-down
335	+ ----------------------------- */
336	+ .eihe-container .imghvr-reveal-down:before {
337	+ -webkit-transform: translateY(-100%);
338	+ -moz-transform: translateY(-100%);
339	+ -ms-transform: translateY(-100%);
340	+ -o-transform: translateY(-100%);
341	+ transform: translateY(-100%);
342	+ }
343	+
344	+ /* imghvr-reveal-left
345	+ ----------------------------- */
346	+ .eihe-container .imghvr-reveal-left:before {
347	+ -webkit-transform: translateX(100%);
348	+ -moz-transform: translateX(100%);
349	+ -ms-transform: translateX(100%);
350	+ -o-transform: translateX(100%);
351	+ transform: translateX(100%);
352	+ }
353	+
354	+ /* imghvr-reveal-right
355	+ ----------------------------- */
356	+ .eihe-container .imghvr-reveal-right:before {
357	+ -webkit-transform: translateX(-100%);
358	+ -moz-transform: translateX(-100%);
359	+ -ms-transform: translateX(-100%);
360	+ -o-transform: translateX(-100%);
361	+ transform: translateX(-100%);
362	+ }
363	+
364	+ /* imghvr-reveal-top-left
365	+ ----------------------------- */
366	+ .eihe-container .imghvr-reveal-top-left:before {
367	+ -webkit-transform: translate(-100%, -100%);
368	+ -moz-transform: translate(-100%, -100%);
369	+ -ms-transform: translate(-100%, -100%);
370	+ -o-transform: translate(-100%, -100%);
371	+ transform: translate(-100%, -100%);
372	+ }
373	+
374	+ /* imghvr-reveal-top-right
375	+ ----------------------------- */
376	+ .eihe-container .imghvr-reveal-top-right:before {
377	+ -webkit-transform: translate(100%, -100%);
378	+ -moz-transform: translate(100%, -100%);
379	+ -ms-transform: translate(100%, -100%);
380	+ -o-transform: translate(100%, -100%);
381	+ transform: translate(100%, -100%);
382	+ }
383	+
384	+ /* imghvr-reveal-bottom-left
385	+ ----------------------------- */
386	+ .eihe-container .imghvr-reveal-bottom-left:before {
387	+ -webkit-transform: translate(-100%, 100%);
388	+ -moz-transform: translate(-100%, 100%);
389	+ -ms-transform: translate(-100%, 100%);
390	+ -o-transform: translate(-100%, 100%);
391	+ transform: translate(-100%, 100%);
392	+ }
393	+
394	+ /* imghvr-reveal-bottom-right
395	+ ----------------------------- */
396	+ .eihe-container .imghvr-reveal-bottom-right:before {
397	+ -webkit-transform: translate(100%, 100%);
398	+ -moz-transform: translate(100%, 100%);
399	+ -ms-transform: translate(100%, 100%);
400	+ -o-transform: translate(100%, 100%);
401	+ transform: translate(100%, 100%);
402	+ }
403	+
404	+ /* imghvr-hinge-*
405	+ ----------------------------- */
406	+ .eihe-container [class^='imghvr-hinge-'], .eihe-container [class*=' imghvr-hinge-'] {
407	+ -webkit-perspective: 50em;
408	+ -moz-perspective: 50em;
409	+ perspective: 50em;
410	+ }
411	+
412	+ .eihe-container [class^='imghvr-hinge-'] .eihe-info, .eihe-container [class*=' imghvr-hinge-'] .eihe-info {
413	+ opacity: 0;
414	+ z-index: 1;
415	+ }
416	+
417	+ .eihe-container [class^='imghvr-hinge-']:hover img, .eihe-container [class*=' imghvr-hinge-']:hover img {
418	+ opacity: 0;
419	+ }
420	+
421	+ .eihe-container [class^='imghvr-hinge-']:hover .eihe-info, .eihe-container [class*=' imghvr-hinge-']:hover .eihe-info {
422	+ opacity: 1;
423	+ -webkit-transition-delay: 0.21s;
424	+ -moz-transition-delay: 0.21s;
425	+ transition-delay: 0.21s;
426	+ }
427	+
428	+ /* imghvr-hinge-up
429	+ ----------------------------- */
430	+ .eihe-container .imghvr-hinge-up img {
431	+ -webkit-transform-origin: 50% 0%;
432	+ -moz-transform-origin: 50% 0%;
433	+ -ms-transform-origin: 50% 0%;
434	+ -o-transform-origin: 50% 0%;
435	+ transform-origin: 50% 0%;
436	+ }
437	+
438	+ .eihe-container .imghvr-hinge-up .eihe-info {
439	+ -webkit-transform: rotateX(90deg);
440	+ -moz-transform: rotateX(90deg);
441	+ -ms-transform: rotateX(90deg);
442	+ -o-transform: rotateX(90deg);
443	+ transform: rotateX(90deg);
444	+ -webkit-transform-origin: 50% 100%;
445	+ -moz-transform-origin: 50% 100%;
446	+ -ms-transform-origin: 50% 100%;
447	+ -o-transform-origin: 50% 100%;
448	+ transform-origin: 50% 100%;
449	+ }
450	+
451	+ .eihe-container .imghvr-hinge-up:hover > img {
452	+ -webkit-transform: rotateX(-90deg);
453	+ -moz-transform: rotateX(-90deg);
454	+ -ms-transform: rotateX(-90deg);
455	+ -o-transform: rotateX(-90deg);
456	+ transform: rotateX(-90deg);
457	+ }
458	+
459	+ .eihe-container .imghvr-hinge-up:hover .eihe-info {
460	+ -webkit-transform: rotateX(0);
461	+ -moz-transform: rotateX(0);
462	+ -ms-transform: rotateX(0);
463	+ -o-transform: rotateX(0);
464	+ transform: rotateX(0);
465	+ }
466	+
467	+ /* imghvr-hinge-down
468	+ ----------------------------- */
469	+ .eihe-container .imghvr-hinge-down img {
470	+ -webkit-transform-origin: 50% 100%;
471	+ -moz-transform-origin: 50% 100%;
472	+ -ms-transform-origin: 50% 100%;
473	+ -o-transform-origin: 50% 100%;
474	+ transform-origin: 50% 100%;
475	+ }
476	+
477	+ .eihe-container .imghvr-hinge-down .eihe-info {
478	+ -webkit-transform: rotateX(-90deg);
479	+ -moz-transform: rotateX(-90deg);
480	+ -ms-transform: rotateX(-90deg);
481	+ -o-transform: rotateX(-90deg);
482	+ transform: rotateX(-90deg);
483	+ -webkit-transform-origin: 50% -50%;
484	+ -moz-transform-origin: 50% -50%;
485	+ -ms-transform-origin: 50% -50%;
486	+ -o-transform-origin: 50% -50%;
487	+ transform-origin: 50% -50%;
488	+ }
489	+
490	+ .eihe-container .imghvr-hinge-down:hover > img {
491	+ -webkit-transform: rotateX(90deg);
492	+ -moz-transform: rotateX(90deg);
493	+ -ms-transform: rotateX(90deg);
494	+ -o-transform: rotateX(90deg);
495	+ transform: rotateX(90deg);
496	+ opacity: 0;
497	+ }
498	+
499	+ .eihe-container .imghvr-hinge-down:hover .eihe-info {
500	+ -webkit-transform: rotateX(0);
501	+ -moz-transform: rotateX(0);
502	+ -ms-transform: rotateX(0);
503	+ -o-transform: rotateX(0);
504	+ transform: rotateX(0);
505	+ }
506	+
507	+ /* imghvr-hinge-left
508	+ ----------------------------- */
509	+ .eihe-container .imghvr-hinge-left img {
510	+ -webkit-transform-origin: 0% 50%;
511	+ -moz-transform-origin: 0% 50%;
512	+ -ms-transform-origin: 0% 50%;
513	+ -o-transform-origin: 0% 50%;
514	+ transform-origin: 0% 50%;
515	+ }
516	+
517	+ .eihe-container .imghvr-hinge-left .eihe-info {
518	+ -webkit-transform: rotateY(-90deg);
519	+ -moz-transform: rotateY(-90deg);
520	+ -ms-transform: rotateY(-90deg);
521	+ -o-transform: rotateY(-90deg);
522	+ transform: rotateY(-90deg);
523	+ -webkit-transform-origin: 100% 50%;
524	+ -moz-transform-origin: 100% 50%;
525	+ -ms-transform-origin: 100% 50%;
526	+ -o-transform-origin: 100% 50%;
527	+ transform-origin: 100% 50%;
528	+ }
529	+
530	+ .eihe-container .imghvr-hinge-left:hover > img {
531	+ -webkit-transform: rotateY(90deg);
532	+ -moz-transform: rotateY(90deg);
533	+ -ms-transform: rotateY(90deg);
534	+ -o-transform: rotateY(90deg);
535	+ transform: rotateY(90deg);
536	+ }
537	+
538	+ .eihe-container .imghvr-hinge-left:hover .eihe-info {
539	+ -webkit-transform: rotateY(0);
540	+ -moz-transform: rotateY(0);
541	+ -ms-transform: rotateY(0);
542	+ -o-transform: rotateY(0);
543	+ transform: rotateY(0);
544	+ }
545	+
546	+ /* imghvr-hinge-right
547	+ ----------------------------- */
548	+ .eihe-container .imghvr-hinge-right img {
549	+ -webkit-transform-origin: 100% 50%;
550	+ -moz-transform-origin: 100% 50%;
551	+ -ms-transform-origin: 100% 50%;
552	+ -o-transform-origin: 100% 50%;
553	+ transform-origin: 100% 50%;
554	+ }
555	+
556	+ .eihe-container .imghvr-hinge-right .eihe-info {
557	+ -webkit-transform: rotateY(90deg);
558	+ -moz-transform: rotateY(90deg);
559	+ -ms-transform: rotateY(90deg);
560	+ -o-transform: rotateY(90deg);
561	+ transform: rotateY(90deg);
562	+ -webkit-transform-origin: 0 50%;
563	+ -moz-transform-origin: 0 50%;
564	+ -ms-transform-origin: 0 50%;
565	+ -o-transform-origin: 0 50%;
566	+ transform-origin: 0 50%;
567	+ }
568	+
569	+ .eihe-container .imghvr-hinge-right:hover > img {
570	+ -webkit-transform: rotateY(-90deg);
571	+ -moz-transform: rotateY(-90deg);
572	+ -ms-transform: rotateY(-90deg);
573	+ -o-transform: rotateY(-90deg);
574	+ transform: rotateY(-90deg);
575	+ }
576	+
577	+ .eihe-container .imghvr-hinge-right:hover .eihe-info {
578	+ -webkit-transform: rotateY(0);
579	+ -moz-transform: rotateY(0);
580	+ -ms-transform: rotateY(0);
581	+ -o-transform: rotateY(0);
582	+ transform: rotateY(0);
583	+ }
584	+
585	+ /* imghvr-flip-*
586	+ ----------------------------- */
587	+ .eihe-container [class^='imghvr-flip-'], .eihe-container [class*=' imghvr-flip-'] {
588	+ -webkit-perspective: 50em;
589	+ -moz-perspective: 50em;
590	+ perspective: 50em;
591	+ }
592	+
593	+ .eihe-container [class^='imghvr-flip-'] img, .eihe-container [class*=' imghvr-flip-'] img {
594	+ backface-visibility: hidden;
595	+ }
596	+
597	+ .eihe-container [class^='imghvr-flip-'] .eihe-info, .eihe-container [class*=' imghvr-flip-'] .eihe-info {
598	+ opacity: 0;
599	+ }
600	+
601	+ .eihe-container [class^='imghvr-flip-']:hover > img, .eihe-container [class*=' imghvr-flip-']:hover > img {
602	+ opacity: 0;
603	+ }
604	+
605	+ .eihe-container [class^='imghvr-flip-']:hover .eihe-info, .eihe-container [class*=' imghvr-flip-']:hover .eihe-info {
606	+ opacity: 1;
607	+ -webkit-transition-delay: 0.14s;
608	+ -moz-transition-delay: 0.14s;
609	+ transition-delay: 0.14s;
610	+ }
611	+
612	+ /* imghvr-flip-horiz
613	+ ----------------------------- */
614	+ .eihe-container .imghvr-flip-horiz .eihe-info {
615	+ -webkit-transform: rotateX(90deg);
616	+ -moz-transform: rotateX(90deg);
617	+ -ms-transform: rotateX(90deg);
618	+ -o-transform: rotateX(90deg);
619	+ transform: rotateX(90deg);
620	+ -webkit-transform-origin: 0% 50%;
621	+ -moz-transform-origin: 0% 50%;
622	+ -ms-transform-origin: 0% 50%;
623	+ -o-transform-origin: 0% 50%;
624	+ transform-origin: 0% 50%;
625	+ }
626	+
627	+ .eihe-container .imghvr-flip-horiz:hover img {
628	+ -webkit-transform: rotateX(-180deg);
629	+ -moz-transform: rotateX(-180deg);
630	+ -ms-transform: rotateX(-180deg);
631	+ -o-transform: rotateX(-180deg);
632	+ transform: rotateX(-180deg);
633	+ }
634	+
635	+ .eihe-container .imghvr-flip-horiz:hover .eihe-info {
636	+ -webkit-transform: rotateX(0deg);
637	+ -moz-transform: rotateX(0deg);
638	+ -ms-transform: rotateX(0deg);
639	+ -o-transform: rotateX(0deg);
640	+ transform: rotateX(0deg);
641	+ }
642	+
643	+ /* imghvr-flip-vert
644	+ ----------------------------- */
645	+ .eihe-container .imghvr-flip-vert .eihe-info {
646	+ -webkit-transform: rotateY(90deg);
647	+ -moz-transform: rotateY(90deg);
648	+ -ms-transform: rotateY(90deg);
649	+ -o-transform: rotateY(90deg);
650	+ transform: rotateY(90deg);
651	+ -webkit-transform-origin: 50% 0%;
652	+ -moz-transform-origin: 50% 0%;
653	+ -ms-transform-origin: 50% 0%;
654	+ -o-transform-origin: 50% 0%;
655	+ transform-origin: 50% 0%;
656	+ }
657	+
658	+ .eihe-container .imghvr-flip-vert:hover > img {
659	+ -webkit-transform: rotateY(-180deg);
660	+ -moz-transform: rotateY(-180deg);
661	+ -ms-transform: rotateY(-180deg);
662	+ -o-transform: rotateY(-180deg);
663	+ transform: rotateY(-180deg);
664	+ }
665	+
666	+ .eihe-container .imghvr-flip-vert:hover .eihe-info {
667	+ -webkit-transform: rotateY(0deg);
668	+ -moz-transform: rotateY(0deg);
669	+ -ms-transform: rotateY(0deg);
670	+ -o-transform: rotateY(0deg);
671	+ transform: rotateY(0deg);
672	+ }
673	+
674	+ /* imghvr-flip-diag-1
675	+ ----------------------------- */
676	+ .eihe-container .imghvr-flip-diag-1 .eihe-info {
677	+ -webkit-transform: rotate3d(1, -1, 0, 100deg);
678	+ -moz-transform: rotate3d(1, -1, 0, 100deg);
679	+ -ms-transform: rotate3d(1, -1, 0, 100deg);
680	+ -o-transform: rotate3d(1, -1, 0, 100deg);
681	+ transform: rotate3d(1, -1, 0, 100deg);
682	+ }
683	+
684	+ .eihe-container .imghvr-flip-diag-1:hover > img {
685	+ -webkit-transform: rotate3d(-1, 1, 0, 100deg);
686	+ -moz-transform: rotate3d(-1, 1, 0, 100deg);
687	+ -ms-transform: rotate3d(-1, 1, 0, 100deg);
688	+ -o-transform: rotate3d(-1, 1, 0, 100deg);
689	+ transform: rotate3d(-1, 1, 0, 100deg);
690	+ }
691	+
692	+ .eihe-container .imghvr-flip-diag-1:hover .eihe-info {
693	+ -webkit-transform: rotate3d(0, 0, 0, 0deg);
694	+ -moz-transform: rotate3d(0, 0, 0, 0deg);
695	+ -ms-transform: rotate3d(0, 0, 0, 0deg);
696	+ -o-transform: rotate3d(0, 0, 0, 0deg);
697	+ transform: rotate3d(0, 0, 0, 0deg);
698	+ }
699	+
700	+ /* imghvr-flip-diag-2
701	+ ----------------------------- */
702	+ .eihe-container .imghvr-flip-diag-2 .eihe-info {
703	+ -webkit-transform: rotate3d(1, 1, 0, 100deg);
704	+ -moz-transform: rotate3d(1, 1, 0, 100deg);
705	+ -ms-transform: rotate3d(1, 1, 0, 100deg);
706	+ -o-transform: rotate3d(1, 1, 0, 100deg);
707	+ transform: rotate3d(1, 1, 0, 100deg);
708	+ }
709	+
710	+ .eihe-container .imghvr-flip-diag-2:hover > img {
711	+ -webkit-transform: rotate3d(-1, -1, 0, 100deg);
712	+ -moz-transform: rotate3d(-1, -1, 0, 100deg);
713	+ -ms-transform: rotate3d(-1, -1, 0, 100deg);
714	+ -o-transform: rotate3d(-1, -1, 0, 100deg);
715	+ transform: rotate3d(-1, -1, 0, 100deg);
716	+ }
717	+
718	+ .eihe-container .imghvr-flip-diag-2:hover .eihe-info {
719	+ -webkit-transform: rotate3d(0, 0, 0, 0deg);
720	+ -moz-transform: rotate3d(0, 0, 0, 0deg);
721	+ -ms-transform: rotate3d(0, 0, 0, 0deg);
722	+ -o-transform: rotate3d(0, 0, 0, 0deg);
723	+ transform: rotate3d(0, 0, 0, 0deg);
724	+ }
725	+
726	+ /* imghvr-shutter-out-*
727	+ ----------------------------- */
728	+ .eihe-container [class^='imghvr-shutter-out-']:before, .eihe-container [class*=' imghvr-shutter-out-']:before {
729	+ position: absolute;
730	+ content: '';
731	+ -webkit-transition-delay: 0.105s;
732	+ -moz-transition-delay: 0.105s;
733	+ transition-delay: 0.105s;
734	+ }
735	+
736	+ .eihe-container [class^='imghvr-shutter-out-'] .eihe-info, .eihe-container [class*=' imghvr-shutter-out-'] .eihe-info {
737	+ opacity: 0;
738	+ -webkit-transition-delay: 0s;
739	+ -moz-transition-delay: 0s;
740	+ transition-delay: 0s;
741	+ }
742	+
743	+ .eihe-container [class^='imghvr-shutter-out-']:hover:before, .eihe-container [class*=' imghvr-shutter-out-']:hover:before {
744	+ -webkit-transition-delay: 0s;
745	+ -moz-transition-delay: 0s;
746	+ transition-delay: 0s;
747	+ }
748	+
749	+ .eihe-container [class^='imghvr-shutter-out-']:hover .eihe-info, .eihe-container [class*=' imghvr-shutter-out-']:hover .eihe-info {
750	+ opacity: 1;
751	+ -webkit-transition-delay: 0.105s;
752	+ -moz-transition-delay: 0.105s;
753	+ transition-delay: 0.105s;
754	+ }
755	+
756	+ /* imghvr-shutter-out-horiz
757	+ ----------------------------- */
758	+ .eihe-container .imghvr-shutter-out-horiz:before {
759	+ left: 50%;
760	+ right: 50%;
761	+ top: 0;
762	+ bottom: 0;
763	+ }
764	+
765	+ .eihe-container .imghvr-shutter-out-horiz:hover:before {
766	+ left: 0;
767	+ right: 0;
768	+ }
769	+
770	+ /* imghvr-shutter-out-vert
771	+ ----------------------------- */
772	+ .eihe-container .imghvr-shutter-out-vert:before {
773	+ top: 50%;
774	+ bottom: 50%;
775	+ left: 0;
776	+ right: 0;
777	+ }
778	+
779	+ .eihe-container .imghvr-shutter-out-vert:hover:before {
780	+ top: 0;
781	+ bottom: 0;
782	+ }
783	+
784	+ /* imghvr-shutter-out-diag-1
785	+ ----------------------------- */
786	+ .eihe-container .imghvr-shutter-out-diag-1:before {
787	+ top: 50%;
788	+ bottom: 50%;
789	+ left: -35%;
790	+ right: -35%;
791	+ -webkit-transform: rotate(45deg);
792	+ -moz-transform: rotate(45deg);
793	+ -ms-transform: rotate(45deg);
794	+ -o-transform: rotate(45deg);
795	+ transform: rotate(45deg);
796	+ }
797	+
798	+ .eihe-container .imghvr-shutter-out-diag-1:hover:before {
799	+ top: -35%;
800	+ bottom: -35%;
801	+ }
802	+
803	+ /* imghvr-shutter-out-diag-2
804	+ ----------------------------- */
805	+ .eihe-container .imghvr-shutter-out-diag-2:before {
806	+ top: 50%;
807	+ bottom: 50%;
808	+ left: -35%;
809	+ right: -35%;
810	+ -webkit-transform: rotate(-45deg);
811	+ -moz-transform: rotate(-45deg);
812	+ -ms-transform: rotate(-45deg);
813	+ -o-transform: rotate(-45deg);
814	+ transform: rotate(-45deg);
815	+ }
816	+
817	+ .eihe-container .imghvr-shutter-out-diag-2:hover:before {
818	+ top: -35%;
819	+ bottom: -35%;
820	+ }
821	+
822	+ /* imghvr-shutter-in-*
823	+ ----------------------------- */
824	+ .eihe-container [class^='imghvr-shutter-in-']:after, .eihe-container [class^='imghvr-shutter-in-']:before, .eihe-container [class=' imghvr-shutter-in-']:after, .eihe-container [class=' imghvr-shutter-in-']:before {
825	+ position: absolute;
826	+ content: '';
827	+ }
828	+
829	+ .eihe-container [class^='imghvr-shutter-in-']:after, .eihe-container [class*=' imghvr-shutter-in-']:after {
830	+ top: 0;
831	+ left: 0;
832	+ }
833	+
834	+ .eihe-container [class^='imghvr-shutter-in-']:before, .eihe-container [class*=' imghvr-shutter-in-']:before {
835	+ right: 0;
836	+ bottom: 0;
837	+ }
838	+
839	+ .eihe-container [class^='imghvr-shutter-in-'] .eihe-info, .eihe-container [class*=' imghvr-shutter-in-'] .eihe-info {
840	+ opacity: 0;
841	+ z-index: 1;
842	+ }
843	+
844	+ .eihe-container [class^='imghvr-shutter-in-']:hover .eihe-info, .eihe-container [class*=' imghvr-shutter-in-']:hover .eihe-info {
845	+ opacity: 1;
846	+ -webkit-transition-delay: 0.21s;
847	+ -moz-transition-delay: 0.21s;
848	+ transition-delay: 0.21s;
849	+ }
850	+
851	+ /* imghvr-shutter-in-horiz
852	+ ----------------------------- */
853	+ .eihe-container .imghvr-shutter-in-horiz:after, .eihe-container .imghvr-shutter-in-horiz:before {
854	+ width: 0;
855	+ height: 100%;
856	+ }
857	+
858	+ .eihe-container .imghvr-shutter-in-horiz:hover:after, .eihe-container .imghvr-shutter-in-horiz:hover:before {
859	+ width: 50%;
860	+ }
861	+
862	+ /* imghvr-shutter-in-vert
863	+ ----------------------------- */
864	+ .eihe-container .imghvr-shutter-in-vert:after, .eihe-container .imghvr-shutter-in-vert:before {
865	+ height: 0;
866	+ width: 100%;
867	+ }
868	+
869	+ .eihe-container .imghvr-shutter-in-vert:hover:after, .eihe-container .imghvr-shutter-in-vert:hover:before {
870	+ height: 50%;
871	+ }
872	+
873	+ /* imghvr-shutter-in-out-horiz
874	+ ----------------------------- */
875	+ .eihe-container .imghvr-shutter-in-out-horiz:after, .eihe-container .imghvr-shutter-in-out-horiz:before {
876	+ width: 0;
877	+ height: 100%;
878	+ opacity: 0.75;
879	+ }
880	+
881	+ .eihe-container .imghvr-shutter-in-out-horiz:hover:after, .eihe-container .imghvr-shutter-in-out-horiz:hover:before {
882	+ width: 100%;
883	+ }
884	+
885	+ /* imghvr-shutter-in-out-vert
886	+ ----------------------------- */
887	+ .eihe-container .imghvr-shutter-in-out-vert:after, .eihe-container .imghvr-shutter-in-out-vert:before {
888	+ height: 0;
889	+ width: 100%;
890	+ opacity: 0.75;
891	+ }
892	+
893	+ .eihe-container .imghvr-shutter-in-out-vert:hover:after, .eihe-container .imghvr-shutter-in-out-vert:hover:before {
894	+ height: 100%;
895	+ }
896	+
897	+ /* imghvr-shutter-in-out-diag-1
898	+ ----------------------------- */
899	+ .eihe-container .imghvr-shutter-in-out-diag-1:after, .eihe-container .imghvr-shutter-in-out-diag-1:before {
900	+ width: 200%;
901	+ height: 200%;
902	+ -webkit-transition: all 0.6s ease;
903	+ -moz-transition: all 0.6s ease;
904	+ transition: all 0.6s ease;
905	+ opacity: 0.75;
906	+ }
907	+
908	+ .eihe-container .imghvr-shutter-in-out-diag-1:after {
909	+ -webkit-transform: skew(-45deg) translateX(-150%);
910	+ -moz-transform: skew(-45deg) translateX(-150%);
911	+ -ms-transform: skew(-45deg) translateX(-150%);
912	+ -o-transform: skew(-45deg) translateX(-150%);
913	+ transform: skew(-45deg) translateX(-150%);
914	+ }
915	+
916	+ .eihe-container .imghvr-shutter-in-out-diag-1:before {
917	+ -webkit-transform: skew(-45deg) translateX(150%);
918	+ -moz-transform: skew(-45deg) translateX(150%);
919	+ -ms-transform: skew(-45deg) translateX(150%);
920	+ -o-transform: skew(-45deg) translateX(150%);
921	+ transform: skew(-45deg) translateX(150%);
922	+ }
923	+
924	+ .eihe-container .imghvr-shutter-in-out-diag-1:hover:after {
925	+ -webkit-transform: skew(-45deg) translateX(-50%);
926	+ -moz-transform: skew(-45deg) translateX(-50%);
927	+ -ms-transform: skew(-45deg) translateX(-50%);
928	+ -o-transform: skew(-45deg) translateX(-50%);
929	+ transform: skew(-45deg) translateX(-50%);
930	+ }
931	+
932	+ .eihe-container .imghvr-shutter-in-out-diag-1:hover:before {
933	+ -webkit-transform: skew(-45deg) translateX(50%);
934	+ -moz-transform: skew(-45deg) translateX(50%);
935	+ -ms-transform: skew(-45deg) translateX(50%);
936	+ -o-transform: skew(-45deg) translateX(50%);
937	+ transform: skew(-45deg) translateX(50%);
938	+ }
939	+
940	+ /* imghvr-shutter-in-out-diag-2
941	+ ----------------------------- */
942	+ .eihe-container .imghvr-shutter-in-out-diag-2:after, .eihe-container .imghvr-shutter-in-out-diag-2:before {
943	+ width: 200%;
944	+ height: 200%;
945	+ -webkit-transition: all 0.6s ease;
946	+ -moz-transition: all 0.6s ease;
947	+ transition: all 0.6s ease;
948	+ opacity: 0.75;
949	+ }
950	+
951	+ .eihe-container .imghvr-shutter-in-out-diag-2:after {
952	+ -webkit-transform: skew(45deg) translateX(-100%);
953	+ -moz-transform: skew(45deg) translateX(-100%);
954	+ -ms-transform: skew(45deg) translateX(-100%);
955	+ -o-transform: skew(45deg) translateX(-100%);
956	+ transform: skew(45deg) translateX(-100%);
957	+ }
958	+
959	+ .eihe-container .imghvr-shutter-in-out-diag-2:before {
960	+ -webkit-transform: skew(45deg) translateX(100%);
961	+ -moz-transform: skew(45deg) translateX(100%);
962	+ -ms-transform: skew(45deg) translateX(100%);
963	+ -o-transform: skew(45deg) translateX(100%);
964	+ transform: skew(45deg) translateX(100%);
965	+ }
966	+
967	+ .eihe-container .imghvr-shutter-in-out-diag-2:hover:after {
968	+ -webkit-transform: skew(45deg) translateX(0%);
969	+ -moz-transform: skew(45deg) translateX(0%);
970	+ -ms-transform: skew(45deg) translateX(0%);
971	+ -o-transform: skew(45deg) translateX(0%);
972	+ transform: skew(45deg) translateX(0%);
973	+ }
974	+
975	+ .eihe-container .imghvr-shutter-in-out-diag-2:hover:before {
976	+ -webkit-transform: skew(45deg) translateX(0%);
977	+ -moz-transform: skew(45deg) translateX(0%);
978	+ -ms-transform: skew(45deg) translateX(0%);
979	+ -o-transform: skew(45deg) translateX(0%);
980	+ transform: skew(45deg) translateX(0%);
981	+ }
982	+
983	+ /* imghvr-fold*
984	+ ----------------------------- */
985	+ .eihe-container [class^='imghvr-fold'], .eihe-container [class*=' imghvr-fold'] {
986	+ -webkit-perspective: 50em;
987	+ -moz-perspective: 50em;
988	+ perspective: 50em;
989	+ }
990	+
991	+ .eihe-container [class^='imghvr-fold'] img, .eihe-container [class*=' imghvr-fold'] img {
992	+ -webkit-transform-origin: 50% 0%;
993	+ -moz-transform-origin: 50% 0%;
994	+ -ms-transform-origin: 50% 0%;
995	+ -o-transform-origin: 50% 0%;
996	+ transform-origin: 50% 0%;
997	+ }
998	+
999	+ .eihe-container [class^='imghvr-fold'] .eihe-info, .eihe-container [class*=' imghvr-fold'] .eihe-info {
1000	+ z-index: 1;
1001	+ opacity: 0;
1002	+ }
1003	+
1004	+ .eihe-container [class^='imghvr-fold']:hover > img, .eihe-container [class*=' imghvr-fold']:hover > img {
1005	+ opacity: 0;
1006	+ -webkit-transition-delay: 0;
1007	+ -moz-transition-delay: 0;
1008	+ transition-delay: 0;
1009	+ }
1010	+
1011	+ .eihe-container [class^='imghvr-fold']:hover .eihe-info, .eihe-container [class*=' imghvr-fold']:hover .eihe-info {
1012	+ -webkit-transform: rotateX(0) translate3d(0, 0%, 0) scale(1);
1013	+ -moz-transform: rotateX(0) translate3d(0, 0%, 0) scale(1);
1014	+ -ms-transform: rotateX(0) translate3d(0, 0%, 0) scale(1);
1015	+ -o-transform: rotateX(0) translate3d(0, 0%, 0) scale(1);
1016	+ transform: rotateX(0) translate3d(0, 0%, 0) scale(1);
1017	+ opacity: 1;
1018	+ -webkit-transition-delay: 0.21s;
1019	+ -moz-transition-delay: 0.21s;
1020	+ transition-delay: 0.21s;
1021	+ }
1022	+
1023	+ /* imghvr-fold-up
1024	+ ----------------------------- */
1025	+ .eihe-container .imghvr-fold-up > img {
1026	+ -webkit-transform-origin: 50% 0%;
1027	+ -moz-transform-origin: 50% 0%;
1028	+ -ms-transform-origin: 50% 0%;
1029	+ -o-transform-origin: 50% 0%;
1030	+ transform-origin: 50% 0%;
1031	+ }
1032	+
1033	+ .eihe-container .imghvr-fold-up .eihe-info {
1034	+ -webkit-transform: rotateX(-90deg) translate3d(0%, -50%, 0) scale(0.6);
1035	+ -moz-transform: rotateX(-90deg) translate3d(0%, -50%, 0) scale(0.6);
1036	+ -ms-transform: rotateX(-90deg) translate3d(0%, -50%, 0) scale(0.6);
1037	+ -o-transform: rotateX(-90deg) translate3d(0%, -50%, 0) scale(0.6);
1038	+ transform: rotateX(-90deg) translate3d(0%, -50%, 0) scale(0.6);
1039	+ -webkit-transform-origin: 50% 100%;
1040	+ -moz-transform-origin: 50% 100%;
1041	+ -ms-transform-origin: 50% 100%;
1042	+ -o-transform-origin: 50% 100%;
1043	+ transform-origin: 50% 100%;
1044	+ }
1045	+
1046	+ .eihe-container .imghvr-fold-up:hover > img {
1047	+ -webkit-transform: rotateX(90deg) scale(0.6) translateY(50%);
1048	+ -moz-transform: rotateX(90deg) scale(0.6) translateY(50%);
1049	+ -ms-transform: rotateX(90deg) scale(0.6) translateY(50%);
1050	+ -o-transform: rotateX(90deg) scale(0.6) translateY(50%);
1051	+ transform: rotateX(90deg) scale(0.6) translateY(50%);
1052	+ }
1053	+
1054	+ /* imghvr-fold-down
1055	+ ----------------------------- */
1056	+ .eihe-container .imghvr-fold-down > img {
1057	+ -webkit-transform-origin: 50% 100%;
1058	+ -moz-transform-origin: 50% 100%;
1059	+ -ms-transform-origin: 50% 100%;
1060	+ -o-transform-origin: 50% 100%;
1061	+ transform-origin: 50% 100%;
1062	+ }
1063	+
1064	+ .eihe-container .imghvr-fold-down .eihe-info {
1065	+ -webkit-transform: rotateX(90deg) translate3d(0%, 50%, 0) scale(0.6);
1066	+ -moz-transform: rotateX(90deg) translate3d(0%, 50%, 0) scale(0.6);
1067	+ -ms-transform: rotateX(90deg) translate3d(0%, 50%, 0) scale(0.6);
1068	+ -o-transform: rotateX(90deg) translate3d(0%, 50%, 0) scale(0.6);
1069	+ transform: rotateX(90deg) translate3d(0%, 50%, 0) scale(0.6);
1070	+ -webkit-transform-origin: 50% 0%;
1071	+ -moz-transform-origin: 50% 0%;
1072	+ -ms-transform-origin: 50% 0%;
1073	+ -o-transform-origin: 50% 0%;
1074	+ transform-origin: 50% 0%;
1075	+ }
1076	+
1077	+ .eihe-container .imghvr-fold-down:hover > img {
1078	+ -webkit-transform: rotateX(-90deg) scale(0.6) translateY(-50%);
1079	+ -moz-transform: rotateX(-90deg) scale(0.6) translateY(-50%);
1080	+ -ms-transform: rotateX(-90deg) scale(0.6) translateY(-50%);
1081	+ -o-transform: rotateX(-90deg) scale(0.6) translateY(-50%);
1082	+ transform: rotateX(-90deg) scale(0.6) translateY(-50%);
1083	+ }
1084	+
1085	+ /* imghvr-fold-left
1086	+ ----------------------------- */
1087	+ .eihe-container .imghvr-fold-left > img {
1088	+ -webkit-transform-origin: 0% 50%;
1089	+ -moz-transform-origin: 0% 50%;
1090	+ -ms-transform-origin: 0% 50%;
1091	+ -o-transform-origin: 0% 50%;
1092	+ transform-origin: 0% 50%;
1093	+ }
1094	+
1095	+ .eihe-container .imghvr-fold-left .eihe-info {
1096	+ -webkit-transform: rotateY(90deg) translate3d(-50%, 0%, 0) scale(0.6);
1097	+ -moz-transform: rotateY(90deg) translate3d(-50%, 0%, 0) scale(0.6);
1098	+ -ms-transform: rotateY(90deg) translate3d(-50%, 0%, 0) scale(0.6);
1099	+ -o-transform: rotateY(90deg) translate3d(-50%, 0%, 0) scale(0.6);
1100	+ transform: rotateY(90deg) translate3d(-50%, 0%, 0) scale(0.6);
1101	+ -webkit-transform-origin: 100% 50%;
1102	+ -moz-transform-origin: 100% 50%;
1103	+ -ms-transform-origin: 100% 50%;
1104	+ -o-transform-origin: 100% 50%;
1105	+ transform-origin: 100% 50%;
1106	+ }
1107	+
1108	+ .eihe-container .imghvr-fold-left:hover > img {
1109	+ -webkit-transform: rotateY(-90deg) scale(0.6) translateX(50%);
1110	+ -moz-transform: rotateY(-90deg) scale(0.6) translateX(50%);
1111	+ -ms-transform: rotateY(-90deg) scale(0.6) translateX(50%);
1112	+ -o-transform: rotateY(-90deg) scale(0.6) translateX(50%);
1113	+ transform: rotateY(-90deg) scale(0.6) translateX(50%);
1114	+ }
1115	+
1116	+ /* imghvr-fold-right
1117	+ ----------------------------- */
1118	+ .eihe-container .imghvr-fold-right > img {
1119	+ -webkit-transform-origin: 100% 50%;
1120	+ -moz-transform-origin: 100% 50%;
1121	+ -ms-transform-origin: 100% 50%;
1122	+ -o-transform-origin: 100% 50%;
1123	+ transform-origin: 100% 50%;
1124	+ }
1125	+
1126	+ .eihe-container .imghvr-fold-right .eihe-info {
1127	+ -webkit-transform: rotateY(-90deg) translate3d(50%, 0%, 0) scale(0.6);
1128	+ -moz-transform: rotateY(-90deg) translate3d(50%, 0%, 0) scale(0.6);
1129	+ -ms-transform: rotateY(-90deg) translate3d(50%, 0%, 0) scale(0.6);
1130	+ -o-transform: rotateY(-90deg) translate3d(50%, 0%, 0) scale(0.6);
1131	+ transform: rotateY(-90deg) translate3d(50%, 0%, 0) scale(0.6);
1132	+ -webkit-transform-origin: 0 50%;
1133	+ -moz-transform-origin: 0 50%;
1134	+ -ms-transform-origin: 0 50%;
1135	+ -o-transform-origin: 0 50%;
1136	+ transform-origin: 0 50%;
1137	+ }
1138	+
1139	+ .eihe-container .imghvr-fold-right:hover > img {
1140	+ -webkit-transform: rotateY(90deg) scale(0.6) translateX(-50%);
1141	+ -moz-transform: rotateY(90deg) scale(0.6) translateX(-50%);
1142	+ -ms-transform: rotateY(90deg) scale(0.6) translateX(-50%);
1143	+ -o-transform: rotateY(90deg) scale(0.6) translateX(-50%);
1144	+ transform: rotateY(90deg) scale(0.6) translateX(-50%);
1145	+ }
1146	+
1147	+ /* imghvr-zoom-in
1148	+ ----------------------------- */
1149	+ .eihe-container .imghvr-zoom-in .eihe-info {
1150	+ opacity: 0;
1151	+ -webkit-transform: scale(0.5);
1152	+ -moz-transform: scale(0.5);
1153	+ -ms-transform: scale(0.5);
1154	+ -o-transform: scale(0.5);
1155	+ transform: scale(0.5);
1156	+ }
1157	+
1158	+ .eihe-container .imghvr-zoom-in:hover .eihe-info {
1159	+ -webkit-transform: scale(1);
1160	+ -moz-transform: scale(1);
1161	+ -ms-transform: scale(1);
1162	+ -o-transform: scale(1);
1163	+ transform: scale(1);
1164	+ opacity: 1;
1165	+ }
1166	+
1167	+ /* imghvr-zoom-out*
1168	+ ----------------------------- */
1169	+ .eihe-container [class^='imghvr-zoom-out'] .eihe-info, .eihe-container [class*=' imghvr-zoom-out'] .eihe-info {
1170	+ -webkit-transform: scale(0.5);
1171	+ -moz-transform: scale(0.5);
1172	+ -ms-transform: scale(0.5);
1173	+ -o-transform: scale(0.5);
1174	+ transform: scale(0.5);
1175	+ -webkit-transform-origin: 50% 50%;
1176	+ -moz-transform-origin: 50% 50%;
1177	+ -ms-transform-origin: 50% 50%;
1178	+ -o-transform-origin: 50% 50%;
1179	+ transform-origin: 50% 50%;
1180	+ opacity: 0;
1181	+ }
1182	+
1183	+ .eihe-container [class^='imghvr-zoom-out']:hover .eihe-info, .eihe-container [class^='imghvr-zoom-out'].hover .eihe-info, .eihe-container [class=' imghvr-zoom-out']:hover .eihe-info, .eihe-container [class=' imghvr-zoom-out'].hover .eihe-info {
1184	+ -webkit-transform: scale(1);
1185	+ -moz-transform: scale(1);
1186	+ -ms-transform: scale(1);
1187	+ -o-transform: scale(1);
1188	+ transform: scale(1);
1189	+ opacity: 1;
1190	+ -webkit-transition-delay: 0.35s;
1191	+ -moz-transition-delay: 0.35s;
1192	+ transition-delay: 0.35s;
1193	+ }
1194	+
1195	+ /* imghvr-zoom-out
1196	+ ----------------------------- */
1197	+ .eihe-container .imghvr-zoom-out:hover > img {
1198	+ -webkit-transform: scale(0.5);
1199	+ -moz-transform: scale(0.5);
1200	+ -ms-transform: scale(0.5);
1201	+ -o-transform: scale(0.5);
1202	+ transform: scale(0.5);
1203	+ opacity: 0;
1204	+ }
1205	+
1206	+ /* imghvr-zoom-out-up
1207	+ ----------------------------- */
1208	+ .eihe-container .imghvr-zoom-out-up:hover > img, .eihe-container .imghvr-zoom-out-up.hover > img {
1209	+ -webkit-animation: imghvr-zoom-out-up 0.4025s linear;
1210	+ -moz-animation: imghvr-zoom-out-up 0.4025s linear;
1211	+ animation: imghvr-zoom-out-up 0.4025s linear;
1212	+ -webkit-animation-iteration-count: 1;
1213	+ -moz-animation-iteration-count: 1;
1214	+ animation-iteration-count: 1;
1215	+ -webkit-animation-fill-mode: forwards;
1216	+ -moz-animation-fill-mode: forwards;
1217	+ animation-fill-mode: forwards;
1218	+ }
1219	+
1220	+ @-webkit-keyframes imghvr-zoom-out-up {
1221	+ 50% {
1222	+ -webkit-transform: scale(0.8) translateY(0%);
1223	+ -moz-transform: scale(0.8) translateY(0%);
1224	+ -ms-transform: scale(0.8) translateY(0%);
1225	+ -o-transform: scale(0.8) translateY(0%);
1226	+ transform: scale(0.8) translateY(0%);
1227	+ opacity: 0.5;
1228	+ }
1229	+ 100% {
1230	+ -webkit-transform: scale(0.8) translateY(-150%);
1231	+ -moz-transform: scale(0.8) translateY(-150%);
1232	+ -ms-transform: scale(0.8) translateY(-150%);
1233	+ -o-transform: scale(0.8) translateY(-150%);
1234	+ transform: scale(0.8) translateY(-150%);
1235	+ opacity: 0.5;
1236	+ }
1237	+ }
1238	+
1239	+ @keyframes imghvr-zoom-out-up {
1240	+ 50% {
1241	+ -webkit-transform: scale(0.8) translateY(0%);
1242	+ -moz-transform: scale(0.8) translateY(0%);
1243	+ -ms-transform: scale(0.8) translateY(0%);
1244	+ -o-transform: scale(0.8) translateY(0%);
1245	+ transform: scale(0.8) translateY(0%);
1246	+ opacity: 0.5;
1247	+ }
1248	+ 100% {
1249	+ -webkit-transform: scale(0.8) translateY(-150%);
1250	+ -moz-transform: scale(0.8) translateY(-150%);
1251	+ -ms-transform: scale(0.8) translateY(-150%);
1252	+ -o-transform: scale(0.8) translateY(-150%);
1253	+ transform: scale(0.8) translateY(-150%);
1254	+ opacity: 0.5;
1255	+ }
1256	+ }
1257	+
1258	+ /* imghvr-zoom-out-down
1259	+ ----------------------------- */
1260	+ .eihe-container .imghvr-zoom-out-down:hover > img, .eihe-container .imghvr-zoom-out-down.hover > img {
1261	+ -webkit-animation: imghvr-zoom-out-down 0.4025s linear;
1262	+ -moz-animation: imghvr-zoom-out-down 0.4025s linear;
1263	+ animation: imghvr-zoom-out-down 0.4025s linear;
1264	+ -webkit-animation-iteration-count: 1;
1265	+ -moz-animation-iteration-count: 1;
1266	+ animation-iteration-count: 1;
1267	+ -webkit-animation-fill-mode: forwards;
1268	+ -moz-animation-fill-mode: forwards;
1269	+ animation-fill-mode: forwards;
1270	+ }
1271	+
1272	+ @-webkit-keyframes imghvr-zoom-out-down {
1273	+ 50% {
1274	+ -webkit-transform: scale(0.8) translateY(0%);
1275	+ -moz-transform: scale(0.8) translateY(0%);
1276	+ -ms-transform: scale(0.8) translateY(0%);
1277	+ -o-transform: scale(0.8) translateY(0%);
1278	+ transform: scale(0.8) translateY(0%);
1279	+ opacity: 0.5;
1280	+ }
1281	+ 100% {
1282	+ -webkit-transform: scale(0.8) translateY(150%);
1283	+ -moz-transform: scale(0.8) translateY(150%);
1284	+ -ms-transform: scale(0.8) translateY(150%);
1285	+ -o-transform: scale(0.8) translateY(150%);
1286	+ transform: scale(0.8) translateY(150%);
1287	+ opacity: 0.5;
1288	+ }
1289	+ }
1290	+
1291	+ @keyframes imghvr-zoom-out-down {
1292	+ 50% {
1293	+ -webkit-transform: scale(0.8) translateY(0%);
1294	+ -moz-transform: scale(0.8) translateY(0%);
1295	+ -ms-transform: scale(0.8) translateY(0%);
1296	+ -o-transform: scale(0.8) translateY(0%);
1297	+ transform: scale(0.8) translateY(0%);
1298	+ opacity: 0.5;
1299	+ }
1300	+ 100% {
1301	+ -webkit-transform: scale(0.8) translateY(150%);
1302	+ -moz-transform: scale(0.8) translateY(150%);
1303	+ -ms-transform: scale(0.8) translateY(150%);
1304	+ -o-transform: scale(0.8) translateY(150%);
1305	+ transform: scale(0.8) translateY(150%);
1306	+ opacity: 0.5;
1307	+ }
1308	+ }
1309	+
1310	+ /* imghvr-zoom-out-left
1311	+ ----------------------------- */
1312	+ .eihe-container .imghvr-zoom-out-left:hover > img, .eihe-container .imghvr-zoom-out-left.hover > img {
1313	+ -webkit-animation: imghvr-zoom-out-left 0.4025s linear;
1314	+ -moz-animation: imghvr-zoom-out-left 0.4025s linear;
1315	+ animation: imghvr-zoom-out-left 0.4025s linear;
1316	+ -webkit-animation-iteration-count: 1;
1317	+ -moz-animation-iteration-count: 1;
1318	+ animation-iteration-count: 1;
1319	+ -webkit-animation-fill-mode: forwards;
1320	+ -moz-animation-fill-mode: forwards;
1321	+ animation-fill-mode: forwards;
1322	+ }
1323	+
1324	+ @-webkit-keyframes imghvr-zoom-out-left {
1325	+ 50% {
1326	+ -webkit-transform: scale(0.8) translateX(0%);
1327	+ -moz-transform: scale(0.8) translateX(0%);
1328	+ -ms-transform: scale(0.8) translateX(0%);
1329	+ -o-transform: scale(0.8) translateX(0%);
1330	+ transform: scale(0.8) translateX(0%);
1331	+ opacity: 0.5;
1332	+ }
1333	+ 100% {
1334	+ -webkit-transform: scale(0.8) translateX(-150%);
1335	+ -moz-transform: scale(0.8) translateX(-150%);
1336	+ -ms-transform: scale(0.8) translateX(-150%);
1337	+ -o-transform: scale(0.8) translateX(-150%);
1338	+ transform: scale(0.8) translateX(-150%);
1339	+ opacity: 0.5;
1340	+ }
1341	+ }
1342	+
1343	+ @keyframes imghvr-zoom-out-left {
1344	+ 50% {
1345	+ -webkit-transform: scale(0.8) translateX(0%);
1346	+ -moz-transform: scale(0.8) translateX(0%);
1347	+ -ms-transform: scale(0.8) translateX(0%);
1348	+ -o-transform: scale(0.8) translateX(0%);
1349	+ transform: scale(0.8) translateX(0%);
1350	+ opacity: 0.5;
1351	+ }
1352	+ 100% {
1353	+ -webkit-transform: scale(0.8) translateX(-150%);
1354	+ -moz-transform: scale(0.8) translateX(-150%);
1355	+ -ms-transform: scale(0.8) translateX(-150%);
1356	+ -o-transform: scale(0.8) translateX(-150%);
1357	+ transform: scale(0.8) translateX(-150%);
1358	+ opacity: 0.5;
1359	+ }
1360	+ }
1361	+
1362	+ /* imghvr-zoom-out-right
1363	+ ----------------------------- */
1364	+ .eihe-container .imghvr-zoom-out-right:hover > img, .eihe-container .imghvr-zoom-out-right.hover > img {
1365	+ -webkit-animation: imghvr-zoom-out-right 0.4025s linear;
1366	+ -moz-animation: imghvr-zoom-out-right 0.4025s linear;
1367	+ animation: imghvr-zoom-out-right 0.4025s linear;
1368	+ -webkit-animation-iteration-count: 1;
1369	+ -moz-animation-iteration-count: 1;
1370	+ animation-iteration-count: 1;
1371	+ -webkit-animation-fill-mode: forwards;
1372	+ -moz-animation-fill-mode: forwards;
1373	+ animation-fill-mode: forwards;
1374	+ }
1375	+
1376	+ @-webkit-keyframes imghvr-zoom-out-right {
1377	+ 50% {
1378	+ -webkit-transform: scale(0.8) translateX(0%);
1379	+ -moz-transform: scale(0.8) translateX(0%);
1380	+ -ms-transform: scale(0.8) translateX(0%);
1381	+ -o-transform: scale(0.8) translateX(0%);
1382	+ transform: scale(0.8) translateX(0%);
1383	+ opacity: 0.5;
1384	+ }
1385	+ 100% {
1386	+ -webkit-transform: scale(0.8) translateX(150%);
1387	+ -moz-transform: scale(0.8) translateX(150%);
1388	+ -ms-transform: scale(0.8) translateX(150%);
1389	+ -o-transform: scale(0.8) translateX(150%);
1390	+ transform: scale(0.8) translateX(150%);
1391	+ opacity: 0.5;
1392	+ }
1393	+ }
1394	+
1395	+ @keyframes imghvr-zoom-out-right {
1396	+ 50% {
1397	+ -webkit-transform: scale(0.8) translateX(0%);
1398	+ -moz-transform: scale(0.8) translateX(0%);
1399	+ -ms-transform: scale(0.8) translateX(0%);
1400	+ -o-transform: scale(0.8) translateX(0%);
1401	+ transform: scale(0.8) translateX(0%);
1402	+ opacity: 0.5;
1403	+ }
1404	+ 100% {
1405	+ -webkit-transform: scale(0.8) translateX(150%);
1406	+ -moz-transform: scale(0.8) translateX(150%);
1407	+ -ms-transform: scale(0.8) translateX(150%);
1408	+ -o-transform: scale(0.8) translateX(150%);
1409	+ transform: scale(0.8) translateX(150%);
1410	+ opacity: 0.5;
1411	+ }
1412	+ }
1413	+
1414	+ /* imghvr-zoom-out-flip-horiz
1415	+ ----------------------------- */
1416	+ .eihe-container .imghvr-zoom-out-flip-horiz {
1417	+ -webkit-perspective: 50em;
1418	+ -moz-perspective: 50em;
1419	+ perspective: 50em;
1420	+ }
1421	+
1422	+ .eihe-container .imghvr-zoom-out-flip-horiz .eihe-info {
1423	+ opacity: 0;
1424	+ -webkit-transform: rotateX(90deg) translateY(-100%) scale(0.5);
1425	+ -moz-transform: rotateX(90deg) translateY(-100%) scale(0.5);
1426	+ -ms-transform: rotateX(90deg) translateY(-100%) scale(0.5);
1427	+ -o-transform: rotateX(90deg) translateY(-100%) scale(0.5);
1428	+ transform: rotateX(90deg) translateY(-100%) scale(0.5);
1429	+ }
1430	+
1431	+ .eihe-container .imghvr-zoom-out-flip-horiz:hover > img, .eihe-container .imghvr-zoom-out-flip-horiz.hover > img {
1432	+ -webkit-transform: rotateX(-100deg) translateY(50%) scale(0.5);
1433	+ -moz-transform: rotateX(-100deg) translateY(50%) scale(0.5);
1434	+ -ms-transform: rotateX(-100deg) translateY(50%) scale(0.5);
1435	+ -o-transform: rotateX(-100deg) translateY(50%) scale(0.5);
1436	+ transform: rotateX(-100deg) translateY(50%) scale(0.5);
1437	+ opacity: 0;
1438	+ -webkit-transition-delay: 0;
1439	+ -moz-transition-delay: 0;
1440	+ transition-delay: 0;
1441	+ }
1442	+
1443	+ .eihe-container .imghvr-zoom-out-flip-horiz:hover .eihe-info, .eihe-container .imghvr-zoom-out-flip-horiz.hover .eihe-info {
1444	+ -webkit-transform: rotateX(0) translateY(0%) scale(1);
1445	+ -moz-transform: rotateX(0) translateY(0%) scale(1);
1446	+ -ms-transform: rotateX(0) translateY(0%) scale(1);
1447	+ -o-transform: rotateX(0) translateY(0%) scale(1);
1448	+ transform: rotateX(0) translateY(0%) scale(1);
1449	+ opacity: 1;
1450	+ -webkit-transition-delay: 0.35s;
1451	+ -moz-transition-delay: 0.35s;
1452	+ transition-delay: 0.35s;
1453	+ }
1454	+
1455	+ /* imghvr-zoom-out-flip-vert
1456	+ ----------------------------- */
1457	+ .eihe-container .imghvr-zoom-out-flip-vert {
1458	+ -webkit-perspective: 50em;
1459	+ -moz-perspective: 50em;
1460	+ perspective: 50em;
1461	+ }
1462	+
1463	+ .eihe-container .imghvr-zoom-out-flip-vert .eihe-info {
1464	+ opacity: 0;
1465	+ -webkit-transform: rotateY(90deg) translate(50%, 0) scale(0.5);
1466	+ -moz-transform: rotateY(90deg) translate(50%, 0) scale(0.5);
1467	+ -ms-transform: rotateY(90deg) translate(50%, 0) scale(0.5);
1468	+ -o-transform: rotateY(90deg) translate(50%, 0) scale(0.5);
1469	+ transform: rotateY(90deg) translate(50%, 0) scale(0.5);
1470	+ }
1471	+
1472	+ .eihe-container .imghvr-zoom-out-flip-vert:hover > img, .eihe-container .imghvr-zoom-out-flip-vert.hover > img {
1473	+ -webkit-transform: rotateY(-100deg) translateX(50%) scale(0.5);
1474	+ -moz-transform: rotateY(-100deg) translateX(50%) scale(0.5);
1475	+ -ms-transform: rotateY(-100deg) translateX(50%) scale(0.5);
1476	+ -o-transform: rotateY(-100deg) translateX(50%) scale(0.5);
1477	+ transform: rotateY(-100deg) translateX(50%) scale(0.5);
1478	+ opacity: 0;
1479	+ -webkit-transition-delay: 0;
1480	+ -moz-transition-delay: 0;
1481	+ transition-delay: 0;
1482	+ }
1483	+
1484	+ .eihe-container .imghvr-zoom-out-flip-vert:hover .eihe-info, .eihe-container .imghvr-zoom-out-flip-vert.hover .eihe-info {
1485	+ -webkit-transform: rotateY(0) translate(0, 0) scale(1);
1486	+ -moz-transform: rotateY(0) translate(0, 0) scale(1);
1487	+ -ms-transform: rotateY(0) translate(0, 0) scale(1);
1488	+ -o-transform: rotateY(0) translate(0, 0) scale(1);
1489	+ transform: rotateY(0) translate(0, 0) scale(1);
1490	+ opacity: 1;
1491	+ -webkit-transition-delay: 0.35s;
1492	+ -moz-transition-delay: 0.35s;
1493	+ transition-delay: 0.35s;
1494	+ }
1495	+
1496	+ /* imghvr-blur
1497	+ ----------------------------- */
1498	+ .eihe-container .imghvr-blur .eihe-info {
1499	+ opacity: 0;
1500	+ }
1501	+
1502	+ .eihe-container .imghvr-blur:hover > img {
1503	+ -webkit-filter: blur(30px);
1504	+ filter: blur(30px);
1505	+ -webkit-transform: scale(1.2);
1506	+ -moz-transform: scale(1.2);
1507	+ -ms-transform: scale(1.2);
1508	+ -o-transform: scale(1.2);
1509	+ transform: scale(1.2);
1510	+ opacity: 0;
1511	+ }
1512	+
1513	+ .eihe-container .imghvr-blur:hover .eihe-info {
1514	+ opacity: 1;
1515	+ -webkit-transition-delay: 0.21s;
1516	+ -moz-transition-delay: 0.21s;
1517	+ transition-delay: 0.21s;
1518	+ }
1519	+
1520	+ /# sourceMappingURL=imagehover.css.map /

image-hover-effects-addon-for-elementor.php ADDED Viewed

	@@ -0,0 +1,96 @@


1	+ <?php
2	+ /**
3	+ * Plugin Name: Image Hover Effects Addon for Elementor
4	+ * Plugin URI: https://blocksera.com/wordpress-plugins/image-hover-effects-elementor
5	+ * Author: Blocksera
6	+ * Author URI: https://blocksera.com
7	+ * Description: Unlimited image hover effects to your web pages using this Elementor addon.
8	+ * Version: 1.0
9	+ * Requires at least: 4.6
10	+ * Tested up to: 4.9.6
11	+ * License: GPL v3
12	+ * Text Domain: eihe-lang
13	+ * Domain Path: /languages
14	+ *
15	+ **/
16	+
17	+ // Exit if accessed directly.
18	+ if ( ! defined( 'ABSPATH' ) ) exit;
19	+
20	+ define( 'EIHE', __FILE__ );
21	+ define( 'EIHE_PATH', plugin_dir_path( EIHE ) );
22	+ define( 'EIHE_URL', plugin_dir_url( EIHE ) );
23	+
24	+ register_activation_hook(__FILE__, array('Elementor_Image_Hover_Effects','activate'));
25	+ register_deactivation_hook(__FILE__, array('Elementor_Image_Hover_Effects','deactivate'));
26	+
27	+
28	+ function eihe_plugin_loaded() {
29	+ if ( ! did_action( 'elementor/loaded' ) ) {
30	+ add_action( 'admin_notices', 'eihe_widgets_fail_load' );
31	+ return;
32	+ }
33	+
34	+ $elementor_version_required = '1.1.2';
35	+ if ( ! version_compare( ELEMENTOR_VERSION, $elementor_version_required, '>=' ) ) {
36	+ add_action( 'admin_notices', 'eihe_fail_load_out_of_date' );
37	+ return;
38	+ }
39	+ }
40	+ add_action( 'plugins_loaded', 'eihe_plugin_loaded' );
41	+
42	+
43	+ require_once EIHE_PATH.'inc/elementor-checker.php';
44	+
45	+ class Elementor_Image_Hover_Effects {
46	+
47	+ private static $_instance = null;
48	+
49	+ public static function get_instance() {
50	+ if ( ! self::$_instance ) {
51	+ self::$_instance = new self();
52	+ }
53	+
54	+ return self::$_instance;
55	+ }
56	+
57	+ public function init() {
58	+ load_plugin_textdomain('eihe-lang', false, EIHE_PATH . 'languages');
59	+ }
60	+
61	+ public static function activate() {
62	+ }
63	+
64	+ public static function deactivate() {
65	+ }
66	+
67	+ public function __construct() {
68	+ if ( self::$_instance ) {
69	+ return;
70	+ }
71	+
72	+ self::$_instance = $this;
73	+
74	+ require_once EIHE_PATH.'inc/elementor-helper.php';
75	+
76	+ add_action('elementor/widgets/widgets_registered',array( $this, 'eihe_elements'));
77	+ add_action('elementor/frontend/after_enqueue_styles', array( $this, 'eihe_enqueue_scripts') );
78	+ }
79	+
80	+ public function eihe_elements(){
81	+ require_once EIHE_PATH.'widgets/eihe-image-hover.php';
82	+ }
83	+
84	+ public function eihe_enqueue_scripts(){
85	+ wp_enqueue_style( 'eihe-admin-style', EIHE_URL . 'assets/css/admin.css', array(), '1.0' );
86	+ wp_enqueue_style( 'eihe-front-style', EIHE_URL . 'assets/css/imagehover.css', array(), '1.0' );
87	+ }
88	+
89	+ }
90	+
91	+
92	+ function Elementor_Image_Hover_Effects() {
93	+ return Elementor_Image_Hover_Effects::get_instance();
94	+ }
95	+
96	+ $GLOBALS['Elementor_Image_Hover_Effects'] = Elementor_Image_Hover_Effects();

inc/elementor-checker.php ADDED Viewed

	@@ -0,0 +1,59 @@


1	+ <?php
2	+
3	+ // Exit if accessed directly.
4	+ if ( ! defined( 'ABSPATH' ) ) exit;
5	+
6	+ function eihe_widgets_fail_load() {
7	+ $screen = get_current_screen();
8	+ if ( isset( $screen->parent_file ) && 'plugins.php' === $screen->parent_file && 'update' === $screen->id ) {
9	+ return;
10	+ }
11	+
12	+ $plugin = 'elementor/elementor.php';
13	+
14	+ if ( _is_elementor_installed() ) {
15	+ if ( ! current_user_can( 'activate_plugins' ) ) {
16	+ return;
17	+ }
18	+
19	+ $activation_url = wp_nonce_url( 'plugins.php?action=activate&plugin=' . $plugin . '&plugin_status=all&paged=1&s', 'activate-plugin_' . $plugin );
20	+
21	+ $message = '<p>' . __( 'Image Hover Effects Addon not working because you need to activate the Elementor plugin.', 'eihe_lang' ) . '</p>';
22	+ $message .= '<p>' . sprintf( '<a href="%s" class="button-primary">%s</a>', $activation_url, __( 'Activate Elementor Now', 'eihe_lang' ) ) . '</p>';
23	+ } else {
24	+ if ( ! current_user_can( 'install_plugins' ) ) {
25	+ return;
26	+ }
27	+
28	+ $install_url = wp_nonce_url( self_admin_url( 'update.php?action=install-plugin&plugin=elementor' ), 'install-plugin_elementor' );
29	+
30	+ $message = '<p>' . __( 'Image Hover Effects Addon not working because you need to install the Elemenor plugin', 'eihe_lang' ) . '</p>';
31	+ $message .= '<p>' . sprintf( '<a href="%s" class="button-primary">%s</a>', $install_url, __( 'Install Elementor Now', 'eihe_lang' ) ) . '</p>';
32	+ }
33	+
34	+ echo '<div class="error"><p>' . $message . '</p></div>';
35	+ }
36	+
37	+ function eihe_fail_load_out_of_date() {
38	+ if ( ! current_user_can( 'update_plugins' ) ) {
39	+ return;
40	+ }
41	+
42	+ $file_path = 'elementor/elementor.php';
43	+
44	+ $upgrade_link = wp_nonce_url( self_admin_url( 'update.php?action=upgrade-plugin&plugin=' ) . $file_path, 'upgrade-plugin_' . $file_path );
45	+ $message = '<p>' . __( 'Image Hover Effects Addon not working because you are using an old version of Elementor.', 'eihe_lang' ) . '</p>';
46	+ $message .= '<p>' . sprintf( '<a href="%s" class="button-primary">%s</a>', $upgrade_link, __( 'Update Elementor Now', 'eihe_lang' ) ) . '</p>';
47	+ echo '<div class="error">' . $message . '</div>';
48	+ }
49	+
50	+
51	+ if ( ! function_exists( '_is_elementor_installed' ) ) {
52	+
53	+ function _is_elementor_installed() {
54	+ $file_path = 'elementor/elementor.php';
55	+ $installed_plugins = get_plugins();
56	+
57	+ return isset( $installed_plugins[ $file_path ] );
58	+ }
59	+ }

inc/elementor-helper.php ADDED Viewed

	@@ -0,0 +1,19 @@


1	+ <?php
2	+ namespace Elementor;
3	+
4	+ // Exit if accessed directly.
5	+ if ( ! defined( 'ABSPATH' ) ) exit;
6	+
7	+ // Create Widgets category into elementor.
8	+
9	+ function eihe_add_category_widgets_init(){
10	+ Plugin::instance()->elements_manager->add_category(
11	+ 'eihe_widget',
12	+ [
13	+ 'title' => 'Image Hover Effects',
14	+ 'icon' => 'font'
15	+ ],
16	+ 1
17	+ );
18	+ }
19	+ add_action('elementor/init','Elementor\eihe_add_category_widgets_init');

readme.txt ADDED Viewed

	@@ -0,0 +1,95 @@


1	+ === Image Hover Effects Addon for Elementor ===
2	+ Contributors: blocksera, crypto4ever
3	+ Donate Link: https://blocksera.com/wordpress-plugins/image-hover-effects-elementor
4	+ Tags: elementor, elementor addon, elementor image hover effects, image hover effects, hover effects
5	+ Requires PHP: 5.2.4
6	+ Requires at least: 4.0
7	+ Tested up to: 4.9.6
8	+ Stable tag: 1.0
9	+ License: GPLv2 or later
10	+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
11	+
12	+ This elementor addon plugin lets you add 40+ Image hover effects with title and descriptions to your site anywhere.
13	+
14	+ == Description ==
15	+
16	+ You can add 40+ Image hover effects with title and descriptions in a simple way using this wordpress plugin image hover effects addon for elementor.
17	+
18	+ = Features =
19	+
20	+ * Easy to customize options.
21	+ * 40+ Image Hover Effects.
22	+ * Circle and Square border both comes with all effects.
23	+ * Center the text horizontally.
24	+ * Control the spaces between elements.
25	+
26	+ with this elementor addon plugin, you can show your title and description with various entry animations.
27	+
28	+ Image Hover Effects List
29	+
30	+ * Fade
31	+ * Slide Up
32	+ * Slide Down
33	+ * Slide Left
34	+ * Slide Right
35	+ * Reveal Up
36	+ * Reveal Down
37	+ * Reveal Left
38	+ * Reveal Right
39	+ * Push Up
40	+ * Push Down
41	+ * Push Left
42	+ * Push Right
43	+ * Hinge Up
44	+ * Hinge Down
45	+ * Hinge Left
46	+ * Hinge Right
47	+ * Flip Horizontal
48	+ * Flip Vertical
49	+ * Flip Dialog 1
50	+ * Flip Dialog 2
51	+ * Shutter Out Horizontal
52	+ * Shutter Out Vertical
53	+ * Shutter Out Dialog 1
54	+ * Shutter Out Dialog 2
55	+ * Shutter In Horizontal
56	+ * Shutter In Vertical
57	+ * Shutter In Out Horizontal
58	+ * Shutter In Out Vertical
59	+ * Shutter In Out Dialog 1
60	+ * Shutter In Out Dialog 2
61	+ * Fold Up
62	+ * Fold Down
63	+ * Fold Left
64	+ * Fold Right
65	+ * Zoom In
66	+ * Zoom Out
67	+ * Zoom Out Up
68	+ * Zoom Out Down
69	+ * Zoom Out Left
70	+ * Zoom Out Right
71	+ * Zoom Out Flip Vertical
72	+ * Zoom Out Flip Horizontal
73	+ * Blur
74	+
75	+
76	+ > still we picked up some best hover effects, we wanted to let us know how our customers feel.
77	+ > Please [let us know](https://blocksersa.com/contact/) your hover effects ideas which can be added to this hover effects lists to make this plugin even more better.
78	+
79	+ == Installation ==
80	+
81	+ 1. Upload the plugin and activate it (alternatively, install through the WP admin console)
82	+ 2. Edit any page/post using edit with elementor option
83	+ 3. On elementor widget menu, search/scroll and find the image hover effects addons
84	+ 4. Drag and drop this addon, where you have to add the section
85	+ 5. Customize the options and add the content
86	+ 6. Hurray ! in a minute you have added the Image Hover Section
87	+
88	+ == Changelog ==
89	+
90	+ = 1.0 =
91	+ * Initial version
92	+
93	+ == Upgrade Notice ==
94	+
95	+ This is the initial version

widgets/eihe-image-hover.php ADDED Viewed

	@@ -0,0 +1,419 @@


1	+ <?php
2	+ namespace Elementor;
3	+
4	+ // Exit if accessed directly.
5	+ if ( ! defined( 'ABSPATH' ) ) exit;
6	+
7	+ class Elementor_Image_Hover_Effects_EIHE extends Widget_Base {
8	+
9	+ public function get_name() {
10	+ return 'e_image_hover_effects';
11	+ }
12	+
13	+ public function get_title() {
14	+ return esc_html__( 'Image Hover Effects', 'eihe-lang' );
15	+ }
16	+
17	+ public function get_icon() {
18	+ return 'fa fa-picture-o';
19	+ }
20	+
21	+ public function get_categories() {
22	+ return [ 'eihe_widget' ];
23	+ }
24	+
25	+ protected function _register_controls() {
26	+
27	+ $this->start_controls_section(
28	+ 'eihe_content_settings',
29	+ [
30	+ 'label' => esc_html__( 'Content Settings', 'elementor-image-hover-effects' ),
31	+ 'tab' => Controls_Manager::TAB_CONTENT,
32	+ ]
33	+ );
34	+
35	+ $this->add_control(
36	+ 'eihe_content_options',
37	+ [
38	+ 'type' => Controls_Manager::REPEATER,
39	+ 'seperator' => 'before',
40	+ 'default' => [
41	+ [ 'eihe_title' => esc_html__( 'Title', 'elementor-image-hover-effects' ) ],
42	+ [ 'eihe_title' => esc_html__( 'Title', 'elementor-image-hover-effects' ) ],
43	+ [ 'eihe_title' => esc_html__( 'Title', 'elementor-image-hover-effects' ) ],
44	+ ],
45	+ 'fields' => [
46	+ [
47	+ 'name' => 'eihe_title',
48	+ 'label' => esc_html__( 'Title', 'elementor-image-hover-effects' ),
49	+ 'type' => Controls_Manager::TEXT,
50	+ 'default' => esc_html__( 'Title', 'elementor-image-hover-effects' ),
51	+ ],
52	+ [
53	+ 'name' => 'eihe_description',
54	+ 'label' => esc_html__( 'Description', 'elementor-image-hover-effects' ),
55	+ 'type' => Controls_Manager::TEXTAREA,
56	+ 'default' => esc_html__( 'Description', 'elementor-image-hover-effects' ),
57	+ ],
58	+ [
59	+ 'name' => 'eihe_image',
60	+ 'label' => esc_html__( 'Upload Image', 'elementor-image-hover-effects' ),
61	+ 'description' => esc_html__( 'Select an image for the Banner', 'elementor-image-hover-effects' ),
62	+ 'type' => Controls_Manager::MEDIA,
63	+ 'default' => [
64	+ 'url' => Utils::get_placeholder_image_src()
65	+ ],
66	+ 'show_external' => true
67	+ ]
68	+ ],
69	+ 'title_field' => '{{eihe_title}}',
70	+ ]
71	+ );
72	+ $this->end_controls_section();
73	+
74	+ $this->start_controls_section(
75	+ 'eihe_general_settings',
76	+ [
77	+ 'label' => esc_html__( 'General Settings', 'elementor-image-hover-effects' ),
78	+ 'tab' => Controls_Manager::TAB_CONTENT,
79	+ ]
80	+ );
81	+
82	+ $this->add_control(
83	+ 'eihe_hover_style',
84	+ [
85	+ 'label' => esc_html__( 'Effects', 'elementor-image-hover-effects' ),
86	+ 'type' => Controls_Manager::SELECT,
87	+ 'default' => 'imghvr-fade',
88	+ 'options' => [
89	+ 'imghvr-fade' => esc_html__( 'Fade', 'elementor-image-hover-effects' ),
90	+ 'imghvr-slide-up' => esc_html__( 'Slide Up', 'elementor-image-hover-effects' ),
91	+ 'imghvr-slide-down' => esc_html__( 'Slide Down', 'elementor-image-hover-effects' ),
92	+ 'imghvr-slide-left' => esc_html__( 'Slide Left', 'elementor-image-hover-effects' ),
93	+ 'imghvr-slide-right' => esc_html__( 'Slide Right', 'elementor-image-hover-effects' ),
94	+ 'imghvr-reveal-up' => esc_html__( 'Reveal Up', 'elementor-image-hover-effects' ),
95	+ 'imghvr-reveal-down' => esc_html__( 'Reveal Down', 'elementor-image-hover-effects' ),
96	+ 'imghvr-reveal-left' => esc_html__( 'Reveal Left', 'elementor-image-hover-effects' ),
97	+ 'imghvr-reveal-right' => esc_html__( 'Reveal Right', 'elementor-image-hover-effects' ),
98	+ 'imghvr-push-up' => esc_html__( 'Push Up', 'elementor-image-hover-effects' ),
99	+ 'imghvr-push-down' => esc_html__( 'Push Down', 'elementor-image-hover-effects' ),
100	+ 'imghvr-push-left' => esc_html__( 'Push Left', 'elementor-image-hover-effects' ),
101	+ 'imghvr-push-right' => esc_html__( 'Push Right', 'elementor-image-hover-effects' ),
102	+ 'imghvr-hinge-up' => esc_html__( 'Hinge Up', 'elementor-image-hover-effects' ),
103	+ 'imghvr-hinge-down' => esc_html__( 'Hinge Down', 'elementor-image-hover-effects' ),
104	+ 'imghvr-hinge-left' => esc_html__( 'Hinge Left', 'elementor-image-hover-effects' ),
105	+ 'imghvr-hinge-right' => esc_html__( 'Hinge Right', 'elementor-image-hover-effects' ),
106	+ 'imghvr-flip-horiz' => esc_html__( 'Flip Horizontal', 'elementor-image-hover-effects' ),
107	+ 'imghvr-flip-vert' => esc_html__( 'Flip Vertical', 'elementor-image-hover-effects' ),
108	+ 'imghvr-flip-diag-1' => esc_html__( 'Flip Dialog 1', 'elementor-image-hover-effects' ),
109	+ 'imghvr-flip-diag-2' => esc_html__( 'Flip Dialog 2', 'elementor-image-hover-effects' ),
110	+ 'imghvr-shutter-out-horiz' => esc_html__( 'Shutter Out Horizontal', 'elementor-image-hover-effects' ),
111	+ 'imghvr-shutter-out-vert' => esc_html__( 'Shutter Out Vertical', 'elementor-image-hover-effects' ),
112	+ 'imghvr-shutter-out-diag-1' => esc_html__( 'Shutter Out Dialog 1', 'elementor-image-hover-effects' ),
113	+ 'imghvr-shutter-out-diag-2' => esc_html__( 'Shutter Out Dialog 2', 'elementor-image-hover-effects' ),
114	+ 'imghvr-shutter-in-horiz' => esc_html__( 'Shutter In Horizontal', 'elementor-image-hover-effects' ),
115	+ 'imghvr-shutter-in-vert' => esc_html__( 'Shutter In Vertical', 'elementor-image-hover-effects' ),
116	+ 'imghvr-shutter-in-out-horiz' => esc_html__( 'Shutter In Out Horizontal', 'elementor-image-hover-effects' ),
117	+ 'imghvr-shutter-in-out-vert' => esc_html__( 'Shutter In Out Vertical', 'elementor-image-hover-effects' ),
118	+ 'imghvr-shutter-in-out-diag-1' => esc_html__( 'Shutter In Out Dialog 1', 'elementor-image-hover-effects' ),
119	+ 'imghvr-shutter-in-out-diag-2' => esc_html__( 'Shutter In Out Dialog 2', 'elementor-image-hover-effects' ),
120	+ 'imghvr-fold-up' => esc_html__( 'Fold Up', 'elementor-image-hover-effects' ),
121	+ 'imghvr-fold-down' => esc_html__( 'Fold Down', 'elementor-image-hover-effects' ),
122	+ 'imghvr-fold-left' => esc_html__( 'Fold Left', 'elementor-image-hover-effects' ),
123	+ 'imghvr-fold-right' => esc_html__( 'Fold Right', 'elementor-image-hover-effects' ),
124	+ 'imghvr-zoom-in' => esc_html__( 'Zoom In', 'elementor-image-hover-effects' ),
125	+ 'imghvr-zoom-out' => esc_html__( 'Zoom Out', 'elementor-image-hover-effects' ),
126	+ 'imghvr-zoom-out-up' => esc_html__( 'Zoom Out Up', 'elementor-image-hover-effects' ),
127	+ 'imghvr-zoom-out-down' => esc_html__( 'Zoom Out Down', 'elementor-image-hover-effects' ),
128	+ 'imghvr-zoom-out-left' => esc_html__( 'Zoom Out Left', 'elementor-image-hover-effects' ),
129	+ 'imghvr-zoom-out-right' => esc_html__( 'Zoom Out Right', 'elementor-image-hover-effects' ),
130	+ 'imghvr-zoom-out-flip-vert' => esc_html__( 'Zoom Out Flip Vertical', 'elementor-image-hover-effects' ),
131	+ 'imghvr-zoom-out-flip-horiz' => esc_html__( 'Zoom Out Flip Horizontal', 'elementor-image-hover-effects' ),
132	+ 'imghvr-blur' => esc_html__( 'Blur', 'elementor-image-hover-effects' ),
133	+ ],
134	+ ]
135	+ );
136	+ $this->add_responsive_control(
137	+ 'eihe_columns',
138	+ [
139	+ 'label' => esc_html__('Columns per row', 'elementor-image-hover-effects'),
140	+ 'type' => Controls_Manager::NUMBER,
141	+ 'min' => 1,
142	+ 'max' => 5,
143	+ 'step' => 1,
144	+ 'default' => 3,
145	+ ]
146	+ );
147	+
148	+
149	+ $this->add_responsive_control(
150	+ 'eihe-text-align',
151	+ [
152	+ 'label' => esc_html__( 'Alignment', 'elementor' ),
153	+ 'type' => Controls_Manager::CHOOSE,
154	+ 'options' => [
155	+ 'left' => [
156	+ 'title' => esc_html__( 'Left', 'elementor' ),
157	+ 'icon' => 'fa fa-align-left',
158	+ ],
159	+ 'center' => [
160	+ 'title' => esc_html__( 'Center', 'elementor' ),
161	+ 'icon' => 'fa fa-align-center',
162	+ ],
163	+ 'right' => [
164	+ 'title' => esc_html__( 'Right', 'elementor' ),
165	+ 'icon' => 'fa fa-align-right',
166	+ ]
167	+ ],
168	+ 'default' => 'left',
169	+ 'selectors' => [
170	+ '{{WRAPPER}} .eihe-container' => 'text-align: {{VALUE}};',
171	+ ]
172	+ ]
173	+ );
174	+
175	+ $this->end_controls_section();
176	+
177	+ $this->start_controls_section(
178	+ 'eihe_grid_style',
179	+ [
180	+ 'label' => esc_html__('Box', 'elementor-image-hover-effects' ),
181	+ 'tab' => Controls_Manager::TAB_STYLE,
182	+ ]
183	+ );
184	+
185	+ $this->add_control(
186	+ 'eihe_overlay_color',
187	+ [
188	+ 'label' => esc_html__('Overlay', 'elementor-image-hover-effects' ),
189	+ 'type' => Controls_Manager::COLOR,
190	+ 'default' => '#000',
191	+ 'scheme' => [
192	+ 'type' => Scheme_Color::get_type(),
193	+ 'value' => Scheme_Color::COLOR_1,
194	+ ],
195	+ 'selectors' => [
196	+ "{{WRAPPER}} .eihe-layer,
197	+ {{WRAPPER}} .eihe-box,
198	+ {{WRAPPER}} .eihe-container [class^='imghvr-shutter-in-']:after,
199	+ {{WRAPPER}} .eihe-container [class^='imghvr-shutter-in-']:before,
200	+ {{WRAPPER}} .eihe-container [class*=' imghvr-shutter-in-']:after,
201	+ {{WRAPPER}} .eihe-container [class*=' imghvr-shutter-in-']:before,
202	+ {{WRAPPER}} .eihe-container [class^='imghvr-shutter-out-']:before,
203	+ {{WRAPPER}} .eihe-container [class*=' imghvr-shutter-out-']:before,
204	+ {{WRAPPER}} .eihe-container [class^='imghvr-reveal-']:before,
205	+ {{WRAPPER}} .eihe-container [class*=' imghvr-reveal-']:before" => "background-color: {{VALUE}};",
206	+ ]
207	+ ]
208	+ );
209	+
210	+ $this->add_responsive_control(
211	+ 'eihe_margin',
212	+ [
213	+ 'label' => esc_html__( 'Grid Outer Gap', 'elementor-image-hover-effects' ),
214	+ 'type' => Controls_Manager::SLIDER,
215	+ 'range' => [
216	+ 'px' => [
217	+ 'min' => 0,
218	+ 'max' => 200,
219	+ ],
220	+ ],
221	+ 'default' => [
222	+ 'size' => 10,
223	+ 'unit' => 'px',
224	+ ],
225	+ 'selectors' => [
226	+ '{{WRAPPER}} .eihe-columns .eihe-box' => 'margin-left: {{SIZE}}{{UNIT}}; margin-right: {{SIZE}}{{UNIT}};',
227	+ ],
228	+ ]
229	+ );
230	+ $this->add_responsive_control(
231	+ 'eihe_margin_bottom',
232	+ [
233	+ 'label' => esc_html__( 'Grid Outer Bottom Gap', 'elementor-image-hover-effects' ),
234	+ 'type' => Controls_Manager::SLIDER,
235	+ 'range' => [
236	+ 'px' => [
237	+ 'min' => 0,
238	+ 'max' => 200,
239	+ ],
240	+ ],
241	+ 'default' => [
242	+ 'size' => 20,
243	+ 'unit' => 'px',
244	+ ],
245	+ 'selectors' => [
246	+ '{{WRAPPER}} .eihe-columns .eihe-box' => 'margin-bottom: {{SIZE}}{{UNIT}};',
247	+ ],
248	+ ]
249	+ );
250	+ $this->add_responsive_control(
251	+ 'eihe_padding',
252	+ [
253	+ 'label' => esc_html__( 'Grid Inner Gap', 'elementor-image-hover-effects' ),
254	+ 'type' => Controls_Manager::SLIDER,
255	+ 'range' => [
256	+ 'px' => [
257	+ 'min' => 0,
258	+ 'max' => 200,
259	+ ],
260	+ ],
261	+ 'default' => [
262	+ 'size' => 20,
263	+ 'unit' => 'px',
264	+ ],
265	+ 'selectors' => [
266	+ '{{WRAPPER}} .eihe-columns .eihe-info' => 'padding-left: {{SIZE}}{{UNIT}}; padding-right: {{SIZE}}{{UNIT}};',
267	+ ],
268	+ ]
269	+ );
270	+ $this->add_responsive_control(
271	+ 'eihe_padding_top',
272	+ [
273	+ 'label' => esc_html__( 'Grid Inner Top Gap', 'elementor-image-hover-effects' ),
274	+ 'type' => Controls_Manager::SLIDER,
275	+ 'range' => [
276	+ 'px' => [
277	+ 'min' => 0,
278	+ 'max' => 200,
279	+ ],
280	+ ],
281	+ 'default' => [
282	+ 'size' => 20,
283	+ 'unit' => 'px',
284	+ ],
285	+ 'selectors' => [
286	+ '{{WRAPPER}} .eihe-columns .eihe-info' => 'padding-top: {{SIZE}}{{UNIT}};',
287	+ ],
288	+ ]
289	+ );
290	+
291	+ $this->add_responsive_control(
292	+ 'eihe_style_border_radius',
293	+ [
294	+ 'label' => esc_html__( 'Border Radius', 'elementor-image-hover-effects' ),
295	+ 'type' => Controls_Manager::DIMENSIONS,
296	+ 'size_units' => [ 'px', '%' ],
297	+ 'selectors' => [
298	+ '{{WRAPPER}} .eihe-columns .eihe-box, {{WRAPPER}} .eihe-columns .eihe-info, {{WRAPPER}} .eihe-columns .eihe-image img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
299	+ ],
300	+ ]
301	+ );
302	+
303	+ $this->end_controls_section();
304	+
305	+ $this->start_controls_section(
306	+ 'eihe_title_style',
307	+ [
308	+ 'label' => esc_html__('Title', 'elementor-image-hover-effects' ),
309	+ 'tab' => Controls_Manager::TAB_STYLE,
310	+ ]
311	+ );
312	+
313	+
314	+ $this->add_control(
315	+ 'eihe_title_color',
316	+ [
317	+ 'label' => esc_html__('Color', 'elementor-image-hover-effects' ),
318	+ 'type' => Controls_Manager::COLOR,
319	+ 'default' => '#fff',
320	+ 'scheme' => [
321	+ 'type' => Scheme_Color::get_type(),
322	+ 'value' => Scheme_Color::COLOR_1,
323	+ ],
324	+ 'selectors' => [
325	+ '{{WRAPPER}} .eihe-info h2' => 'color: {{VALUE}};',
326	+ ]
327	+ ]
328	+ );
329	+
330	+
331	+ $this->add_group_control(
332	+ Group_Control_Typography::get_type(),
333	+ [
334	+ 'name' => 'eihe_title_typo',
335	+ 'scheme' => Scheme_Typography::TYPOGRAPHY_1,
336	+ 'selector' => '{{WRAPPER}} .eihe-info h2',
337	+ ]
338	+ );
339	+
340	+ $this->end_controls_section();
341	+
342	+ $this->start_controls_section(
343	+ 'eihe_desc_style',
344	+ [
345	+ 'label' => esc_html__('Description', 'elementor-image-hover-effects' ),
346	+ 'tab' => Controls_Manager::TAB_STYLE,
347	+ ]
348	+ );
349	+
350	+ $this->add_control(
351	+ 'eihe_desc_color',
352	+ [
353	+ 'label' => esc_html__('Color', 'elementor-image-hover-effects' ),
354	+ 'type' => Controls_Manager::COLOR,
355	+ 'default' => '#fff',
356	+ 'scheme' => [
357	+ 'type' => Scheme_Color::get_type(),
358	+ 'value' => Scheme_Color::COLOR_1,
359	+ ],
360	+ 'selectors' => [
361	+ '{{WRAPPER}} .eihe-info p' => 'color: {{VALUE}};',
362	+ ]
363	+ ]
364	+ );
365	+
366	+ $this->add_group_control(
367	+ Group_Control_Typography::get_type(),
368	+ [
369	+ 'name' => 'eihe_desc_typo',
370	+ 'scheme' => Scheme_Typography::TYPOGRAPHY_1,
371	+ 'selector' => '{{WRAPPER}} .eihe-info p',
372	+ ]
373	+ );
374	+
375	+ $this->end_controls_section();
376	+ }
377	+
378	+ protected function render() {
379	+
380	+ $settings = $this->get_settings_for_display();
381	+
382	+ echo '<div class="eihe-container" data-hover="'.$settings['eihe_hover_style'].'" data-col="'.$settings['eihe_columns'].'">';
383	+
384	+ foreach ($settings['eihe_content_options'] as $eihe_each) :?>
385	+
386	+ <div class="eihe-columns">
387	+ <div class="eihe-box <?php echo $settings['eihe_hover_style'] ; ?>">
388	+ <img src="<?php echo $eihe_each['eihe_image']['url']; ?>" />
389	+ <div class="eihe-layer"></div>
390	+ <div class="eihe-info"><h2><?php echo $eihe_each['eihe_title']; ?> </h2><p><?php echo $eihe_each['eihe_description']; ?></p></div>
391	+ </div>
392	+ </div>
393	+
394	+ <?php endforeach;
395	+
396	+ echo '</div>';
397	+ }
398	+
399	+
400	+ protected function _content_template() {
401	+ ?>
402	+ <div class="eihe-container" data-hover="{{{ settings.eihe_hover_style }}}" data-col="{{{ settings.eihe_columns }}}">
403	+ <#
404	+ if ( settings.eihe_content_options ) {
405	+ _.each( settings.eihe_content_options, function( item, index ) { #>
406	+ <div class="eihe-columns">
407	+ <div class="eihe-box {{{ settings.eihe_hover_style }}}">
408	+ <img src="{{{ item.eihe_image.url }}}" />
409	+ <div class="eihe-layer"></div>
410	+ <div class="eihe-info"><h2>{{{ item.eihe_title }}}</h2><p>{{{ item.eihe_description }}}</p></div>
411	+ </div>
412	+ </div>
413	+ <# });
414	+ } #>
415	+ </div>
416	+ <?php
417	+ }
418	+ }
419	+ Plugin::instance()->widgets_manager->register_widget_type( new Elementor_Image_Hover_Effects_EIHE() );

Image Hover Effects – Elementor Addon - Version 1.0

Version Description

Release Info

Version 1.0