
/*cattocss | 2024 | MIT License | 
A proyect by: Alejandro Avalos | https://github.com/Avalojandro/Catto-CSS */

/* This is a minified file, for a proper functioning of this code it is recommended not to modify 
   this document, instead it is recommended to see the catto.css file */
/****************************************************************************************/

.h-float{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-float:hover{box-shadow:0 8px 8px 0 #000000,0 8px 8px 0 #000;transform:translate(0,5px);-webkit-transform:translate(0,5px);-moz-transform:translate(0,5px)}
.h-rotate-180{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-rotate-180:hover{transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg)}
.h-rotate-360{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-rotate-360:hover{transform:rotateZ(360deg);-webkit-transform:rotateZ(360deg);-moz-transform:rotateZ(360deg)}
.h-flex{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-flex:hover{transform:matrix(3,.5,0,1,1,1);-webkit-transform:matrix(3,.5,0,1,1,1);-moz-transform:matrix(3,.5,0,1,1,1)}
.h-transLeft{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-transLeft:hover{transform:translatex(-20px);-webkit-transform:translatex(-20px);-moz-transform:translatex(-20px)}
.h-transRight{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-transRight:hover{transform:translatex(20px);-webkit-transform:translatex(20px);-moz-transform:translatex(20px)}
.h-transDown{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-transDown:hover{transform:translatey(20px);-webkit-transform:translatey(20px);-moz-transform:translatey(20px)}
.h-transUp{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-transUp:hover{transform:translatey(-20px);-webkit-transform:translatey(-20px);-moz-transform:translatey(-20px)}
.h-toStretch{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-toStretch:hover{transform:scale(2,.5);-webkit-transform:scale(1.2,.5);-moz-transform:scale(1.2,.5)}
.h-skew{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-skew:hover{transform:skew(30deg,20deg);-webkit-transform:skew(30deg,20deg);-moz-transform:skew(30deg,20deg)}
.h-skewX{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-skewX:hover{transform:skewX(30deg);-webkit-transform:skewX(30deg);-moz-transform:skewX(30deg)}
.h-skewY{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-skewY:hover{transform:skewY(1.07rad);-webkit-transform:skewY(15deg);-moz-transform:skewY(15deg)}
.h-float-fluid{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-float-fluid:hover{transform:translate3d(12px,50%,3em);-webkit-transform:translate3d(12px,50%,3em);-moz-transform:translate3d(12px,50%,3em);box-shadow:0 8px 8px 0 #000000,0 8px 8px 0 #000}
.h-grow{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-grow:hover{transform:scale3d(1.5,1.5,.3);-webkit-transform:scale3d(1.5,1.5,.3);-moz-transform:scale3d(1.5,1.5,.3)}
.h-flipUp-360{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-flipUp-360:hover{transform:rotateX(360deg);-webkit-transform:rotateX(360deg);-moz-transform:rotateX(360deg)}
.h-flipUp-180{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-flipUp-180:hover{transform:rotateX(180deg);-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg)}
.h-flipSide-180{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-flipSide-180:hover{transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg)}
.h-flipSide-360{transition:.5s,color .10s;-webkit-transition:.5s,color .10s;-moz-transition:.5s,color .10s}
.h-flipSide-360:hover{transform:rotateY(360deg);-webkit-transform:rotateY(360deg);-moz-transform:rotateY(360deg)}
.h-shake:hover{animation-name:shake;-webkit-animation-name:shake;-moz-animation-name:shake;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite}@keyframes shake{0%{transform:translate(1px,1px) rotate(0deg)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px,0) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0deg)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0deg)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0deg)}100%{transform:translate(1px,-2px) rotate(-1deg)}}
.h-shakeFix:hover{animation-name:shakefix;-webkit-animation-name:shakefix;-moz-animation-name:shakefix;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite}@keyframes shakefix{0%{transform:translate(1px,1px)}10%{transform:translate(-1px,-2px)}20%{transform:translate(-3px,0)}30%{transform:translate(3px,2px)}40%{transform:translate(1px,-1px)}50%{transform:translate(-1px,2px)}60%{transform:translate(-3px,1px)}70%{transform:translate(3px,1px)}80%{transform:translate(-1px,-1px)}90%{transform:translate(1px,2px)}100%{transform:translate(1px,-2px)}}
.h-bounceShakeX:hover{animation-name:bounce-shakeX;-webkit-animation-name:bounce-shakeX;-moz-animation-name:bounce-shakeX;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s}@keyframes bounce-shakeX{0%{transform:translate(-50%,0)}12%{transform:translate(50%,0)}24%{transform:translate(-20%,0)}36%{transform:translate(20%,0)}48%{transform:translate(-10%,0)}60%{transform:translate(10%,0)}72%{transform:translate(-5%,0)}84%{transform:translate(5%,0)}96%{transform:translate(0%,0)}100%{transform:translate(0%,0)}}
.h-bounceShakeY:hover{animation-name:bounce-shakeY;-webkit-animation-name:bounce-shakeY;-moz-animation-name:bounce-shakeY;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s}@keyframes bounce-shakeY{0%{transform:translateY(-50%)}12%{transform:translateY(50%)}24%{transform:translateY(-20%)}36%{transform:translateY(20%)}48%{transform:translateY(-10%)}60%{transform:translateY(10%)}72%{transform:translateY(-5%)}84%{transform:translateY(5%)}96%{transform:translateY(0%)}100%{transform:translateY(0%)}}
.h-surprise:hover{animation-name:surprise;-webkit-animation-name:surprise;-moz-animation-name:surprise;animation-duration:.8s;-webkit-animation-duration:.8s;-moz-animation-duration:.8s}@keyframes surprise{0%{transform:rotate(0deg) scale(1,1);}10%{transform:rotate(7deg) scale(2,2)}20%{transform:rotate(-7deg) scale(2,2)}30%{transform:rotate(7deg) scale(2,2)}40%{transform:rotate(-7deg) scale(2,2)}50%{transform:rotate(7deg) scale(2,2)}60%{transform:rotate(-7deg) scale(2,2)}70%{transform:rotate(7deg) scale(2,2)}80%{transform:rotate(-7deg) scale(2,2)}90%{transform:rotate(7deg) scale(2,2)}100%{transform:rotate(0deg) scale(1,1)}}
.h-jello:hover{animation-name:jello;-webkit-animation-name:jello;-moz-animation-name:jello;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s;transform-origin:center;-webkit-transform-origin:center;-moz-transform-origin:center}@keyframes jello{from,11.1%,to{transform:translate3d(0,0,0)}22.2%{transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{transform:skewX(6.25deg) skewY(6.25deg)}44.4%{transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{transform:skewX(-0.78125deg) skewY(-0.78125deg)}77.7%{transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{transform:skewX(-0.1953125deg) skewY(-0.1953125deg)}}
.h-swing:hover{animation-name:swing;-webkit-animation-name:swing;-moz-animation-name:swing;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s}@keyframes swing{20%{transform:rotate3d(0,0,1,15deg)}40%{transform:rotate3d(0,0,1,-10deg)}60%{transform:rotate3d(0,0,1,5deg)}80%{transform:rotate3d(0,0,1,-5deg)}to{transform:rotate3d(0,0,1,0deg)}}
.i-shake{animation-name:shake;-webkit-animation-name:shake;-moz-animation-name:shake;animation-duration:1s;-webkit-animation-duration:1s;-moz-animation-duration:1s;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite}
.i-pulse{animation-name:pulse;animation-duration:1s;animation-iteration-count:infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}100%{transform:scale(1)}}
.i-bounce{animation-name:bounce;animation-duration:1s;animation-iteration-count:infinite}@keyframes bounce{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}
.i-spin{animation-name:spin;animation-duration:1s;animation-iteration-count:infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.i-heartbeat{animation-name:heartbeat;animation-duration:1s;animation-iteration-count:infinite}@keyframes heartbeat{0%{transform:scale(1)}25%{transform:scale(1.3)}50%{transform:scale(1)}75%{transform:scale(.7)}100%{transform:scale(1)}}
.i-slide{animation-name:slide;animation-duration:1s;animation-iteration-count:infinite}@keyframes slide{0%{transform:translateX(0)}50%{transform:translateX(20px)}100%{transform:translateX(0)}}
.i-flicker{animation-name:flicker;animation-duration:1s;animation-iteration-count:infinite}@keyframes flicker{0%{opacity:1}25%{opacity:.5}50%{opacity:1}75%{opacity:.5}100%{opacity:1}}
.i-rotate{animation-name:rotate;animation-duration:1s;animation-iteration-count:infinite}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.i-wobble{animation-name:wobble;animation-duration:1s;animation-iteration-count:infinite}@keyframes wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-30px) rotate(-5deg)}30%{transform:translateX(15px) rotate(3deg)}45%{transform:translateX(-15px) rotate(-3deg)}60%{transform:translateX(9px) rotate(2deg)}75%{transform:translateX(-6px) rotate(-1deg)}100%{transform:translateX(0) rotate(0deg)}}