.wpr-pointer-item { position: relative; } .wpr-pointer-double-line .wpr-pointer-item:before, .wpr-pointer-double-line .wpr-pointer-item:after, .wpr-pointer-underline .wpr-pointer-item:after, .wpr-pointer-overline .wpr-pointer-item:before { content: ''; display: block; height: 0px; width: 100%; left: 0; background-color: #55595c; z-index: 2; } .wpr-pointer-fx-none .wpr-pointer-item:before, .wpr-pointer-fx-none .wpr-pointer-item:after { opacity: 0; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } .wpr-pointer-fx-none .wpr-pointer-item:hover:before, .wpr-pointer-fx-none .wpr-pointer-item:hover:after { opacity: 1; } .wpr-pointer-fx-fade .wpr-pointer-item:before, .wpr-pointer-line-fx.wpr-pointer-fx-fade .wpr-pointer-item:after, .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:before, .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:after, .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:before, .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:after { opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .wpr-pointer-line-fx.wpr-pointer-fx-fade .wpr-pointer-item:hover:before, .wpr-pointer-line-fx.wpr-pointer-fx-fade .wpr-pointer-item:hover:after { opacity: 1; } .wpr-pointer-line-fx.wpr-pointer-fx-slide .wpr-pointer-item:before, .wpr-pointer-line-fx.wpr-pointer-fx-slide .wpr-pointer-item:after { width: 0; -webkit-transition: all .3s cubic-bezier(.175,.885,.32,1.075); -o-transition: all .3s cubic-bezier(.175,.885,.32,1.075); transition: all .3s cubic-bezier(.175,.885,.32,1.075); } .wpr-pointer-line-fx.wpr-pointer-fx-slide .wpr-pointer-item:hover:before, .wpr-pointer-line-fx.wpr-pointer-fx-slide .wpr-pointer-item:hover:after { width: 100%; } .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:before, .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:after { position: absolute; width: 0; margin: 0 auto; left: 0; right: 0; -webkit-transition: all .3s cubic-bezier(0, 0, 0.16, 0.95); -o-transition: all .3s cubic-bezier(0, 0, 0.16, 0.95); -webkit-transition: all .3s ease(0, 0, 0.16, 0.95); -o-transition: all .3s ease(0, 0, 0.16, 0.95); transition: all .3s ease(0, 0, 0.16, 0.95); } .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:hover:before, .wpr-pointer-line-fx.wpr-pointer-fx-grow .wpr-pointer-item:hover:after { opacity: 1; width: 100%; } .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:before { position: absolute; top: -10px; } .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:hover:before { top: 0; opacity: 1; } .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:after { position: absolute; bottom: -10px; } .wpr-pointer-line-fx.wpr-pointer-fx-drop .wpr-pointer-item:hover:after { bottom: 0; opacity: 1; } .wpr-pointer-border-fx .wpr-pointer-item:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; opacity: 0; border: 2px solid #000; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .wpr-pointer-border-fx .wpr-pointer-item:hover:before { opacity: 1; } .wpr-pointer-border-fx.wpr-pointer-fx-grow .wpr-pointer-item:before, .wpr-pointer-background-fx.wpr-pointer-fx-grow .wpr-pointer-item:before { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } .wpr-pointer-border-fx.wpr-pointer-fx-shrink .wpr-pointer-item:before, .wpr-pointer-background-fx.wpr-pointer-fx-shrink .wpr-pointer-item:before { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .wpr-pointer-border-fx.wpr-pointer-fx-grow .wpr-pointer-item:hover:before, .wpr-pointer-border-fx.wpr-pointer-fx-shrink .wpr-pointer-item:hover:before, .wpr-pointer-background-fx.wpr-pointer-fx-grow .wpr-pointer-item:hover:before, .wpr-pointer-background-fx.wpr-pointer-fx-shrink .wpr-pointer-item:hover:before, .wpr-pointer-background-fx.wpr-pointer-fx-sweep .wpr-pointer-item:hover:before { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .wpr-pointer-background-fx .wpr-pointer-item:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; opacity: 0; background: #000; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .wpr-pointer-background-fx .wpr-pointer-item:hover:before { opacity: 1; } .wpr-pointer-background-fx.wpr-pointer-fx-sweep .wpr-pointer-item:before { -webkit-transform: translateY(-12%); -ms-transform: translateY(-12%); transform: translateY(-12%); } .wpr-pointer-background-fx.wpr-pointer-fx-skew .wpr-pointer-item:before { -webkit-transform: perspective(600px) rotateX(90deg); transform: perspective(600px) rotateX(90deg); -webkit-transform-origin: center bottom 0; -ms-transform-origin: center bottom 0; transform-origin: center bottom 0; } .wpr-pointer-background-fx.wpr-pointer-fx-skew .wpr-pointer-item:hover:before { -webkit-transform: perspective(600px) rotateX(0deg); transform: perspective(600px) rotateX(0deg); }