/
var
/
www
/
barefootlaw.org
/
wp-content
/
plugins
/
vc-shortcodes
/
shortcodes
/
hover-effects
/
css
/
Upload File
HOME
.ahe-caption { list-style: outside none none !important; margin: 0 !important; padding: 0; width: 100%; } .caption_li { float: left; } .wcp-caption-plugin { margin: 5px 0; } .wcp-caption-plugin .image-caption-box { cursor: pointer; overflow: visible; position: relative; width: 100%; } .centered-text { display: table-cell !important; vertical-align: middle !important; } .wcp-caption-plugin .image-caption-box img { max-width: 100% !important; position: relative; transition: all 1s ease-out 0s; } .wcp-caption-plugin .image-caption-box .caption { background-color: rgba(0, 0, 0, 0.5); color: #fff; height: 100%; position: absolute; transition: all 1s ease-out 0s; width: 100%; z-index: 100; } .wcp-caption-plugin .image-caption-box .captionna { pointer-events: none !important; } .wcp-caption-plugin .image-caption-box .no-effect { display: block; top: 0; transition: none 0s ease 0s ; visibility: hidden; } .wcp-caption-plugin .image-caption-box:hover .no-effect { visibility: visible; } .wcp-caption-plugin .image-caption-box .simple-fade { display: block; opacity: 0 !important; top: 0; transition: all 1s ease 0s; } .wcp-caption-plugin .image-caption-box:hover .simple-fade { opacity: 1 !important; } .wcp-caption-plugin .image-caption-box .slide-top-to-bottom { bottom: -100%; display: block; } .wcp-caption-plugin .image-caption-box:hover .slide-top-to-bottom { transform: translateY(-100%); } .wcp-caption-plugin .image-caption-box .slide-bottom-to-top { display: block; top: -100%; } .wcp-caption-plugin .image-caption-box:hover .slide-bottom-to-top { transform: translateY(100%); } .wcp-caption-plugin .image-caption-box .caption-slide-up { display: block; top: 0; } .wcp-caption-plugin .image-caption-box:hover .caption-slide-up { transform: translateY(-100%); } .wcp-caption-plugin .image-caption-box .slide-left-to-right { display: block; left: -100%; } .wcp-caption-plugin .image-caption-box:hover .slide-left-to-right { transform: translateX(100%); } .wcp-caption-plugin .image-caption-box .slide-right-to-left { display: block; right: -100%; } .wcp-caption-plugin .image-caption-box:hover .slide-right-to-left { transform: translateX(-100%); } .wcp-caption-plugin .image-caption-box .image-flip-up { display: block; top: 0; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-flip-up ~ img { z-index: 101; } .wcp-caption-plugin .image-caption-box:hover .image-flip-up ~ img { transform: translateY(-100%); } .wcp-caption-plugin .image-caption-box .image-flip-down { display: block; top: 0; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-flip-down ~ img { z-index: 101; } .wcp-caption-plugin .image-caption-box:hover .image-flip-down ~ img { transform: translateY(100%); } .wcp-caption-plugin .image-caption-box .image-flip-right { display: block; top: 0; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-flip-right ~ img { z-index: 101; } .wcp-caption-plugin .image-caption-box:hover .image-flip-right ~ img { transform: translateX(100%); } .wcp-caption-plugin .image-caption-box .image-flip-left { display: block; top: 0; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-flip-left ~ img { z-index: 101; } .wcp-caption-plugin .image-caption-box:hover .image-flip-left ~ img { transform: translateX(-100%); } .wcp-caption-plugin .image-caption-box .rotate-image-down { display: block; top: 0; z-index: 0; } .wcp-caption-plugin .image-caption-box .rotate-image-down ~ img { transform-origin: right bottom 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .rotate-image-down ~ img { transform: rotate(180deg); } .wcp-caption-plugin .image-caption-box .image-turn-around { backface-visibility: hidden; display: block; top: 0; transform: rotateY(180deg); transition: all 0.5s ease-in-out 0s; } .wcp-caption-plugin .image-caption-box .image-turn-around ~ img { backface-visibility: hidden; transform-style: preserve-3d; transition: all 0.5s ease-in-out 0s; } .wcp-caption-plugin .image-caption-box:hover .image-turn-around ~ img { backface-visibility: hidden; transform: rotateY(-180deg); } .wcp-caption-plugin .image-caption-box:hover .image-turn-around { backface-visibility: hidden; transform: rotateY(0deg); } .wcp-caption-plugin .image-caption-box .zoom-and-pan { display: block; top: 0; transform: scale(0.01); transition: all 0.5s ease 0s; z-index: 3; } .wcp-caption-plugin .image-caption-box .zoom-and-pan ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .zoom-and-pan ~ img { transform: scale(10); } .wcp-caption-plugin .image-caption-box:hover .zoom-and-pan { transform: scale(1); } .wcp-caption-plugin .image-caption-box .tilt-image { display: block; transform: scale(0.01); transition: all 0.5s ease 0s; } .wcp-caption-plugin .image-caption-box .tilt-image ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .tilt-image ~ img { transform: rotate(-10deg); } .wcp-caption-plugin .image-caption-box:hover .tilt-image { transform: rotate(-10deg); } .wcp-caption-plugin .image-caption-box .morph { border-radius: 50%; display: block; transform: rotate(360deg); transition: all 0.5s ease 0s; z-index: 0; } .wcp-caption-plugin .image-caption-box .morph ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .morph ~ img { border-radius: 50%; transform: rotate(360deg); } .wcp-caption-plugin .image-caption-box:hover .morph { border-radius: 0; transform: rotate(0deg); z-index: 3; } .wcp-caption-plugin .image-caption-box .move-image-right { display: block; transform: translateX(-100%); transition: all 0.5s ease 0s; z-index: 0; } .wcp-caption-plugin .image-caption-box .move-image-right ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .move-image-right ~ img { transform: translateX(100%); } .wcp-caption-plugin .image-caption-box:hover .move-image-right { transform: translateX(0px); } .wcp-caption-plugin .image-caption-box .move-image-left { display: block; transform: translateX(100%); transition: all 0.5s ease 0s; z-index: 0; } .wcp-caption-plugin .image-caption-box .move-image-left ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .move-image-left ~ img { transform: translateX(-100%); } .wcp-caption-plugin .image-caption-box:hover .move-image-left { transform: translateX(0px); } .wcp-caption-plugin .image-caption-box .move-image-top { display: block; transform: translateY(100%); transition: all 0.5s ease 0s; z-index: 0; } .wcp-caption-plugin .image-caption-box .move-image-top ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .move-image-top ~ img { transform: translateY(-100%); } .wcp-caption-plugin .image-caption-box:hover .move-image-top { transform: translateY(0px); } .wcp-caption-plugin .image-caption-box .move-image-bottom { display: block; transform: translateY(-100%); transition: all 0.5s ease 0s; z-index: 0; } .wcp-caption-plugin .image-caption-box .move-image-bottom ~ img { backface-visibility: hidden; transition: all 0.5s ease 0s; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .move-image-bottom ~ img { transform: translateY(100%); } .wcp-caption-plugin .image-caption-box:hover .move-image-bottom { transform: translateY(0px); } .wcp-caption-plugin .image-caption-box .image-squeez-right { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-squeez-right ~ img { backface-visibility: hidden; transform-origin: right center 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .image-squeez-right ~ img { transform: scaleX(0); transform-origin: right center 0; } .wcp-caption-plugin .image-caption-box .image-squeez-left { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-squeez-left ~ img { backface-visibility: hidden; transform-origin: left center 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .image-squeez-left ~ img { transform: scaleX(0); transform-origin: left center 0; } .wcp-caption-plugin .image-caption-box .image-squeez-top { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-squeez-top ~ img { backface-visibility: hidden; transform-origin: center top 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .image-squeez-top ~ img { transform: scaleY(0); transform-origin: center top 0; } .wcp-caption-plugin .image-caption-box .image-squeez-bottom { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .image-squeez-bottom ~ img { backface-visibility: hidden; transform-origin: center bottom 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .image-squeez-bottom ~ img { transform: scaleY(0); transform-origin: center bottom 0; } .wcp-caption-plugin .image-caption-box .fall-down-caption { backface-visibility: hidden; display: block; opacity: 1; transform: scale(1, 1) rotate(0deg); transform-origin: 100% 200% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .fall-down-caption ~ img { z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .fall-down-caption { opacity: 0; transform: scale(0, 0) rotate(270deg); transform-origin: 200% 500% 0; } .wcp-caption-plugin .image-caption-box .fall-down-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .fall-down-image ~ img { backface-visibility: hidden; opacity: 1; transform: scale(1, 1) rotate(0deg); transform-origin: 100% 200% 0; } .wcp-caption-plugin .image-caption-box:hover .fall-down-image ~ img { opacity: 0; transform: scale(0, 0) rotate(270deg); transform-origin: 200% 500% 0; } .wcp-caption-plugin .image-caption-box .swap-caption { backface-visibility: hidden; opacity: 0; transform: scale(0, 0) translate(-700px, 0px); transform-origin: 0 100% 0; } .wcp-caption-plugin .image-caption-box .swap-caption ~ img { display: block; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .swap-caption { opacity: 1; transform: scale(1, 1) translate(0px, 0px); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box .swap-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .swap-image ~ img { backface-visibility: hidden; opacity: 0; transform: scale(0, 0) translate(-700px, 0px); transform-origin: 0 100% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .swap-image ~ img { opacity: 1; transform: scale(1, 1) translate(0px, 0px); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box .puffin-caption { backface-visibility: hidden; opacity: 0 !important; transform: scale(2, 2); transform-origin: 50% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .puffin-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .puffin-caption { opacity: 1 !important; transform: scale(1, 1); transform-origin: 50% 50% 0; } .wcp-caption-plugin .image-caption-box .puffin-image { display: block; opacity: 1 !important; z-index: 0; } .wcp-caption-plugin .image-caption-box .puffin-image ~ img { opacity: 0; transform: scale(2, 2); transform-origin: 50% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .puffin-image ~ img { opacity: 1 !important; transform: scale(1, 1); transform-origin: 50% 50% 0; } .wcp-caption-plugin .image-caption-box .puffout-caption { opacity: 1 !important; transform: scale(1, 1); transform-origin: 50% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .puffout-caption ~ img { display: block; opacity: 1 !important; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .puffout-caption { opacity: 0 !important; transform: scale(2, 2); transform-origin: 50% 50% 0; } .wcp-caption-plugin .image-caption-box .puffout-image { display: block; opacity: 1 !important; z-index: 0; } .wcp-caption-plugin .image-caption-box .puffout-image ~ img { opacity: 1 !important; transform: scale(1, 1); transform-origin: 50% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .puffout-image ~ img { opacity: 0 !important; transform: scale(2, 2); transform-origin: 50% 50% 0; } .wcp-caption-plugin .image-caption-box .opendoordown-caption { transform: perspective(800px) rotateX(0deg); transform-origin: 0 100% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .opendoordown-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .opendoordown-caption { transform: perspective(800px) rotateX(-180deg); transform-origin: 0 100% 0; } .wcp-caption-plugin .image-caption-box .opendoordown-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .opendoordown-image ~ img { transform: perspective(800px) rotateX(0deg); transform-origin: 0 100% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .opendoordown-image ~ img { transform: perspective(800px) rotateX(-180deg); transform-origin: 0 100% 0; } .wcp-caption-plugin .image-caption-box .opendoorup-caption { transform: perspective(800px) rotateX(0deg); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .opendoorup-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .opendoorup-caption { transform: perspective(800px) rotateX(180deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box .opendoorup-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .opendoorup-image ~ img { transform: perspective(800px) rotateX(0deg); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .opendoorup-image ~ img { transform: perspective(800px) rotateX(180deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box .opendoorright-caption { transform: perspective(800px) rotateY(0deg); transform-origin: 100% 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .opendoorright-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .opendoorright-caption { transform: perspective(800px) rotateY(180deg); transform-origin: 100% 0 0; } .wcp-caption-plugin .image-caption-box .opendoorright-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .opendoorright-image ~ img { transform: perspective(800px) rotateY(0deg); transform-origin: 100% 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .opendoorright-image ~ img { transform: perspective(800px) rotateY(180deg); transform-origin: 100% 0 0; } .wcp-caption-plugin .image-caption-box .opendoorleft-caption { transform: perspective(800px) rotateY(0deg); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .opendoorleft-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .opendoorleft-caption { transform: perspective(800px) rotateY(-180deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box .opendoorleft-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .opendoorleft-image ~ img { transform: perspective(800px) rotateY(0deg); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .opendoorleft-image ~ img { transform: perspective(800px) rotateY(-180deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box .rotatedown-caption { opacity: 1 !important; transform: perspective(800px) rotateX(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .rotatedown-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .rotatedown-caption { opacity: 0 !important; transform: perspective(800px) rotateX(-180deg) translateZ(300px); transform-origin: 50% 100% 0; } .wcp-caption-plugin .image-caption-box .rotatedown-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .rotatedown-image ~ img { opacity: 1 !important; transform: perspective(800px) rotateX(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .rotatedown-image ~ img { opacity: 0 !important; transform: perspective(800px) rotateX(-180deg) translateZ(300px); transform-origin: 50% 100% 0; } .wcp-caption-plugin .image-caption-box .rotateup-caption { opacity: 1 !important; transform: perspective(800px) rotateX(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .rotateup-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .rotateup-caption { opacity: 0 !important; transform: perspective(800px) rotateX(180deg) translateZ(100px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .rotateup-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .rotateup-image ~ img { opacity: 1 !important; transform: perspective(800px) rotateX(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .rotateup-image ~ img { opacity: 0 !important; transform: perspective(800px) rotateX(180deg) translateZ(100px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .rotateright-caption { opacity: 1 !important; transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .rotateright-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .rotateright-caption { opacity: 0 !important; transform: perspective(800px) rotateY(-180deg) translateZ(150px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .rotateright-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .rotateright-image ~ img { opacity: 1 !important; transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .rotateright-image ~ img { opacity: 0 !important; transform: perspective(800px) rotateY(-180deg) translateZ(150px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .rotateleft-caption { opacity: 1 !important; transform: perspective(800px) rotateY(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .rotateleft-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .rotateleft-caption { opacity: 0 !important; transform: perspective(800px) rotateY(180deg) translateZ(100px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .rotateleft-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .rotateleft-image ~ img { opacity: 1 !important; transform: perspective(800px) rotateY(0deg) translateZ(0px); transform-origin: 0 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .rotateleft-image ~ img { opacity: 0 !important; transform: perspective(800px) rotateY(180deg) translateZ(300px); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .spaceoutup-caption { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 50% 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .spaceoutup-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .spaceoutup-caption { opacity: 0 !important; transform: scale(0.2) translate(0%, -200%); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .spaceoutup-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .spaceoutup-image ~ img { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 50% 0 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .spaceoutup-image ~ img { opacity: 0 !important; transform: scale(0.2) translate(0%, -200%); transform-origin: 50% 0 0; } .wcp-caption-plugin .image-caption-box .spaceoutdown-caption { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 50% 100% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .spaceoutdown-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .spaceoutdown-caption { opacity: 0 !important; transform: scale(0.2) translate(0%, 200%); transform-origin: 50% 100% 0; } .wcp-caption-plugin .image-caption-box .spaceoutdown-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .spaceoutdown-image ~ img { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 50% 100% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .spaceoutdown-image ~ img { opacity: 0 !important; transform: scale(0.2) translate(0%, 200%); transform-origin: 50% 100% 0; } .wcp-caption-plugin .image-caption-box .spaceoutright-caption { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 100% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .spaceoutright-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .spaceoutright-caption { opacity: 0 !important; transform: scale(0.2) translate(200%, 0%); transform-origin: 100% 50% 0; } .wcp-caption-plugin .image-caption-box .spaceoutright-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .spaceoutright-image ~ img { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 100% 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .spaceoutright-image ~ img { opacity: 0 !important; transform: scale(0.2) translate(200%, 0%); transform-origin: 100% 50% 0; } .wcp-caption-plugin .image-caption-box .spaceoutleft-caption { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 0 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box .spaceoutleft-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .spaceoutleft-caption { opacity: 0 !important; transform: scale(0.2) translate(-200%, 0%); transform-origin: 0 50% 0; } .wcp-caption-plugin .image-caption-box .spaceoutleft-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .spaceoutleft-image ~ img { opacity: 1 !important; transform: scale(1) translate(0%, 0%); transform-origin: 0 50% 0; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .spaceoutleft-image ~ img { opacity: 0 !important; transform: scale(0.2) translate(-200%, 0%); transform-origin: 0 50% 0; } .wcp-caption-plugin .image-caption-box .foolish-caption { animation-duration: 1s; animation-name: foolishIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box .foolish-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .foolish-caption { animation-duration: 1s; animation-name: foolishOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .foolish-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .foolish-image ~ img { animation-duration: 1s; animation-name: foolishIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .foolish-image ~ img { animation-duration: 1s; animation-name: foolishOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinright-caption { animation-duration: 1s; animation-name: tinRightIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box .tinright-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .tinright-caption { animation-duration: 1s; animation-name: tinRightOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinright-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .tinright-image ~ img { animation-duration: 1s; animation-name: tinRightIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .tinright-image ~ img { animation-duration: 1s; animation-name: tinRightOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinleft-caption { animation-duration: 1s; animation-name: tinLeftIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box .tinleft-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .tinleft-caption { animation-duration: 1s; animation-name: tinLeftOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinleft-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .tinleft-image ~ img { animation-duration: 1s; animation-name: tinLeftIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .tinleft-image ~ img { animation-duration: 1s; animation-name: tinLeftOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinup-caption { animation-duration: 1s; animation-name: tinUpIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box .tinup-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .tinup-caption { animation-duration: 1s; animation-name: tinUpOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tinup-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .tinup-image ~ img { animation-duration: 1s; animation-name: tinUpIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .tinup-image ~ img { animation-duration: 1s; animation-name: tinUpOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tindown-caption { animation-duration: 1s; animation-name: tinDownIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box .tindown-caption ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .tindown-caption { animation-duration: 1s; animation-name: tinDownOut; opacity: 0 !important; } .wcp-caption-plugin .image-caption-box .tindown-image { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box .tindown-image ~ img { animation-duration: 1s; animation-name: tinDownIn; opacity: 1 !important; z-index: 2; } .wcp-caption-plugin .image-caption-box:hover .tindown-image ~ img { animation-duration: 1s; animation-name: tinDownOut; opacity: 0 !important; } @keyframes foolishOut { 0% { opacity: 1; transform: scale(1, 1) rotate(360deg); transform-origin: 50% 50% 0; } 20% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 0 0; } 40% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 100% 0 0; } 60% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 50% 0; } 80% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 100% 0; } 100% { opacity: 0; transform: scale(0, 0) rotate(0deg); transform-origin: 50% 50% 0; } } @keyframes foolishIn { 0% { opacity: 0; transform: scale(0, 0) rotate(360deg); transform-origin: 50% 50% 0; } 20% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 100% 0; } 40% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 100% 100% 0; } 60% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 50% 0; } 80% { opacity: 1; transform: scale(0.5, 0.5) rotate(0deg); transform-origin: 0 0 0; } 100% { opacity: 1; transform: scale(1, 1) rotate(0deg); transform-origin: 50% 50% 0; } } @keyframes tinRightOut { 0%, 20%, 40%, 50% { opacity: 1; transform: scale(1, 1) translateX(0px); } 10%, 30% { opacity: 1; transform: scale(1.1, 1.1) translateX(0px); } 100% { opacity: 0; transform: scale(1, 1) translateX(900%); } } @keyframes tinLeftOut { 0%, 20%, 40%, 50% { opacity: 1; transform: scale(1, 1) translateX(0px); } 10%, 30% { opacity: 1; transform: scale(1.1, 1.1) translateX(0px); } 100% { opacity: 0; transform: scale(1, 1) translateX(-900%); } } @keyframes tinUpOut { 0%, 20%, 40%, 50% { opacity: 1; transform: scale(1, 1) translateY(0px); } 10%, 30% { opacity: 1; transform: scale(1.1, 1.1) translateY(0px); } 100% { opacity: 0; transform: scale(1, 1) translateY(-900%); } } @keyframes tinDownOut { 0%, 20%, 40%, 50% { opacity: 1; transform: scale(1, 1) translateY(0px); } 10%, 30% { opacity: 1; transform: scale(1.1, 1.1) translateY(0px); } 100% { opacity: 0; transform: scale(1, 1) translateY(900%); } } @keyframes tinRightIn { 0% { opacity: 0; transform: scale(1, 1) translateX(900%); } 50%, 70%, 90% { opacity: 1; transform: scale(1.1, 1.1) translateX(0px); } 60%, 80%, 100% { opacity: 1; transform: scale(1, 1) translateX(0px); } } @keyframes tinLeftIn { 0% { opacity: 0; transform: scale(1, 1) translateX(-900%); } 50%, 70%, 90% { opacity: 1; transform: scale(1.1, 1.1) translateX(0px); } 60%, 80%, 100% { opacity: 1; transform: scale(1, 1) translateX(0px); } } @keyframes tinUpIn { 0% { opacity: 0; transform: scale(1, 1) translateY(-900%); } 50%, 70%, 90% { opacity: 1; transform: scale(1.1, 1.1) translateY(0px); } 60%, 80%, 100% { opacity: 1; transform: scale(1, 1) translateY(0px); } } @keyframes tinDownIn { 0% { opacity: 0; transform: scale(1, 1) translateY(900%); } 50%, 70%, 90% { opacity: 1; transform: scale(1.1, 1.1) translateY(0px); } 60%, 80%, 100% { opacity: 1; transform: scale(1, 1) translateY(0px); } } .wcp-caption-plugin .image-caption-box .zoom-in { opacity: 0; transform: scale(0); } .wcp-caption-plugin .image-caption-box .zoom-in ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-in { opacity: 1; transform: scale(1); } .wcp-caption-plugin .image-caption-box .zoom-out { opacity: 0; transform: scale(5); } .wcp-caption-plugin .image-caption-box .zoom-out ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-out { opacity: 1; transform: scale(1); } .wcp-caption-plugin .image-caption-box .zoom-in-twist { opacity: 0; transform: scale(0) rotateZ(-720deg); } .wcp-caption-plugin .image-caption-box .zoom-in-twist ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-in-twist { opacity: 1; transform: scale(1) rotateZ(0deg); } .wcp-caption-plugin .image-caption-box .zoom-out-twist { opacity: 0; transform: scale(5) rotateZ(720deg); } .wcp-caption-plugin .image-caption-box .zoom-out-twist ~ img { display: block; z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-out-twist { opacity: 1; transform: scale(1) rotateZ(0deg); } .wcp-caption-plugin .image-caption-box .zoom-caption-in-image-out { opacity: 0; transform: scale(0); } .wcp-caption-plugin .image-caption-box .zoom-caption-in-image-out ~ img { display: block; transform: scale(1); z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-caption-in-image-out { opacity: 1; transform: scale(1); } .wcp-caption-plugin .image-caption-box:hover .zoom-caption-in-image-out ~ img { opacity: 0; transform: scale(0); } .wcp-caption-plugin .image-caption-box .zoom-caption-out-image-in { opacity: 0; transform: scale(5); } .wcp-caption-plugin .image-caption-box .zoom-caption-out-image-in ~ img { display: block; transform: scale(1); z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-caption-out-image-in { opacity: 1; transform: scale(1); } .wcp-caption-plugin .image-caption-box:hover .zoom-caption-out-image-in ~ img { opacity: 0; transform: scale(5); } .wcp-caption-plugin .image-caption-box .zoom-image-out-caption-twist { opacity: 0; transform: scale(0) rotateZ(-720deg); } .wcp-caption-plugin .image-caption-box .zoom-image-out-caption-twist ~ img { display: block; transform: scale(1); z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-image-out-caption-twist { opacity: 1; transform: scale(1) rotateZ(0deg); } .wcp-caption-plugin .image-caption-box:hover .zoom-image-out-caption-twist ~ img { opacity: 0; transform: scale(0); } .wcp-caption-plugin .image-caption-box .zoom-image-in-caption-twist { opacity: 0; transform: scale(5) rotateZ(720deg); } .wcp-caption-plugin .image-caption-box .zoom-image-in-caption-twist ~ img { display: block; transform: scale(1); z-index: 0; } .wcp-caption-plugin .image-caption-box:hover .zoom-image-in-caption-twist { opacity: 1; transform: scale(1) rotateZ(0deg); } .wcp-caption-plugin .image-caption-box:hover .zoom-image-in-caption-twist ~ img { opacity: 0; transform: scale(5); } .wcp-caption-plugin .image-caption-box .flip-image-vertical, .wcp-caption-plugin .image-caption-box .flip-image-vertical-back, .wcp-caption-plugin .image-caption-box .flip-image-horizontal, .wcp-caption-plugin .image-caption-box .flip-image-horizontal-back { backface-visibility: hidden; transition: all 0.5s ease-in-out 0s; } .wcp-caption-plugin .image-caption-box .flip-image-vertical ~ img, .wcp-caption-plugin .image-caption-box .flip-image-vertical-back ~ img, .wcp-caption-plugin .image-caption-box .flip-image-horizontal ~ img, .wcp-caption-plugin .image-caption-box .flip-image-horizontal-back ~ img { backface-visibility: hidden; transform-style: preserve-3d; transition: all 0.5s ease-in-out 0s; } .wcp-caption-plugin .image-caption-box .flip-image-vertical { transform: rotateX(180deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-vertical { backface-visibility: hidden; transform: rotateX(0deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-vertical ~ img { backface-visibility: hidden; transform: rotateX(-180deg); } .wcp-caption-plugin .image-caption-box .flip-image-vertical-back { transform: rotateX(-180deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-vertical-back { backface-visibility: hidden; transform: rotateX(0deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-vertical-back ~ img { backface-visibility: hidden; transform: rotateX(180deg); } .wcp-caption-plugin .image-caption-box .flip-image-horizontal { transform: rotateY(180deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-horizontal { backface-visibility: hidden; transform: rotateY(0deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-horizontal ~ img { backface-visibility: hidden; transform: rotateY(-180deg); } .wcp-caption-plugin .image-caption-box .flip-image-horizontal-back { transform: rotateY(-180deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-horizontal-back { backface-visibility: hidden; transform: rotateY(0deg); } .wcp-caption-plugin .image-caption-box:hover .flip-image-horizontal-back ~ img { backface-visibility: hidden; transform: rotateY(180deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-top { opacity: 0; transform: rotateX(90deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-top { opacity: 1; transform: rotateX(0deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-top ~ img { opacity: 1; transform: rotateX(0deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-top ~ img { opacity: 0; transform: rotateX(-90deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-bottom { opacity: 0; transform: rotateX(-90deg); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-bottom { opacity: 1; transform: rotateX(0deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-bottom ~ img { opacity: 1; transform: rotateX(0deg); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-bottom ~ img { opacity: 0; transform: rotateX(90deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-left { opacity: 0; transform: rotateY(-90deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-left { opacity: 1; transform: rotateY(0deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-left ~ img { opacity: 1; transform: rotateY(0deg); transform-origin: 0 0 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-left ~ img { opacity: 0; transform: rotateY(90deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-right { opacity: 0; transform: rotateY(90deg); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-right { opacity: 1; transform: rotateY(0deg); } .wcp-caption-plugin .image-caption-box .page-turn-from-right ~ img { opacity: 1; transform: rotateY(0deg); transform-origin: 100% 100% 0; } .wcp-caption-plugin .image-caption-box:hover .page-turn-from-right ~ img { opacity: 0; transform: rotateY(-90deg); }