%PDF-
%PDF-
Mini Shell
Mini Shell
@keyframes fusionSonarEffect {
0% {
opacity: 0.3;
}
40% {
opacity: 0.5;
}
100% {
transform: scale(1.5);
opacity: 0;
}
}
@keyframes fusionToRightFromLeft {
49% {
transform: translate(100%);
}
50% {
opacity: 0;
transform: translate(-100%);
}
51% {
opacity: 1;
}
100% {
opacity: 1;
}
}
@keyframes fusionExpandAndShow {
0% {
transform: scale(0.5);
opacity: 1;
}
100% {
transform: scale(1);
opacity: 1;
}
}
@keyframes fusionExpandWidth {
0% {
width: 0;
}
100% {
width: 99%;
}
}
@keyframes fusionExpandHeight {
0% {
height: 0;
}
100% {
height: 100%;
}
}
.icon-hover-animation-slide .fontawesome-icon.circle-yes {
overflow: hidden;
}
.icon-hover-animation-slide .fontawesome-icon:before {
display: block;
opacity: 1;
}
.icon-hover-animation-fade .fontawesome-icon {
transition: background-color 0.3s, color 0.3s;
}
.link-area-box-hover.icon-hover-animation-fade .fontawesome-icon,
.link-area-link-icon-hover.icon-hover-animation-fade .fontawesome-icon {
transition: background-color 0.3s, color 0.3s;
}
.link-area-box-hover.icon-hover-animation-slide .fontawesome-icon:before,
.link-area-link-icon-hover.icon-hover-animation-slide .fontawesome-icon:before {
display: block;
animation: fusionToRightFromLeft 0.3s forwards;
}
.fusion-content-boxes .link-area-box-hover.icon-hover-animation-pulsate .heading,
.fusion-content-boxes .link-area-link-icon-hover.icon-hover-animation-pulsate .heading {
overflow: visible;
}
.link-area-box-hover.icon-hover-animation-pulsate .fontawesome-icon,
.link-area-link-icon-hover.icon-hover-animation-pulsate .fontawesome-icon {
transition: background-color 0.3s, color 0.3s;
transform: scale(0.93);
}
.link-area-box-hover.icon-hover-animation-pulsate .fontawesome-icon:after,
.link-area-link-icon-hover.icon-hover-animation-pulsate .fontawesome-icon:after {
pointer-events: none;
position: absolute;
width: 100%;
height: 100%;
border-radius: inherit;
content: "";
box-sizing: content-box;
top: 0;
left: 0;
padding: 0;
z-index: -1;
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
opacity: 0;
transform: scale(0.9);
display: inline-block;
animation: fusionSonarEffect 1.3s ease-out 75ms;
}
@-moz-document url-prefix() {
.link-area-box-hover.icon-hover-animation-pulsate .fontawesome-icon:after,
.link-area-link-icon-hover.icon-hover-animation-pulsate .fontawesome-icon:after {
animation-iteration-count: infinite;
}
}
.fusion-content-boxes .link-area-box-hover.icon-wrapper-hover-animation-pulsate .heading,
.fusion-content-boxes .link-area-link-icon-hover.icon-wrapper-hover-animation-pulsate .heading {
overflow: visible;
}
.link-area-box-hover.icon-wrapper-hover-animation-pulsate .fontawesome-icon,
.link-area-link-icon-hover.icon-wrapper-hover-animation-pulsate .fontawesome-icon {
transition: background-color 0.3s, color 0.3s;
}
.link-area-box-hover.icon-wrapper-hover-animation-pulsate .icon span,
.link-area-link-icon-hover.icon-wrapper-hover-animation-pulsate .icon span {
transform: scale(0.93);
}
.link-area-box-hover.icon-wrapper-hover-animation-pulsate .icon span:after,
.link-area-link-icon-hover.icon-wrapper-hover-animation-pulsate .icon span:after {
pointer-events: none;
position: absolute;
width: 100%;
height: 100%;
border-radius: inherit;
content: "";
box-sizing: content-box;
top: 0;
left: 0;
padding: 0;
z-index: -1;
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
opacity: 0;
transform: scale(0.9);
display: inline-block;
animation: fusionSonarEffect 1.3s ease-out 75ms;
}
@keyframes flash {
0%,
50%,
100% {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
@keyframes shake {
0%,
100% {
transform: translateX(0);
}
10%,
30%,
50%,
70%,
90% {
transform: translateX(-10px);
}
20%,
40%,
60%,
80% {
transform: translateX(10px);
}
}
@keyframes bounce {
0%,
20%,
50%,
80%,
100% {
transform: translateY(0);
}
40% {
transform: translateY(-30px);
}
60% {
transform: translateY(-15px);
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
transform: translateY(-20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
transform: translateX(-20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
transform: translateX(20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
transform: translateY(2000px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
transform: translateY(-2000px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
transform: translateX(-2000px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
transform: translateX(2000px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(-20px);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(20px);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-20px);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(20px);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(-2000px);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(2000px);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-2000px);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(2000px);
}
}
@keyframes slideInDown {
0% {
opacity: 0;
transform: translateY(-2000px);
}
100% {
transform: translateY(0);
}
}
@keyframes slideInUp {
0% {
opacity: 0;
transform: translateY(2000px);
}
100% {
transform: translateY(0);
}
}
@keyframes slideInLeft {
0% {
opacity: 0;
transform: translateX(-2000px);
}
100% {
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
transform: translateX(2000px);
}
100% {
transform: translateX(0);
}
}
@keyframes slideOutUp {
0% {
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(-2000px);
}
}
@keyframes slideOutLeft {
0% {
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-2000px);
}
}
@keyframes slideOutRight {
0% {
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(2000px);
}
}
@keyframes bounceIn {
0% {
opacity: 0;
transform: scale(0.3);
}
50% {
opacity: 1;
transform: scale(1.05);
}
70% {
transform: scale(0.9);
}
100% {
transform: scale(1);
}
}
@keyframes bounceInUp {
0% {
opacity: 0;
transform: translateY(2000px);
}
60% {
opacity: 1;
transform: translateY(-30px);
}
80% {
transform: translateY(10px);
}
100% {
transform: translateY(0);
}
}
@keyframes bounceInDown {
0% {
opacity: 0;
transform: translateY(-2000px);
}
60% {
opacity: 1;
transform: translateY(30px);
}
80% {
transform: translateY(-10px);
}
100% {
transform: translateY(0);
}
}
@keyframes bounceInLeft {
0% {
opacity: 0;
transform: translateX(-2000px);
}
60% {
opacity: 1;
transform: translateX(30px);
}
80% {
transform: translateX(-10px);
}
100% {
transform: translateX(0);
}
}
@keyframes bounceInRight {
0% {
opacity: 0;
transform: translateX(2000px);
}
60% {
opacity: 1;
transform: translateX(-30px);
}
80% {
transform: translateX(10px);
}
100% {
transform: translateX(0);
}
}
@keyframes bounceOut {
0% {
transform: scale(1);
}
25% {
transform: scale(0.95);
}
50% {
opacity: 1;
transform: scale(1.1);
}
100% {
opacity: 0;
transform: scale(0.3);
}
}
@keyframes bounceOutUp {
0% {
transform: translateY(0);
}
20% {
opacity: 1;
transform: translateY(20px);
}
100% {
opacity: 0;
transform: translateY(-2000px);
}
}
@keyframes bounceOutDown {
0% {
transform: translateY(0);
}
20% {
opacity: 1;
transform: translateY(-20px);
}
100% {
opacity: 0;
transform: translateY(2000px);
}
}
@keyframes bounceOutLeft {
0% {
transform: translateX(0);
}
20% {
opacity: 1;
transform: translateX(20px);
}
100% {
opacity: 0;
transform: translateX(-2000px);
}
}
@keyframes bounceOutRight {
0% {
transform: translateX(0);
}
20% {
opacity: 1;
transform: translateX(-20px);
}
100% {
opacity: 0;
transform: translateX(2000px);
}
}
@keyframes lightSpeedIn {
0% {
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
60% {
transform: translateX(-20%) skewX(30deg);
opacity: 1;
}
80% {
transform: translateX(0%) skewX(-15deg);
opacity: 1;
}
100% {
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
}
@keyframes lightSpeedOut {
0% {
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
100% {
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
}
@keyframes rubberBand {
0% {
transform: scale3d(1, 1, 1);
}
30% {
transform: scale3d(1.25, 0.75, 1);
}
40% {
transform: scale3d(0.75, 1.25, 1);
}
50% {
transform: scale3d(1.15, 0.85, 1);
}
65% {
transform: scale3d(0.95, 1.05, 1);
}
75% {
transform: scale3d(1.05, 0.95, 1);
}
100% {
transform: scale3d(1, 1, 1);
}
}
@keyframes zoomIn {
0% {
opacity: 0;
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomInDown {
0% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInLeft {
0% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInRight {
0% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInUp {
0% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
transform: scale3d(0.3, 0.3, 0.3);
}
100% {
opacity: 0;
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform-origin: center bottom;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
transform: scale(0.1) translate3d(-2000px, 0, 0);
transform-origin: left center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
transform: scale(0.1) translate3d(2000px, 0, 0);
transform-origin: right center;
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform-origin: center bottom;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.fusion-animated {
visibility: hidden;
}
.dont-animate .fusion-animated {
visibility: visible;
}
/* Do Animations */
.do-animate {
/* Lightspeed Animations */
/* Rubberband Animation */
/* Zoom Animations */
}
.do-animate .fusion-animated {
animation-fill-mode: both;
animation-duration: 1s;
}
.do-animate .fusion-animated.hinge {
animation-duration: 1s;
}
.do-animate .flash {
animation-name: flash;
}
.do-animate .shake {
animation-name: shake;
}
.do-animate .bounce {
animation-name: bounce;
}
.do-animate .fadeIn {
animation-name: fadeIn;
}
.do-animate .fadeInUp {
animation-name: fadeInUp;
}
.do-animate .fadeInDown {
animation-name: fadeInDown;
}
.do-animate .fadeInLeft {
animation-name: fadeInLeft;
}
.do-animate .fadeInRight {
animation-name: fadeInRight;
}
.do-animate .fadeInUpBig {
animation-name: fadeInUpBig;
}
.do-animate .fadeInDownBig {
animation-name: fadeInDownBig;
}
.do-animate .fadeInLeftBig {
animation-name: fadeInLeftBig;
}
.do-animate .fadeInRightBig {
animation-name: fadeInRightBig;
}
.do-animate .fadeOut {
animation-name: fadeOut;
}
.do-animate .fadeOutUp {
animation-name: fadeOutUp;
}
.do-animate .fadeOutDown {
animation-name: fadeOutDown;
}
.do-animate .fadeOutLeft {
animation-name: fadeOutLeft;
}
.do-animate .fadeOutRight {
animation-name: fadeOutRight;
}
.do-animate .fadeOutUpBig {
animation-name: fadeOutUpBig;
}
.do-animate .fadeOutDownBig {
animation-name: fadeOutDownBig;
}
.do-animate .fadeOutLeftBig {
animation-name: fadeOutLeftBig;
}
.do-animate .fadeOutRightBig {
animation-name: fadeOutRightBig;
}
.do-animate .slideInDown {
animation-name: slideInDown;
}
.do-animate .slideInUp {
animation-name: slideInUp;
}
.do-animate .slideInLeft {
animation-name: slideInLeft;
}
.do-animate .slideInRight {
animation-name: slideInRight;
}
.do-animate .slideOutUp {
animation-name: slideOutUp;
}
.do-animate .slideOutLeft {
animation-name: slideOutLeft;
}
.do-animate .slideOutRight {
animation-name: slideOutRight;
}
.do-animate .bounceIn {
animation-name: bounceIn;
}
.do-animate .bounceInUp {
animation-name: bounceInUp;
}
.do-animate .bounceInDown {
animation-name: bounceInDown;
}
.do-animate .bounceInLeft {
animation-name: bounceInLeft;
}
.do-animate .bounceInRight {
animation-name: bounceInRight;
}
.do-animate .bounceOut {
animation-name: bounceOut;
}
.do-animate .bounceOutUp {
color: red;
animation-name: bounceOutUp;
}
.do-animate .bounceOutDown {
animation-name: bounceOutDown;
}
.do-animate .bounceOutLeft {
animation-name: bounceOutLeft;
}
.do-animate .bounceOutRight {
animation-name: bounceOutRight;
}
.do-animate .lightSpeedIn {
animation-name: lightSpeedIn;
animation-timing-function: ease-out;
}
.do-animate .lightSpeedOut {
animation-name: lightSpeedOut;
animation-timing-function: ease-in;
}
.do-animate .rubberBand {
animation-name: rubberBand;
}
.do-animate .zoomIn {
animation-name: zoomIn;
}
.do-animate .zoomInDown {
animation-name: zoomInDown;
}
.do-animate .zoomInLeft {
animation-name: zoomInLeft;
}
.do-animate .zoomInRight {
animation-name: zoomInRight;
}
.do-animate .zoomInUp {
animation-name: zoomInUp;
}
.do-animate .zoomOut {
animation-name: zoomOut;
}
.do-animate .zoomOutDown {
animation-name: zoomOutDown;
}
.do-animate .zoomOutLeft {
animation-name: zoomOutLeft;
}
.do-animate .zoomOutRight {
animation-name: zoomOutRight;
}
.do-animate .zoomOutUp {
animation-name: zoomOutUp;
}
Zerion Mini Shell 1.0