sugarcss 1.0.0

data/stylesheets/sugar/vendors/animatecss/fading_entrances/_fadeInUpBig.scss

@@ -0,0 +1,16 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeInUpBig) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeInUpBig); @keyframes fadeInUpBig {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 2000px, 0);
+  }
+
+  100% {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+%fadeInUpBig {
+  animation-name: fadeInUpBig;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOut.scss

@@ -0,0 +1,9 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOut) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOut); @keyframes fadeOut {
+  from {opacity: 1;}
+  100% {opacity: 0;}
+}
+
+%fadeOut {
+  animation-name: fadeOut;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutDown.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutDown) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutDown); @keyframes fadeOutDown {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+%fadeOutDown {
+  animation-name: fadeOutDown;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutDownBig.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutDownBig) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutDownBig); @keyframes fadeOutDownBig {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(0, 2000px, 0);
+  }
+}
+
+%fadeOutDownBig {
+  animation-name: fadeOutDownBig;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutLeft.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutLeft); @keyframes fadeOutLeft {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+%fadeOutLeft {
+  animation-name: fadeOutLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutLeftBig.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutLeftBig) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutLeftBig); @keyframes fadeOutLeftBig {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(-2000px, 0, 0);
+  }
+}
+
+%fadeOutLeftBig {
+  animation-name: fadeOutLeftBig;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutRight.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutRight); @keyframes fadeOutRight {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+%fadeOutRight {
+  animation-name: fadeOutRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutRightBig.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutRightBig) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutRightBig); @keyframes fadeOutRightBig {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(2000px, 0, 0);
+  }
+}
+
+%fadeOutRightBig {
+  animation-name: fadeOutRightBig;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutUp.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutUp) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutUp); @keyframes fadeOutUp {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+%fadeOutUp {
+  animation-name: fadeOutUp;
+}
+}

data/stylesheets/sugar/vendors/animatecss/fading_exits/_fadeOutUpBig.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, fadeOutUpBig) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, fadeOutUpBig); @keyframes fadeOutUpBig {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+    transform: translate3d(0, -2000px, 0);
+  }
+}
+
+%fadeOutUpBig {
+  animation-name: fadeOutUpBig;
+}
+}

data/stylesheets/sugar/vendors/animatecss/flippers/_flip.scss

@@ -0,0 +1,32 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, flip) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, flip); @keyframes flip {
+  from {
+    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
+    animation-timing-function: ease-out;
+  }
+
+  40% {
+    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
+    animation-timing-function: ease-out;
+  }
+
+  50% {
+    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
+    animation-timing-function: ease-in;
+  }
+
+  80% {
+    transform: perspective(400px) scale3d(.95, .95, .95);
+    animation-timing-function: ease-in;
+  }
+
+  100% {
+    transform: perspective(400px);
+    animation-timing-function: ease-in;
+  }
+}
+
+%animated%flip {
+  backface-visibility: visible;
+  animation-name: flip;
+}
+}

data/stylesheets/sugar/vendors/animatecss/flippers/_flipInX.scss

@@ -0,0 +1,31 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, flipInX) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, flipInX); @keyframes flipInX {
+  from {
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    animation-timing-function: ease-in;
+    opacity: 0;
+  }
+
+  40% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    animation-timing-function: ease-in;
+  }
+
+  60% {
+    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+    opacity: 1;
+  }
+
+  80% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+  }
+
+  100% {
+    transform: perspective(400px);
+  }
+}
+
+%flipInX {
+  backface-visibility: visible !important;
+  animation-name: flipInX;
+}
+}

data/stylesheets/sugar/vendors/animatecss/flippers/_flipInY.scss

@@ -0,0 +1,31 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, flipInY) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, flipInY); @keyframes flipInY {
+  from {
+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    animation-timing-function: ease-in;
+    opacity: 0;
+  }
+
+  40% {
+    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+    animation-timing-function: ease-in;
+  }
+
+  60% {
+    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+    opacity: 1;
+  }
+
+  80% {
+    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+  }
+
+  100% {
+    transform: perspective(400px);
+  }
+}
+
+%flipInY {
+  backface-visibility: visible !important;
+  animation-name: flipInY;
+}
+}

data/stylesheets/sugar/vendors/animatecss/flippers/_flipOutX.scss

@@ -0,0 +1,21 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, flipOutX) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, flipOutX); @keyframes flipOutX {
+  from {
+    transform: perspective(400px);
+  }
+
+  30% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+    opacity: 1;
+  }
+
+  100% {
+    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+%flipOutX {
+  animation-name: flipOutX;
+  backface-visibility: visible !important;
+}
+}

data/stylesheets/sugar/vendors/animatecss/flippers/_flipOutY.scss

@@ -0,0 +1,21 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, flipOutY) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, flipOutY); @keyframes flipOutY {
+  from {
+    transform: perspective(400px);
+  }
+
+  30% {
+    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+    opacity: 1;
+  }
+
+  100% {
+    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+    opacity: 0;
+  }
+}
+
+%flipOutY {
+  backface-visibility: visible !important;
+  animation-name: flipOutY;
+}
+}

data/stylesheets/sugar/vendors/animatecss/lightspeed/_lightSpeedIn.scss

@@ -0,0 +1,27 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, lightSpeedIn) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, lightSpeedIn); @keyframes lightSpeedIn {
+  from {
+    transform: translate3d(100%, 0, 0) skewX(-30deg);
+    opacity: 0;
+  }
+
+  60% {
+    transform: skewX(20deg);
+    opacity: 1;
+  }
+
+  80% {
+    transform: skewX(-5deg);
+    opacity: 1;
+  }
+
+  100% {
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%lightSpeedIn {
+  animation-name: lightSpeedIn;
+  animation-timing-function: ease-out;
+}
+}

data/stylesheets/sugar/vendors/animatecss/lightspeed/_lightSpeedOut.scss

@@ -0,0 +1,16 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, lightSpeedOut) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, lightSpeedOut); @keyframes lightSpeedOut {
+  from {
+    opacity: 1;
+  }
+
+  100% {
+    transform: translate3d(100%, 0, 0) skewX(30deg);
+    opacity: 0;
+  }
+}
+
+%lightSpeedOut {
+  animation-name: lightSpeedOut;
+  animation-timing-function: ease-in;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_entrances/_rotateIn.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateIn) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateIn); @keyframes rotateIn {
+  from {
+    transform-origin: center;
+    transform: rotate3d(0, 0, 1, -200deg);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: center;
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%rotateIn {
+  animation-name: rotateIn;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_entrances/_rotateInDownLeft.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateInDownLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateInDownLeft); @keyframes rotateInDownLeft {
+  from {
+    transform-origin: left bottom;
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: left bottom;
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%rotateInDownLeft {
+  animation-name: rotateInDownLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_entrances/_rotateInDownRight.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateInDownRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateInDownRight); @keyframes rotateInDownRight {
+  from {
+    transform-origin: right bottom;
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: right bottom;
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%rotateInDownRight {
+  animation-name: rotateInDownRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_entrances/_rotateInUpLeft.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateInUpLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateInUpLeft); @keyframes rotateInUpLeft {
+  from {
+    transform-origin: left bottom;
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: left bottom;
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%rotateInUpLeft {
+  animation-name: rotateInUpLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_entrances/_rotateInUpRight.scss

@@ -0,0 +1,18 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateInUpRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateInUpRight); @keyframes rotateInUpRight {
+  from {
+    transform-origin: right bottom;
+    transform: rotate3d(0, 0, 1, -90deg);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: right bottom;
+    transform: none;
+    opacity: 1;
+  }
+}
+
+%rotateInUpRight {
+  animation-name: rotateInUpRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_exits/_rotateOut.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateOut) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateOut); @keyframes rotateOut {
+  from {
+    transform-origin: center;
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: center;
+    transform: rotate3d(0, 0, 1, 200deg);
+    opacity: 0;
+  }
+}
+
+%rotateOut {
+  animation-name: rotateOut;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_exits/_rotateOutDownLeft.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateOutDownLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateOutDownLeft); @keyframes rotateOutDownLeft {
+  from {
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: left bottom;
+    transform: rotate3d(0, 0, 1, 45deg);
+    opacity: 0;
+  }
+}
+
+%rotateOutDownLeft {
+  animation-name: rotateOutDownLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_exits/_rotateOutDownRight.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateOutDownRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateOutDownRight); @keyframes rotateOutDownRight {
+  from {
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: right bottom;
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+%rotateOutDownRight {
+  animation-name: rotateOutDownRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_exits/_rotateOutUpLeft.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateOutUpLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateOutUpLeft); @keyframes rotateOutUpLeft {
+  from {
+    transform-origin: left bottom;
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: left bottom;
+    transform: rotate3d(0, 0, 1, -45deg);
+    opacity: 0;
+  }
+}
+
+%rotateOutUpLeft {
+  animation-name: rotateOutUpLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/rotating_exits/_rotateOutUpRight.scss

@@ -0,0 +1,17 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, rotateOutUpRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, rotateOutUpRight); @keyframes rotateOutUpRight {
+  from {
+    transform-origin: right bottom;
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: right bottom;
+    transform: rotate3d(0, 0, 1, 90deg);
+    opacity: 0;
+  }
+}
+
+%rotateOutUpRight {
+  animation-name: rotateOutUpRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_entrances/_slideInDown.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideInDown) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideInDown); @keyframes slideInDown {
+  from {
+    transform: translate3d(0, -100%, 0);
+    visibility: visible;
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+%slideInDown {
+  animation-name: slideInDown;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_entrances/_slideInLeft.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideInLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideInLeft); @keyframes slideInLeft {
+  from {
+    transform: translate3d(-100%, 0, 0);
+    visibility: visible;
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+%slideInLeft {
+  animation-name: slideInLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_entrances/_slideInRight.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideInRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideInRight); @keyframes slideInRight {
+  from {
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+%slideInRight {
+  animation-name: slideInRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_entrances/_slideInUp.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideInUp) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideInUp); @keyframes slideInUp {
+  from {
+    transform: translate3d(0, 100%, 0);
+    visibility: visible;
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+%slideInUp {
+  animation-name: slideInUp;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_exits/_slideOutDown.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideOutDown) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideOutDown); @keyframes slideOutDown {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+%slideOutDown {
+  animation-name: slideOutDown;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_exits/_slideOutLeft.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideOutLeft) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideOutLeft); @keyframes slideOutLeft {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    transform: translate3d(-100%, 0, 0);
+  }
+}
+
+%slideOutLeft {
+  animation-name: slideOutLeft;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_exits/_slideOutRight.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideOutRight) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideOutRight); @keyframes slideOutRight {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    transform: translate3d(100%, 0, 0);
+  }
+}
+
+%slideOutRight {
+  animation-name: slideOutRight;
+}
+}

data/stylesheets/sugar/vendors/animatecss/sliding_exits/_slideOutUp.scss

@@ -0,0 +1,15 @@
+@if global-variable-exists(sugar-animatecss) == false or index($sugar-animatecss, slideOutUp) { $_sugar-animatecss : () !default; $_sugar-animatecss : append($_sugar-animatecss, slideOutUp); @keyframes slideOutUp {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+%slideOutUp {
+  animation-name: slideOutUp;
+}
+}