芝麻web文件管理V1.00
编辑当前文件:/var/www/cognitio.in/wp-content/plugins/Ultimate_VC_Addons/assets/css/advanced-buttons.css
@charset "utf-8"; .ubtn { border: inherit; -webkit-border-radius: none; border-radius: none; font-size: 12px; font-weight: normal; line-height: 1.4em; color: inherit; background: transparent; cursor: pointer; display: inline-block; margin: 0px; padding: 25px 80px; outline: 0; text-align: center; text-decoration: none; position: relative; -webkit-transition: all .3s; transition: all .3s; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; z-index: 1; max-width: 100%; visibility: visible; -webkit-backface-visibility: hidden; backface-visibility: hidden } .ubtn:after { content: ''; position: absolute; z-index: -1; -webkit-transition: all .3s; transition: all .3s } .ubtn-data { z-index: 3; position: inherit; display: block; font-family: inherit; font-weight: inherit; font-size: inherit; color: inherit } button.ubtn { background: inherit; color: inherit } button.ubtn:hover, button.ubtn:focus, button.ubtn:active, button.ubtn:visited { color: inherit; background: inherit; -webkit-box-shadow: inherit; box-shadow: inherit; outline: 0 } /*.ubtn-right { float: right }*/ .ubtn-ctn-left { display: block; text-align: left } .ubtn-ctn-center { display: block; text-align: center } .ubtn-ctn-right { display: block; text-align: right } .ubtn-ctn-inline { display: inline-block; text-align: center } a.ubtn-link { display: inline-block; margin:0px; color: inherit; text-decoration: none; max-width: 100% } a.ubtn-link:hover { color: inherit; text-decoration: none } a.ubtn-link .ubtn { margin: 0 } button.ubtn-mini { padding: 5px 10px } button.ubtn-small { padding: 8px 16px } button.ubtn-normal { padding: 15px 30px } button.ubtn-large { padding: 21px 42px } .ubtn-block { display: block; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0; padding-right: 0 } button.ubtn-custom { padding: 0 } @media(max-width:768px) { .ubtn-small { padding: 6px 12px } .ubtn-normal { padding: 10px 24px } .ubtn-large { padding: 12px 36px } } .ubtn-shd { -webkit-border-radius: 5px; border-radius: 5px; background: #eaeaea; -webkit-box-shadow: 0 5px #bebebe; box-shadow: 0 5px #bebebe; -webkit-transition: none !important; transition: none !important } .ubtn-sep-icon .ubtn-icon { position: absolute; top: 50%; opacity: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); line-height: 1; -webkit-transition: all .3s; transition: all .3s } .ubtn-sep-icon:hover .ubtn-icon { opacity: 1 } .ubtn-sep-icon .ubtn-icon span { line-height: inherit; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .ubtn.ubtn-sep-icon.ubtn-only-icon .ubtn-icon { position: relative; left: 0; top: 0; right: 0; bottom: 0; -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0) } .ubtn-sep-icon.ubtn-sep-icon-at-left .ubtn-icon { left: 20px; opacity: 1 } .ubtn-img-container .ubtn-sep-icon.ubtn-sep-icon-at-left .ubtn-icon { left: 20px; opacity: 1 } .ubtn-img-container .ubtn-sep-icon.ubtn-sep-icon-at-right .ubtn-icon { right: 20px; opacity: 1 } .ubtn-sep-icon.ubtn-sep-icon-at-right .ubtn-icon { right: 20px; opacity: 1 } .ubtn-sep-icon-left .ubtn-icon { left: -2em } .ubtn-sep-icon-left:hover .ubtn-icon { left: 10px } .ubtn-img-container .ubtn-sep-icon-left:hover .ubtn-icon { left: 10px } .ubtn-sep-icon-left-rev .ubtn-icon { left: 4em } .ubtn-sep-icon-left-rev:hover .ubtn-icon { left: 20px } .ubtn-sep-icon-right .ubtn-icon { right: -2em } .ubtn-img-container .ubtn-sep-icon-right:hover .ubtn-icon { right: 30px } .ubtn-sep-icon-right:hover .ubtn-icon { right: 5px } .ubtn-sep-icon-right-rev .ubtn-icon { right: 4em } .ubtn-sep-icon-right-rev:hover .ubtn-icon { right: 20px } .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-icon { position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); line-height: 1 } .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-icon i, .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-icon i, .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-icon i, .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-icon i { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-text { display: inline-block; -webkit-transform: translateX(0) translateY(0); -ms-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0) } .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-icon { top: -500px } .ubtn-sep-icon.ubtn-sep-icon-top-push:hover .ubtn-icon { top: 0 } .ubtn-sep-icon.ubtn-sep-icon-top-push:hover .ubtn-text { display: inline-block; -webkit-transform: translateY(500px); -ms-transform: translateY(500px); transform: translateY(500px) } .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-top-push:hover .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-top-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-top-push:hover .ubtn-text { -webkit-transition: all .45s; transition: all .45s } .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-icon { top: 500px } .ubtn-sep-icon.ubtn-sep-icon-bottom-push:hover .ubtn-icon { top: 0 } .ubtn-sep-icon.ubtn-sep-icon-bottom-push:hover .ubtn-text { display: inline-block; -webkit-transform: translateY(-500px); -ms-transform: translateY(-500px); transform: translateY(-500px) } .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-bottom-push:hover .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-bottom-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-bottom-push:hover .ubtn-text { -webkit-transition: all .45s; transition: all .45s } .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-icon { left: -500px } .ubtn-sep-icon.ubtn-sep-icon-left-push:hover .ubtn-icon { left: 0 } .ubtn-sep-icon.ubtn-sep-icon-left-push:hover .ubtn-text { display: inline-block; -webkit-transform: translateX(500px); -ms-transform: translateX(500px); transform: translateX(500px) } .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-left-push:hover .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-left-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-left-push:hover .ubtn-text { -webkit-transition: all .6s; transition: all .6s } .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-icon { left: 500px } .ubtn-sep-icon.ubtn-sep-icon-right-push:hover .ubtn-icon { left: 0 } .ubtn-sep-icon.ubtn-sep-icon-right-push:hover .ubtn-text { display: inline-block; -webkit-transform: translateX(-500px); -ms-transform: translateX(-500px); transform: translateX(-500px) } .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-right-push:hover .ubtn-icon, .ubtn-sep-icon.ubtn-sep-icon-right-push .ubtn-text, .ubtn-sep-icon.ubtn-sep-icon-right-push:hover .ubtn-text { -webkit-transition: all .6s; transition: all .6s } .ubtn-hover { width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; position: absolute; background: transparent; z-index: 2; -webkit-transition: all .3s; transition: all .3s; -webkit-border-radius:inherit; border-radius:inherit; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .ubtn-fade-bg .ubtn-hover { background: rgba(255, 255, 255, 0); opacity: 0 } .ubtn-fade-bg:hover .ubtn-hover { opacity: 1 } .ubtn-top-bg .ubtn-hover { top: -100%; background: #CCC } .ubtn-top-bg:hover .ubtn-hover { top: 0 } .ubtn-bottom-bg .ubtn-hover { top: 100%; background: #CCC } .ubtn-bottom-bg:hover .ubtn-hover { top: 0 } .ubtn-left-bg .ubtn-hover { left: -100%; background: #CCC } .ubtn-left-bg:hover .ubtn-hover { left: 0 } .ubtn-right-bg .ubtn-hover { left: 100%; background: #CCC } .ubtn-right-bg:hover .ubtn-hover { left: 0 } .ubtn-center-hz-bg .ubtn-hover { width: 0; height: 103%; top: 50%; left: 50%; background: #CCC; opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .ubtn-center-hz-bg:hover .ubtn-hover { width: 90%; opacity: 1 } .ubtn-center-hz-bg:active .ubtn-hover { width: 101%; opacity: 1 } .ubtn-center-vt-bg .ubtn-hover { width: 101%; height: 0; top: 50%; left: 50%; background: #CCC; opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .ubtn-center-vt-bg:hover .ubtn-hover { height: 75%; opacity: 1 } .ubtn-center-vt-bg:active .ubtn-hover { height: 130%; opacity: 1 } .ubtn-center-dg-bg .ubtn-hover { width: 100%; height: 0; top: 50%; left: 50%; background: #CCC; opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg) } .ubtn-center-dg-bg:hover .ubtn-hover { height: 260%; opacity: 1 } .ubtn-center-dg-bg:active .ubtn-hover { height: 400%; opacity: 1 } .no-ubtn-shadow { -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-transition: all 50ms linear !important; transition: all 50ms linear !important } .ubtn-img-container { position: relative } .ubtn-img-container img { position: relative; display: block; max-width: 100%; border: 0; -webkit-box-shadow: none; box-shadow: none; margin: 0 auto; padding: 0 } .ubtn-img-container .ubtn { position: relative; display: block ; margin: 0 auto ; top: 0; left: 0 ; -webkit-transform: none; -ms-transform: none ; transform: none ; } .ubtn-img-container .ubtn.ubtn-right { /* -webkit-transform: translateX(0%) translateY(-50%); -moz-transform: translateX(0%) translateY(-50%); transform: translateX(0%) translateY(-50%);*/ /* Raju changes */ right: 0; margin-right: 0; left: initial; } .ubtn-img-container .ubtn.ubtn-left { /* -webkit-transform: translateX(0%) translateY(-50%); -moz-transform: translateX(0%) translateY(-50%); transform: translateX(0%) translateY(-50%);*/ /* Raju changes */ left: 0; margin-left: 0; right: initial; } .ubtn-img-container .ubtn-data { position: relative; display: inline-block } .ubtn-img-container a.ubtn-link { display: inline-block } .ulta-grow { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-grow:hover, .ulta-grow:focus, .ulta-grow:active { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } .ulta-shrink { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-shrink:hover, .ulta-shrink:focus, .ulta-shrink:active { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9) } @-webkit-keyframes ulta-pulse { 25% { -webkit-transform: scale(1.1); transform: scale(1.1) } 75% { -webkit-transform: scale(0.9); transform: scale(0.9) } } @keyframes ulta-pulse { 25% { -webkit-transform: scale(1.1); transform: scale(1.1) } 75% { -webkit-transform: scale(0.9); transform: scale(0.9) } } .ulta-pulse { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-pulse:hover, .ulta-pulse:focus, .ulta-pulse:active { -webkit-animation-name: ulta-pulse; animation-name: ulta-pulse; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite } @-webkit-keyframes ulta-pulse-grow { to { -webkit-transform: scale(1.1); transform: scale(1.1) } } @keyframes ulta-pulse-grow { to { -webkit-transform: scale(1.1); transform: scale(1.1) } } .ulta-pulse-grow { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-pulse-grow:hover, .ulta-pulse-grow:focus, .ulta-pulse-grow:active { -webkit-animation-name: ulta-pulse-grow; animation-name: ulta-pulse-grow; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate } @-webkit-keyframes ulta-pulse-shrink { to { -webkit-transform: scale(0.9); transform: scale(0.9) } } @keyframes ulta-pulse-shrink { to { -webkit-transform: scale(0.9); transform: scale(0.9) } } .ulta-pulse-shrink { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-pulse-shrink:hover, .ulta-pulse-shrink:focus, .ulta-pulse-shrink:active { -webkit-animation-name: ulta-pulse-shrink; animation-name: ulta-pulse-shrink; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate } @-webkit-keyframes ulta-push { 50% { -webkit-transform: scale(0.8); transform: scale(0.8) } 100% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes ulta-push { 50% { -webkit-transform: scale(0.8); transform: scale(0.8) } 100% { -webkit-transform: scale(1); transform: scale(1) } } .ulta-push { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-push:hover, .ulta-push:focus, .ulta-push:active { -webkit-animation-name: ulta-push; animation-name: ulta-push; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2) } 100% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes ulta-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2) } 100% { -webkit-transform: scale(1); transform: scale(1) } } .ulta-pop { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-pop:hover, .ulta-pop:focus, .ulta-pop:active { -webkit-animation-name: ulta-pop; animation-name: ulta-pop; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } .ulta-rotate { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-rotate:hover, .ulta-rotate:focus, .ulta-rotate:active { -webkit-transform: rotate(4deg); -ms-transform: rotate(4deg); transform: rotate(4deg) } .ulta-grow-rotate { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-grow-rotate:hover, .ulta-grow-rotate:focus, .ulta-grow-rotate:active { -webkit-transform: scale(1.1) rotate(4deg); -ms-transform: scale(1.1) rotate(4deg); transform: scale(1.1) rotate(4deg) } .ulta-float { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-float:hover, .ulta-float:focus, .ulta-float:active { -webkit-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px) } .ulta-sink { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-sink:hover, .ulta-sink:focus, .ulta-sink:active { -webkit-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px) } @-webkit-keyframes ulta-hover { 50% { -webkit-transform: translateY(-3px); transform: translateY(-3px) } 100% { -webkit-transform: translateY(-6px); transform: translateY(-6px) } } @keyframes ulta-hover { 50% { -webkit-transform: translateY(-3px); transform: translateY(-3px) } 100% { -webkit-transform: translateY(-6px); transform: translateY(-6px) } } .ulta-hover { display: inline-block; -webkit-transition-duration: .5s; transition-duration: .5s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-hover:hover, .ulta-hover:focus, .ulta-hover:active { -webkit-transform: translateY(-6px); -ms-transform: translateY(-6px); transform: translateY(-6px); -webkit-animation-name: ulta-hover; animation-name: ulta-hover; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: .3s; animation-delay: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate } @-webkit-keyframes ulta-hang { 50% { -webkit-transform: translateY(3px); transform: translateY(3px) } 100% { -webkit-transform: translateY(6px); transform: translateY(6px) } } @keyframes ulta-hang { 50% { -webkit-transform: translateY(3px); transform: translateY(3px) } 100% { -webkit-transform: translateY(6px); transform: translateY(6px) } } .ulta-hang { display: inline-block; -webkit-transition-duration: .5s; transition-duration: .5s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-hang:hover, .ulta-hang:focus, .ulta-hang:active { -webkit-transform: translateY(6px); -ms-transform: translateY(6px); transform: translateY(6px); -webkit-animation-name: ulta-hang; animation-name: ulta-hang; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-delay: .3s; animation-delay: .3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate } .ulta-skew { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-skew:hover, .ulta-skew:focus, .ulta-skew:active { -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg) } .ulta-skew-forward { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform-origin: 0 100%; -ms-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-skew-forward:hover, .ulta-skew-forward:focus, .ulta-skew-forward:active { -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg) } .ulta-skew-backward { display: inline-block; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform-origin: 0 100%; -ms-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-skew-backward:hover, .ulta-skew-backward:focus, .ulta-skew-backward:active { -webkit-transform: skew(10deg); -ms-transform: skew(10deg); transform: skew(10deg) } @-webkit-keyframes ulta-wobble-vertical { 16.65% { -webkit-transform: translateY(8px); transform: translateY(8px) } 33.3% { -webkit-transform: translateY(-6px); transform: translateY(-6px) } 49.95% { -webkit-transform: translateY(4px); transform: translateY(4px) } 66.6% { -webkit-transform: translateY(-2px); transform: translateY(-2px) } 83.25% { -webkit-transform: translateY(1px); transform: translateY(1px) } 100% { -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes ulta-wobble-vertical { 16.65% { -webkit-transform: translateY(8px); transform: translateY(8px) } 33.3% { -webkit-transform: translateY(-6px); transform: translateY(-6px) } 49.95% { -webkit-transform: translateY(4px); transform: translateY(4px) } 66.6% { -webkit-transform: translateY(-2px); transform: translateY(-2px) } 83.25% { -webkit-transform: translateY(1px); transform: translateY(1px) } 100% { -webkit-transform: translateY(0); transform: translateY(0) } } .ulta-wobble-vertical { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-vertical:hover, .ulta-wobble-vertical:focus, .ulta-wobble-vertical:active { -webkit-animation-name: ulta-wobble-vertical; animation-name: ulta-wobble-vertical; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-horizontal { 16.65% { -webkit-transform: translateX(8px); transform: translateX(8px) } 33.3% { -webkit-transform: translateX(-6px); transform: translateX(-6px) } 49.95% { -webkit-transform: translateX(4px); transform: translateX(4px) } 66.6% { -webkit-transform: translateX(-2px); transform: translateX(-2px) } 83.25% { -webkit-transform: translateX(1px); transform: translateX(1px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes ulta-wobble-horizontal { 16.65% { -webkit-transform: translateX(8px); transform: translateX(8px) } 33.3% { -webkit-transform: translateX(-6px); transform: translateX(-6px) } 49.95% { -webkit-transform: translateX(4px); transform: translateX(4px) } 66.6% { -webkit-transform: translateX(-2px); transform: translateX(-2px) } 83.25% { -webkit-transform: translateX(1px); transform: translateX(1px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } .ulta-wobble-horizontal { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-horizontal:hover, .ulta-wobble-horizontal:focus, .ulta-wobble-horizontal:active { -webkit-animation-name: ulta-wobble-horizontal; animation-name: ulta-wobble-horizontal; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-to-bottom-right { 16.65% { -webkit-transform: translate(8px, 8px); transform: translate(8px, 8px) } 33.3% { -webkit-transform: translate(-6px, -6px); transform: translate(-6px, -6px) } 49.95% { -webkit-transform: translate(4px, 4px); transform: translate(4px, 4px) } 66.6% { -webkit-transform: translate(-2px, -2px); transform: translate(-2px, -2px) } 83.25% { -webkit-transform: translate(1px, 1px); transform: translate(1px, 1px) } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0) } } @keyframes ulta-wobble-to-bottom-right { 16.65% { -webkit-transform: translate(8px, 8px); transform: translate(8px, 8px) } 33.3% { -webkit-transform: translate(-6px, -6px); transform: translate(-6px, -6px) } 49.95% { -webkit-transform: translate(4px, 4px); transform: translate(4px, 4px) } 66.6% { -webkit-transform: translate(-2px, -2px); transform: translate(-2px, -2px) } 83.25% { -webkit-transform: translate(1px, 1px); transform: translate(1px, 1px) } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0) } } .ulta-wobble-to-bottom-right { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-to-bottom-right:hover, .ulta-wobble-to-bottom-right:focus, .ulta-wobble-to-bottom-right:active { -webkit-animation-name: ulta-wobble-to-bottom-right; animation-name: ulta-wobble-to-bottom-right; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-to-top-right { 16.65% { -webkit-transform: translate(8px, -8px); transform: translate(8px, -8px) } 33.3% { -webkit-transform: translate(-6px, 6px); transform: translate(-6px, 6px) } 49.95% { -webkit-transform: translate(4px, -4px); transform: translate(4px, -4px) } 66.6% { -webkit-transform: translate(-2px, 2px); transform: translate(-2px, 2px) } 83.25% { -webkit-transform: translate(1px, -1px); transform: translate(1px, -1px) } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0) } } @keyframes ulta-wobble-to-top-right { 16.65% { -webkit-transform: translate(8px, -8px); transform: translate(8px, -8px) } 33.3% { -webkit-transform: translate(-6px, 6px); transform: translate(-6px, 6px) } 49.95% { -webkit-transform: translate(4px, -4px); transform: translate(4px, -4px) } 66.6% { -webkit-transform: translate(-2px, 2px); transform: translate(-2px, 2px) } 83.25% { -webkit-transform: translate(1px, -1px); transform: translate(1px, -1px) } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0) } } .ulta-wobble-to-top-right { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-to-top-right:hover, .ulta-wobble-to-top-right:focus, .ulta-wobble-to-top-right:active { -webkit-animation-name: ulta-wobble-to-top-right; animation-name: ulta-wobble-to-top-right; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-top { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } @keyframes ulta-wobble-top { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } .ulta-wobble-top { display: inline-block; -webkit-transform-origin: 0 100%; -ms-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-top:hover, .ulta-wobble-top:focus, .ulta-wobble-top:active { -webkit-animation-name: ulta-wobble-top; animation-name: ulta-wobble-top; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-bottom { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } @keyframes ulta-wobble-bottom { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } .ulta-wobble-bottom { display: inline-block; -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-bottom:hover, .ulta-wobble-bottom:focus, .ulta-wobble-bottom:active { -webkit-animation-name: ulta-wobble-bottom; animation-name: ulta-wobble-bottom; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-wobble-skew { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } @keyframes ulta-wobble-skew { 16.65% { -webkit-transform: skew(-12deg); transform: skew(-12deg) } 33.3% { -webkit-transform: skew(10deg); transform: skew(10deg) } 49.95% { -webkit-transform: skew(-6deg); transform: skew(-6deg) } 66.6% { -webkit-transform: skew(4deg); transform: skew(4deg) } 83.25% { -webkit-transform: skew(-2deg); transform: skew(-2deg) } 100% { -webkit-transform: skew(0); transform: skew(0) } } .ulta-wobble-skew { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-wobble-skew:hover, .ulta-wobble-skew:focus, .ulta-wobble-skew:active { -webkit-animation-name: ulta-wobble-skew; animation-name: ulta-wobble-skew; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } @-webkit-keyframes ulta-buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } } @keyframes ulta-buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } } .ulta-buzz { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-buzz:hover, .ulta-buzz:focus, .ulta-buzz:active { -webkit-animation-name: ulta-buzz; animation-name: ulta-buzz; -webkit-animation-duration: .15s; animation-duration: .15s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite } @-webkit-keyframes ulta-buzz-out { 10% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 20% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } 30% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 40% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } 50% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg) } 60% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg) } 70% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg) } 80% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg) } 90% { -webkit-transform: translateX(1px) rotate(0); transform: translateX(1px) rotate(0) } 100% { -webkit-transform: translateX(-1px) rotate(0); transform: translateX(-1px) rotate(0) } } @keyframes ulta-buzz-out { 10% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 20% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } 30% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg) } 40% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg) } 50% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg) } 60% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg) } 70% { -webkit-transform: translateX(2px) rotate(1deg); transform: translateX(2px) rotate(1deg) } 80% { -webkit-transform: translateX(-2px) rotate(-1deg); transform: translateX(-2px) rotate(-1deg) } 90% { -webkit-transform: translateX(1px) rotate(0); transform: translateX(1px) rotate(0) } 100% { -webkit-transform: translateX(-1px) rotate(0); transform: translateX(-1px) rotate(0) } } .ulta-buzz-out { display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0) } .ulta-buzz-out:hover, .ulta-buzz-out:focus, .ulta-buzz-out:active { -webkit-animation-name: ulta-buzz-out; animation-name: ulta-buzz-out; -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1 } .ubtn-img-container .ubtn-data.ubtn-icon i { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .ubtn-img-container .ubtn-data.ubtn-icon { height: 100%; position: absolute; } /*.ubtn-img-container .ubtn-data.ubtn-text { left: 15px; Left to align space for icon } */ .ubtn-hover { opacity: 0; } .ubtn-hover-active { opacity: 1; } /*swapnil*/ .ubtn-img-container .ubtn-sep-icon-right .ubtn-data.ubtn-text{ left: -10px; } .ubtn-img-container .ubtn-sep-icon-at-left .ubtn-data.ubtn-text{ right: -15px; } /* Raju */ /* Center */ .ubtn-img-container .ubtn-ctn-center{ position: absolute; width: 100%; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .ubtn-img-container .ubtn-ctn-inline{ position: absolute; width: auto; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } /* Left */ .ubtn-img-container .ubtn-ctn-left { position: absolute; left: 0; width: 100%; top: 50%; -webkit-transform: translateX(0) translateY(-50%); -ms-transform: translateX(0) translateY(-50%); transform: translateX(0) translateY(-50%); } /* Right */ .ubtn-img-container .ubtn-ctn-right { position: absolute; right: 0; width: 100%; top: 50%; -webkit-transform: translateX(0) translateY(-50%); -ms-transform: translateX(0) translateY(-50%); transform: translateX(0) translateY(-50%); }