| 1 |
/* Start of Image Comparison */ |
| 2 |
.jltma-image-comparison { |
| 3 |
position: relative; |
| 4 |
} |
| 5 |
.jltma-image-comparison > img { |
| 6 |
width: 100%; |
| 7 |
} |
| 8 |
.jltma-image-comparison > img:last-child { |
| 9 |
position: absolute; |
| 10 |
top: 0; |
| 11 |
} |
| 12 |
.jltma-image-comparison .twentytwenty-handle { |
| 13 |
background: white; |
| 14 |
animation: jltma-image-comparison-pulse 1000ms ease-in-out 0s infinite alternate; |
| 15 |
} |
| 16 |
.jltma-image-comparison .twentytwenty-handle .twentytwenty-left-arrow { |
| 17 |
border-right-color: #4b00e7; |
| 18 |
} |
| 19 |
.jltma-image-comparison .twentytwenty-handle .twentytwenty-right-arrow { |
| 20 |
border-left-color: #4b00e7; |
| 21 |
} |
| 22 |
.jltma-image-comparison .twentytwenty-handle .twentytwenty-down-arrow { |
| 23 |
border-top-color: #4b00e7; |
| 24 |
} |
| 25 |
.jltma-image-comparison .twentytwenty-handle .twentytwenty-up-arrow { |
| 26 |
border-bottom-color: #4b00e7; |
| 27 |
} |
| 28 |
|
| 29 |
@keyframes jltma-image-comparison-pulse { |
| 30 |
0% { |
| 31 |
box-shadow: 0px 0px 2px rgba(61, 61, 61, 0.8), 0 0 0 4px rgba(255, 255, 255, 0.15); |
| 32 |
} |
| 33 |
100% { |
| 34 |
box-shadow: 0px 0px 2px rgba(61, 61, 61, 0.8), 0 0 0 12px rgba(255, 255, 255, 0.3); |
| 35 |
} |
| 36 |
} |
| 37 |
/* End of Image Comparison */ |
