%PDF- %PDF-
Direktori : /var/www/tif-dev/wp-content/plugins/fusion-builder/assets/css/shortcodes/ |
Current File : //var/www/tif-dev/wp-content/plugins/fusion-builder/assets/css/shortcodes/flip-boxes.css |
/* stylelint-disable length-zero-no-unit */ /* stylelint-enable length-zero-no-unit */ .fusion-flip-boxes { margin-bottom: 25px; } .fusion-flip-boxes .fusion-column { box-sizing: border-box; } .fusion-flip-boxes .fusion-flip-box { position: relative; z-index: 1; padding: 0; margin: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); } .fusion-flip-boxes .fusion-flip-box .flip-box-inner-wrapper { position: relative; margin-bottom: 15px; perspective: 1000px; } .fusion-flip-boxes .fusion-flip-box .flip-box-back, .fusion-flip-boxes .fusion-flip-box .flip-box-front { display: flex; align-items: center; top: 0; right: 0; left: 0; perspective: 1000px; padding: 27px 20px; text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; background-clip: padding-box; background-position: center; background-repeat: no-repeat; background-size: cover; } .fusion-flip-boxes .fusion-flip-box .flip-box-front { position: relative; bottom: 0; z-index: 10; } .fusion-flip-boxes .fusion-flip-box .flip-box-back { position: absolute; z-index: -1; } .fusion-flip-boxes .fusion-flip-box .flip-box-back .fusion-button { display: table; margin: 20px auto 0; } .fusion-flip-boxes .fusion-flip-box .flip-box-front-inner, .fusion-flip-boxes .fusion-flip-box .flip-box-back-inner { width: 100%; } .fusion-flip-boxes .fusion-flip-box.hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box:hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box:focus .flip-box-back { z-index: 1; } .fusion-flip-boxes .fusion-flip-box.hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box:hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box:focus .flip-box-front { z-index: -1; } .fusion-flip-boxes .fusion-flip-box .flip-box-grafix { display: table; margin: 0 auto 10px; } .fusion-flip-boxes .fusion-flip-box .flip-box-image { table-layout: fixed; width: 100%; } .fusion-flip-boxes .fusion-flip-box .flip-box-circle { height: 64px; width: 64px; border: 1px solid; border-radius: 50%; background-clip: padding-box; } .fusion-flip-boxes .fusion-flip-box .flip-box-circle i { display: table-cell; vertical-align: middle; font-size: 24px; } .fusion-flip-boxes .fusion-flip-box .flip-box-no-circle i { font-size: 60px; } .fusion-flip-boxes .fusion-flip-box .flip-box-heading { margin-top: 0; margin-bottom: 9px; padding-top: 0; } .fusion-flip-boxes .fusion-flip-box .flip-box-heading.without-text { margin-bottom: 0; } .fusion-flip-boxes .fusion-flip-box .flip-box-heading-back { margin-bottom: 9px; margin-top: 0; text-transform: uppercase; } .fusion-flip-boxes .fusion-flip-box .finished-animating { transition: none !important; animation: none !important; } .fusion-flip-boxes .fusion-flip-box.flip-right .flip-box-front { transform: rotateY(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-right .flip-box-back { transform: rotateY(-180deg); } .fusion-flip-boxes .fusion-flip-box.flip-right.hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-right:hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-right:focus .flip-box-back { transform: rotateY(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-right.hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-right:hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-right:focus .flip-box-front { transform: rotateY(180deg); } .fusion-flip-boxes .fusion-flip-box.flip-left .flip-box-front { transform: rotateY(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-left .flip-box-back { transform: rotateY(180deg); } .fusion-flip-boxes .fusion-flip-box.flip-left.hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-left:hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-left:focus .flip-box-back { transform: rotateY(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-left.hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-left:hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-left:focus .flip-box-front { transform: rotateY(-180deg); } .fusion-flip-boxes .fusion-flip-box.flip-up .flip-box-front { transform: rotateX(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-up .flip-box-back { transform: rotateX(-180deg); } .fusion-flip-boxes .fusion-flip-box.flip-up.hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-up:hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-up:focus .flip-box-back { transform: rotateX(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-up.hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-up:hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-up:focus .flip-box-front { transform: rotateX(180deg); } .fusion-flip-boxes .fusion-flip-box.flip-down .flip-box-front { transform: rotateX(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-down .flip-box-back { transform: rotateX(180deg); } .fusion-flip-boxes .fusion-flip-box.flip-down.hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-down:hover .flip-box-back, .fusion-flip-boxes .fusion-flip-box.flip-down:focus .flip-box-back { transform: rotateX(0deg); } .fusion-flip-boxes .fusion-flip-box.flip-down.hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-down:hover .flip-box-front, .fusion-flip-boxes .fusion-flip-box.flip-down:focus .flip-box-front { transform: rotateX(-180deg); } .fusion-flip-boxes.flip-effect-classic .flip-box-back, .fusion-flip-boxes.flip-effect-classic .flip-box-front { transition: transform 0.4s cubic-bezier(0.2, 0.85, 0.4, 1.275); } .fusion-flip-boxes.flip-effect-classic .fusion-flip-box.hover .flip-box-grafix i:before, .fusion-flip-boxes.flip-effect-classic .fusion-flip-box:hover .flip-box-grafix i:before, .fusion-flip-boxes.flip-effect-classic .fusion-flip-box:focus .flip-box-grafix i:before { display: none; } .fusion-flip-boxes.flip-effect-3d .flip-box-inner-wrapper { transform-style: preserve-3d; } .fusion-flip-boxes.flip-effect-3d .flip-box-back, .fusion-flip-boxes.flip-effect-3d .flip-box-front { transform-style: preserve-3d; transition: transform 0.75s ease-in-out; } .fusion-flip-boxes.flip-effect-3d .flip-box-front-inner, .fusion-flip-boxes.flip-effect-3d .flip-box-back-inner { transform: translateZ(50px) scale(0.9); } .ua-edge .fusion-flip-boxes .fusion-flip-box.hover .flip-box-back, .ua-edge .fusion-flip-boxes .fusion-flip-box:hover .flip-box-back, .ua-edge .fusion-flip-boxes .fusion-flip-box:focus .flip-box-back { transform: rotateY(0deg); z-index: 1; } .ua-edge .fusion-flip-boxes .fusion-flip-box.hover .flip-box-front, .ua-edge .fusion-flip-boxes .fusion-flip-box:hover .flip-box-front, .ua-edge .fusion-flip-boxes .fusion-flip-box:focus .flip-box-front { transform: rotateY(180deg); z-index: -1; }