3.2.13 (Media Mark) 8f684f39bc10ce46b2402653aeaebf96f6e8c0ae o:Sass::Tree::RootNode : @linei:@has_childrenT:@template" $modal-padding: 3em; $modal-close-color: $light-gray; $modal-image-height: 135px; $modal-image-width: $modal-image-height; .modal-open { overflow: hidden; } .modal { label { cursor: pointer; margin-bottom: 0; img { $img-width: 300px; border-radius: $img-width/2; display: block; max-width: $img-width; } } input[type="checkbox"] { display: none; } } .modal-window { @include transition(opacity .25s ease); @include position(fixed, 0px 0px 0px 0px); background: rgba(0,0,0, .85); opacity: 0; text-align: left; visibility: hidden; z-index: 999; .modal-bg { @include position(absolute, 0px 0px 0px 0px); cursor: pointer; } .modal-inner { @include transition(opacity .25s ease); @include position(absolute, -20% 0px 0px 0px); border-radius: 3px; background: white; margin: auto; max-height: 70%; overflow: auto; padding: $modal-padding; width: 95%; @include media($medium-screen) { width: 50%; } .img-wrapper-modal { @include size($modal-image-width $modal-image-height); background-color: $light-gray; border-radius: 190px; display: block; img { @include size($modal-image-width $modal-image-height); content: ''; display: block; padding: 30px; } } h1 { color: $base-font-color; margin-bottom: .6em; text-align: left; text-transform: capitalize; } p { font-size: $base-font-size; max-width: 100% !important; padding: 0; text-align: left; &.intro { color: $blue; line-height: 1.6em; } &.body { color: $base-font-color; line-height: 1.45em; @include media($medium-screen) { @include columns(2 8em); } } } a.cta { color: white; display: inline-block; margin-right: .5em; margin-top: 1em; &:last-child { padding: 0 2em; } } } .modal-close { @include position(fixed, ($modal-padding /2) ($modal-padding /2) 0 0); @include size(0.5em); cursor: pointer; &:after, &:before { @include position(absolute, 0px 0 0 -50%); @include transform(rotate(45deg)); @include size(.15em 1.5em); background: $modal-close-color; content: ''; display: block; margin: -3px 0 0 -1px; } &:hover:after, &:hover:before { background: darken($modal-close-color, 10); } &:before { @include transform(rotate(-45deg)); } } } .modal-state:checked + .modal-window { opacity: 1; visibility: visible; } .modal-state:checked + .modal-window .modal-inner { top: 0; } .btn { @include button(simple, $base-accent-color); font-size: $base-font-size; margin-bottom: $base-line-height; } p img { float: left; height: auto; margin: 0 1em 1em 0; max-width: 200px; } // Based on code by Kasper Mikiewicz :@children[o:Sass::Tree::VariableNode : @expro:Sass::Script::Number ;i:@numerator_units["em:@original"3em: @valuei:@denominator_units[: @options{;i: @name"modal-padding; [: @guarded0;@o; ; o:Sass::Script::Variable ;i;"light-gray:@underscored_name"light_gray;@;i;"modal-close-color; [;0;@o; ; o; ;i; ["px;" 135px;i‡;[;@;i;"modal-image-height; [;0;@o; ; o; ;i ;"modal-image-height;"modal_image_height;@;i ;"modal-image-width; [;0;@o:Sass::Tree::RuleNode ;i :@parsed_ruleso:"Sass::Selector::CommaSequence;i : @members[o:Sass::Selector::Sequence;[o:#Sass::Selector::SimpleSequence ;i : @sourceso:Set: @hash{: @subject0;[o:Sass::Selector::Class;i ;["modal-open:@filename";!@1;!@1;T: @tabsi; [o:Sass::Tree::PropNode ;i ;[" overflow:@prop_syntax:new;"i; [;o:Sass::Script::String: @type:identifier;" hidden;@;@;@: @rule[".modal-openo; ;i;o;;i;[o;;[o; ;i;o;;{;0;[o; ;i;[" modal;!";!@G;!@G;T;"i; [o; ;i;o;;i;[o;;[o; ;i;o;;{;0;[o:Sass::Selector::Element ;i;[" label:@namespace0;!";!@U;!@U;T;"i; [o;# ;i;[" cursor;$;%;"i; [;o;&;';(;" pointer;@;@o;# ;i;["margin-bottom;$;%;"i; [;o;&;';(;"0;@;@o; ;i;o;;i;[o;;[o; ;i;o;;{;0;[o;* ;i;["img;+0;!";!@o;!@o;T;"i; [ o; ; o; ;i; ["px;" 300px;i,;[;@;i;"img-width; [;0;@o;# ;i;["border-radius;$;%;"i; [;o:Sass::Script::Operation ;i:@operand2o; ;i; [;"2;i;[;@:@operand1o; ;i;"img-width;"img_width;@;@:@operator:div;@o;# ;i;[" display;$;%;"i; [;o;&;';(;" block;@;@o;# ;i;["max-width;$;%;"i; [;o; ;i;"img-width;"img_width;@;@;@;)["img;@;)[" labelo; ;i;o;;i;[o;;[o; ;i;o;;{;0;[o;* ;i;[" input;+0;!"o:Sass::Selector::Attribute ;i;[" type: @flags0;[""checkbox";+0;!@;/"=;!@;!@;T;"i; [o;# ;i;[" display;$;%;"i; [;o;&;';(;" none;@;@;@;)["input[type="checkbox"];@;)[" .modalo; ;i!;o;;i!;[o;;[o; ;i!;o;;{;0;[o; ;i!;["modal-window;!";!@»;!@»;T;"i; [o:Sass::Tree::MixinNode ;i";"transition: @splat0; [;@:@keywords{: @args[o:Sass::Script::List ;i":@separator: space;[o;& ;i";';(;" opacity;@o; ;i"; ["s;" 0.25s;f 0.25;[;@o;& ;i";';(;" ease;@;@o;3 ;i#;" position;40; [;@;5{;6[o;& ;i#;';(;" fixed;@o;7 ;i#;8;9;[ o; ;i#; ["px;"0px;i;[;@o; ;i#; ["px;"0px;i;[;@o; ;i#; ["px;"0px;i;[;@o; ;i#; ["px;"0px;i;[;@;@o;# ;i$;["background;$;%;"i; [;o:Sass::Script::Funcall ;i$;" rgba;40;@;5{;6[ o; ;i$; [;"0;i;@|;@o; ;i$; [;"0;i;@|;@o; ;i$; [;"0;i;@|;@o; ;i$; [;" 0.85;f0.8499999999999999833;@|;@;@o;# ;i%;[" opacity;$;%;"i; [;o;&;';(;"0;@;@o;# ;i&;["text-align;$;%;"i; [;o;&;';(;" left;@;@o;# ;i';["visibility;$;%;"i; [;o;&;';(;" hidden;@;@o;# ;i(;[" z-index;$;%;"i; [;o;&;';(;"999;@;@o; ;i*;o;;i*;[o;;[o; ;i*;o;;{;0;[o; ;i*;[" modal-bg;!";!@$;!@$;T;"i; [o;3 ;i+;" position;40; [;@;5{;6[o;& ;i+;';(;" absolute;@o;7 ;i+;8;9;[ o; ;i+; ["px;"0px;i;[;@o; ;i+; ["px;"0px;i;[;@o; ;i+; ["px;"0px;i;[;@o; ;i+; ["px;"0px;i;[;@;@o;# ;i,;[" cursor;$;%;"i; [;o;&;';(;" pointer;@;@;@;)[".modal-bgo; ;i/;o;;i/;[o;;[o; ;i/;o;;{;0;[o; ;i/;["modal-inner;!";!@W;!@W;T;"i; [o;3 ;i0;"transition;40; [;@;5{;6[o;7 ;i0;8;9;[o;& ;i0;';(;" opacity;@o; ;i0; ["s;" 0.25s;f 0.25;[;@o;& ;i0;';(;" ease;@;@o;3 ;i1;" position;40; [;@;5{;6[o;& ;i1;';(;" absolute;@o;7 ;i1;8;9;[ o; ;i1; ["%;" -20%;iç;[;@o; ;i1; ["px;"0px;i;[;@o; ;i1; ["px;"0px;i;[;@o; ;i1; ["px;"0px;i;[;@;@o;# ;i2;["border-radius;$;%;"i; [;o;&;';(;"3px;@;@o;# ;i3;["background;$;%;"i; [;o;&;';(;" white;@;@o;# ;i4;[" margin;$;%;"i; [;o;&;';(;" auto;@;@o;# ;i5;["max-height;$;%;"i; [;o;&;';(;"70%;@;@o;# ;i6;[" overflow;$;%;"i; [;o;&;';(;" auto;@;@o;# ;i7;[" padding;$;%;"i; [;o; ;i7;"modal-padding;"modal_padding;@;@o;# ;i8;[" width;$;%;"i; [;o;&;';(;"95%;@;@o;3 ;i:;" media;T;40; [o;# ;i;;[" width;$;%;"i; [;o;&;';(;"50%;@;@;@;5{;6[o; ;i:;"medium-screen;"medium_screen;@o; ;i>;o;;i>;[o;;[o; ;i>;o;;{;0;[o; ;i>;["img-wrapper-modal;!";!@Ì;!@Ì;T;"i; [ o;3 ;i?;" size;40; [;@;5{;6[o;7 ;i?;8;9;[o; ;i?;"modal-image-width;"modal_image_width;@o; ;i?;"modal-image-height;"modal_image_height;@;@o;# ;i@;["background-color;$;%;"i; [;o; ;i@;"light-gray;"light_gray;@;@o;# ;iA;["border-radius;$;%;"i; [;o;&;';(;" 190px;@;@o;# ;iB;[" display;$;%;"i; [;o;&;';(;" block;@;@o; ;iD;o;;iD;[o;;[o; ;iD;o;;{;0;[o;* ;iD;["img;+0;!";!@ú;!@ú;T;"i; [ o;3 ;iE;" size;40; [;@;5{;6[o;7 ;iE;8;9;[o; ;iE;"modal-image-width;"modal_image_width;@o; ;iE;"modal-image-height;"modal_image_height;@;@o;# ;iF;[" content;$;%;"i; [;o;&;';(;"'';@;@o;# ;iG;[" display;$;%;"i; [;o;&;';(;" block;@;@o;# ;iH;[" padding;$;%;"i; [;o;&;';(;" 30px;@;@;@;)["img;@;)[".img-wrapper-modalo; ;iL;o;;iL;[o;;[o; ;iL;o;;{;0;[o;* ;iL;["h1;+0;!";!@+;!@+;T;"i; [ o;# ;iM;[" color;$;%;"i; [;o; ;iM;"base-font-color;"base_font_color;@;@o;# ;iN;["margin-bottom;$;%;"i; [;o;&;';(;" .6em;@;@o;# ;iO;["text-align;$;%;"i; [;o;&;';(;" left;@;@o;# ;iP;["text-transform;$;%;"i; [;o;&;';(;"capitalize;@;@;@;)["h1o; ;iS;o;;iS;[o;;[o; ;iS;o;;{;0;[o;* ;iS;["p;+0;!";!@T;!@T;T;"i; [ o;# ;iT;["font-size;$;%;"i; [;o; ;iT;"base-font-size;"base_font_size;@;@o;# ;iU;["max-width;$;%;"i; [;o;&;';(;"100% !important;@;@o;# ;iV;[" padding;$;%;"i; [;o;&;';(;"0;@;@o;# ;iW;["text-align;$;%;"i; [;o;&;';(;" left;@;@o; ;iY;o;;iY;[o;;[o; ;iY;o;;{;0;[o:Sass::Selector::Parent;iY;!"o; ;iY;[" intro;!@y;!@y;!@y;T;"i; [o;# ;iZ;[" color;$;%;"i; [;o; ;iZ;" blue;" blue;@;@o;# ;i[;["line-height;$;%;"i; [;o;&;';(;" 1.6em;@;@;@;)[" &.introo; ;i^;o;;i^;[o;;[o; ;i^;o;;{;0;[o;;;i^;!"o; ;i^;[" body;!@—;!@—;!@—;T;"i; [o;# ;i_;[" color;$;%;"i; [;o; ;i_;"base-font-color;"base_font_color;@;@o;# ;i`;["line-height;$;%;"i; [;o;&;';(;" 1.45em;@;@o;3 ;ib;" media;T;40; [o;3 ;ic;" columns;40; [;@;5{;6[o;7 ;ic;8;9;[o; ;ic; [;"2;i;@|;@o; ;ic; ["em;"8em;i ;[;@;@;@;5{;6[o; ;ib;"medium-screen;"medium_screen;@;@;)[" &.body;@;)["po; ;ih;o;;ih;[o;;[o; ;ih;o;;{;0;[o;* ;ih;["a;+0;!"o; ;ih;["cta;!@Ð;!@Ð;!@Ð;T;"i; [ o;# ;ii;[" color;$;%;"i; [;o;&;';(;" white;@;@o;# ;ij;[" display;$;%;"i; [;o;&;';(;"inline-block;@;@o;# ;ik;["margin-right;$;%;"i; [;o;&;';(;" .5em;@;@o;# ;il;["margin-top;$;%;"i; [;o;&;';(;"1em;@;@o; ;in;o;;in;[o;;[o; ;in;o;;{;0;[o;;;in;!"o:Sass::Selector::Pseudo ;in;["last-child: @arg0:@syntactic_type: class;!@÷;!@÷;!@÷;T;"i; [o;# ;io;[" padding;$;%;"i; [;o;&;';(;" 0 2em;@;@;@;)["&:last-child;@;)[" a.cta;@;)[".modal-innero; ;it;o;;it;[o;;[o; ;it;o;;{;0;[o; ;it;["modal-close;!";!@;!@;T;"i; [ o;3 ;iu;" position;40; [;@;5{;6[o;& ;iu;';(;" fixed;@o;7 ;iu;8;9;[ o;, ;iu;-o; ;iu; [;"2;i;@|;@;.o; ;iu;"modal-padding;"modal_padding;@;@;/;0o;, ;iu;-o; ;iu; [;"2;i;@|;@;.o; ;iu;"modal-padding;"modal_padding;@;@;/;0o; ;iu; [;"0;i;@|;@o; ;iu; [;"0;i;@|;@;@o;3 ;iv;" size;40; [;@;5{;6[o; ;iv; ["em;" 0.5em;f0.5;[;@o;# ;iw;[" cursor;$;%;"i; [;o;&;';(;" pointer;@;@o; ;iz;o;;iz;[o;;[o; ;iz;o;;{;0;[o;;;iz;!"o;< ;iz;[" after;=0;>;?;!@N;!@No;;[" o; ;iz;o;;{;0;[o;;;iz;!@No;< ;iz;[" before;=0;>;?;!@N;!@N;!@N;T;"i; [ o;3 ;i{;" position;40; [;@;5{;6[o;& ;i{;';(;" absolute;@o;7 ;i{;8;9;[ o; ;i{; ["px;"0px;i;[;@o; ;i{; [;"0;i;@|;@o; ;i{; [;"0;i;@|;@o; ;i{; ["%;" -50%;iÉ;[;@;@o;3 ;i|;"transform;40; [;@;5{;6[o;: ;i|;" rotate;40;@;5{;6[o; ;i|; ["deg;" 45deg;i2;[;@o;3 ;i};" size;40; [;@;5{;6[o;7 ;i};8;9;[o; ;i}; ["em;" 0.15em;f0.1499999999999999933;[;@o; ;i}; ["em;" 1.5em;f1.5;[;@;@o;# ;i~;["background;$;%;"i; [;o; ;i~;"modal-close-color;"modal_close_color;@;@o;# ;i;[" content;$;%;"i; [;o;&;';(;"'';@;@o;# ;i{;[" display;$;%;"i; [;o;&;';(;" block;@;@o;# ;i|;[" margin;$;%;"i; [;o;&;';(;"-3px 0 0 -1px;@;@;@;)["&:after, &:beforeo; ;i€;o;;i€;[o;;[o; ;i€;o;;{;0;[o;;;i€;!"o;< ;i€;[" hover;=0;>;?;!@½o;< ;i€;[" after;=0;>;?;!@½;!@½o;;[" o; ;i€;o;;{;0;[o;;;i€;!@½o;< ;i€;[" hover;=0;>;?;!@½o;< ;i€;[" before;=0;>;?;!@½;!@½;!@½;T;"i; [o;# ;i;["background;$;%;"i; [;o;: ;i;" darken;40;@;5{;6[o; ;i;"modal-close-color;"modal_close_color;@o; ;i; [;"10;i;@|;@;@;@;)["&&:hover:after, &:hover:beforeo; ;i„;o;;i„;[o;;[o; ;i„;o;;{;0;[o;;;i„;!"o;< ;i„;[" before;=0;>;?;!@í;!@í;!@í;T;"i; [o;3 ;i…;"transform;40; [;@;5{;6[o;: ;i…;" rotate;40;@;5{;6[o; ;i…; ["deg;" -45deg;iÎ;[;@;@;)[" &:before;@;)[".modal-close;@;)[".modal-windowo; ;iŠ;o;;iŠ;[o;;[o; ;iŠ;o;;{;0;[o; ;iŠ;["modal-state;!"o;< ;iŠ;[" checked;=0;>;?;!@;!@"+o; ;iŠ;o;;{;0;[o; ;iŠ;["modal-window;!@;!@;!@;T;"i; [o;# ;i‹;[" opacity;$;%;"i; [;o;&;';(;"1;@;@o;# ;iŒ;["visibility;$;%;"i; [;o;&;';(;" visible;@;@;@;)[").modal-state:checked + .modal-windowo; ;i;o;;i;[o;;[ o; ;i;o;;{;0;[o; ;i;["modal-state;!"o;< ;i;[" checked;=0;>;?;!@9;!@9"+o; ;i;o;;{;0;[o; ;i;["modal-window;!@9;!@9o; ;i;o;;{;0;[o; ;i;["modal-inner;!@9;!@9;!@9;T;"i; [o;# ;i;["top;$;%;"i; [;o;&;';(;"0;@;@;@;)["6.modal-state:checked + .modal-window .modal-innero; ;i”;o;;i”;[o;;[o; ;i”;o;;{;0;[o; ;i”;["btn;!";!@a;!@a;T;"i; [o;3 ;i•;" button;40; [;@;5{;6[o;& ;i•;';(;" simple;@o; ;i•;"base-accent-color;"base_accent_color;@o;# ;i–;["font-size;$;%;"i; [;o; ;i–;"base-font-size;"base_font_size;@;@o;# ;i—;["margin-bottom;$;%;"i; [;o; ;i—;"base-line-height;"base_line_height;@;@;@;)[" .btno; ;iš;o;;iš;[o;;[o; ;iš;o;;{;0;[o;* ;iš;["p;+0;!";!@‰o; ;iš;o;;{;0;[o;* ;iš;["img;+0;!@‰;!@‰;!@‰;T;"i; [ o;# ;i›;[" float;$;%;"i; [;o;&;';(;" left;@;@o;# ;iœ;[" height;$;%;"i; [;o;&;';(;" auto;@;@o;# ;i;[" margin;$;%;"i; [;o;&;';(;"0 1em 1em 0;@;@o;# ;iž;["max-width;$;%;"i; [;o;&;';(;" 200px;@;@;@;)[" p imgo:Sass::Tree::CommentNode ;i¡;': silent; [;[",/* Based on code by Kasper Mikiewicz */;@;@