3.1.2 (Brainy Betty) 1faeeb68ccdcb0b2c4cbe63133e1285a536c5067 o:Sass::Tree::RootNode : @linei:@has_childrenT:@children[io:Sass::Tree::ImportNode ;i:@imported_filename" shared;[: @options{:@template0o:Sass::Tree::CommentNode ;i: @value"/* @doc off * Note ---------------------------------------------------------------------- * Safari is the only browser that currently supports 3D transforms. * Because of that it can be important to control whether a given 2D transform * uses the full range of experimental browser prefixes, or only the 3D list. * To make that easy, all 2D transforms include an browser-targeting toggle ($only3d) * to switch between the two support lists. The toggle defaults to 'false' (2D), * and also accepts 'true' (3D). Currently the lists are as follows: * 2D: Mozilla, Webkit, Opera, Official * 3D: Webkit, Official **(Only Safari Supports 3D perspective)** */: @silenti;[; @ : @loud0: @lines[o; ;i;"/* Available Transforms ------------------------------------------------------ * - Scale (2d and 3d) * - Rotate (2d and 3d) * - Translate (2d and 3d) * - Skew (2d only) */;i;[; @ ;0;[o; ;i;"/* Transform Parameters ------------------------------------------------------ * - Transform Origin (2d and 3d) * - Perspective (3d) * - Perspective Origin (3d) * - Transform Style (3d) * - Backface Visibility (3d) */;i;[; @ ;0;[o; ;i ;"p/* Mixins -------------------------------------------------------------------- * transform-origin * - shortcuts: transform-origin2d, transform-origin3d * - helpers: apply-origin * transform * - shortcuts: transform2d, transform3d * - helpers: simple-transform, create-transform * perspective * - helpers: perspective-origin * transform-style * backface-visibility * scale * - shortcuts: scaleX, scaleY, scaleZ, scale3d * rotate * - shortcuts: rotateX, rotateY, rotate3d * translate * - shortcuts: translateX, translateY, translateZ, translate3d * skew * - shortcuts: skewX, skewY */;i;[; @ ;0;[o; ;i4;"a/* Defaults ------------------------------------------------------------------ * @doc on */;i;[; @ ;0;[o; ;i7;"./* The default x-origin for transforms */;i;[; @ ;0;[o:Sass::Tree::VariableNode ;i8: @guarded" !default;[: @name"default-origin-x; @ : @expro:Sass::Script::Number ;i8;i7; {:@original"50%:@denominator_units[:@numerator_units["%o; ;i9;"./* The default y-origin for transforms */;i;[; @ ;0;[o; ;i:;" !default;[;"default-origin-y; @ ;o; ;i:;i7; {;"50%;[;["%o; ;i;;"./* The default z-origin for transforms */;i;[; @ ;0;[o; ;i<;" !default;[;"default-origin-z; @ ;o; ;i<;i7; {;"50%;[;["%o; ;i?;"//* The default x-multiplier for scaling */;i;[; @ ;0;[o; ;i@;" !default;[;"default-scale-x; @ ;o; ;i@;f 1.25; {;" 1.25;[;[o; ;iA;"//* The default y-multiplier for scaling */;i;[; @ ;0;[o; ;iB;" !default;[;"default-scale-y; @ ;o:Sass::Script::Variable ;iB;"default-scale-x; {:@underscored_name"default_scale_xo; ;iC;"//* The default z-multiplier for scaling */;i;[; @ ;0;[o; ;iD;" !default;[;"default-scale-z; @ ;o; ;iD;"default-scale-x; {;"default_scale_xo; ;iG;"*/* The default angle for rotations */;i;[; @ ;0;[o; ;iH;" !default;[;"default-rotate; @ ;o; ;iH;i2; {;" 45deg;[;["dego; ;iK;";F; @F[o;;" only3d; @F;" only3do;';i?;F; @F;[o; ;iA;0;[;" trans; @ ;o;! ;iA;"{;[o; ;iA;" rotate; {;" rotate;" rotate; @^u;&[o:Sass::Script::Variable : @lineiB: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;iB: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;iB: @value[o:Sass::Script::Funcall ;iB:@keywords{: @args[o; ;iB;"perspective;{; "perspective;"perspective;@o; ;iB;" trans;@; " trans;@:@separator: spaceo;+ ;iC;"{;[o; ;iC;" trans; {;" transo; ;iC;" only3d; @g;" only3d;[;"transform; @ ;" rotate; @ o; ;iF;"/* A longcut for 'rotate' in case you forget that 'z' is implied * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;iM;T;[[o;;" rotate; {;" rotateo; ;iJ;"default-rotate; @x;"default_rotate[o;;"perspective; @x;"perspectiveo;';iK;F; @x[o;;" only3d; @x;" only3do;';iL;F; @x;[o;+ ;iN;"{;[o; ;iN;" rotate; {;" rotateo; ;iN;"perspective; @;"perspectiveo; ;iN;" only3d; @;" only3d;[;" rotate; @ ;" rotateZ; @ o; ;iQ;"/* Rotate an object around the x axis (3D) * @include rotateX( [ rotation, perspective ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;iX;T;[[o;;" rotate; {;" rotateo; ;iV;"default-rotate; @;"default_rotate[o;;"perspective; @;"perspectiveo;';iW;F; @;[o; ;iY;0;[;" trans; @ ;o;! ;iY;"{;[o; ;iY;" rotate; {;" rotate;" rotateX; @u;&[o:Sass::Script::Variable : @lineiZ: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;iZ: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;iZ: @value[o:Sass::Script::Funcall ;iZ:@keywords{: @args[o; ;iZ;"perspective;{; "perspective;"perspective;@o; ;iZ;" trans;@; " trans;@:@separator: spaceo;+ ;i[;"{;[o; ;i[;" trans; {;" trans;[;"transform3d; @ ;" rotateX; @ o; ;i^;"/* Rotate an object around the y axis (3D) * @include rotate( [ rotation, perspective ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;ie;T;[[o;;" rotate; {;" rotateo; ;ic;"default-rotate; @;"default_rotate[o;;"perspective; @;"perspectiveo;';id;F; @;[o; ;if;0;[;" trans; @ ;o;! ;if;"{;[o; ;if;" rotate; {;" rotate;" rotateY; @u;&[o:Sass::Script::Variable : @lineig: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;ig: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;ig: @value[o:Sass::Script::Funcall ;ig:@keywords{: @args[o; ;ig;"perspective;{; "perspective;"perspective;@o; ;ig;" trans;@; " trans;@:@separator: spaceo;+ ;ih;"{;[o; ;ih;" trans; {;" trans;[;"transform3d; @ ;" rotateY; @ o; ;ik;"/* Rotate an object around an arbitrary axis (3D) * @include rotate( [ vector-x, vector-y, vector-z, rotation, perspective ] ) * where the 'vector-' arguments accept unitless numbers * these numbers are not important on their own, but in relation to one another * creating an axis from your transform-origin, along the axis of Xx = Yy = Zz * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;ix;T;[ [o;;" vector-x; {;" vector_xo; ;is;"default-vector-x; @;"default_vector_x[o;;" vector-y; @;" vector_yo; ;it;"default-vector-y; @;"default_vector_y[o;;" vector-z; @;" vector_zo; ;iu;"default-vector-z; @;"default_vector_z[o;;" rotate; @;" rotateo; ;iv;"default-rotate; @;"default_rotate[o;;"perspective; @;"perspectiveo;';iw;F; @;[o; ;iy;0;[;" trans; @ ;o;! ;iy;"{;[ o; ;iy;" vector-x; {;" vector_xo; ;iy;" vector-y; @;" vector_yo; ;iy;" vector-z; @;" vector_zo; ;iy;" rotate; @;" rotate;" rotate3d; @u;&[o:Sass::Script::Variable : @lineiz: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;iz: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;iz: @value[o:Sass::Script::Funcall ;iz:@keywords{: @args[o; ;iz;"perspective;{; "perspective;"perspective;@o; ;iz;" trans;@; " trans;@:@separator: spaceo;+ ;i{;"{;[o; ;i{;" trans; {;" trans;[;"transform3d; @ ;" rotate3d; @ o; ;i~;"m/* @doc off * Translate ----------------------------------------------------------------- * @doc on */;i;[; @ ;0;[o; ;i;"5/* Move an object along the x or y axis (2D) * @include translate( [ translate-x, translate-y, perspective, 3D-only ] ) * where the 'translate-' arguments accept any distance in percentages or absolute (px, cm, in, em etc..) units * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[ [o;;"translate-x; {;"translate_xo; ;i;"default-translate-x; @A;"default_translate_x[o;;"translate-y; @A;"translate_yo; ;i;"default-translate-y; @A;"default_translate_y[o;;"perspective; @A;"perspectiveo;';i;F; @A[o;;" only3d; @A;" only3do;';i;F; @A;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;"translate-x; {;"translate_xo; ;i;"translate-y; @`;"translate_y;"translate; @`u;&[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;" trans;@; " trans;@:@separator: spaceo;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @l;" only3d;[;"transform; @ ;"translate; @ o; ;i;"/* Move an object along the x axis (2D) * @include translate( [ translate-x, perspective, 3D-only ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" trans-x; {;" trans_xo; ;i;"default-translate-x; @};"default_translate_x[o;;"perspective; @};"perspectiveo;';i;F; @}[o;;" only3d; @};" only3do;';i;F; @};[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" trans-x; {;" trans_x;"translateX; @u;&[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;" trans;@; " trans;@:@separator: spaceo;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @;" only3d;[;"transform; @ ;"translateX; @ o; ;i;"/* Move an object along the y axis (2D) * @include translate( [ translate-y, perspective, 3D-only ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" trans-y; {;" trans_yo; ;i;"default-translate-y; @;"default_translate_y[o;;"perspective; @;"perspectiveo;';i;F; @[o;;" only3d; @;" only3do;';i;F; @;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" trans-y; {;" trans_y;"translateY; @u;&[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;" trans;@; " trans;@:@separator: spaceo;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @;" only3d;[;"transform; @ ;"translateY; @ o; ;i;"/* Move an object along the z axis (3D) * @include translate( [ translate-z, perspective ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" trans-z; {;" trans_zo; ;i;"default-translate-z; @;"default_translate_z[o;;"perspective; @;"perspectiveo;';i;F; @;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" trans-z; {;" trans_z;"translateZ; @u;&[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;" trans;@; " trans;@:@separator: spaceo;+ ;i;"{;[o; ;i;" trans; {;" trans;[;"transform3d; @ ;"translateZ; @ o; ;i;"/* Move an object along the x, y and z axis (3D) * @include translate( [ translate-x, translate-y, translate-z, perspective ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[ [o;;"translate-x; {;"translate_xo; ;i;"default-translate-x; @ ;"default_translate_x[o;;"translate-y; @ ;"translate_yo; ;i;"default-translate-y; @ ;"default_translate_y[o;;"translate-z; @ ;"translate_zo; ;i;"default-translate-z; @ ;"default_translate_z[o;;"perspective; @ ;"perspectiveo;';i;F; @ ;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;"translate-x; {;"translate_xo; ;i;"translate-y; @,;"translate_yo; ;i;"translate-z; @,;"translate_z;"translate3d; @,u;&[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;" trans;@; " trans;@:@separator: spaceo;+ ;i;"{;[o; ;i;" trans; {;" trans;[;"transform3d; @ ;"translate3d; @ o; ;i;"m/* @doc off * Skew ---------------------------------------------------------------------- * @doc on */;i;[; @ ;0;[o; ;i;"/* Skew an element: * * @include skew( [ skew-x, skew-y, 3D-only ] ) * * where the 'skew-' arguments accept css angles in degrees (deg) or radian (rad) units * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" skew-x; {;" skew_xo; ;i;"default-skew-x; @M;"default_skew_x[o;;" skew-y; @M;" skew_yo; ;i;"default-skew-y; @M;"default_skew_y[o;;" only3d; @M;" only3do;';i;F; @M;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" skew-x; {;" skew_xo; ;i;" skew-y; @g;" skew_y;" skew; @go;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @r;" only3d;[;"transform; @ ;" skew; @ o; ;i;"/* Skew an element along the x axiz * * @include skew( [ skew-x, 3D-only ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" skew-x; {;" skew_xo; ;i;"default-skew-x; @;"default_skew_x[o;;" only3d; @;" only3do;';i;F; @;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" skew-x; {;" skew_x;" skewX; @o;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @;" only3d;[;"transform; @ ;" skewX; @ o; ;i;"/* Skew an element along the y axis * * @include skew( [ skew-y, 3D-only ] ) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;" skew-y; {;" skew_yo; ;i;"default-skew-y; @;"default_skew_y[o;;" only3d; @;" only3do;';i;F; @;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o; ;i;" skew-y; {;" skew_y;" skewY; @o;+ ;i;"{;[o; ;i;" trans; {;" transo; ;i;" only3d; @;" only3d;[;"transform; @ ;" skewY; @ o; ;i;"/* Full transform mixins * For settings any combination of transforms as arguments * These are complex and not highly recommended for daily use * They are mainly here for backwards-compatability purposes * * * they include origin adjustments * * scale takes a multiplier (unitless), rotate and skew take degrees (deg) * * **Note** This mixin cannot be combined with other transform mixins. */;i;[; @ ;0;[o; ;i;T;[[o;;"perspective; {;"perspectiveo;';i;F; @[o;;" scale-x; @;" scale_xo;';i;F; @[o;;" scale-y; @;" scale_yo;';i;F; @[o;;" scale-z; @;" scale_zo;';i;F; @[o;;" rotate-x; @;" rotate_xo;';i;F; @[o;;" rotate-y; @;" rotate_yo;';i;F; @[o;;" rotate-z; @;" rotate_zo;';i ;F; @[o;;" rotate3d; @;" rotate3do;';i ;F; @[o;;" trans-x; @;" trans_xo;';i ;F; @[o;;" trans-y; @;" trans_yo;';i ;F; @[o;;" trans-z; @;" trans_zo;';i ;F; @[o;;" skew-x; @;" skew_xo;';i;F; @[o;;" skew-y; @;" skew_yo;';i;F; @[o;;" origin-x; @;" origin_xo;';i;F; @[o;;" origin-y; @;" origin_yo;';i;F; @[o;;" origin-z; @;" origin_zo;';i;F; @[o;;" only3d; @;" only3do;';i;F; @;[o; ;i;0;[;" trans; @ ;o;! ;i;"{;[o;( ;i;";);*; {;" unquote; @7o; ;i;"/* perspective */;i;[; @ ;0;[u;&.[o:Sass::Script::Variable : @linei: @name"perspective: @options{:@underscored_name"perspective0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;"perspective;{; "perspective;"perspective;@o; ;i;"/* scale */;i;[; @ ;0;[u;&[o:Sass::Script::Operation : @linei:@operand2o:Sass::Script::Variable ;i: @name" scale-y: @options{:@underscored_name" scale_y:@operand1o; ;i; " scale-x; @ ; " scale_x; @ :@operator:andu:Sass::Tree::IfNode[00[u:Sass::Tree::IfNodev[o:Sass::Script::Variable : @linei: @name" scale-x: @options{:@underscored_name" scale_x0[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o; ;i;" trans;{; " transo:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;" scale-x;@; " scale_x;" scaleX;@;@:@separator: spaceu;v[o:Sass::Script::Variable : @linei : @name" scale-y: @options{:@underscored_name" scale_y0[o:Sass::Tree::VariableNode ;i : @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i : @value[o; ;i ;" trans;{; " transo:Sass::Script::Funcall ;i :@keywords{: @args[o; ;i ;" scale-y;@; " scale_y;" scaleY;@;@:@separator: spaceu;v[o:Sass::Script::Variable : @linei!: @name" scale-z: @options{:@underscored_name" scale_z0[o:Sass::Tree::VariableNode ;i!: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i!: @value[o; ;i!;" trans;{; " transo:Sass::Script::Funcall ;i!:@keywords{: @args[o; ;i!;" scale-z;@; " scale_z;" scaleZ;@;@:@separator: space[u;L[o:Sass::Script::Variable : @linei: @name" scale-z: @options{:@underscored_name" scale_zu:Sass::Tree::IfNodev[00[o:Sass::Tree::VariableNode : @linei: @guarded0:@children[: @name" trans: @options{: @expro:Sass::Script::List ;i: @value[o:Sass::Script::Variable ;i; " trans; {:@underscored_name" transo:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i; " scale-x; @;" scale_xo; ;i; " scale-y; @;" scale_y; " scale; @; @:@separator: space[o:Sass::Tree::VariableNode ;i: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i: @value[o; ;i;" trans;{; " transo:Sass::Script::Funcall ;i:@keywords{: @args[o; ;i;" scale-x;@; " scale_xo; ;i;" scale-y;@; " scale_yo; ;i;" scale-z;@; " scale_z;" scale3d;@;@:@separator: spaceo; ;i$;"/* rotate */;i;[; @ ;0;[u;&{[o:Sass::Script::Variable : @linei%: @name" rotate-x: @options{:@underscored_name" rotate_x0[o:Sass::Tree::VariableNode ;i%: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i%: @value[o; ;i%;" trans;{; " transo:Sass::Script::Funcall ;i%:@keywords{: @args[o; ;i%;" rotate-x;@; " rotate_x;" rotateX;@;@:@separator: spaceu;&{[o:Sass::Script::Variable : @linei&: @name" rotate-y: @options{:@underscored_name" rotate_y0[o:Sass::Tree::VariableNode ;i&: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i&: @value[o; ;i&;" trans;{; " transo:Sass::Script::Funcall ;i&:@keywords{: @args[o; ;i&;" rotate-y;@; " rotate_y;" rotateY;@;@:@separator: spaceu;&{[o:Sass::Script::Variable : @linei': @name" rotate-z: @options{:@underscored_name" rotate_z0[o:Sass::Tree::VariableNode ;i': @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i': @value[o; ;i';" trans;{; " transo:Sass::Script::Funcall ;i':@keywords{: @args[o; ;i';" rotate-z;@; " rotate_z;" rotateZ;@;@:@separator: spaceu;&|[o:Sass::Script::Variable : @linei(: @name" rotate3d: @options{:@underscored_name" rotate3d0[o:Sass::Tree::VariableNode ;i(: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i(: @value[o; ;i(;" trans;{; " transo:Sass::Script::Funcall ;i(:@keywords{: @args[o; ;i(;" rotate3d;@; " rotate3d;" rotate3d;@;@:@separator: spaceo; ;i*;"/* translate */;i;[; @ ;0;[u;&[o:Sass::Script::Operation : @linei+:@operand2o:Sass::Script::Variable ;i+: @name" trans-y: @options{:@underscored_name" trans_y:@operand1o; ;i+; " trans-x; @ ; " trans_x; @ :@operator:andu:Sass::Tree::IfNode[00[u:Sass::Tree::IfNodez[o:Sass::Script::Variable : @linei/: @name" trans-x: @options{:@underscored_name" trans_x0[o:Sass::Tree::VariableNode ;i/: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i/: @value[o; ;i/;" trans;{; " transo:Sass::Script::Funcall ;i/:@keywords{: @args[o; ;i/;" trans-x;@; " trans_x;"translateX;@;@:@separator: spaceu;z[o:Sass::Script::Variable : @linei0: @name" trans-y: @options{:@underscored_name" trans_y0[o:Sass::Tree::VariableNode ;i0: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i0: @value[o; ;i0;" trans;{; " transo:Sass::Script::Funcall ;i0:@keywords{: @args[o; ;i0;" trans-y;@; " trans_y;"translateY;@;@:@separator: spaceu;z[o:Sass::Script::Variable : @linei1: @name" trans-z: @options{:@underscored_name" trans_z0[o:Sass::Tree::VariableNode ;i1: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i1: @value[o; ;i1;" trans;{; " transo:Sass::Script::Funcall ;i1:@keywords{: @args[o; ;i1;" trans-z;@; " trans_z;"translateZ;@;@:@separator: space[u;T[o:Sass::Script::Variable : @linei,: @name" trans-z: @options{:@underscored_name" trans_zu:Sass::Tree::IfNodez[00[o:Sass::Tree::VariableNode : @linei-: @guarded0:@children[: @name" trans: @options{: @expro:Sass::Script::List ;i-: @value[o:Sass::Script::Variable ;i-; " trans; {:@underscored_name" transo:Sass::Script::Funcall ;i-:@keywords{: @args[o; ;i-; " trans-x; @;" trans_xo; ;i-; " trans-y; @;" trans_y; "translate; @; @:@separator: space[o:Sass::Tree::VariableNode ;i,: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i,: @value[o; ;i,;" trans;{; " transo:Sass::Script::Funcall ;i,:@keywords{: @args[o; ;i,;" trans-x;@; " trans_xo; ;i,;" trans-y;@; " trans_yo; ;i,;" trans-z;@; " trans_z;"translate3d;@;@:@separator: spaceo; ;i4;"/* skew */;i;[; @ ;0;[u;&[o:Sass::Script::Operation : @linei5:@operand2o:Sass::Script::Variable ;i5: @name" skew-y: @options{:@underscored_name" skew_y:@operand1o; ;i5; " skew-x; @ ; " skew_x; @ :@operator:andu:Sass::Tree::IfNode[00[u:Sass::Tree::IfNodeq[o:Sass::Script::Variable : @linei7: @name" skew-x: @options{:@underscored_name" skew_x0[o:Sass::Tree::VariableNode ;i7: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i7: @value[o; ;i7;" trans;{; " transo:Sass::Script::Funcall ;i7:@keywords{: @args[o; ;i7;" skew-x;@; " skew_x;" skewX;@;@:@separator: spaceu;q[o:Sass::Script::Variable : @linei8: @name" skew-y: @options{:@underscored_name" skew_y0[o:Sass::Tree::VariableNode ;i8: @guarded0:@children[;" trans;{: @expro:Sass::Script::List ;i8: @value[o; ;i8;" trans;{; " transo:Sass::Script::Funcall ;i8:@keywords{: @args[o; ;i8;" skew-y;@; " skew_y;" skewY;@;@:@separator: space[o:Sass::Tree::VariableNode ;i5: @guarded0:@children[; " trans; {: @expro:Sass::Script::List ;i5: @value[o; ;i5; " trans; {; " transo:Sass::Script::Funcall ;i5:@keywords{: @args[o; ;i5; " skew-x; @; " skew_xo; ;i5; " skew-y; @; " skew_y; " skew; @; @:@separator: spaceo; ;i;;"/* apply it! */;i;[; @ ;0;[o;+ ;i<;"{;[o; ;i<;" trans; {;" transo; ;i<;" only3d; @^;" only3d;[;"transform; @ o;+ ;i=;"{;[ o; ;i=;" origin-x; {;" origin_xo; ;i=;" origin-y; @j;" origin_yo; ;i=;" origin-z; @j;" origin_zo; ;i=;" only3d; @j;" only3d;[;"transform-origin; @ ;"create-transform; @ o; ;iA;"q/* A simplified set of options * backwards-compatible with the previous version of the 'transform' mixin */;i;[; @ ;0;[o; ;iL;T;[ [o;;" scale; {;" scaleo;';iD;F; @[o;;" rotate; @;" rotateo;';iE;F; @[o;;" trans-x; @;" trans_xo;';iF;F; @[o;;" trans-y; @;" trans_yo;';iG;F; @[o;;" skew-x; @;" skew_xo;';iH;F; @[o;;" skew-y; @;" skew_yo;';iI;F; @[o;;" origin-x; @;" origin_xo;';iJ;F; @[o;;" origin-y; @;" origin_yo;';iK;F; @;[o;+ ;iU;"{;[o;';iN;F; {o; ;iO;" scale; @;" scaleo; ;iO;" scale; @;" scaleo;';iO;F; @o;';iP;F; @o;';iP;F; @o; ;iP;" rotate; @;" rotateo;';iP;F; @o; ;iQ;" trans-x; @;" trans_xo; ;iQ;" trans-y; @;" trans_yo;';iQ;F; @o; ;iR;" skew-x; @;" skew_xo; ;iR;" skew-y; @;" skew_yo; ;iS;" origin-x; @;" origin_xo; ;iS;" origin-y; @;" origin_yo;';iS;F; @o;';iT;F; @;[;"create-transform; @ ;"simple-transform; @ ; @ ; "H@import "shared"; // @doc off // Note ---------------------------------------------------------------------- // Safari is the only browser that currently supports 3D transforms. // Because of that it can be important to control whether a given 2D transform // uses the full range of experimental browser prefixes, or only the 3D list. // To make that easy, all 2D transforms include an browser-targeting toggle ($only3d) // to switch between the two support lists. The toggle defaults to 'false' (2D), // and also accepts 'true' (3D). Currently the lists are as follows: // 2D: Mozilla, Webkit, Opera, Official // 3D: Webkit, Official **(Only Safari Supports 3D perspective)** // Available Transforms ------------------------------------------------------ // - Scale (2d and 3d) // - Rotate (2d and 3d) // - Translate (2d and 3d) // - Skew (2d only) // Transform Parameters ------------------------------------------------------ // - Transform Origin (2d and 3d) // - Perspective (3d) // - Perspective Origin (3d) // - Transform Style (3d) // - Backface Visibility (3d) // Mixins -------------------------------------------------------------------- // transform-origin // - shortcuts: transform-origin2d, transform-origin3d // - helpers: apply-origin // transform // - shortcuts: transform2d, transform3d // - helpers: simple-transform, create-transform // perspective // - helpers: perspective-origin // transform-style // backface-visibility // scale // - shortcuts: scaleX, scaleY, scaleZ, scale3d // rotate // - shortcuts: rotateX, rotateY, rotate3d // translate // - shortcuts: translateX, translateY, translateZ, translate3d // skew // - shortcuts: skewX, skewY // Defaults ------------------------------------------------------------------ // @doc on // The default x-origin for transforms $default-origin-x : 50% !default; // The default y-origin for transforms $default-origin-y : 50% !default; // The default z-origin for transforms $default-origin-z : 50% !default; // The default x-multiplier for scaling $default-scale-x : 1.25 !default; // The default y-multiplier for scaling $default-scale-y : $default-scale-x !default; // The default z-multiplier for scaling $default-scale-z : $default-scale-x !default; // The default angle for rotations $default-rotate : 45deg !default; // The default x-vector for the axis of 3d rotations $default-vector-x : 1 !default; // The default y-vector for the axis of 3d rotations $default-vector-y : 1 !default; // The default z-vector for the axis of 3d rotations $default-vector-z : 1 !default; // The default x-length for translations $default-translate-x : 1em !default; // The default y-length for translations $default-translate-y : $default-translate-x !default; // The default z-length for translations $default-translate-z : $default-translate-x !default; // The default x-angle for skewing $default-skew-x : 5deg !default; // The default y-angle for skewing $default-skew-y : 5deg !default; // **Transform-origin** // Transform-origin sent as a complete string // // @include apply-origin( origin [, 3D-only ] ) // // where 'origin' is a space separated list containing 1-3 (x/y/z) coordinates // in percentages, absolute (px, cm, in, em etc..) or relative // (left, top, right, bottom, center) units // // @param only3d Set this to true to only apply this // mixin where browsers have 3D support. @mixin apply-origin($origin, $only3d) { $only3d: $only3d or -compass-list-size(-compass-list($origin)) > 2; @if $only3d { @include experimental(transform-origin, $origin, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } @else { @include experimental(transform-origin, $origin, -moz, -webkit, -o, -ms, not -khtml, official ); } } // Transform-origin sent as individual arguments: // // @include transform-origin( [ origin-x, origin-y, origin-z, 3D-only ] ) // // where the 3 'origin-' arguments represent x/y/z coordinates. // // **NOTE:** setting z coordinates triggers 3D support list, leave false for 2D support @mixin transform-origin( $origin-x: $default-origin-x, $origin-y: $default-origin-y, $origin-z: false, $only3d: if($origin-z, true, false) ) { $origin: unquote(''); @if $origin-x or $origin-y or $origin-z { @if $origin-x { $origin: $origin-x; } @else { $origin: 50%; } @if $origin-y { $origin: $origin $origin-y; } @else { @if $origin-z { $origin: $origin 50%; }} @if $origin-z { $origin: $origin $origin-z; } @include apply-origin($origin, $only3d); } } // Transform sent as a complete string: // // @include transform( transforms [, 3D-only ] ) // // where 'transforms' is a space separated list of all the transforms to be applied @mixin transform( $transform, $only3d: false ) { @if $only3d { @include experimental(transform, $transform, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } @else { @include experimental(transform, $transform, -moz, -webkit, -o, -ms, not -khtml, official ); } } // Shortcut to target all browsers with 2D transform support @mixin transform2d($trans) { @include transform($trans, false); } // Shortcut to target only browsers with 3D transform support @mixin transform3d($trans) { @include transform($trans, true); } // @doc off // 3D Parameters ------------------------------------------------------------- // @doc on // Set the perspective of 3D transforms on the children of an element: // // @include perspective( perspective ) // // where 'perspective' is a uniless number representing the depth of the z-axis // the higher the perspective, the more exagerated the foreshortening. // values from 500 to 1000 are more-or-less "normal" - a good starting-point. @mixin perspective($p) { @include experimental(perspective, $p, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } // Set the origin position for the perspective // // @include perspective-origin(origin-x [origin-y]) // // where the two arguments represent x/y coordinates @mixin perspective-origin($origin: 50%) { @include experimental(perspective-origin, $origin, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } // Determine whether a 3D objects children also live in the given 3D space // // @include transform-style( [ style ] ) // // where `style` can be either `flat` or `preserve-3d` // browsers default to `flat`, mixin defaults to `preserve-3d` @mixin transform-style($style: preserve-3d) { @include experimental(transform-style, $style, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } // Determine the visibility of an element when it's back is turned // // @include backface-visibility( [ visibility ] ) // // where `visibility` can be either `visible` or `hidden` // browsers default to visible, mixin defaults to hidden @mixin backface-visibility($visibility: hidden) { @include experimental(backface-visibility, $visibility, not -moz, -webkit, not -o, not -ms, not -khtml, official ); } // @doc off // Transform Partials -------------------------------------------------------- // These work well on their own, but they don't add to each other, they override. // Use along with transform parameter mixins to adjust origin, perspective and style // --------------------------------------------------------------------------- // Scale --------------------------------------------------------------------- // @doc on // Scale an object along the x and y axis: // // @include scale( [ scale-x, scale-y, perspective, 3D-only ] ) // // where the 'scale-' arguments are unitless multipliers of the x and y dimensions // and perspective, which works the same as the stand-alone perspective property/mixin // but applies to the individual element (multiplied with any parent perspective) // // **Note** This mixin cannot be combined with other transform mixins. @mixin scale( $scale-x: $default-scale-x, $scale-y: $scale-x, $perspective: false, $only3d: false ) { $trans: scale($scale-x, $scale-y); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Scale an object along the x axis // @include scaleX( [ scale-x, perspective, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin scaleX( $scale: $default-scale-x, $perspective: false, $only3d: false ) { $trans: scaleX($scale); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Scale an object along the y axis // @include scaleY( [ scale-y, perspective, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin scaleY( $scale: $default-scale-y, $perspective: false, $only3d: false ) { $trans: scaleY($scale); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Scale an object along the z axis // @include scaleZ( [ scale-z, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin scaleZ( $scale: $default-scale-z, $perspective: false ) { $trans: scaleZ($scale); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // Scale and object along all three axis // @include scale3d( [ scale-x, scale-y, scale-z, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin scale3d( $scale-x: $default-scale-x, $scale-y: $default-scale-y, $scale-z: $default-scale-z, $perspective: false ) { $trans: scale3d($scale-x, $scale-y, $scale-z); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // @doc off // Rotate -------------------------------------------------------------------- // @doc on // Rotate an object around the z axis (2D) // @include rotate( [ rotation, perspective, 3D-only ] ) // where 'rotation' is an angle set in degrees (deg) or radian (rad) units // // **Note** This mixin cannot be combined with other transform mixins. @mixin rotate( $rotate: $default-rotate, $perspective: false, $only3d: false ) { $trans: rotate($rotate); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // A longcut for 'rotate' in case you forget that 'z' is implied // // **Note** This mixin cannot be combined with other transform mixins. @mixin rotateZ( $rotate: $default-rotate, $perspective: false, $only3d: false ) { @include rotate($rotate, $perspective, $only3d); } // Rotate an object around the x axis (3D) // @include rotateX( [ rotation, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin rotateX( $rotate: $default-rotate, $perspective: false ) { $trans: rotateX($rotate); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // Rotate an object around the y axis (3D) // @include rotate( [ rotation, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin rotateY( $rotate: $default-rotate, $perspective: false ) { $trans: rotateY($rotate); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // Rotate an object around an arbitrary axis (3D) // @include rotate( [ vector-x, vector-y, vector-z, rotation, perspective ] ) // where the 'vector-' arguments accept unitless numbers // these numbers are not important on their own, but in relation to one another // creating an axis from your transform-origin, along the axis of Xx = Yy = Zz // // **Note** This mixin cannot be combined with other transform mixins. @mixin rotate3d( $vector-x: $default-vector-x, $vector-y: $default-vector-y, $vector-z: $default-vector-z, $rotate: $default-rotate, $perspective: false ) { $trans: rotate3d($vector-x, $vector-y, $vector-z, $rotate); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // @doc off // Translate ----------------------------------------------------------------- // @doc on // Move an object along the x or y axis (2D) // @include translate( [ translate-x, translate-y, perspective, 3D-only ] ) // where the 'translate-' arguments accept any distance in percentages or absolute (px, cm, in, em etc..) units // // **Note** This mixin cannot be combined with other transform mixins. @mixin translate( $translate-x: $default-translate-x, $translate-y: $default-translate-y, $perspective: false, $only3d: false ) { $trans: translate($translate-x, $translate-y); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Move an object along the x axis (2D) // @include translate( [ translate-x, perspective, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin translateX( $trans-x: $default-translate-x, $perspective: false, $only3d: false ) { $trans: translateX($trans-x); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Move an object along the y axis (2D) // @include translate( [ translate-y, perspective, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin translateY( $trans-y: $default-translate-y, $perspective: false, $only3d: false ) { $trans: translateY($trans-y); @if $perspective { $trans: perspective($perspective) $trans; } @include transform($trans, $only3d); } // Move an object along the z axis (3D) // @include translate( [ translate-z, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin translateZ( $trans-z: $default-translate-z, $perspective: false ) { $trans: translateZ($trans-z); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // Move an object along the x, y and z axis (3D) // @include translate( [ translate-x, translate-y, translate-z, perspective ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin translate3d( $translate-x: $default-translate-x, $translate-y: $default-translate-y, $translate-z: $default-translate-z, $perspective: false ) { $trans: translate3d($translate-x, $translate-y, $translate-z); @if $perspective { $trans: perspective($perspective) $trans; } @include transform3d($trans); } // @doc off // Skew ---------------------------------------------------------------------- // @doc on // Skew an element: // // @include skew( [ skew-x, skew-y, 3D-only ] ) // // where the 'skew-' arguments accept css angles in degrees (deg) or radian (rad) units // // **Note** This mixin cannot be combined with other transform mixins. @mixin skew( $skew-x: $default-skew-x, $skew-y: $default-skew-y, $only3d: false ) { $trans: skew($skew-x, $skew-y); @include transform($trans, $only3d); } // Skew an element along the x axiz // // @include skew( [ skew-x, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin skewX( $skew-x: $default-skew-x, $only3d: false ) { $trans: skewX($skew-x); @include transform($trans, $only3d); } // Skew an element along the y axis // // @include skew( [ skew-y, 3D-only ] ) // // **Note** This mixin cannot be combined with other transform mixins. @mixin skewY( $skew-y: $default-skew-y, $only3d: false ) { $trans: skewY($skew-y); @include transform($trans, $only3d); } // Full transform mixins // For settings any combination of transforms as arguments // These are complex and not highly recommended for daily use // They are mainly here for backwards-compatability purposes // // * they include origin adjustments // * scale takes a multiplier (unitless), rotate and skew take degrees (deg) // // **Note** This mixin cannot be combined with other transform mixins. @mixin create-transform( $perspective: false, $scale-x: false, $scale-y: false, $scale-z: false, $rotate-x: false, $rotate-y: false, $rotate-z: false, $rotate3d: false, $trans-x: false, $trans-y: false, $trans-z: false, $skew-x: false, $skew-y: false, $origin-x: false, $origin-y: false, $origin-z: false, $only3d: false ) { $trans: unquote(""); // perspective @if $perspective { $trans: perspective($perspective) ; } // scale @if $scale-x and $scale-y { @if $scale-z { $trans: $trans scale3d($scale-x, $scale-y, $scale-z); } @else { $trans: $trans scale($scale-x, $scale-y); } } @else { @if $scale-x { $trans: $trans scaleX($scale-x); } @if $scale-y { $trans: $trans scaleY($scale-y); } @if $scale-z { $trans: $trans scaleZ($scale-z); } } // rotate @if $rotate-x { $trans: $trans rotateX($rotate-x); } @if $rotate-y { $trans: $trans rotateY($rotate-y); } @if $rotate-z { $trans: $trans rotateZ($rotate-z); } @if $rotate3d { $trans: $trans rotate3d($rotate3d); } // translate @if $trans-x and $trans-y { @if $trans-z { $trans: $trans translate3d($trans-x, $trans-y, $trans-z); } @else { $trans: $trans translate($trans-x, $trans-y); } } @else { @if $trans-x { $trans: $trans translateX($trans-x); } @if $trans-y { $trans: $trans translateY($trans-y); } @if $trans-z { $trans: $trans translateZ($trans-z); } } // skew @if $skew-x and $skew-y { $trans: $trans skew($skew-x, $skew-y); } @else { @if $skew-x { $trans: $trans skewX($skew-x); } @if $skew-y { $trans: $trans skewY($skew-y); } } // apply it! @include transform($trans, $only3d); @include transform-origin($origin-x, $origin-y, $origin-z, $only3d); } // A simplified set of options // backwards-compatible with the previous version of the 'transform' mixin @mixin simple-transform( $scale: false, $rotate: false, $trans-x: false, $trans-y: false, $skew-x: false, $skew-y: false, $origin-x: false, $origin-y: false ) { @include create-transform( false, $scale, $scale, false, false, false, $rotate, false, $trans-x, $trans-y, false, $skew-x, $skew-y, $origin-x, $origin-y, false, false ); }